Reorganize for img folder

rchillard · Mar 13, 2021 · ac5b98c · ac5b98c
1 parent 09f2710
commit ac5b98c
Show file tree

Hide file tree

Showing 52 changed files with 84 additions and 84 deletions.
diff --git a/about.html b/about.html
@@ -7,7 +7,7 @@
   <meta name="Description"
     content="Home for beginners to learn HTML, experts to reference elements, and anyone to leverage common templates">
   <title>HTML Haus | Hyper Text's Home</title>
-  <link rel="icon" type="image/x-icon" href="assets/favicon.ico">
+  <link rel="icon" type="image/x-icon" href="img/favicon.ico">
   <!-- <link rel="stylesheet" type="text/css" href="css/sane.css"> -->
   <link rel="stylesheet" type="text/css" href="css/styles.css">
   <!-- <base href="https://html.haus/"> -->
@@ -16,7 +16,7 @@
 <body>
   <header>
     <nav>
-      <a id="menu-title" href="index.html">HTML<img class="logo" src="assets/house-with-tree.png"
+      <a id="menu-title" href="index.html">HTML<img class="logo" src="img/house-with-tree.png"
           alt="House with tree icon"></a>
       <ul>
         <li><a href="learn.html">Learn</a></li>
@@ -72,10 +72,10 @@ <h2>License</h2>
     <h2>Contributing</h2>
     <p>Have a suggestion or see an error? This project is open source. Please contribute on <a
         href="https://github.com/rchillard/html.haus">GitHub <img class="logo" alt="GitHub Octocat Logo"
-          src="assets/github.svg"></a>.</p>
+          src="img/github.svg"></a>.</p>
     <h2>Author</h2>
     <p>
-      Made with <img id="heart" src="assets/red-heart.png" alt="Red Heart"> by <a href="https://rchillard.com/">RCH</a>. 
+      Made with <img id="heart" src="img/red-heart.png" alt="Red Heart"> by <a href="https://rchillard.com/">RCH</a>. 
       This is first project in a trifecta covering web technologies:
     </p>
     <ul>
@@ -90,7 +90,7 @@ <h2>Author</h2>
     <a href="reference.html">Reference</a>
     <a href="tools.html">Tools</a>
     <a href="about.html">About</a>
-    <a href="index.html"><img alt="House with tree icon" src="assets/house-with-tree.png"></a>
+    <a href="index.html"><img alt="House with tree icon" src="img/house-with-tree.png"></a>
   </footer>
 </body>
 

diff --git a/api.html b/api.html
@@ -7,7 +7,7 @@
   <meta name="Description"
     content="Instructions for using our API to see HTML elements and code samples">
   <title>HTML Haus | API</title>
-  <link rel="icon" type="image/x-icon" href="assets/favicon.ico">
+  <link rel="icon" type="image/x-icon" href="img/favicon.ico">
   <!-- <link rel="stylesheet" type="text/css" href="css/sane.css"> -->
   <link rel="stylesheet" type="text/css" href="css/styles.css">
   <!-- <base href="https://html.haus/"> -->
@@ -16,7 +16,7 @@
 <body>
   <header>
     <nav>
-      <a id="menu-title" href="index.html">HTML<img class="logo" src="assets/house-with-tree.png"
+      <a id="menu-title" href="index.html">HTML<img class="logo" src="img/house-with-tree.png"
           alt="House with tree icon"></a>
       <ul>
         <li><a href="learn.html">Learn</a></li>
@@ -112,7 +112,7 @@ <h3>HTML</h3>
     <a href="reference.html">Reference</a>
     <a href="tools.html">Tools</a>
     <a href="about.html">About</a>
-    <a href="index.html"><img alt="House with tree icon" src="assets/house-with-tree.png"></a>
+    <a href="index.html"><img alt="House with tree icon" src="img/house-with-tree.png"></a>
   </footer>
 </body>
 

