diff --git a/static/skald.css b/static/skald.css
index 24e9dfe..8f05f0a 100644
--- a/static/skald.css
+++ b/static/skald.css
@@ -829,6 +829,10 @@ h1 {
     overflow-y: hidden;
 }
 
+.sidenav.invisible {
+    display: none;
+}
+
 .sidenav a {
     padding: 10px 20px;
     text-decoration: none;
diff --git a/static/skald.html b/static/skald.html
index 74f0117..f390dee 100644
--- a/static/skald.html
+++ b/static/skald.html
@@ -18,7 +18,7 @@
   <body>
     <main id="main" class="app">
       <div class="row full-height">
-        <nav id="left-sidebar">
+        <nav id="left-sidebar" class="connected-only invisible" aria-hidden="true">
           <div class="users-header">
             <div class="skald-header">Skald</div>
           </div>
@@ -26,7 +26,7 @@
           <div id="users"></div>
         </nav>
         <div class="container">
-          <header>
+          <header class="connected-only invisible" aria-hidden="true">
             <nav class="topnav navbar navbar-expand navbar-light fixed-top">
               <div id="header">
                 <button class="collapse" aria-label="Toggle left panel" aria-expanded="true" id="sidebarCollapse">
@@ -62,7 +62,7 @@
             </nav>
           </header>
           <div class="row full-width" id="mainrow">
-            <div class="coln-left" id="left">
+            <div class="coln-left connected-only invisible" id="left" aria-hidden="true">
               <div id="chat" role="region" aria-label="Chat">
                 <div id="chatbox">
                   <button class="close-chat" id="close-chat" aria-label="Hide chat">
@@ -82,7 +82,7 @@
                 </div>
               </div>
             </div>
-            <div id="resizer" tabindex="0" role="separator" aria-label="Chat resize handle" aria-orientation="vertical"></div>
+            <div id="resizer" class="connected-only invisible" aria-hidden="true" tabindex="0" role="separator" aria-label="Chat resize handle" aria-orientation="vertical"></div>
             <div class="coln-right" id="right">
               <button class="chat-btn show-chat invisible" id="show-chat" aria-label="Show chat">
                 <i class="far fa-comment-alt icon-chat" aria-hidden="true"></i>
@@ -130,7 +130,7 @@
       </div>
     </main>
 
-    <aside id="sidebarnav" class="sidenav" aria-label="Settings">
+    <aside id="sidebarnav" class="sidenav connected-only invisible" aria-hidden="true" aria-label="Settings">
       <div class="sidenav-header">
         <h2>Settings</h2>
         <button class="closebtn" id="closeside" aria-label="Close settings"><i class="fas fa-times" aria-hidden="true"></i></button>
diff --git a/static/skald.js b/static/skald.js
index 4f0bcaa..b172a25 100644
--- a/static/skald.js
+++ b/static/skald.js
@@ -284,8 +284,21 @@ function isFirefox() {
 function setConnected(connected) {
     let userbox = document.getElementById('profile');
     let connectionbox = document.getElementById('login-container');
+    let alreadyConnected = !userbox.classList.contains('invisible');
+    if(connected !== alreadyConnected) {
+        for(let elt of document.querySelectorAll('.connected-only')) {
+            if(connected) {
+                elt.classList.remove('invisible');
+                elt.removeAttribute('aria-hidden');
+            } else {
+                elt.classList.add('invisible');
+                elt.setAttribute('aria-hidden', 'true');
+            }
+        }
+    }
     if(connected) {
-        clearChat();
+        if(!alreadyConnected)
+            clearChat();
         userbox.classList.remove('invisible');
         connectionbox.classList.add('invisible');
         displayUsername();
@@ -293,6 +306,7 @@ function setConnected(connected) {
             scheduleReconsiderDownRate();
         }
     } else {
+        closeNav();
         userbox.classList.add('invisible');
         connectionbox.classList.remove('invisible');
         ;
@@ -306,7 +320,6 @@ function setConnected(connected) {
  * @this {ServerConnection}
  */
 async function gotConnected() {
-    setConnected(true);
     await join();
 }
 
@@ -1849,6 +1862,7 @@ async function gotJoined(kind, hall, perms, status, data, error, message) {
         for(let key in status)
             hallStatus[key] = status[key];
         setTitle((status && status.displayName) || capitalise(hall));
+        setConnected(true);
         displayUsername();
         setButtonsVisibility();
         setChangePassword(pwAuth && !!hallStatus.canChangePassword &&
