How to make author name hyperlinked to its profile in node template
Normally {{ author_name }} already comes as renderable markup containing the linked author name. But there's also {{ node.getOwnerId }} (the author's user ID) and {{ node.getOwner.label }} (the author's user name) you could simply use to build the link yourself.

&lt;div class="foobar"&gt;
  &lt;a href="/user/{{ node.getOwnerId }}"&gt;
    &lt;span&gt;{{ node.getOwner.label }}&lt;/span&gt;
  &lt;/a&gt;
&lt;/div&gt;


Note you can easily inspect what variables are available for a template by installing the Devel sub-module Kint and then in your template print {{ kint() }}, flush cache and reload. You now will get all available variables pretty-printed to easily find out which ones you could use to solve your problem.



To make that snippet a little bit more sustainable use the path() function to build the link target. By that also path aliases (built with Pathauto for example) will be taken into account.

&lt;div class="foobar"&gt;
  &lt;a href="{{ path('entity.user.canonical', {'user': node.getOwnerId}) }}"&gt;
    &lt;span&gt;{{ node.getOwner.label }}&lt;/span&gt;
  &lt;/a&gt;
&lt;/div&gt;