diff --git a/assets/attribute.svg → img/attribute.svg b/assets/attribute.svg → img/attribute.svg
diff --git a/assets/brickwall-1800.jpg → img/brickwall-1800.jpg b/assets/brickwall-1800.jpg → img/brickwall-1800.jpg
diff --git a/assets/brickwall-2700.jpg → img/brickwall-2700.jpg b/assets/brickwall-2700.jpg → img/brickwall-2700.jpg
diff --git a/assets/brickwall-600.jpg → img/brickwall-600.jpg b/assets/brickwall-600.jpg → img/brickwall-600.jpg
diff --git a/assets/brickwall-900.jpg → img/brickwall-900.jpg b/assets/brickwall-900.jpg → img/brickwall-900.jpg
diff --git a/assets/element-emphasis.svg → img/element-emphasis.svg b/assets/element-emphasis.svg → img/element-emphasis.svg
diff --git a/assets/element-mark.svg → img/element-mark.svg b/assets/element-mark.svg → img/element-mark.svg
diff --git a/assets/favicon.ico → img/favicon.ico b/assets/favicon.ico → img/favicon.ico
diff --git a/assets/foundation-1800.jpg → img/foundation-1800.jpg b/assets/foundation-1800.jpg → img/foundation-1800.jpg
diff --git a/assets/foundation-2700.jpg → img/foundation-2700.jpg b/assets/foundation-2700.jpg → img/foundation-2700.jpg
diff --git a/assets/foundation-600.jpg → img/foundation-600.jpg b/assets/foundation-600.jpg → img/foundation-600.jpg
diff --git a/assets/foundation-900.jpg → img/foundation-900.jpg b/assets/foundation-900.jpg → img/foundation-900.jpg
diff --git a/assets/github.svg → img/github.svg b/assets/github.svg → img/github.svg
diff --git a/assets/haus-1800.jpg → img/haus-1800.jpg b/assets/haus-1800.jpg → img/haus-1800.jpg
diff --git a/assets/haus-2700.jpg → img/haus-2700.jpg b/assets/haus-2700.jpg → img/haus-2700.jpg
diff --git a/assets/haus-600.jpg → img/haus-600.jpg b/assets/haus-600.jpg → img/haus-600.jpg
diff --git a/assets/haus-900.jpg → img/haus-900.jpg b/assets/haus-900.jpg → img/haus-900.jpg
diff --git a/assets/highlighted-text-1800.jpg → img/highlighted-text-1800.jpg b/assets/highlighted-text-1800.jpg → img/highlighted-text-1800.jpg
diff --git a/assets/highlighted-text-2700.jpg → img/highlighted-text-2700.jpg b/assets/highlighted-text-2700.jpg → img/highlighted-text-2700.jpg
diff --git a/assets/highlighted-text-600.jpg → img/highlighted-text-600.jpg b/assets/highlighted-text-600.jpg → img/highlighted-text-600.jpg
diff --git a/assets/highlighted-text-900.jpg → img/highlighted-text-900.jpg b/assets/highlighted-text-900.jpg → img/highlighted-text-900.jpg
diff --git a/assets/house-with-tree.png → img/house-with-tree.png b/assets/house-with-tree.png → img/house-with-tree.png
diff --git a/assets/inline-block-combined.svg → img/inline-block-combined.svg b/assets/inline-block-combined.svg → img/inline-block-combined.svg
diff --git a/...ashkan-forouzani-czmRe87k_ww-unsplash.jpg → ...ashkan-forouzani-czmRe87k_ww-unsplash.jpg b/...ashkan-forouzani-czmRe87k_ww-unsplash.jpg → ...ashkan-forouzani-czmRe87k_ww-unsplash.jpg
diff --git a/...ashkan-forouzani-qhcml9Xo_5k-unsplash.jpg → ...ashkan-forouzani-qhcml9Xo_5k-unsplash.jpg b/...ashkan-forouzani-qhcml9Xo_5k-unsplash.jpg → ...ashkan-forouzani-qhcml9Xo_5k-unsplash.jpg
diff --git a/.../gabriele-diwald-aL1Bp6Put2I-unsplash.jpg → .../gabriele-diwald-aL1Bp6Put2I-unsplash.jpg b/.../gabriele-diwald-aL1Bp6Put2I-unsplash.jpg → .../gabriele-diwald-aL1Bp6Put2I-unsplash.jpg
diff --git a/...als/hana-barakat-T1uOZ2kEDsA-unsplash.jpg → ...als/hana-barakat-T1uOZ2kEDsA-unsplash.jpg b/...als/hana-barakat-T1uOZ2kEDsA-unsplash.jpg → ...als/hana-barakat-T1uOZ2kEDsA-unsplash.jpg
diff --git a/...ls/hannah-busing-G-_L3Eqkqmc-unsplash.jpg → ...ls/hannah-busing-G-_L3Eqkqmc-unsplash.jpg b/...ls/hannah-busing-G-_L3Eqkqmc-unsplash.jpg → ...ls/hannah-busing-G-_L3Eqkqmc-unsplash.jpg
diff --git a/...ls/jesse-roberts-561igiTyvSk-unsplash.jpg → ...ls/jesse-roberts-561igiTyvSk-unsplash.jpg b/...ls/jesse-roberts-561igiTyvSk-unsplash.jpg → ...ls/jesse-roberts-561igiTyvSk-unsplash.jpg
diff --git a/.../luke-stackpoole-eWqOgJ-lfiI-unsplash.jpg → .../luke-stackpoole-eWqOgJ-lfiI-unsplash.jpg b/.../luke-stackpoole-eWqOgJ-lfiI-unsplash.jpg → .../luke-stackpoole-eWqOgJ-lfiI-unsplash.jpg
diff --git a/...als/mirko-blicke-V_y81v_lI4k-unsplash.jpg → ...als/mirko-blicke-V_y81v_lI4k-unsplash.jpg b/...als/mirko-blicke-V_y81v_lI4k-unsplash.jpg → ...als/mirko-blicke-V_y81v_lI4k-unsplash.jpg
diff --git a/...iginals/t-h-chia-RQCwU_73uAg-unsplash.jpg → ...iginals/t-h-chia-RQCwU_73uAg-unsplash.jpg b/...iginals/t-h-chia-RQCwU_73uAg-unsplash.jpg → ...iginals/t-h-chia-RQCwU_73uAg-unsplash.jpg
diff --git a/.../valeriy-kryukov-aRvKSkRO-vw-unsplash.jpg → .../valeriy-kryukov-aRvKSkRO-vw-unsplash.jpg b/.../valeriy-kryukov-aRvKSkRO-vw-unsplash.jpg → .../valeriy-kryukov-aRvKSkRO-vw-unsplash.jpg
diff --git a/assets/red-heart-brickwall-1800.jpg → img/red-heart-brickwall-1800.jpg b/assets/red-heart-brickwall-1800.jpg → img/red-heart-brickwall-1800.jpg
diff --git a/assets/red-heart-brickwall-2700.jpg → img/red-heart-brickwall-2700.jpg b/assets/red-heart-brickwall-2700.jpg → img/red-heart-brickwall-2700.jpg
diff --git a/assets/red-heart-brickwall-600.jpg → img/red-heart-brickwall-600.jpg b/assets/red-heart-brickwall-600.jpg → img/red-heart-brickwall-600.jpg
diff --git a/assets/red-heart-brickwall-900.jpg → img/red-heart-brickwall-900.jpg b/assets/red-heart-brickwall-900.jpg → img/red-heart-brickwall-900.jpg
diff --git a/assets/red-heart.png → img/red-heart.png b/assets/red-heart.png → img/red-heart.png
diff --git a/assets/red-house-150.jpg → img/red-house-150.jpg b/assets/red-house-150.jpg → img/red-house-150.jpg
diff --git a/assets/rocket.png → img/rocket.png b/assets/rocket.png → img/rocket.png
diff --git a/assets/wooden-frame-1800.jpg → img/wooden-frame-1800.jpg b/assets/wooden-frame-1800.jpg → img/wooden-frame-1800.jpg
diff --git a/assets/wooden-frame-2700.jpg → img/wooden-frame-2700.jpg b/assets/wooden-frame-2700.jpg → img/wooden-frame-2700.jpg
diff --git a/assets/wooden-frame-600.jpg → img/wooden-frame-600.jpg b/assets/wooden-frame-600.jpg → img/wooden-frame-600.jpg
diff --git a/assets/wooden-frame-900.jpg → img/wooden-frame-900.jpg b/assets/wooden-frame-900.jpg → img/wooden-frame-900.jpg
diff --git a/index.html b/index.html
@@ -5,15 +5,15 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <meta name="Description" content="Home for beginners to learn HTML, experts to reference elements, and anyone to leverage common templates">
     <title>HTML Haus | Hyper Text's Home</title>
