From 48f0b5b8cf50757d3961ba1b5bf573031d9acb71 Mon Sep 17 00:00:00 2001
From: Tanvik Reddy <tanvikreddy123@gmail.com>
Date: Fri, 25 Jul 2025 01:14:03 -0400
Subject: [PATCH] Improve semantic HTML structure and accessibility in
 final_touches.html

---
 4-semantic-html/26_final_touches.html | 86 ++++++++++++++++-----------
 1 file changed, 51 insertions(+), 35 deletions(-)

diff --git a/4-semantic-html/26_final_touches.html b/4-semantic-html/26_final_touches.html
index 9055b93..24651fd 100644
--- a/4-semantic-html/26_final_touches.html
+++ b/4-semantic-html/26_final_touches.html
@@ -33,51 +33,67 @@ <h1>My Blog</h1>
         </ul>
       </nav>
     </header>
-    <br/>
+    <br>
     <main>
       <section id="about-section">
         <h2>About Me</h2>
         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
       </section>
-      <br/>
+      <br>
       <section id="stories-section">
         <h2>Stories</h2>
-        <article>
-          <figure>
-            <img style="width: 150px;" src="https://cdn.pixabay.com/photo/2014/10/27/18/32/obsidian-505332_960_720.jpg" alt="Obsidian" />
-            <figcaption>A piece of obsidian</figcaption>
-          </figure>
-          <br/>
-          <h3>Title</h3>
-          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
-        </article>
-        <br/><hr/><br/>
-        <article>
-          <figure>
-            <img style="width: 150px;" src="https://cdn.pixabay.com/photo/2014/10/27/18/32/obsidian-505332_960_720.jpg" alt="Obsidian" />
-            <figcaption>A piece of obsidian</figcaption>
-          </figure>
-          <h3>Title</h3>
-          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
-        </article>
-        <br/><hr/><br/>
-        <article>
-          <figure>
-            <img style="width: 150px;" src="https://cdn.pixabay.com/photo/2014/10/27/18/32/obsidian-505332_960_720.jpg" alt="Obsidian" />
-            <figcaption>A piece of obsidian</figcaption>
-          </figure>
-          <br>
-          <h3>Title</h3>
-          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
-        </article>
+        <section class="blog-posts">
+          <article>
+            <figure>
+              <img
+                style="width: 150px;"
+                src="https://cdn.pixabay.com/photo/2014/10/27/18/32/obsidian-505332_960_720.jpg"
+                alt="Close-up of a shiny obsidian rock"
+              />
+              <figcaption>A piece of obsidian</figcaption>
+            </figure>
+            <br>
+            <h3>Title</h3>
+            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+          </article>
+          <br><hr><br>
+          <article>
+            <figure>
+              <img
+                style="width: 150px;"
+                src="https://cdn.pixabay.com/photo/2014/10/27/18/32/obsidian-505332_960_720.jpg"
+                alt="Obsidian rock with light reflection"
+              />
+              <figcaption>A piece of obsidian</figcaption>
+            </figure>
+            <h3>Title</h3>
+            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+          </article>
+          <br><hr><br>
+          <article>
+            <figure>
+              <img
+                style="width: 150px;"
+                src="https://cdn.pixabay.com/photo/2014/10/27/18/32/obsidian-505332_960_720.jpg"
+                alt="Dark glossy obsidian stone"
+              />
+              <br>
+              <figcaption>A piece of obsidian</figcaption>
+            </figure>
+            <h3>Title</h3>
+            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+          </article>
+        </section>
       </section>
     </main>
     <footer>
-      <ul>
-        <li>Codédex Daily © 2023</li>
-        <li><a href="/about">About</a></li>
-        <li><a href="/blog">Blog</a></li>
-      </ul>
+      <section>
+        <ul>
+          <li>Codédex Daily © 2023</li>
+          <li><a href="/about">About</a></li>
+          <li><a href="/blog">Blog</a></li>
+        </ul>
+      </section>
     </footer>
   </body>
 </html>