diff --git a/public/assets/css/base.css b/public/assets/css/base.css
index eb78e26fb9..7da98bed41 100644
--- a/public/assets/css/base.css
+++ b/public/assets/css/base.css
@@ -96,6 +96,9 @@
     left: var(--unit-size);
     font-size: var(--small-size);
 }
+#header:above-level.panel[open] ~ * {
+    display: none;
+}
 
 .icon {
     fill: var(--white);
@@ -261,6 +264,7 @@
     .icon-left,
     .icon-right {
         display: flex;
+        width: 100%;
     }
 
     /* by default they are hidden */
@@ -268,21 +272,15 @@
         display: none;
     }
 
-    .panel[open] {
-        width: 100%;
-        font-size: var(--main-size);
-    }
-
-    .panel[open] {
-        all: unset;
-        display: flex;
-        flex-direction: column;
-    }
-
-    .panel aside {
+    .panel:not(:focus-within or :not[open]) aside {
         display: none;
     }
-
+    .panel[open]:focus-within aside,
+    .panel[open] {
+        display: flex;
+        flex-direction: column;
+        font-size: var(--main-size);
+    }
     .panel[open] aside {
         padding: var(--unit-size);
         box-sizing: border-box;
@@ -296,7 +294,6 @@
         background-size: 100% 100%;
         min-height: 100%;
 
-        display: block !important;
     }
 
     .panel[open] aside .footer {
diff --git a/templates/base.html.twig b/templates/base.html.twig
index c518519a8c..2ede828581 100644
--- a/templates/base.html.twig
+++ b/templates/base.html.twig
@@ -32,19 +32,19 @@
     {% block header %}
         <div id='header'>
             <details class="panel" id="left-container">
-                <summary tabindex="1">
+                <summary tabindex="0" aria-haspopup="true" role="button" aria-expanded="false">
                     {{ icon('menu', 'icon icon-left') | raw }}
                     {{ block("leftpanel", "stdgrid.html.twig") }}
                 </summary>
             </details>
 
-            <a id='instance' href="{{ path('main_public') }}" tabindex="2">
+            <a id='instance' href="{{ path('main_public') }}" tabindex="0">
                 {{ icon('logo', 'icon icon-logo') | raw }}
                 <h1> {{ config('site', 'name') }} </h1>
             </a>
 
             <details class="panel" id="right-container">
-                <summary tabindex="3">
+                <summary tabindex="0" aria-haspopup="true" role="button" aria-expanded="false">
                     {{ icon('notes', 'icon icon-right') | raw }}
                     {{ block("rightpanel", "stdgrid.html.twig") }}
                 </summary>
diff --git a/templates/network/public.html.twig b/templates/network/public.html.twig
index a26760ae92..ff8b3ca5f3 100644
--- a/templates/network/public.html.twig
+++ b/templates/network/public.html.twig
@@ -10,7 +10,7 @@
 {% block body %}
 
     {# Backwards compatibility with hAtom 0.1 #}
-    <div class="timeline">
+    <div class="timeline" tabindex="0">
         <main class="h-feed hfeed notes">
             {% if notes is defined and notes is not empty %}
                 {% for conversation in notes %}
diff --git a/templates/note/view.html.twig b/templates/note/view.html.twig
index d00dde5a26..08c66b31cf 100644
--- a/templates/note/view.html.twig
+++ b/templates/note/view.html.twig
@@ -2,7 +2,8 @@
     <div class="note-info">
         {% set nickname = note.getActorNickname() %}
 
-        <a class="u-url" href="{{ path('settings_avatar') }}">
+        {# TODO: this should link to the note's user profile? #}
+        <a class="u-url" href="#">
             {# Microformat's h-card properties indicates a face icon is a "u-logo" #}
             <img class="u-logo avatar" src="{{ note.getAvatarUrl() }}" alt="{{ nickname }}'s avatar">
             <b class="p-nickname">{{ nickname }}</b>
diff --git a/templates/sidepanel/left/left.html.twig b/templates/sidepanel/left/left.html.twig
index a08942f317..98ca757308 100644
--- a/templates/sidepanel/left/left.html.twig
+++ b/templates/sidepanel/left/left.html.twig
@@ -1,4 +1,4 @@
-<aside id='left-panel'>
+<aside id='left-panel' tabindex="-1">
     <nav class='profile-nav'>
 
         {% if app.user %}
diff --git a/templates/sidepanel/right/right.html.twig b/templates/sidepanel/right/right.html.twig
index 6400530779..3ca5425017 100644
--- a/templates/sidepanel/right/right.html.twig
+++ b/templates/sidepanel/right/right.html.twig
@@ -1,4 +1,4 @@
-<aside id='right-panel'>
+<aside id='right-panel' tabindex="-1">
     {% if post_form is defined %}
         <section class="section-widget">
             <details class="section-title">