Add heading identifiers

index.html

@@ -117,7 +117,7 @@ <h1 style="text-wrap: balance">
         </p>
       </section>
       <section>
-        <h2>Layout</h2>
+        <h2 id="layout">Layout</h2>
         <p>
           Most websites include a CSS reset, a set of stylings that remove style
           inconsistencies between browsers. This page has a rather minimal reset
@@ -200,7 +200,7 @@ <h2>Layout</h2>
 
       <section style="max-width: unset; padding: 0">
         <div class="inline">
-          <h3>Breaking out</h3>
+          <h3 id="breaking-out">Breaking out</h3>
           <p>
             Although this default width is useful for prose, there are also
             situations when you might want more width to work with. In those
@@ -238,7 +238,7 @@ <h3>Breaking out</h3>
           </p>
         </div>
         <div class="inline">
-          <h3>Grid layout</h3>
+          <h3 id="grid-layout">Grid layout</h3>
           <p>
             Grids are a powerful layout approach. They can be used for simple
             vertical layouts like this overall page, but can also be used for
@@ -268,7 +268,7 @@ <h3>Grid layout</h3>
       </section>
 
       <section>
-        <h3>Scroll layout</h3>
+        <h3 id="scroll-layout">Scroll layout</h3>
         <p>
           There is a common storytelling method in journalism called
           "scrollytelling." In essence, a visual element remains in the
@@ -477,7 +477,7 @@ <h3>Scroll layout</h3>
       </section>
 
       <section>
-        <h2>Prose</h2>
+        <h2 id="prose">Prose</h2>
         <p>
           The Daily uses Lora as our serif font and Open Sans as our sans serif
           font (digitally). In typography, serifs are small lines that are
@@ -509,7 +509,7 @@ <h2>Prose</h2>
       </section>
 
       <section>
-        <h2>Images</h2>
+        <h2 id="images">Images</h2>
         <p>
           Every story that gets published usually includes at least one image
           (i.e., the featured image). An image should almost always have the