-    <link rel="icon" type="image/x-icon" href="assets/favicon.ico">
+    <link rel="icon" type="image/x-icon" href="img/favicon.ico">
     <!-- <link rel="stylesheet" type="text/css" href="css/sane.css"> -->
     <link rel="stylesheet" type="text/css" href="css/styles.css">
     <!-- <base href="https://html.haus/"> -->
   </head>
   <body>
     <header>
       <nav>
-        <a id="menu-title" href="index.html">HTML<img class="logo" src="assets/house-with-tree.png" alt="House with tree icon"></a>
+        <a id="menu-title" href="index.html">HTML<img class="logo" src="img/house-with-tree.png" alt="House with tree icon"></a>
         <ul>
           <li><a href="learn.html">Learn</a></li>
           <li><a href="practice.html">Practice</a></li>
@@ -43,16 +43,16 @@ <h2>HTML</h2>
         and concrete that frames every website and web application.  It's the skeleton that the rest of the web builds upon to define meaning 
         and present information.
       </p>
-      <img src="assets/foundation-600.jpg"
+      <img src="img/foundation-600.jpg"
       sizes="(max-width: 600px) 95vw,
             (min-width: 600px) 90vw, 
             (min-width: 768px) 75vw, 
             (min-width: 992px) 60vw, 
             (min-width: 1200px) 50vw, 100vw"
