Site Helper Tag value is rendered above it's position in the template

Here I go again...

I created a site helper tag which works basically. The PHP code in it outputs a variable, let's say $output. This output should be displayed. In the template the tag, let's call it {{ site:output }}, is pasted beneath a H5 heading. But the output by the tag gets rendered above this H5 (but inside the body although it's beneath it in the template.

My Tags.php:

<?php

namespace Statamic\SiteHelpers;

use Statamic\Extend\Tags as AbstractTags;

class Tags extends AbstractTags
{
    /**
     * The {{ site:example }} tag
     *
     * @return mixed
     */
    public function output()
    {
          echo 'This is the output.';
    }
}

My template:

<h5>Caption</h5>
{{ site:output }} <!-- Outputs: "This is the output" -->

The output:

This is the output.

Caption

I don't really know why this is.