Fix broken images and cite element misuse (#25)

* Replace placehold.it with dummyimage.com

* Remove `cite` from `blockquote`

* Rebuild index.html

* Patch version bump

Author: ericwbailey

docs/index.html

@@ -166,7 +166,7 @@ <h3 id="subtitle-content">Content</h3>
         "Yes, mother, yes, thank-you, I'm getting up now."
       </p>
       <footer>
-        <cite>Gregor Samsa</cite>
+        Gregor Samsa
       </footer>
     </blockquote>
     <p>
@@ -531,14 +531,14 @@ <h2 id="title-embedded">Embedded</h2>
   <!-- Start of #subsection-image -->
   <h3 id="subsection-image">Image</h3>
   <img
-    src="http://placehold.it/600x400?text=Image+Example"
+    src="https://dummyimage.com/600x400?text==Image+Example"
     alt="Image Example" />
   <!-- End of #subsection-image -->
 
   <!-- Start of #subsection-broken-image -->
   <h3 id="subsection-lazy-loaded-image">Lazy-loaded Image</h3>
   <img
-    src="http://placehold.it/500x500?text=Lazy-Loaded+Image+Example"
+    src="http://dummyimage.com/500x500?text=Lazy-Loaded+Image+Example"
     loading="lazy"
     decoding="async"
     width="500"
@@ -557,7 +557,7 @@ <h3 id="subsection-broken-image">Broken Image</h3>
   <h3 id="subsection-figure-with-caption">Figure with Caption</h3>
   <figure>
     <img
-      src="http://placehold.it/400x250?text=Figure+Example"
+      src="http://dummyimage.com/400x250?text=Figure+Example"
       alt="Figure Example" />
     <figcaption>
       An example figure caption.
@@ -607,25 +607,25 @@ <h3 id="subsection-picture">Picture</h3>
   <picture>
     <source
       media="(min-width: 40em)"
-      srcset="http://placehold.it/800x450/7ED321/ffffff/?text=1x+Source+w/Breakpoint+Example 1x,
-              http://placehold.it/800x600/7ED321/ffffff/?text=2x+Source+w/Breakpoint+Example 2x" />
+      srcset="http://dummyimage.com/800x450/7ED321/ffffff/?text=1x+Source+w/Breakpoint+Example 1x,
+              http://dummyimage.com/800x600/7ED321/ffffff/?text=2x+Source+w/Breakpoint+Example 2x" />
     <source
-      srcset="http://placehold.it/500x250/F5A623/ffffff/?text=1x+Source+Example 1x,
-              http://placehold.it/500x250/F5A623/ffffff/?text=2x+Source+Example 2x" />
+      srcset="http://dummyimage.com/500x250/F5A623/ffffff/?text=1x+Source+Example 1x,
+              http://dummyimage.com/500x250/F5A623/ffffff/?text=2x+Source+Example 2x" />
     <img
-      src="http://placehold.it/600x400?text=Img+Fallback"
+      src="https://dummyimage.com/600x400?text==Img+Fallback"
       alt="Picture Element" />
   </picture>
   <!-- End of #subsection-picture -->
 
   <!-- Start of #subsection-image-with-srcset-and-sizes -->
   <h3 id="subsection-image-with-srcset-and-sizes">Image with Srcset and Sizes</h3>
   <img
-    srcset="http://placehold.it/1024x768/7ED321/ffffff/?text=Large 1024w,
-            http://placehold.it/1024x768/F5A623/ffffff/?text=Medium 640w,
-            http://placehold.it/320x240/50E3C2/ffffff/?text=Small 320w"
+    srcset="http://dummyimage.com/1024x768/7ED321/ffffff/?text=Large 1024w,
+            http://dummyimage.com/1024x768/F5A623/ffffff/?text=Medium 640w,
+            http://dummyimage.com/320x240/50E3C2/ffffff/?text=Small 320w"
     sizes="(min-width: 36em) 50vw, 100vw"
-    src="http://placehold.it/600x400?text=Img+Fallback"
+    src="https://dummyimage.com/600x400?text==Img+Fallback"
     alt="Image with Srcset and Sizes Example" />
   <!-- End of #subsection-image-with-srcset-and-sizes -->
 
@@ -668,7 +668,7 @@ <h3 id="subsection-audio">Audio</h3>
   <h3 id="subsection-video">Video</h3>
   <video
     controls
-    poster="http://placehold.it/854x480?text=Video+Poster">
+    poster="http://dummyimage.com/854x480?text=Video+Poster">
     <source
       src="http://clips.vorwaerts-gmbh.de/VfE_html5.mp4"
       type="video/mp4" />

package.json

@@ -2,7 +2,7 @@
   "name": "accessible-html-content-patterns",
   "description": "A collection of the full HTML5 Doctor Element Index as well as common markup patterns for quick reference.",
   "homepage": "https://github.com/ericwbailey/accessible-html-content-patterns",
-  "version": "2.0.9",
+  "version": "2.0.10",
   "license": "MIT",
   "author": "Eric Bailey <[email protected]> (http://ericwbailey.website/)",
   "contributors": [

partials/section.embedded.hbs

@@ -5,14 +5,14 @@
   <!-- Start of #subsection-image -->
   <h3 id="subsection-image">Image</h3>
   <img
-    src="http://placehold.it/600x400?text=Image+Example"
+    src="https://dummyimage.com/600x400?text==Image+Example"
     alt="Image Example" />
   <!-- End of #subsection-image -->
 
   <!-- Start of #subsection-broken-image -->
   <h3 id="subsection-lazy-loaded-image">Lazy-loaded Image</h3>
   <img
-    src="http://placehold.it/500x500?text=Lazy-Loaded+Image+Example"
+    src="http://dummyimage.com/500x500?text=Lazy-Loaded+Image+Example"
     loading="lazy"
     decoding="async"
     width="500"
@@ -31,7 +31,7 @@
   <h3 id="subsection-figure-with-caption">Figure with Caption</h3>
   <figure>
     <img
-      src="http://placehold.it/400x250?text=Figure+Example"
+      src="http://dummyimage.com/400x250?text=Figure+Example"
       alt="Figure Example" />
     <figcaption>
       An example figure caption.
@@ -81,25 +81,25 @@
   <picture>
     <source
       media="(min-width: 40em)"
-      srcset="http://placehold.it/800x450/7ED321/ffffff/?text=1x+Source+w/Breakpoint+Example 1x,
-              http://placehold.it/800x600/7ED321/ffffff/?text=2x+Source+w/Breakpoint+Example 2x" />
+      srcset="http://dummyimage.com/800x450/7ED321/ffffff/?text=1x+Source+w/Breakpoint+Example 1x,
+              http://dummyimage.com/800x600/7ED321/ffffff/?text=2x+Source+w/Breakpoint+Example 2x" />
     <source
-      srcset="http://placehold.it/500x250/F5A623/ffffff/?text=1x+Source+Example 1x,
-              http://placehold.it/500x250/F5A623/ffffff/?text=2x+Source+Example 2x" />
+      srcset="http://dummyimage.com/500x250/F5A623/ffffff/?text=1x+Source+Example 1x,
+              http://dummyimage.com/500x250/F5A623/ffffff/?text=2x+Source+Example 2x" />
     <img
-      src="http://placehold.it/600x400?text=Img+Fallback"
+      src="https://dummyimage.com/600x400?text==Img+Fallback"
       alt="Picture Element" />
   </picture>
   <!-- End of #subsection-picture -->
 
   <!-- Start of #subsection-image-with-srcset-and-sizes -->
   <h3 id="subsection-image-with-srcset-and-sizes">Image with Srcset and Sizes</h3>
   <img
-    srcset="http://placehold.it/1024x768/7ED321/ffffff/?text=Large 1024w,
-            http://placehold.it/1024x768/F5A623/ffffff/?text=Medium 640w,
-            http://placehold.it/320x240/50E3C2/ffffff/?text=Small 320w"
+    srcset="http://dummyimage.com/1024x768/7ED321/ffffff/?text=Large 1024w,
+            http://dummyimage.com/1024x768/F5A623/ffffff/?text=Medium 640w,
+            http://dummyimage.com/320x240/50E3C2/ffffff/?text=Small 320w"
     sizes="(min-width: 36em) 50vw, 100vw"
-    src="http://placehold.it/600x400?text=Img+Fallback"
+    src="https://dummyimage.com/600x400?text==Img+Fallback"
     alt="Image with Srcset and Sizes Example" />
   <!-- End of #subsection-image-with-srcset-and-sizes -->
 
@@ -142,7 +142,7 @@
   <h3 id="subsection-video">Video</h3>
   <video
     controls
-    poster="http://placehold.it/854x480?text=Video+Poster">
+    poster="http://dummyimage.com/854x480?text=Video+Poster">
     <source
       src="http://clips.vorwaerts-gmbh.de/VfE_html5.mp4"
       type="video/mp4" />

partials/section.text-level.hbs

@@ -13,7 +13,7 @@
         "Yes, mother, yes, thank-you, I'm getting up now."
       </p>
       <footer>
-        <cite>Gregor Samsa</cite>
+        Gregor Samsa
       </footer>
     </blockquote>
     <p>