-      srcset="assets/foundation-600.jpg 600w,
-              assets/foundation-900.jpg 900w,
-              assets/foundation-1800.jpg 1800w,
-              assets/foundation-2700.jpg 2700w"
+      srcset="img/foundation-600.jpg 600w,
+              img/foundation-900.jpg 900w,
+              img/foundation-1800.jpg 1800w,
+              img/foundation-2700.jpg 2700w"
       alt="Concrete pillars at sunset by Mirko Blicke on Unsplash">
       <p>
         Everything is built on top of HTML's foundation.  If you want to learn how to build on the web, you have to start with HTML.
@@ -61,20 +61,20 @@ <h2 lang="de">Haus</h2>
       <p>
         <span lang="de">Haus</span> is the German word for house.  It comes from Middle High German hūs (pronounced /haʊ̯s/).  You can hear it here:
       </p>
-      <audio controls style="padding-left: 1rem">
+      <audio controls>
         <source src="assets/De-Haus.ogg" type="audio/ogg">
         Your browser does not support the audio element.
       </audio>
-      <img src="assets/haus-600.jpg"
+      <img src="img/haus-600.jpg"
           sizes="(max-width: 600px) 95vw,
                 (min-width: 600px) 90vw, 
                 (min-width: 768px) 75vw, 
                 (min-width: 992px) 60vw, 
                 (min-width: 1200px) 50vw, 100vw"
-          srcset="assets/haus-600.jpg 600w,
-                  assets/haus-900.jpg 900w,
-                  assets/haus-1800.jpg 1800w,
-                  assets/haus-2700.jpg 2700w"
+          srcset="img/haus-600.jpg 600w,
+                  img/haus-900.jpg 900w,
+                  img/haus-1800.jpg 1800w,
+                  img/haus-2700.jpg 2700w"
           alt="Large white rural house by Jesse Roberts on Unsplash">
       <p>
         HTML.Haus is your home for learning how to build websites using HTML by starting with the foundation, the structure, the bones of 
@@ -106,7 +106,7 @@ <h2>Background</h2>
       <a href="reference.html">Reference</a>
       <a href="tools.html">Tools</a>
       <a href="about.html">About</a>
