diff --git a/core/themes/bartik/templates/page.html.twig b/core/themes/bartik/templates/page.html.twig
index 8c739bb..dd1ae49 100644
--- a/core/themes/bartik/templates/page.html.twig
+++ b/core/themes/bartik/templates/page.html.twig
@@ -77,13 +77,13 @@
  * @see html.html.twig
  */
 #}
-<div id="page-wrapper"><div id="page">
+<div class="page-wrapper"><div class="page">
 
   <header id="header" class="{{ secondary_menu ? 'with-secondary-menu' : 'without-secondary-menu' }}" role="banner" aria-label="{{ 'Site header'|t}}"><div class="section clearfix">
    {% if secondary_menu %}
       <nav id="secondary-menu" class="navigation" role="navigation"  aria-labelledby="links__system_secondary_menu">
         {{ secondary_menu }}
-      </nav> <!-- /#secondary-menu -->
+      </nav>{# /#secondary-menu #}
     {% endif %}
 
     {% if logo %}
@@ -103,7 +103,7 @@
             </div>
           {# Use h1 when the content title is empty #}
           {% else %}
-            <h1 id="site-name"{% if hide_site_name %} class="visually-hidden" {% endif %}>
+            <h1 class="site-name"{% if hide_site_name %} class="visually-hidden" {% endif %}>
               <a href="{{ front_page }}" title="{{ 'Home'|t }}" rel="home"><span>{{ site_name }}</span></a>
             </h1>
           {% endif %}
@@ -114,7 +114,7 @@
             {{ site_slogan }}
           </div>
         {% endif %}
-      </div><!-- /#name-and-slogan -->
+      </div>{# /#name-and-slogan #}
     {% endif %}
 
     {{ page.header }}
@@ -126,23 +126,23 @@
         <a class="main-menu-reveal" href="#nav">{{ 'Menu'|t }}</a>
         <a class="main-menu-reveal main-menu-reveal--hide" href="#no-nav">{{ 'Menu'|t }}</a>
         {{ main_menu }}
-      </nav> <!-- /#main-menu -->
+      </nav>{# /#main-menu #}
     {% endif %}
-  </div></header> <!-- /.section, /#header-->
+  </div></header>{# /.section, /#header #}
 
   {% if messages %}
     <div id="messages"><div class="section clearfix">
       {{ messages }}
-    </div></div> <!-- /.section, /#messages -->
+    </div></div>{# /.section, /#messages #}
   {% endif %}
 
   {% if page.featured %}
-    <aside id="featured"><div class="section clearfix">
+    <div id="featured"><aside class="section clearfix" role="complementary">
       {{ page.featured }}
-    </div></aside> <!-- /.section, /#featured -->
+    </aside></div>{# /.section, /#featured #}
   {% endif %}
 
-  <div id="main-wrapper" class="clearfix"><div id="main" class="clearfix">
+  <div class="main-wrapper" class="clearfix"><div id="main" class="clearfix">
     {{ breadcrumb }}
 
     <main id="content" class="column" role="main"><section class="section">
@@ -150,7 +150,7 @@
       <a id="main-content"></a>
       {{ title_prefix }}
         {% if title %}
-          <h1 class="title" id="page-title">
+          <h1 class="title page-title">
             {{ title }}
           </h1>
         {% endif %}
@@ -168,31 +168,31 @@
         {% endif %}
       {{ page.content }}
       {{ feed_icons }}
-    </section></main> <!-- /.section, /#content -->
+    </section></main>{# /.section, /#content #}
 
     {% if page.sidebar_first %}
-      <div id="sidebar-first" class="column sidebar"><aside class="section">
+      <div class="sidebar-first" class="column sidebar"><aside class="section" role="complementary">
         {{ page.sidebar_first }}
-      </aside></div><!-- /.section, /#sidebar-first -->
+      </aside></div>{# /.section, /#sidebar-first #}
     {% endif %}
 
     {% if page.sidebar_second %}
-      <div id="sidebar-second" class="column sidebar"><aside class="section">
+      <div class="sidebar-second" class="column sidebar"><aside class="section" role="complementary">
         {{ page.sidebar_second }}
-      </aside></div><!-- /.section, /#sidebar-second -->
+      </aside></div>{# /.section, /#sidebar-second #}
     {% endif %}
 
-  </div></div><!-- /#main, /#main-wrapper -->
+  </div></div>{# /#main, /.main-wrapper #}
 
   {% if page.triptych_first or page.triptych_middle or page.triptych_last %}
-    <div id="triptych-wrapper"><aside id="triptych" class="clearfix">
+    <div class="triptych-wrapper"><aside class="triptych" class="clearfix" role="complementary">
       {{ page.triptych_first }}
       {{ page.triptych_middle }}
       {{ page.triptych_last }}
-    </aside></div><!-- /#triptych, /#triptych-wrapper -->
+    </aside></div>{# /.triptych, /.triptych-wrapper #}
   {% endif %}
 
-  <div id="footer-wrapper"><footer class="section">
+  <div class="footer-wrapper"><footer class="section">
 
     {% if page.footer_firstcolumn or page.footer_secondcolumn or page.footer_thirdcolumn or page.footer_fourthcolumn %}
       <div id="footer-columns" class="clearfix">
@@ -200,15 +200,15 @@
         {{ page.footer_secondcolumn }}
         {{ page.footer_thirdcolumn }}
         {{ page.footer_fourthcolumn }}
-      </div><!-- /#footer-columns -->
+      </div>{# /#footer-columns #}
     {% endif %}
 
     {% if page.footer %}
       <div id="footer" role="contentinfo" class="clearfix">
         {{ page.footer }}
-      </div> <!-- /#footer -->
+      </div>{# /#footer #}
    {% endif %}
 
-  </footer></div> <!-- /.section, /#footer-wrapper -->
+  </footer></div>{# /.section, /.footer-wrapper #}
 
-</div></div> <!-- /#page, /#page-wrapper -->
+</div></div>{# /.page, /.page-wrapper #}