-      <a href="index.html"><img alt="House with tree icon" class="logo" src="assets/house-with-tree.png"></a>
+      <a href="index.html"><img alt="House with tree icon" class="logo" src="img/house-with-tree.png"></a>
     </footer>
   </body>
 </html>
diff --git a/learn.html b/learn.html
@@ -6,7 +6,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <meta name="Description" content="Tutorial to teach the basics of HTML to beginners">
   <title>HTML Haus | Learn HTML</title>
-  <link rel="icon" type="image/x-icon" href="assets/favicon.ico">
+  <link rel="icon" type="image/x-icon" href="img/favicon.ico">
   <!-- <link rel="stylesheet" type="text/css" href="css/sane.css"> -->
   <link rel="stylesheet" type="text/css" href="css/styles.css">
   <!-- <base href="https://html.haus/"> -->
@@ -15,7 +15,7 @@
 <body>
   <header>
     <nav>
-      <a id="menu-title" href="index.html">HTML<img class="logo" src="assets/house-with-tree.png"
+      <a id="menu-title" href="index.html">HTML<img class="logo" src="img/house-with-tree.png"
           alt="House with tree icon"></a>
       <ul>
         <li><a href="learn.html">Learn</a></li>
@@ -45,14 +45,14 @@ <h1>Learn HTML</h1>
       regular text to specify structure and meaning. This is similar to how you physically mark up an important passage
       in a book by highlighting. When you highlight part of a book, you are marking that part as important.
     </p>
-    <img src="assets/highlighted-text-600.jpg" sizes="(max-width: 600px) 95vw,
+    <img src="img/highlighted-text-600.jpg" sizes="(max-width: 600px) 95vw,
              (min-width: 600px) 90vw, 
              (min-width: 768px) 75vw, 
              (min-width: 992px) 60vw, 
-             (min-width: 1200px) 50vw, 100vw" srcset="assets/highlighted-text-600.jpg 600w,
-               assets/highlighted-text-900.jpg 900w,
-               assets/highlighted-text-1800.jpg 1800w,
-               assets/highlighted-text-2700.jpg 2700w" alt="Highlighted book by Hannah Busing on Unsplash">
+             (min-width: 1200px) 50vw, 100vw" srcset="img/highlighted-text-600.jpg 600w,
+               img/highlighted-text-900.jpg 900w,
+               img/highlighted-text-1800.jpg 1800w,
+               img/highlighted-text-2700.jpg 2700w" alt="Highlighted book by Hannah Busing on Unsplash">
     <p>
       HTML gives you the digital equivalent of a physical highlighter to mark up content. You use HTML on the web to
       define the structure or 'mark up' the
@@ -66,7 +66,7 @@ <h2>Elements</h2>
       tag and an ending tag. These tags follow a certain
       syntax and they encase content to form an element. Here's a diagram of an element:
     </p>
-    <img class="diagram" src="assets/element-mark.svg"
+    <img class="diagram" src="img/element-mark.svg"
       alt="diagram of basic html element <mark> with start tag and end tag" height="160">
     <p>
       In HTML, the &lt;mark&gt; tag is short for marked and browsers usually render it as highlighted text. Similar to
@@ -154,14 +154,14 @@ <h3>Block Elements</h3>
       probably be the bricks you use to start building. The most common textual block element or brick is the paragraph
       element. You're reading one right now!
     </p>
-    <img src="assets/brickwall-600.jpg" sizes="(max-width: 600px) 95vw,
+    <img src="img/brickwall-600.jpg" sizes="(max-width: 600px) 95vw,
              (min-width: 600px) 90vw, 
              (min-width: 768px) 75vw, 
              (min-width: 992px) 60vw, 
-             (min-width: 1200px) 50vw, 100vw" srcset="assets/brickwall-600.jpg 600w,
-               assets/brickwall-900.jpg 900w,
-               assets/brickwall-1800.jpg 1800w,
-               assets/brickwall-2700.jpg 2700w"
+             (min-width: 1200px) 50vw, 100vw" srcset="img/brickwall-600.jpg 600w,
+               img/brickwall-900.jpg 900w,
+               img/brickwall-1800.jpg 1800w,
+               img/brickwall-2700.jpg 2700w"
       alt="Red bricks peaking through white stucco wall by Gabriele Diwald on Unsplash">
     <p>
       I lied before because the p tag should really be the first building block in your world of new materials. See how
@@ -273,14 +273,14 @@ <h2>Story</h2>
         </textarea>
     </label>
 
-    <img src="assets/wooden-frame-600.jpg" sizes="(max-width: 600px) 95vw,
+    <img src="img/wooden-frame-600.jpg" sizes="(max-width: 600px) 95vw,
              (min-width: 600px) 90vw, 
              (min-width: 768px) 75vw, 
              (min-width: 992px) 60vw, 
-             (min-width: 1200px) 50vw, 100vw" srcset="assets/wooden-frame-600.jpg 600w,
-               assets/wooden-frame-900.jpg 900w,
-               assets/wooden-frame-1800.jpg 1800w,
-               assets/wooden-frame-2700.jpg 2700w"
+             (min-width: 1200px) 50vw, 100vw" srcset="img/wooden-frame-600.jpg 600w,
+               img/wooden-frame-900.jpg 900w,
+               img/wooden-frame-1800.jpg 1800w,
+               img/wooden-frame-2700.jpg 2700w"
       alt="Japanese building with red wooden frame and white roof by T.H. Chia on Unsplash">
     <h3>Inline Elements</h3>
     <p>
@@ -296,7 +296,7 @@ <h3>Inline Elements</h3>
       might. That's because they're inline elements.
       Inline elements only effect text in the same line and do not alter the visual flow of the page or document.
     </p>
-    <img class="diagram" src="assets/inline-block-combined.svg"
+    <img class="diagram" src="img/inline-block-combined.svg"
       alt="diagram of p block element and strong inline element" height="160">
     <p>The book is an <strong>American Gothic masterwork</strong></p>
     <label>The HTML used to display the text above:
@@ -393,14 +393,14 @@ <h3>Accessibility</h3>
       reader or users that are hearing impaired and will need
       to read the captions on a video embedded in your site.
     </p>
-    <img src="assets/red-heart-brickwall-600.jpg" sizes="(max-width: 600px) 95vw,
+    <img src="img/red-heart-brickwall-600.jpg" sizes="(max-width: 600px) 95vw,
              (min-width: 600px) 90vw, 
              (min-width: 768px) 75vw, 
              (min-width: 992px) 60vw, 
-             (min-width: 1200px) 50vw, 100vw" srcset="assets/red-heart-brickwall-600.jpg 600w,
-               assets/red-heart-brickwall-900.jpg 900w,
-               assets/red-heart-brickwall-1800.jpg 1800w,
-               assets/red-heart-brickwall-2700.jpg 2700w"
+             (min-width: 1200px) 50vw, 100vw" srcset="img/red-heart-brickwall-600.jpg 600w,
+               img/red-heart-brickwall-900.jpg 900w,
+               img/red-heart-brickwall-1800.jpg 1800w,
+               img/red-heart-brickwall-2700.jpg 2700w"
       alt="Black heart drawn on red brick wall by Ashkan Forouzani on Unsplash">
     <p>
       You've learned how to write a story. You can build a basic house using HTML, and now you understand why it's
@@ -422,7 +422,7 @@ <h2>Attributes</h2>
       Here's a visual example showing an attribute called style which you can use to change how your element is
       displayed.
     </p>
-    <img class="diagram" src="assets/attribute.svg" alt="diagram of html style attribute for paragraph tag"
+    <img class="diagram" src="img/attribute.svg" alt="diagram of html style attribute for paragraph tag"
       height="160">
     <p>And here's how the actual HTML looks:</p>
     <p style="color: red">She's a brick haus!</p>
@@ -516,22 +516,22 @@ <h2>Images</h2>
     </p>
     <label>
       You can see an example here:
-      <textarea><img src="assets/red-house-150.jpg" alt="Red house on side of green hill"></textarea>
+      <textarea><img src="img/red-house-150.jpg" alt="Red house on side of green hill"></textarea>
     </label>
-    <img src="assets/red-house-150.jpg" alt="Red house on side of green hill by Luke Stackpoole on Unsplash">
+    <img src="img/red-house-150.jpg" alt="Red house on side of green hill by Luke Stackpoole on Unsplash">
     <p>
-      The src="assets/red-house-150.jpg" is referencing a file in relation to where my current HTML page that references
+      The src="img/red-house-150.jpg" is referencing a file in relation to where my current HTML page that references
       the image is located. In this case, it's inside of a subfolder
-      which is named "assets" and the image is named "red-house-150.jpg". I was referencing an image on my computer, but
+      which is named "img" and the image is named "red-house-150.jpg". I was referencing an image on my computer, but
       you can also reference images on the internet by
       using their exact location. If you want to try, you can use the following address on your own HTML page:
-      "https://html.haus/assets/red-house-150.jpg"
+      "https://html.haus/img/red-house-150.jpg"
     </p>
     <label>
       Here's the HTML for you to try:
-      <textarea><img src="https://html.haus/assets/red-house-150.jpg" alt="Red house on side of green hill"></textarea>
+      <textarea><img src="https://html.haus/img/red-house-150.jpg" alt="Red house on side of green hill"></textarea>
     </label>
-    <img src="https://html.haus/assets/red-house-150.jpg" alt="Red house on side of green hill">
+    <img src="https://html.haus/img/red-house-150.jpg" alt="Red house on side of green hill">
     <p>
       You may have noticed another attribute attached to each of these images. Images have two required attributes: the
       src attribute and the alt attribute.
@@ -650,7 +650,7 @@ <h2>Conclusion</h2>
   <body>
     <h1>Congratulations</h1>
     <p>I'm proud of you for learning HTML and building your very own <a href="https://html.haus/">HTML.Haus</a>.</p>
-    <img src="https://html.haus/assets/red-house-150.jpg" alt="Red house on side of green hill">
+    <img src="https://html.haus/img/red-house-150.jpg" alt="Red house on side of green hill">
   </body>
 </html>
         </textarea>
@@ -675,7 +675,7 @@ <h2>Next Steps</h2>
     <a href="reference.html">Reference</a>
     <a href="tools.html">Tools</a>
     <a href="about.html">About</a>
-    <a href="index.html"><img alt="House with tree icon" src="assets/house-with-tree.png"></a>
+    <a href="index.html"><img alt="House with tree icon" src="img/house-with-tree.png"></a>
   </footer>
 </body>
 

diff --git a/practice.html b/practice.html
@@ -7,7 +7,7 @@
   <meta name="Description"
     content="Home for beginners to learn HTML, experts to reference elements, and anyone to leverage common templates">
   <title>HTML Haus | Hyper Text's Home</title>
-  <link rel="icon" type="image/x-icon" href="assets/favicon.ico">
+  <link rel="icon" type="image/x-icon" href="img/favicon.ico">
   <!-- <link rel="stylesheet" type="text/css" href="css/sane.css"> -->
   <link rel="stylesheet" type="text/css" href="css/styles.css">
   <!-- <base href="https://html.haus/"> -->
@@ -16,7 +16,7 @@
 <body>
   <header>
     <nav>
-      <a id="menu-title" href="index.html">HTML<img class="logo" src="assets/house-with-tree.png"
+      <a id="menu-title" href="index.html">HTML<img class="logo" src="img/house-with-tree.png"
           alt="House with tree icon"></a>
       <ul>
         <li><a href="learn.html">Learn</a></li>
@@ -49,7 +49,7 @@ <h1>Practice</h1>
     <a href="reference.html">Reference</a>
     <a href="tools.html">Tools</a>
     <a href="about.html">About</a>
-    <a href="index.html"><img alt="House with tree icon" src="assets/house-with-tree.png"></a>
+    <a href="index.html"><img alt="House with tree icon" src="img/house-with-tree.png"></a>
   </footer>
 </body>