build

README.md

@@ -2,4 +2,14 @@
 
 Lee Cattarin's personal website, v2. Built on Eleventy.
 
-Not live yet.
+## Pulling from git repo with NPM
+
+Apparently this works differently in WSL vs Linux? Fuck me, I guess.
+
+### WSL2
+
+> "@zachleat/heading-anchors": "https://github.com/lee0c/heading-anchors/tarball/main",
+
+### Linux
+
+> "@zachleat/heading-anchors": "github:lee0c/heading-anchors"

_includes/head-content.njk

@@ -6,7 +6,7 @@
 <meta name="description" content="{{ description or metadata.description }}">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="{{ metadata.title }}">
 
-<meta property="og:title" content="{{ title or metadata.title }}" />
+<meta property="og:title" content="{{ pageTitle }}" />
 <meta property="og:type" content="website" />
 <meta property="og:description" content="{{ description or metadata.description }}" />
 <meta property="og:site_name" content="{{ metadata.title }}" />

_includes/postlist.njk

@@ -2,16 +2,16 @@
 	{% for post in postlist %}
   <li class="post">
 		<a class="postlink" href="{{ post.url }}">
-			{% if post.data.image %}
-			<img src="/img/{{ post.data.image.src }}" alt="{{ post.data.image.alt }}"
-        {% if "blur" in post.data.tags %}class="blur"{% endif %}>
-			{% endif %}
 			<h2 data-ha-exclude>{{ post.data.title }} {% if "blur" in post.data.tags %}(mature){% endif %}</h2>
+			{% if post.data.image %}
 			<ul class="postlist-tags">
 				{% for tag in post.data.tags | removeBasicTags %}
 				<li>{{ tag }}</li>
 				{% endfor %}
 			</ul>
+			<img src="/img/{{ post.data.image.src }}" alt="{{ post.data.image.alt }}"
+        {% if "blur" in post.data.tags %}class="blur"{% endif %}>
+			{% endif %}
 		</a>
 	</li>
 	{% endfor %}

_site/1/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,183 +981,183 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/spinning-plants/">
-			
-			<img src="/img/plant-handspun.jpg" alt="6 small skeins of handspun yarn, each made from a different plant fiber. from top, we have flax (medium brown, rough); what is probably lotus (golden, shiny and soft); banana (white and semi shiny); hemp (light brown, rough); tencel (white and very shiny); ramie (a particularly small skein, white and semi shiny)" loading="lazy" decoding="async" width="1000" height="874">
-			
 			<h2 data-ha-exclude="" id="spinning-plants">spinning plants </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/plant-handspun.jpg" alt="6 small skeins of handspun yarn, each made from a different plant fiber. from top, we have flax (medium brown, rough); what is probably lotus (golden, shiny and soft); banana (white and semi shiny); hemp (light brown, rough); tencel (white and very shiny); ramie (a particularly small skein, white and semi shiny)" loading="lazy" decoding="async" width="1000" height="874">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/comparing-text-editors/">
-			
-			<img src="/img/horsetail.jpg" alt="Image unrelated to post. Close up on a horsetail plant&#39;s stem, with many small needle-like leaves emerging from all sides of the circular stem at each segmented joint." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="comparing-text-editors">comparing text editors </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/horsetail.jpg" alt="Image unrelated to post. Close up on a horsetail plant&#39;s stem, with many small needle-like leaves emerging from all sides of the circular stem at each segmented joint." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/an-intro-to-git/">
-			
-			<img src="/img/goldeneye-tail.jpg" alt="Image unrelated to post. The tail of a diving duck pokes out from the water with a small splash." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="an-intro-to-git">an intro to git </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/goldeneye-tail.jpg" alt="Image unrelated to post. The tail of a diving duck pokes out from the water with a small splash." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/orion-handspun/">
-			
-			<img src="/img/orion-handspun.jpg" alt="3 skeins of handspun yarn, 1 large and 2 small. One of the small skeins is a little more inconsistent weight than the other two - this one was spun on drop spindle about 2 years ago. The other two are about a sport or maybe a DK weight. All three are a gold colorway with tiny hints of orange and a pale light green." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="orion-handspun">orion handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/orion-handspun.jpg" alt="3 skeins of handspun yarn, 1 large and 2 small. One of the small skeins is a little more inconsistent weight than the other two - this one was spun on drop spindle about 2 years ago. The other two are about a sport or maybe a DK weight. All three are a gold colorway with tiny hints of orange and a pale light green." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/moving-images/">
-			
-			<img src="/img/cormorant.jpg" alt="Image unrelated to post. A cormorant, a type of black waterfowl, poses with wings spread on a buoy in Puget Sound. Off to the left, another bird floats." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="moving-images">moving images </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/cormorant.jpg" alt="Image unrelated to post. A cormorant, a type of black waterfowl, poses with wings spread on a buoy in Puget Sound. Off to the left, another bird floats." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/petrichor-handspun/">
-			
-			<img src="/img/petrichor-handspun.jpg" alt="3 skeins of handspun yarn, 2 large and 1 small. the large ones are a rich earth-tone blend of reds, pinks, browns, and hints of green and gold. the smaller skein is similar but with a decidedly greener hue" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="petrichor-handspun">petrichor handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/petrichor-handspun.jpg" alt="3 skeins of handspun yarn, 2 large and 1 small. the large ones are a rich earth-tone blend of reds, pinks, browns, and hints of green and gold. the smaller skein is similar but with a decidedly greener hue" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/light-grey-jacobs-handspun/">
-			
-			<img src="/img/light-grey-jacobs.jpg" alt="a skein of light grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="light-grey-jacobs-handspun">light grey jacobs handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/light-grey-jacobs.jpg" alt="a skein of light grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/icelandic-lamb-handspun/">
-			
-			<img src="/img/icelandic-lamb.jpg" alt="a skein of black handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="icelandic-lamb-handspun">icelandic lamb handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/icelandic-lamb.jpg" alt="a skein of black handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/handcombed-jacobs-handspun/">
-			
-			<img src="/img/handcombed-jacobs.jpg" alt="a skein of dark grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="handcombed-jacobs-handspun">handcombed jacobs handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/handcombed-jacobs.jpg" alt="a skein of dark grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/happy-solstice-2025/">
-			
-			<img src="/img/solstice-2025.jpg" alt="front and back of our solstice card from this year, designed in postcard format. long alt incoming... front - 4 picture collage. 1 - i&#39;m standing in the woods, looking to one side, wearing an elaborate knit scarf. 2 - silhouetted thistle-like flowers in front of a pink-purple sky. 3 - my wife brooke crouches down to draw a heart in charcoal on a beach log, with &#39;L + B&#39; written inside. 4 - brooke stands on a driftwood-covered beach looking hella cool in mirrored shades. our dog kes stands in front of her and looks off to one side eagerly. overlaid is the words &#39;happy solstice&#39; in cursive. back - split down the center like the back of a postcard. on the left side, a 5 picture collage. 1 - i stand on a rock at the edge of a calm alpine lake. overlaid is the words &#39;lee, brooke, kestrel, &amp; the flock&#39; in print lettering. 2 - an early spring fern curl. 3 - our six ducks, all facing to the left, not in a row but still very organized. 4 - brooke grins at the camera while hugging kestrel&#39;s head. kestrel looks maybe a bit distraught. 5 - silhouette of a heron in flight across an early morning blue sky. on the address side, i&#39;ve added a dahlia to represent the stamp, and written &#39;you!&#39; in the field that would normally hold the mailing address." loading="lazy" decoding="async" width="1000" height="1346">
-			
 			<h2 data-ha-exclude="" id="happy-solstice-2025">happy solstice 2025 </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/solstice-2025.jpg" alt="front and back of our solstice card from this year, designed in postcard format. long alt incoming... front - 4 picture collage. 1 - i&#39;m standing in the woods, looking to one side, wearing an elaborate knit scarf. 2 - silhouetted thistle-like flowers in front of a pink-purple sky. 3 - my wife brooke crouches down to draw a heart in charcoal on a beach log, with &#39;L + B&#39; written inside. 4 - brooke stands on a driftwood-covered beach looking hella cool in mirrored shades. our dog kes stands in front of her and looks off to one side eagerly. overlaid is the words &#39;happy solstice&#39; in cursive. back - split down the center like the back of a postcard. on the left side, a 5 picture collage. 1 - i stand on a rock at the edge of a calm alpine lake. overlaid is the words &#39;lee, brooke, kestrel, &amp; the flock&#39; in print lettering. 2 - an early spring fern curl. 3 - our six ducks, all facing to the left, not in a row but still very organized. 4 - brooke grins at the camera while hugging kestrel&#39;s head. kestrel looks maybe a bit distraught. 5 - silhouette of a heron in flight across an early morning blue sky. on the address side, i&#39;ve added a dahlia to represent the stamp, and written &#39;you!&#39; in the field that would normally hold the mailing address." loading="lazy" decoding="async" width="1000" height="1346">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/stationery-exchange/">
-			
-			<img src="/img/clustered-brown-mushrooms.jpg" alt="Picture unrelated to post. A tight close-up on a cluster of tannish brown mushrooms." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="stationery-exchange">stationery exchange </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>stationery</li>
 				
 			</ul>
+			<img src="/img/clustered-brown-mushrooms.jpg" alt="Picture unrelated to post. A tight close-up on a cluster of tannish brown mushrooms." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/siblinghood-of-the-traveling-greeting-card/">
-			
-			<img src="/img/rockery.jpg" alt="Image unrelated to post. A surprisingly neat pile of rounded beach rocks, mainly speckly grey-white-bluish ones, with trees in the background." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="siblinghood-of-the-traveling-greeting-card">siblinghood of the traveling greeting card </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>stationery</li>
 				
 			</ul>
+			<img src="/img/rockery.jpg" alt="Image unrelated to post. A surprisingly neat pile of rounded beach rocks, mainly speckly grey-white-bluish ones, with trees in the background." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/brookes-scarf/">
-			
-			<img src="/img/brooke-scarf.jpg" alt="A diaphanous knit lacework scarf draped over the back of a chair. It is split down the long way into two colors - one tinted orange and one tinted mint blue. Both colors, the orange and the blue, are held double with the same variegated gray, making the piece more cohesive. The yarn overs in the lacework create airy repeating holes." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="brookes-scarf">brooke&#39;s scarf </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/brooke-scarf.jpg" alt="A diaphanous knit lacework scarf draped over the back of a chair. It is split down the long way into two colors - one tinted orange and one tinted mint blue. Both colors, the orange and the blue, are held double with the same variegated gray, making the piece more cohesive. The yarn overs in the lacework create airy repeating holes." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
@@ -1208,6 +1214,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/1/` was built on 2026-04-06T17:26:32.405Z -->
+    <!-- This page `/1/` was built on 2026-05-04T22:39:26.060Z -->
   </body>
 </html>

_site/10/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,10 +981,8 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/happy-bihrtday/">
-			
-			<img src="/img/happy-bihrtday-card-print.jpg" alt="A card and print in the same design - a bouncy, cheery font reading &#39;happy biHRTday&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="happy-bihrtday">happy biHRTday </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -988,15 +992,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/happy-bihrtday-card-print.jpg" alt="A card and print in the same design - a bouncy, cheery font reading &#39;happy biHRTday&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/foxgloves/">
-			
-			<img src="/img/foxgloves-print.jpg" alt="A print of a cluster of foxgloves. The background is inked in green, with negative space and pink details making up the foxgloves." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="foxgloves">foxgloves </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1006,15 +1010,15 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/foxgloves-print.jpg" alt="A print of a cluster of foxgloves. The background is inked in green, with negative space and pink details making up the foxgloves." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/artisans-cooperative-cards/">
-			
-			<img src="/img/artisans-coop-cards.jpg" alt="2 white greeting cards with the Artisans Cooperative logo, a chicken. One card has a single print of the chicken in black ink, and the other has two overlapping prints in blue and red ink" loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="artisans-cooperative-cards">artisans cooperative cards </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1022,43 +1026,43 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/artisans-coop-cards.jpg" alt="2 white greeting cards with the Artisans Cooperative logo, a chicken. One card has a single print of the chicken in black ink, and the other has two overlapping prints in blue and red ink" loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/stickers/">
-			
-			<img src="/img/trans-rights-stickers.jpg" alt="Clear and holographic stickers in the same design - a smiling skull with speech bubble reading &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="stickers">stickers! </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>sticker</li>
 				
 			</ul>
+			<img src="/img/trans-rights-stickers.jpg" alt="Clear and holographic stickers in the same design - a smiling skull with speech bubble reading &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/shirts/">
-			
-			<img src="/img/shirts.jpg" alt="A row of shirts hanging in front of a window, with a variety of hand-printed designs." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="shirts">shirts! </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/shirts.jpg" alt="A row of shirts hanging in front of a window, with a variety of hand-printed designs." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/nonbinary-flag/">
-			
-			<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1068,15 +1072,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/gender-in-data-models/">
-			
-			<img src="/img/peony.jpg" alt="Image unrelated to post. A light pink peony in full bloom, close up." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="gender-in-data-models">gender in data models </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>gender</li>
@@ -1086,15 +1090,15 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/peony.jpg" alt="Image unrelated to post. A light pink peony in full bloom, close up." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/five-of-them/">
-			
-			<img src="/img/five-of-them-print.jpg" alt="A block print of five mule deer grazing in a dark green field. The deer are partially negative space and partially brown ink detailing." loading="lazy" decoding="async" width="1000" height="594">
-			
 			<h2 data-ha-exclude="" id="five-of-them">five of them </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1102,15 +1106,15 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/five-of-them-print.jpg" alt="A block print of five mule deer grazing in a dark green field. The deer are partially negative space and partially brown ink detailing." loading="lazy" decoding="async" width="1000" height="594">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/swallowtail-on-snowdrops/">
-			
-			<img src="/img/swallowtail-on-snowdrops-print.jpg" alt="A block print of a tiger swallowtail butterfly dangling from Japanese snowdrops, a white drooping flower." loading="lazy" decoding="async" width="1000" height="1332">
-			
 			<h2 data-ha-exclude="" id="swallowtail-on-snowdrops">swallowtail on snowdrops </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1120,29 +1124,29 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/swallowtail-on-snowdrops-print.jpg" alt="A block print of a tiger swallowtail butterfly dangling from Japanese snowdrops, a white drooping flower." loading="lazy" decoding="async" width="1000" height="1332">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/leather-strap-journal/">
-			
-			<img src="/img/leather-strap-journal.jpg" alt="A 3-part collage showing a blue journal with leather straps woven into the covers." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="leather-strap-journal">leather strap journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/leather-strap-journal.jpg" alt="A 3-part collage showing a blue journal with leather straps woven into the covers." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/hummingbird-become-ungovernable/">
-			
-			<img src="/img/hummingbird-ungovernable-print.jpg" alt="A block print in black and orange ink of a rufous hummingbird, tail flared, hovering in midair. Clutched in eir tiny claws is a banner that waves in the wind and reads &#39;become ungovernable&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="hummingbird-become-ungovernable">hummingbird become ungovernable </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1152,32 +1156,34 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/hummingbird-ungovernable-print.jpg" alt="A block print in black and orange ink of a rufous hummingbird, tail flared, hovering in midair. Clutched in eir tiny claws is a banner that waves in the wind and reads &#39;become ungovernable&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/printing-press-notes/">
-			
-			<img src="/img/printing-press.jpg" alt="An open Speedball Model B printing press, which uses a lever handle to put even pressure on a 6 by 8 inch top plate." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="printing-press-notes">printing press notes </h2>
+			
 			<ul class="postlist-tags">
 				
 			</ul>
+			<img src="/img/printing-press.jpg" alt="An open Speedball Model B printing press, which uses a lever handle to put even pressure on a 6 by 8 inch top plate." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/stampede-journal/">
-			
-			<img src="/img/stampede-journal.jpg" alt="A 4-part collage of a hardcover book, showing a coloring page with &#39;stampede!&#39; written across it." loading="lazy" decoding="async" width="1000" height="1777">
-			
 			<h2 data-ha-exclude="" id="stampede-journal">stampede journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/stampede-journal.jpg" alt="A 4-part collage of a hardcover book, showing a coloring page with &#39;stampede!&#39; written across it." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
@@ -1234,6 +1240,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/10/` was built on 2026-04-06T17:26:35.087Z -->
+    <!-- This page `/10/` was built on 2026-05-04T22:39:31.572Z -->
   </body>
 </html>

_site/11/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,38 +981,36 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/orange-green-journal/">
-			
-			<img src="/img/orange-green-journal.jpg" alt="A 4-part collage of a slim handbound book." loading="lazy" decoding="async" width="1000" height="1777">
-			
 			<h2 data-ha-exclude="" id="orange-green-journal">orange green journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/orange-green-journal.jpg" alt="A 4-part collage of a slim handbound book." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/baseball-journal/">
-			
-			<img src="/img/baseball-journal.jpg" alt="A 3-part collage of a leather-covered book with baseball-style stitching across the spine." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="baseball-journal">baseball journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/baseball-journal.jpg" alt="A 3-part collage of a leather-covered book with baseball-style stitching across the spine." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/trans-wrongs-skull/">
-			
-			<img src="/img/trans-wrongs-print.jpg" alt="A smiling skull with devil horns and a little spiked tail, and a speech bubble reading &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="trans-wrongs-skull">trans wrongs skull </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1020,15 +1024,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-wrongs-print.jpg" alt="A smiling skull with devil horns and a little spiked tail, and a speech bubble reading &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/geese-trans-wrongs/">
-			
-			<img src="/img/trans-wrongs-geese-print.jpg" alt="Two Canada geese and their reflections in the water. One is calmly swimming away, while the over leans over towards them and HONKS! Both have speech bubbles; the calm goose says &#39;trans rights!&#39; while the honking goose says &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="geese-trans-wrongs">geese/trans wrongs </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1038,15 +1042,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-wrongs-geese-print.jpg" alt="Two Canada geese and their reflections in the water. One is calmly swimming away, while the over leans over towards them and HONKS! Both have speech bubbles; the calm goose says &#39;trans rights!&#39; while the honking goose says &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/spotted-towhee/">
-			
-			<img src="/img/spotted-towhee-print.jpg" alt="A block print of a spotted towhee mid-leap." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="spotted-towhee">spotted towhee </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1054,29 +1058,29 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/spotted-towhee-print.jpg" alt="A block print of a spotted towhee mid-leap." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/knit-shrimp/">
-			
-			<img src="/img/knit-shrimp.jpg" alt="Four knitted shrimp in various shades of pink. They are all somewhere around hand-sized, and have little yarn antennae and leggies." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="knit-shrimp">knit shrimp </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/knit-shrimp.jpg" alt="Four knitted shrimp in various shades of pink. They are all somewhere around hand-sized, and have little yarn antennae and leggies." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/geese/">
-			
-			<img src="/img/geese-print.jpg" alt="Two Canada geese and their reflections in the water. One is calmly swimming away, while the over leans over and HONKS!" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="geese">geese </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1086,15 +1090,15 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/geese-print.jpg" alt="Two Canada geese and their reflections in the water. One is calmly swimming away, while the over leans over and HONKS!" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/fat-raccoon/">
-			
-			<img src="/img/fat-raccoon-print.jpg" alt="A block print in black ink of a rotund raccoon raising a welcoming paw towards the viewer." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="fat-raccoon">fat raccoon </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1104,15 +1108,15 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/fat-raccoon-print.jpg" alt="A block print in black ink of a rotund raccoon raising a welcoming paw towards the viewer." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/big-pidge/">
-			
-			<img src="/img/big-pidge-print.jpg" alt="A block print of a superb speciman of pigeon, inked mostly in black but with patches of green, blue, and purple to indicate iridescence." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="big-pidge">big pidge </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1122,27 +1126,27 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/big-pidge-print.jpg" alt="A block print of a superb speciman of pigeon, inked mostly in black but with patches of green, blue, and purple to indicate iridescence." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/shirt-making-notes/">
-			
-			<img src="/img/shirt-wip.jpg" alt="A shirt laid out on my desk after being printed with my jay and flicker prints. There are ink pads and other tools scattered around." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="shirt-making-notes">shirt making notes </h2>
+			
 			<ul class="postlist-tags">
 				
 			</ul>
+			<img src="/img/shirt-wip.jpg" alt="A shirt laid out on my desk after being printed with my jay and flicker prints. There are ink pads and other tools scattered around." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/trans-rights-skull/">
-			
-			<img src="/img/trans-rights-print.jpg" alt="A print in mostly black ink of a smiling skull with a speech bubble. In pink and blue, the speech bubble reads &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="trans-rights-skull">trans rights skull </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1156,15 +1160,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-rights-print.jpg" alt="A print in mostly black ink of a smiling skull with a speech bubble. In pink and blue, the speech bubble reads &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/stellars-jay/">
-			
-			<img src="/img/stellars-jay-print.jpg" alt="A print of a stellar&#39;s jay, a beautiful black and blue bird, about to take off from a branch" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="stellars-jay">stellar&#39;s jay </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1174,20 +1178,22 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/stellars-jay-print.jpg" alt="A print of a stellar&#39;s jay, a beautiful black and blue bird, about to take off from a branch" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/backend-accessibility/">
-			
-			<img src="/img/camelCase-print.jpg" alt="A carved stamp next to its print. The print reads &#39;#camelCase&#39; in a slightly formal-looking italic font." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="backend-accessibility">backend accessibility </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/camelCase-print.jpg" alt="A carved stamp next to its print. The print reads &#39;#camelCase&#39; in a slightly formal-looking italic font." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1244,6 +1250,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/11/` was built on 2026-04-06T17:26:35.333Z -->
+    <!-- This page `/11/` was built on 2026-05-04T22:39:32.362Z -->
   </body>
 </html>

_site/12/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,22 +981,22 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/block-printing-transfer-method/">
-			
-			<img src="/img/transfer-wip.jpg" alt="A pink block of carving material with a printed design of a bird attached to it. The paper has been partially rubbed away (process described in this post) to reveal the inked design on the carving material." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="block-printing-transfer-method">block printing transfer method </h2>
+			
 			<ul class="postlist-tags">
 				
+				<li>print</li>
+				
 			</ul>
+			<img src="/img/transfer-wip.jpg" alt="A pink block of carving material with a printed design of a bird attached to it. The paper has been partially rubbed away (process described in this post) to reveal the inked design on the carving material." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/hair/">
-			
-			<img src="/img/hair-print.jpg" alt="A print in black ink of belly hair." loading="lazy" decoding="async" width="1000" height="710">
-			
 			<h2 data-ha-exclude="" id="hair">hair </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -998,15 +1004,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/hair-print.jpg" alt="A print in black ink of belly hair." loading="lazy" decoding="async" width="1000" height="710">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/flicker/">
-			
-			<img src="/img/flicker-print.jpg" alt="A print in black, brown, and red ink of a northern flicker (a type of woodpecker). Viewed from the back, he is looking over his shoulder and upward towards something unseen above him (my bird feeder)." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="flicker">flicker </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1016,15 +1022,15 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/flicker-print.jpg" alt="A print in black, brown, and red ink of a northern flicker (a type of woodpecker). Viewed from the back, he is looking over his shoulder and upward towards something unseen above him (my bird feeder)." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/heron/">
-			
-			<img src="/img/heron-print.jpg" alt="A print in black ink of a great blue heron, leaning downwards so that eir beak is level with eir feet." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="heron">heron </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1034,15 +1040,15 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/heron-print.jpg" alt="A print in black ink of a great blue heron, leaning downwards so that eir beak is level with eir feet." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/seedling/">
-			
-			<img src="/img/seedling-print.jpg" alt="A print of a 3-stage design of a green seedling barely open, starting to straighten up, and growing strong, with little piles of dirt beneath each one." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="seedling">seedling </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1050,15 +1056,15 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/seedling-print.jpg" alt="A print of a 3-stage design of a green seedling barely open, starting to straighten up, and growing strong, with little piles of dirt beneath each one." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/lupine/">
-			
-			<img src="/img/lupine-prints.jpg" alt="6 versions of a print of lupine flowers with the leaves inked in light green and the blossoms inked in a variety of blues, purples, and pinks." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="lupine">lupine </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1068,29 +1074,29 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/lupine-prints.jpg" alt="6 versions of a print of lupine flowers with the leaves inked in light green and the blossoms inked in a variety of blues, purples, and pinks." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/leather-keychains/">
-			
-			<img src="/img/leather-keychains.jpg" alt="A picture of multiple leather keychains sitting on a wood table. Many of them are simple rectangle shapes with stitching around the edge; a few are odd wavy or geometric shapes. A few say things like &#39;MOM&#39; or &#39;EGG&#39;." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="leather-keychains">leather keychains </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leather-keychains.jpg" alt="A picture of multiple leather keychains sitting on a wood table. Many of them are simple rectangle shapes with stitching around the edge; a few are odd wavy or geometric shapes. A few say things like &#39;MOM&#39; or &#39;EGG&#39;." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/killdeer/">
-			
-			<img src="/img/killdeer-print.jpg" alt="A print of a killdeer in black ink." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="killdeer">killdeer </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1098,15 +1104,15 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/killdeer-print.jpg" alt="A print of a killdeer in black ink." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/junco/">
-			
-			<img src="/img/junco-print.jpg" alt="A print of a junco mid-takeoff from a branch. Eir head is inked in black, body in gray, and the branch in sepia." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="junco">junco </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1114,29 +1120,29 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/junco-print.jpg" alt="A print of a junco mid-takeoff from a branch. Eir head is inked in black, body in gray, and the branch in sepia." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/handspun-yarn-in-party-mix-and-orange-gold/">
-			
-			<img src="/img/handspun0.jpg" alt="4 skeins of handspun yarn, two in a somewhat pastel multicolor and two in a blend of orange, gold, and white." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="handspun-yarn-in-party-mix-and-orange-gold">handspun yarn in party mix and orange-gold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/handspun0.jpg" alt="4 skeins of handspun yarn, two in a somewhat pastel multicolor and two in a blend of orange, gold, and white." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/flatfish/">
-			
-			<img src="/img/flatfish-print.jpg" alt="A print of a simple flatfish design inked in sepia." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="flatfish">flatfish </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1144,15 +1150,15 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/flatfish-print.jpg" alt="A print of a simple flatfish design inked in sepia." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/chanterelle/">
-			
-			<img src="/img/chanterelle-print.jpg" alt="A print of two chanterelle mushrooms inked in a dark-to-light yellow gradient." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="chanterelle">chanterelle </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1160,15 +1166,15 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/chanterelle-print.jpg" alt="A print of two chanterelle mushrooms inked in a dark-to-light yellow gradient." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/butch-hands-pattern/">
-			
-			<img src="/img/butch-hands.jpg" alt="Hands wearing a pair of pink and grey gloves with convertable mitten tops." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="butch-hands-pattern">butch hands pattern </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
@@ -1176,6 +1182,8 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/butch-hands.jpg" alt="Hands wearing a pair of pink and grey gloves with convertable mitten tops." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1232,6 +1240,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/12/` was built on 2026-04-06T17:26:35.593Z -->
+    <!-- This page `/12/` was built on 2026-05-04T22:39:32.810Z -->
   </body>
 </html>

_site/13/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,10 +981,8 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/iris/">
-			
-			<img src="/img/iris-prints.jpg" alt="3 copies of the same print of iris flowers and a bud, done in slightly varied color schemes." loading="lazy" decoding="async" width="1000" height="562">
-			
 			<h2 data-ha-exclude="" id="iris">iris </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -986,15 +990,15 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/iris-prints.jpg" alt="3 copies of the same print of iris flowers and a bud, done in slightly varied color schemes." loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/congrats-on-the-gay/">
-			
-			<img src="/img/congrats-on-the-gay.jpg" alt="A greeting card reading, in black. &#39;Congrats on the,&#39; and then, in rainbow, &#39;Gay!&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="congrats-on-the-gay">congrats on the gay </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1004,43 +1008,43 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/congrats-on-the-gay.jpg" alt="A greeting card reading, in black. &#39;Congrats on the,&#39; and then, in rainbow, &#39;Gay!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/lined-notebook/">
-			
-			<img src="/img/lined-notebook.jpg" alt="A three panel collage showing a the endpapers, cover, and pages of a small hardbound notebook." loading="lazy" decoding="async" width="1000" height="1776">
-			
 			<h2 data-ha-exclude="" id="lined-notebook">lined notebook </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/lined-notebook.jpg" alt="A three panel collage showing a the endpapers, cover, and pages of a small hardbound notebook." loading="lazy" decoding="async" width="1000" height="1776">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/flocked-notebook/">
-			
-			<img src="/img/flocked-notebook.jpg" alt="A two panel collage showing the cover and endpapers of a thick notebook." loading="lazy" decoding="async" width="1000" height="1331">
-			
 			<h2 data-ha-exclude="" id="flocked-notebook">flocked notebook </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/flocked-notebook.jpg" alt="A two panel collage showing the cover and endpapers of a thick notebook." loading="lazy" decoding="async" width="1000" height="1331">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/brookes-notebook/">
-			
-			<img src="/img/brooke-notebook.jpg" alt="A six panel collage showing the covers, endpapers, and some of the pages of a notebook." loading="lazy" decoding="async" width="1000" height="1500">
-			
 			<h2 data-ha-exclude="" id="brookes-notebook">brooke&#39;s notebook </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
@@ -1048,71 +1052,71 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/brooke-notebook.jpg" alt="A six panel collage showing the covers, endpapers, and some of the pages of a notebook." loading="lazy" decoding="async" width="1000" height="1500">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/recommendations-and-favorites/">
-			
-			<img src="/img/metal-curl.jpg" alt="Photo unrelated to content of post. A metal sculpture rises up and curls into itself, with similar sculptures around it. Looking through the very center of the curve, an any-gender bathroom sign is visible." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="recommendations-and-favorites">recommendations &amp; favorites </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/metal-curl.jpg" alt="Photo unrelated to content of post. A metal sculpture rises up and curls into itself, with similar sculptures around it. Looking through the very center of the curve, an any-gender bathroom sign is visible." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/pink-socks/">
-			
-			<img src="/img/pink-socks.jpg" alt="Feet propped up on a car dashboard, with a desert landscape beyond. The feet are in salmon-colored socks with black flecks, and decorative lines running down the socks." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="pink-socks">pink socks </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/pink-socks.jpg" alt="Feet propped up on a car dashboard, with a desert landscape beyond. The feet are in salmon-colored socks with black flecks, and decorative lines running down the socks." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/brookes-socks/">
-			
-			<img src="/img/brooke-socks.jpg" alt="Feet in a pair of colorful socks. They are identically striped and quickly vary between yellow, green, blue, white, and gray." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="brookes-socks">brooke&#39;s socks </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/brooke-socks.jpg" alt="Feet in a pair of colorful socks. They are identically striped and quickly vary between yellow, green, blue, white, and gray." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/gender/">
-			
-			<img src="/img/gender-notes.png" alt="A page of handwritten notes with some loosely drawn charts, described further in the post." loading="lazy" decoding="async" width="865" height="1080">
-			
 			<h2 data-ha-exclude="" id="gender">gender? </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/gender-notes.png" alt="A page of handwritten notes with some loosely drawn charts, described further in the post." loading="lazy" decoding="async" width="865" height="1080">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/pride-dice-bags/">
-			
-			<img src="/img/pride-dice-bags.jpg" alt="Several knitted drawstring dice bags sit in front of a bookshelf. They are in different pride flag colors; from right to left (skipping a few duplicates) bisexual, lesbian, nonbinary, trans, and genderqueer. The trans-colored dice bag in the center opens towards the camera, showing a variety of colorful dice inside." loading="lazy" decoding="async" width="1000" height="500">
-			
 			<h2 data-ha-exclude="" id="pride-dice-bags">pride dice bags </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
@@ -1120,48 +1124,50 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/pride-dice-bags.jpg" alt="Several knitted drawstring dice bags sit in front of a bookshelf. They are in different pride flag colors; from right to left (skipping a few duplicates) bisexual, lesbian, nonbinary, trans, and genderqueer. The trans-colored dice bag in the center opens towards the camera, showing a variety of colorful dice inside." loading="lazy" decoding="async" width="1000" height="500">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/square-watercolor-pad/">
-			
-			<img src="/img/square-watercolor-pad.jpg" alt="A two panel collage showing a square book with a tan cover and blue and gold endpapers." loading="lazy" decoding="async" width="1000" height="1331">
-			
 			<h2 data-ha-exclude="" id="square-watercolor-pad">square watercolor pad </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/square-watercolor-pad.jpg" alt="A two panel collage showing a square book with a tan cover and blue and gold endpapers." loading="lazy" decoding="async" width="1000" height="1331">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/tiny-books/">
-			
-			<img src="/img/tiny-book.jpg" alt="A three panel collage showing a book held in the palm of a hand." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="tiny-books">tiny books </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/tiny-book.jpg" alt="A three panel collage showing a book held in the palm of a hand." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/orange-journal/">
-			
-			<img src="/img/orange-journal.jpg" alt="A three panel collage showcasing a small book with foldout pages and a bright orange cover." loading="lazy" decoding="async" width="1000" height="1776">
-			
 			<h2 data-ha-exclude="" id="orange-journal">orange journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/orange-journal.jpg" alt="A three panel collage showcasing a small book with foldout pages and a bright orange cover." loading="lazy" decoding="async" width="1000" height="1776">
+			
 		</a>
 	</li>
 	
@@ -1218,6 +1224,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/13/` was built on 2026-04-06T17:26:35.814Z -->
+    <!-- This page `/13/` was built on 2026-05-04T22:39:33.247Z -->
   </body>
 </html>

_site/14/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,66 +981,64 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/striped-journal/">
-			
-			<img src="/img/striped-journal.jpg" alt="A three panel collage showcasing a journal with a striped cover." loading="lazy" decoding="async" width="1000" height="1776">
-			
 			<h2 data-ha-exclude="" id="striped-journal">striped journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/striped-journal.jpg" alt="A three panel collage showcasing a journal with a striped cover." loading="lazy" decoding="async" width="1000" height="1776">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/green-memo-pad/">
-			
-			<img src="/img/green-memo-pad.jpg" alt="A three panel collage showcasing a small green memo pad." loading="lazy" decoding="async" width="1000" height="1776">
-			
 			<h2 data-ha-exclude="" id="green-memo-pad">green memo pad </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/green-memo-pad.jpg" alt="A three panel collage showcasing a small green memo pad." loading="lazy" decoding="async" width="1000" height="1776">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/blue-and-brown-leather-journal/">
-			
-			<img src="/img/blue-brown-leather-journal.jpg" alt="A three panel collage showcasing a blue and brown leather-covered journal." loading="lazy" decoding="async" width="1000" height="1776">
-			
 			<h2 data-ha-exclude="" id="blue-and-brown-leather-journal">blue and brown leather journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/blue-brown-leather-journal.jpg" alt="A three panel collage showcasing a blue and brown leather-covered journal." loading="lazy" decoding="async" width="1000" height="1776">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/acadia-coloring-journal/">
-			
-			<img src="/img/acadia-coloring-journal.jpg" alt="A five panel collage showcasing a book that is part graph papers of various sizes, and part coloring pages based on Acadia National Park." loading="lazy" decoding="async" width="1000" height="562">
-			
 			<h2 data-ha-exclude="" id="acadia-coloring-journal">Acadia coloring journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/acadia-coloring-journal.jpg" alt="A five panel collage showcasing a book that is part graph papers of various sizes, and part coloring pages based on Acadia National Park." loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/pronoun-patches/">
-			
-			<img src="/img/pronoun-patch.jpg" alt="Rows of the same design, a skull with a speech bubble announcing varied pronoun sets, repeat in multiple colors along a stretch of off-white fabric." loading="lazy" decoding="async" width="1000" height="562">
-			
 			<h2 data-ha-exclude="" id="pronoun-patches">pronoun patches </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1044,15 +1048,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/pronoun-patch.jpg" alt="Rows of the same design, a skull with a speech bubble announcing varied pronoun sets, repeat in multiple colors along a stretch of off-white fabric." loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/congrats-on-the-autism-adhd/">
-			
-			<img src="/img/congrats-on-the.jpg" alt="4 greeting cards propped up on a keyboard. On the right hand side, two cards read &#39;Congrats on the Autism&#39;; one in rainbow ink and one in black ink with a glittery gold shadow. On the left, two cards read &#39;Congrats on the ADHD&#39;; one in red and one in black, both with glittery pink shadows." loading="lazy" decoding="async" width="1000" height="562">
-			
 			<h2 data-ha-exclude="" id="congrats-on-the-autism-adhd">congrats on the autism/adhd </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1060,34 +1064,36 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/congrats-on-the.jpg" alt="4 greeting cards propped up on a keyboard. On the right hand side, two cards read &#39;Congrats on the Autism&#39;; one in rainbow ink and one in black ink with a glittery gold shadow. On the left, two cards read &#39;Congrats on the ADHD&#39;; one in red and one in black, both with glittery pink shadows." loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/become-unbutterable/">
-			
-			<img src="/img/become-unbutterable.jpg" alt="3 copies of the same stamp in orange ink are spread out next to the hand carved rubber stamp they were made from. They show a cat lying on his back with paws curled, holding a butter knife in his mouth. Text around the cat reads, in all caps, &#39;become unbutterable.&#39;" loading="lazy" decoding="async" width="1000" height="562">
-			
 			<h2 data-ha-exclude="" id="become-unbutterable">become unbutterable </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/become-unbutterable.jpg" alt="3 copies of the same stamp in orange ink are spread out next to the hand carved rubber stamp they were made from. They show a cat lying on his back with paws curled, holding a butter knife in his mouth. Text around the cat reads, in all caps, &#39;become unbutterable.&#39;" loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/queer-book-list/">
-			
-			<img src="/img/rainbow-books.jpg" alt="A bookshelf with a variety of books on LGBTQ+ themes, arranged roughly in rainbow order" loading="lazy" decoding="async" width="1000" height="562">
-			
 			<h2 data-ha-exclude="" id="queer-book-list">queer book list </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/rainbow-books.jpg" alt="A bookshelf with a variety of books on LGBTQ+ themes, arranged roughly in rainbow order" loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
@@ -1138,6 +1144,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/14/` was built on 2026-04-06T17:26:35.904Z -->
+    <!-- This page `/14/` was built on 2026-05-04T22:39:33.631Z -->
   </body>
 </html>

_site/2/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,24 +981,22 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/my-favorite-git-flag/">
-			
-			<img src="/img/shelf-mushrooms.jpg" alt="Picture unrelated to post. Creamy beige shelf mushrooms on a mossy tree trunk." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="my-favorite-git-flag">my favorite git flag </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/shelf-mushrooms.jpg" alt="Picture unrelated to post. Creamy beige shelf mushrooms on a mossy tree trunk." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/dragon-mask/">
-			
-			<img src="/img/dragon-mask.jpg" alt="lee (a white person with glasses and a side shave) holds up a leather dragon mask in black and dark green. ze sticks hir tongue out at it." loading="lazy" decoding="async" width="1000" height="746">
-			
 			<h2 data-ha-exclude="" id="dragon-mask">dragon mask </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
@@ -1000,29 +1004,29 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/dragon-mask.jpg" alt="lee (a white person with glasses and a side shave) holds up a leather dragon mask in black and dark green. ze sticks hir tongue out at it." loading="lazy" decoding="async" width="1000" height="746">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/intro-to-wireframing/">
-			
-			<img src="/img/aggregator-wireframes.jpg" alt="a figma page with 4 major sections titled aggregator, aggregator mobile, aggregator color, and aggregator mobile color. each section has 7 pages in it - all sections pretty clearly have the same 7 pages, with the mobile sections shown on mobile screens and the color sections in a rainbow of pastels rather than grayscale." loading="lazy" decoding="async" width="1000" height="1042">
-			
 			<h2 data-ha-exclude="" id="intro-to-wireframing">intro to wireframing </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/aggregator-wireframes.jpg" alt="a figma page with 4 major sections titled aggregator, aggregator mobile, aggregator color, and aggregator mobile color. each section has 7 pages in it - all sections pretty clearly have the same 7 pages, with the mobile sections shown on mobile screens and the color sections in a rainbow of pastels rather than grayscale." loading="lazy" decoding="async" width="1000" height="1042">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/designing-a-bag/">
-			
-			<img src="/img/shoelace-bag.jpg" alt="a 3-image collage showcasing a leather crossbody bag. the leather body is brown and fairly simple. up the narrow sides, rope is laced through grommets in a style resembling a shoe lacing. the rope forms the handle and loops seamlessly through the other side of the bag, joining in one point in a figure-8 follow-through knot. At the bottom corners, there are small diagonal lines of stitching to give the bag a small lip around the base and ensure small objects don&#39;t slide out." loading="lazy" decoding="async" width="1000" height="1777">
-			
 			<h2 data-ha-exclude="" id="designing-a-bag">designing a bag </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
@@ -1030,57 +1034,57 @@ footer a:focus-visible {
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/shoelace-bag.jpg" alt="a 3-image collage showcasing a leather crossbody bag. the leather body is brown and fairly simple. up the narrow sides, rope is laced through grommets in a style resembling a shoe lacing. the rope forms the handle and loops seamlessly through the other side of the bag, joining in one point in a figure-8 follow-through knot. At the bottom corners, there are small diagonal lines of stitching to give the bag a small lip around the base and ensure small objects don&#39;t slide out." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/brookes-suspenders/">
-			
-			<img src="/img/brooke-suspenders.jpg" alt="a two image collage showing the front and back of a person, neck to waist. she&#39;s wearing leather suspenders with a button attachment, buckles for adjustment, and a stitched diamond where the straps cross in the back." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="brookes-suspenders">brooke&#39;s suspenders </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/brooke-suspenders.jpg" alt="a two image collage showing the front and back of a person, neck to waist. she&#39;s wearing leather suspenders with a button attachment, buckles for adjustment, and a stitched diamond where the straps cross in the back." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/wrap-bracelets/">
-			
-			<img src="/img/leather-wrap-bracelets.jpg" alt="two wrists, each wearing a black leather wrap bracelet. the upper bracelet is a thin strap wrapped 3 times around the wrist. the lower bracelet wraps twice, with a thicker strap, and has carefully placed spikes that avoid the wrap spots." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="wrap-bracelets">wrap bracelets </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leather-wrap-bracelets.jpg" alt="two wrists, each wearing a black leather wrap bracelet. the upper bracelet is a thin strap wrapped 3 times around the wrist. the lower bracelet wraps twice, with a thicker strap, and has carefully placed spikes that avoid the wrap spots." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/acadia-mitts/">
-			
-			<img src="/img/acadia-mitts.jpg" alt="a hand wearing a knitted fingerless mitten. it&#39;s knit in a slubby, almost tweedy yarn, with the body being blue grey stockinette and the cuffs and tips a vibrant green rib." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="acadia-mitts">acadia mitts </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/acadia-mitts.jpg" alt="a hand wearing a knitted fingerless mitten. it&#39;s knit in a slubby, almost tweedy yarn, with the body being blue grey stockinette and the cuffs and tips a vibrant green rib." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/on-the-shoulders-of-giants/">
-			
-			<img src="/img/on-the-shoulders.jpg" alt="ok so. five image collage showing the front, 3 inner spreads, and back of a riso-printed zine in green and light blue. it&#39;s called &#39;on the shoulders of giants&#39; and it&#39;s about a knitting technique I learned from Stephen west and how I built on that technique. it talks about joining two adjacent panels without seaming, instead knitting the second panel onto the selvedge of the first. then it uses that technique to approach two panels knit with significantly different weights of yarn" loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="on-the-shoulders-of-giants">on the shoulders of giants </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>zine</li>
@@ -1088,69 +1092,69 @@ footer a:focus-visible {
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/on-the-shoulders.jpg" alt="ok so. five image collage showing the front, 3 inner spreads, and back of a riso-printed zine in green and light blue. it&#39;s called &#39;on the shoulders of giants&#39; and it&#39;s about a knitting technique I learned from Stephen west and how I built on that technique. it talks about joining two adjacent panels without seaming, instead knitting the second panel onto the selvedge of the first. then it uses that technique to approach two panels knit with significantly different weights of yarn" loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/sideways-canvas-shirt/">
-			
-			<img src="/img/sideways-canvas.jpg" alt="someone&#39;s torso in a knitted short sleeve shirt. the front is teal, and the bit of back we can see is mustard yellow. looking closely, it&#39;s notable that the stitches are turned 90 degrees from a standard knit garment." loading="lazy" decoding="async" width="1000" height="1338">
-			
 			<h2 data-ha-exclude="" id="sideways-canvas-shirt">sideways canvas shirt </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/sideways-canvas.jpg" alt="someone&#39;s torso in a knitted short sleeve shirt. the front is teal, and the bit of back we can see is mustard yellow. looking closely, it&#39;s notable that the stitches are turned 90 degrees from a standard knit garment." loading="lazy" decoding="async" width="1000" height="1338">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/scrap-patches/">
-			
-			<img src="/img/scrap-patches.jpg" alt="a collage of 4 images, each showing a fabric patch created by collaging 5 or 6 scraps of fabric and joining them with a simple running stitch in white thread. patches of running stitch go back and forth both horizontally and vertically." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="scrap-patches">scrap patches </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>patch</li>
 				
 			</ul>
+			<img src="/img/scrap-patches.jpg" alt="a collage of 4 images, each showing a fabric patch created by collaging 5 or 6 scraps of fabric and joining them with a simple running stitch in white thread. patches of running stitch go back and forth both horizontally and vertically." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/keffiyah-fishing-net-pattern/">
-			
-			<img src="/img/keffiyah-nets.jpg" alt="a knitted swatch. it&#39;s mostly white yarn, but a grid of dark red- purple- green yarn that looks like a chain link fence is built into it. the diagonal lines are achieved with floats of yarn from one row, then picked up and knit into several rows later." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="keffiyah-fishing-net-pattern">keffiyah fishing net pattern </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/keffiyah-nets.jpg" alt="a knitted swatch. it&#39;s mostly white yarn, but a grid of dark red- purple- green yarn that looks like a chain link fence is built into it. the diagonal lines are achieved with floats of yarn from one row, then picked up and knit into several rows later." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/art-shows-and-events/">
-			
-			<img src="/img/pink-yellow-flowers.jpg" alt="Image unrelated to post. A cluster of small, four-petaled flowers, varying in color between a purpley-pink and yellow." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="art-shows-and-events">art shows and events </h2>
+			
 			<ul class="postlist-tags">
 				
 			</ul>
+			<img src="/img/pink-yellow-flowers.jpg" alt="Image unrelated to post. A cluster of small, four-petaled flowers, varying in color between a purpley-pink and yellow." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/textures-unite/">
-			
-			<img src="/img/textures-unite.jpg" alt="a largely unseen person holds up an expansive knitted shawl, built in 6 sections of different textures and colors. in the background, trees and dappled sunlight." loading="lazy" decoding="async" width="1000" height="1334">
-			
 			<h2 data-ha-exclude="" id="textures-unite">textures unite </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
@@ -1158,6 +1162,8 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/textures-unite.jpg" alt="a largely unseen person holds up an expansive knitted shawl, built in 6 sections of different textures and colors. in the background, trees and dappled sunlight." loading="lazy" decoding="async" width="1000" height="1334">
+			
 		</a>
 	</li>
 	
@@ -1214,6 +1220,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/2/` was built on 2026-04-06T17:26:32.738Z -->
+    <!-- This page `/2/` was built on 2026-05-04T22:39:26.743Z -->
   </body>
 </html>

_site/3/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,24 +981,22 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/redirections/">
-			
-			<img src="/img/angle-brackets-uwu.jpg" alt="Ascii art of an emoticon with pinched eyes and a small mouth made with two angle brackets." loading="lazy" decoding="async" width="1000" height="316">
-			
 			<h2 data-ha-exclude="" id="redirections">redirections </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/angle-brackets-uwu.jpg" alt="Ascii art of an emoticon with pinched eyes and a small mouth made with two angle brackets." loading="lazy" decoding="async" width="1000" height="316">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/azure-locations-and-file-crawling/">
-			
-			<img src="/img/azure-locations.jpg" alt="A Linux terminal. There is a fun rainbow flag in ascii art at the top, and then the user has called a command asking Azure for a list of locations applicable to a specific resource type. The output is lengthy." loading="lazy" decoding="async" width="1000" height="827">
-			
 			<h2 data-ha-exclude="" id="azure-locations-and-file-crawling">azure locations and file crawling </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>software</li>
@@ -1000,71 +1004,71 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/azure-locations.jpg" alt="A Linux terminal. There is a fun rainbow flag in ascii art at the top, and then the user has called a command asking Azure for a list of locations applicable to a specific resource type. The output is lengthy." loading="lazy" decoding="async" width="1000" height="827">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/fix-your-hearts/">
-			
-			<img src="/img/fix-your-hearts-print.jpg" alt="2 copies of the same print, one in black ink and one in dark teal. The print is text that reads &#39;fix your hearts or die&#39;, with the text shaped into a somewhat long and narrow heart." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="fix-your-hearts">fix your hearts </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/fix-your-hearts-print.jpg" alt="2 copies of the same print, one in black ink and one in dark teal. The print is text that reads &#39;fix your hearts or die&#39;, with the text shaped into a somewhat long and narrow heart." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/networks-of-trans-care/">
-			
-			<img src="/img/mushrooms-and-moss.jpg" alt="Image unrelated to post. Close up on a cluster of orange-brown mushrooms on a mossy tree trunk." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="networks-of-trans-care">networks of trans care </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/mushrooms-and-moss.jpg" alt="Image unrelated to post. Close up on a cluster of orange-brown mushrooms on a mossy tree trunk." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/give-to-trans-orgs-and-people/">
-			
-			<img src="/img/bouquet.jpg" alt="Image unrelated to post. A close up on a flower bouquet in shades of purple, pink, and white. Centered is a large, almost soft-looking pink flower that is still partially closed up." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="give-to-trans-orgs-and-people">give to trans orgs and people </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/bouquet.jpg" alt="Image unrelated to post. A close up on a flower bouquet in shades of purple, pink, and white. Centered is a large, almost soft-looking pink flower that is still partially closed up." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/loon/">
-			
-			<img src="/img/loon-print.jpg" alt="A print of a loon rearing up with wings spread" loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="loon">loon </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/loon-print.jpg" alt="A print of a loon rearing up with wings spread" loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/kestrel-zine/">
-			
-			<img src="/img/kestrel-zine.jpg" alt="A 5 photo collage showing the front and back cover as well as 3 full spreads of a folded zine about Kestrel, my dog, who is a 65lb Malinois with a goofy smile and floppy ears. it is printed in two layers of color, blue and orange, and each image depicts Kestrel in various posts... alert and watchful, resting, looking mopey, wearing a sweatshirt." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="kestrel-zine">kestrel zine </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1074,27 +1078,27 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/kestrel-zine.jpg" alt="A 5 photo collage showing the front and back cover as well as 3 full spreads of a folded zine about Kestrel, my dog, who is a 65lb Malinois with a goofy smile and floppy ears. it is printed in two layers of color, blue and orange, and each image depicts Kestrel in various posts... alert and watchful, resting, looking mopey, wearing a sweatshirt." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/happy-solstice-2024/">
-			
-			<img src="/img/solstice-2024.png" alt="A digital card with front and back stitched together into one image. Front - a collage of photos - brooke with blue hair and kestrel wiggling in her lap; kestrel on his back with one back paw clutched in his mouth; lee sitting holding some custom art of kestrel, showing kestrel the pictures; lee looking intently through a long camera lens; brooke, back to the camera, swaggering across tidal flats in her hand-stitched jacket. over the photos, hand-lettering reads &#39;happy solstice!&#39; in two shades of pink. Back - two photos - the duckies clustered around the camera; and kestrel leaping gracefully through shallow water with his tongue out in a blep. Overlaid text reads &#39;~ Lee, Brooke, Kestrel, &amp; the Flock&#39;" loading="lazy" decoding="async" width="1000" height="1428">
-			
 			<h2 data-ha-exclude="" id="happy-solstice-2024">happy solstice 2024 </h2>
+			
 			<ul class="postlist-tags">
 				
 			</ul>
+			<img src="/img/solstice-2024.png" alt="A digital card with front and back stitched together into one image. Front - a collage of photos - brooke with blue hair and kestrel wiggling in her lap; kestrel on his back with one back paw clutched in his mouth; lee sitting holding some custom art of kestrel, showing kestrel the pictures; lee looking intently through a long camera lens; brooke, back to the camera, swaggering across tidal flats in her hand-stitched jacket. over the photos, hand-lettering reads &#39;happy solstice!&#39; in two shades of pink. Back - two photos - the duckies clustered around the camera; and kestrel leaping gracefully through shallow water with his tongue out in a blep. Overlaid text reads &#39;~ Lee, Brooke, Kestrel, &amp; the Flock&#39;" loading="lazy" decoding="async" width="1000" height="1428">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/greeting-loons/">
-			
-			<img src="/img/greeting-loons.jpg" alt="A pile of hand-printed A2 size greeting cards. A loon rearing up with outstretched wings spans the front and back of the cards." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="greeting-loons">greeting loons </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>card</li>
@@ -1104,43 +1108,43 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/greeting-loons.jpg" alt="A pile of hand-printed A2 size greeting cards. A loon rearing up with outstretched wings spans the front and back of the cards." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/fountain-pen-friendly-stationery/">
-			
-			<img src="/img/wax-seals.jpg" alt="Two envelopes with wax seals. The top envelope is cream with a copper-and-white swirled seal depicting a yelling possum holding mail. The bottom envelope is marbled blue, black, and gold, with a white-and-blue swirled seal depicting an octopus holding a fountain pen." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="fountain-pen-friendly-stationery">fountain pen-friendly stationery </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>stationery</li>
 				
 			</ul>
+			<img src="/img/wax-seals.jpg" alt="Two envelopes with wax seals. The top envelope is cream with a copper-and-white swirled seal depicting a yelling possum holding mail. The bottom envelope is marbled blue, black, and gold, with a white-and-blue swirled seal depicting an octopus holding a fountain pen." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/brown-creeper/">
-			
-			<img src="/img/brown-creeper-print.jpg" alt="2 copies of the same print side by side. In yellow, black, and purple ink, a brown creeper, a small bird, is depicted, well camouflaged against a tree trunk." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="brown-creeper">brown creeper </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/brown-creeper-print.jpg" alt="2 copies of the same print side by side. In yellow, black, and purple ink, a brown creeper, a small bird, is depicted, well camouflaged against a tree trunk." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/quorbs/">
-			
-			<img src="/img/quorbs-print.jpg" alt="A print in two layers of color showing two rotund quails on a branch. Most of the details are in black ink, then there is a layer with a brown gradient filling in some color on the head and breast." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="quorbs">quorbs </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1148,15 +1152,15 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/quorbs-print.jpg" alt="A print in two layers of color showing two rotund quails on a branch. Most of the details are in black ink, then there is a layer with a brown gradient filling in some color on the head and breast." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/not-a-drill/">
-			
-			<img src="/img/not-a-drill-print.jpg" alt="A print in dark teal ink depicting a power drill with text in cursive below that reads &#39;ceci n&#39;est pas un exercice&#39; or &#39;this is not a drill&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="not-a-drill">not a drill </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1164,6 +1168,8 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/not-a-drill-print.jpg" alt="A print in dark teal ink depicting a power drill with text in cursive below that reads &#39;ceci n&#39;est pas un exercice&#39; or &#39;this is not a drill&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1220,6 +1226,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/3/` was built on 2026-04-06T17:26:33.061Z -->
+    <!-- This page `/3/` was built on 2026-05-04T22:39:27.453Z -->
   </body>
 </html>

_site/4/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,10 +981,8 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/leather-long-stitch-journals/">
-			
-			<img src="/img/long-stitch-journals.jpg" alt="A stack of hand-bound journals showing long stitches aligned with the spines. They are leather bound and have tie closures." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="leather-long-stitch-journals">leather long-stitch journals </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
@@ -986,29 +990,29 @@ footer a:focus-visible {
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/long-stitch-journals.jpg" alt="A stack of hand-bound journals showing long stitches aligned with the spines. They are leather bound and have tie closures." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/lobstah/">
-			
-			<img src="/img/lobstah.jpg" alt="Two red leather lobster ornaments, about 4-5 in long each." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="lobstah">lobstah </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/lobstah.jpg" alt="Two red leather lobster ornaments, about 4-5 in long each." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/greeting-quorbs/">
-			
-			<img src="/img/greeting-quorbs.jpg" alt="A pile of hand-printed A2 size greeting cards. Only the front is visible, showing a particularly round quail." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="greeting-quorbs">greeting quorbs </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>card</li>
@@ -1016,95 +1020,95 @@ footer a:focus-visible {
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/greeting-quorbs.jpg" alt="A pile of hand-printed A2 size greeting cards. Only the front is visible, showing a particularly round quail." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/fedizinefest-2025/">
-			
-			<img src="/img/fedizinefest-2025.png" alt="A logo in purple, yellow, blue, and green. A piece of paper folded into 8 sections reads FEDI ZINE; it resembles the classic folding pattern of a simple 8-page zine made from printer paper. Next to it, a fully folded zine reads fest 2025." loading="lazy" decoding="async" width="729" height="799">
-			
 			<h2 data-ha-exclude="" id="fedizinefest-2025">fediZineFest 2025 </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>zine</li>
 				
 			</ul>
+			<img src="/img/fedizinefest-2025.png" alt="A logo in purple, yellow, blue, and green. A piece of paper folded into 8 sections reads FEDI ZINE; it resembles the classic folding pattern of a simple 8-page zine made from printer paper. Next to it, a fully folded zine reads fest 2025." loading="lazy" decoding="async" width="729" height="799">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/euphorbia/">
-			
-			<img src="/img/euphorbia-print.jpg" alt="A print in black ink on brown paper. It depicts a stem of euphorbia, a plant with long, thin leaves and many clustered flowers." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="euphorbia">euphorbia </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/euphorbia-print.jpg" alt="A print in black ink on brown paper. It depicts a stem of euphorbia, a plant with long, thin leaves and many clustered flowers." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/on-the-ubiquity-of-enby/">
-			
-			<img src="/img/gender-census.jpg" alt="A screenshot of part of the Gender Census reports page, showing the header bar and a title that reads &#39;Gender Census 2023 Worldwide Report&#39;" loading="lazy" decoding="async" width="1000" height="364">
-			
 			<h2 data-ha-exclude="" id="on-the-ubiquity-of-enby">on the ubiquity of &#39;enby&#39; </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/gender-census.jpg" alt="A screenshot of part of the Gender Census reports page, showing the header bar and a title that reads &#39;Gender Census 2023 Worldwide Report&#39;" loading="lazy" decoding="async" width="1000" height="364">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/handedness-toggle/">
-			
-			<img src="/img/handedness-toggle-0.png" alt="A screenshot of the rescue trans rescue navbar centered on a button that shows a hand pointing left." loading="lazy" decoding="async" width="1000" height="257">
-			
 			<h2 data-ha-exclude="" id="handedness-toggle">handedness toggle </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/handedness-toggle-0.png" alt="A screenshot of the rescue trans rescue navbar centered on a button that shows a hand pointing left." loading="lazy" decoding="async" width="1000" height="257">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/rescue-trans-rescue/">
-			
-			<img src="/img/wood-ducks.jpg" alt="“Picture unrelated to post. A male and female wood duck in summer ‘eclipse’ plumage have a little tiff while standing on a log. to the right, the male has his neck extended and beak open; on the left, the female has a wing extended upwards.“" loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="rescue-trans-rescue">rescue Trans Rescue </h2>
+			
 			<ul class="postlist-tags">
 				
 			</ul>
+			<img src="/img/wood-ducks.jpg" alt="“Picture unrelated to post. A male and female wood duck in summer ‘eclipse’ plumage have a little tiff while standing on a log. to the right, the male has his neck extended and beak open; on the left, the female has a wing extended upwards.“" loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/no-politics-wip/">
-			
-			<img src="/img/mushroom-on-fence.jpg" alt="Picture unrelated to post. A small orange mushroom grows from the center of a fence post." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="no-politics-wip">no politics (wip) </h2>
+			
 			<ul class="postlist-tags">
 				
 			</ul>
+			<img src="/img/mushroom-on-fence.jpg" alt="Picture unrelated to post. A small orange mushroom grows from the center of a fence post." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/booby-congrats-on-the-top-surgery/">
-			
-			<img src="/img/booby-card.jpg" alt="A landscape-oriented white card with a two-color print of a blue-footed booby." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="booby-congrats-on-the-top-surgery">booby (congrats on the top surgery) </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1114,15 +1118,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/booby-card.jpg" alt="A landscape-oriented white card with a two-color print of a blue-footed booby." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/luminescent/">
-			
-			<img src="/img/luminescent-print.jpg" alt="A print of a tattooed woman in bright highlighter yellow underwear." class="blur" loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="luminescent-mature">luminescent (mature)</h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1130,34 +1134,36 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/luminescent-print.jpg" alt="A print of a tattooed woman in bright highlighter yellow underwear." class="blur" loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/kniphofia/">
-			
-			<img src="/img/kniphofia-print.jpg" alt="A print of a brightly colored flower in 4 layers of color" loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="kniphofia">kniphofia </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/kniphofia-print.jpg" alt="A print of a brightly colored flower in 4 layers of color" loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/fd-signifier-and-oppositional-sexism/">
-			
-			<img src="/img/sheep.jpg" alt="Image unrelated to post. A mama sheep with two babies curled up next to her in a grassy field." loading="lazy" decoding="async" width="1000" height="450">
-			
 			<h2 data-ha-exclude="" id="fd-signifier-and-oppositional-sexism">fd signifier &amp; oppositional sexism </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/sheep.jpg" alt="Image unrelated to post. A mama sheep with two babies curled up next to her in a grassy field." loading="lazy" decoding="async" width="1000" height="450">
+			
 		</a>
 	</li>
 	
@@ -1214,6 +1220,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/4/` was built on 2026-04-06T17:26:33.510Z -->
+    <!-- This page `/4/` was built on 2026-05-04T22:39:28.340Z -->
   </body>
 </html>

_site/404.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="hello hello">
+<meta property="og:title" content=" | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -219,6 +219,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -849,12 +855,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -888,7 +894,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -945,7 +951,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1006,6 +1012,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/404.html` was built on 2026-04-06T17:26:29.558Z -->
+    <!-- This page `/404.html` was built on 2026-05-04T22:39:21.392Z -->
   </body>
 </html>

_site/5/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,52 +981,50 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/triangle-pouch/">
-			
-			<img src="/img/triangle-pouch.jpg" alt="5 small triangular pouches made of leather in two sizes and various colors." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="triangle-pouch">triangle pouch </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/triangle-pouch.jpg" alt="5 small triangular pouches made of leather in two sizes and various colors." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/tiny-portraits/">
-			
-			<img src="/img/tiny-portrait-stamps.jpg" alt="A collage showing various small (around an inch) stamps that depict people or animals." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="tiny-portraits">tiny portraits </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/tiny-portrait-stamps.jpg" alt="A collage showing various small (around an inch) stamps that depict people or animals." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/snap-pouch/">
-			
-			<img src="/img/snap-pouches.jpg" alt="4 square pouches that close with snaps. 2 have loops that attach keyrings. They are in various colors of leather." loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="snap-pouch">snap pouch </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/snap-pouches.jpg" alt="4 square pouches that close with snaps. 2 have loops that attach keyrings. They are in various colors of leather." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/gender-as-a-proxy-variable/">
-			
-			<img src="/img/gender-zine-cover.png" alt="Part of a scan of the cover of my zine, Gender as a Proxy Variable. It shows the title and a bit of handsewn binding." loading="lazy" decoding="async" width="1000" height="444">
-			
 			<h2 data-ha-exclude="" id="gender-as-a-proxy-variable">gender as a proxy variable </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>gender</li>
@@ -1028,113 +1032,113 @@ footer a:focus-visible {
 				<li>zine</li>
 				
 			</ul>
+			<img src="/img/gender-zine-cover.png" alt="Part of a scan of the cover of my zine, Gender as a Proxy Variable. It shows the title and a bit of handsewn binding." loading="lazy" decoding="async" width="1000" height="444">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/o-ring-bracelet/">
-			
-			<img src="/img/oring-bracelet.jpg" alt="A green leather bracelet, stitched along the edges with dark blue thread, holds an ouroborous o-ring in place with two black snaps." loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="o-ring-bracelet">o-ring bracelet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/oring-bracelet.jpg" alt="A green leather bracelet, stitched along the edges with dark blue thread, holds an ouroborous o-ring in place with two black snaps." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/leaf-patches/">
-			
-			<img src="/img/leaf-patches-oak.jpg" alt="Several oak-leaf-shaped leather patches with stitching holes punched around the edges." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="leaf-patches">leaf patches </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leaf-patches-oak.jpg" alt="Several oak-leaf-shaped leather patches with stitching holes punched around the edges." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/bowtie/">
-			
-			<img src="/img/bowtie.jpg" alt="A black leather bow tie with black stitching." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="bowtie">bowtie </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/bowtie.jpg" alt="A black leather bow tie with black stitching." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/swoop-wallet/">
-			
-			<img src="/img/swoop-wallet.jpg" alt="A collage showing 3 pictures of a red and brown leather card wallet. The red pocket separator folds around to the back to become a fetching curlicue." loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="swoop-wallet">swoop wallet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/swoop-wallet.jpg" alt="A collage showing 3 pictures of a red and brown leather card wallet. The red pocket separator folds around to the back to become a fetching curlicue." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/squarsh/">
-			
-			<img src="/img/squarsh-prints.jpg" alt="Two identical prints of a delicata squash. The body of the squash is cornsilk (muted yellow), the stem and stripes in mint green, and the shadows in lilac." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="squarsh">squarsh </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/squarsh-prints.jpg" alt="Two identical prints of a delicata squash. The body of the squash is cornsilk (muted yellow), the stem and stripes in mint green, and the shadows in lilac." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/rachels-bracelets/">
-			
-			<img src="/img/rachel-bracelets.jpg" alt="Two pink leather bracelets with stainless steel hardware and aqua stitching." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="rachels-bracelets">rachel&#39;s bracelets </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/rachel-bracelets.jpg" alt="Two pink leather bracelets with stainless steel hardware and aqua stitching." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/printmaking-paper-notes/">
-			
-			<img src="/img/killdeer.jpg" alt="Image unrelated to post. A very fluffed up killdeer stands on a rocky beach." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="printmaking-paper-notes">printmaking paper notes </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/killdeer.jpg" alt="Image unrelated to post. A very fluffed up killdeer stands on a rocky beach." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/bottom-growth/">
-			
-			<img src="/img/bottom-growth-prints.jpg" alt="4 copies of the same print in various color schemes, laid out in a 2x2 grid. The print shows testosterone-driven bottom growth of a clitoris. The color schemes are, clockwise from top right, brown on turquoise, red on cornsilk (muted yellow), violet on magenta, and mint green on lilac." class="blur" loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="bottom-growth-mature">bottom growth (mature)</h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1142,20 +1146,22 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/bottom-growth-prints.jpg" alt="4 copies of the same print in various color schemes, laid out in a 2x2 grid. The print shows testosterone-driven bottom growth of a clitoris. The color schemes are, clockwise from top right, brown on turquoise, red on cornsilk (muted yellow), violet on magenta, and mint green on lilac." class="blur" loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/soras-collar/">
-			
-			<img src="/img/sora-collar.jpg" alt="A collage showing a red and black leather dog collar tooled with roses and the name Sora. It&#39;s fully stitched with dark red stitching and has brass hardware." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="soras-collar">sora&#39;s collar </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/sora-collar.jpg" alt="A collage showing a red and black leather dog collar tooled with roses and the name Sora. It&#39;s fully stitched with dark red stitching and has brass hardware." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
@@ -1212,6 +1218,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/5/` was built on 2026-04-06T17:26:33.797Z -->
+    <!-- This page `/5/` was built on 2026-05-04T22:39:28.890Z -->
   </body>
 </html>

_site/6/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,94 +981,92 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/shrimp-cat-toy/">
-			
-			<img src="/img/two-shrimp.jpg" alt="Two leather shrimp-shaped cat toys. They have long dangly antennae and are stitched in red and orange." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="shrimp-cat-toy">shrimp cat toy </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/two-shrimp.jpg" alt="Two leather shrimp-shaped cat toys. They have long dangly antennae and are stitched in red and orange." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/foldy-wallet-with-thumb-slide/">
-			
-			<img src="/img/foldy-thumb-slide.jpg" alt="A card wallet with one main pocket and one quick access slot with a thumb slide. The cover of the main pocket curves around the thumb slide." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="foldy-wallet-with-thumb-slide">foldy wallet with thumb slide </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/foldy-thumb-slide.jpg" alt="A card wallet with one main pocket and one quick access slot with a thumb slide. The cover of the main pocket curves around the thumb slide." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/brookes-cuff-bracelets/">
-			
-			<img src="/img/brooke-cuffs.jpg" alt="Olive green leather cuffs with silver spikes and a shearling lining." loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="brookes-cuff-bracelets">brooke&#39;s cuff bracelets </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/brooke-cuffs.jpg" alt="Olive green leather cuffs with silver spikes and a shearling lining." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/aarons-mask/">
-			
-			<img src="/img/aaron-mask.jpg" alt="A brown/grey leather mask of a long snouted dog with visible teeth and red detailing." loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="aarons-mask">aaron&#39;s mask </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/aaron-mask.jpg" alt="A brown/grey leather mask of a long snouted dog with visible teeth and red detailing." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/sunflower/">
-			
-			<img src="/img/sunflower.jpg" alt="A sunflower made of leather. Many individual natural toned leather petals are sewn onto a brown center ." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="sunflower">sunflower </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/sunflower.jpg" alt="A sunflower made of leather. Many individual natural toned leather petals are sewn onto a brown center ." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/foldy-wallet/">
-			
-			<img src="/img/foldy-wallet.jpg" alt="A four part collage showing a single piece of deep red leather folding up to become a card wallet." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="foldy-wallet">foldy wallet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/foldy-wallet.jpg" alt="A four part collage showing a single piece of deep red leather folding up to become a card wallet." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/proud-dad-wallet/">
-			
-			<img src="/img/proud-dad-wallet.jpg" alt="A brown leather wallet with a subtle trans flag stitching across the top." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="proud-dad-wallet">proud dad wallet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
@@ -1070,85 +1074,85 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/proud-dad-wallet.jpg" alt="A brown leather wallet with a subtle trans flag stitching across the top." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/patchwork-wallet/">
-			
-			<img src="/img/patchwork-wallet.jpg" alt="A collage showing a wallet in a patchwork style, with different colors of leather all stitched together to make up the exterior and the top interior pockets. Other pockets inside are dyed various colors." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="patchwork-wallet">patchwork wallet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/patchwork-wallet.jpg" alt="A collage showing a wallet in a patchwork style, with different colors of leather all stitched together to make up the exterior and the top interior pockets. Other pockets inside are dyed various colors." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/mom-bag/">
-			
-			<img src="/img/mom-bag.jpg" alt="A leather bag sized for a large smartphone with a main pocket and a wraparound smaller pocket. It has a magnetic clasp." loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="mom-bag">mom bag </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/mom-bag.jpg" alt="A leather bag sized for a large smartphone with a main pocket and a wraparound smaller pocket. It has a magnetic clasp." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/gradient-purse-strap/">
-			
-			<img src="/img/gradient-purse-strap.jpg" alt="a coiled up purse strap in gradient cool colors - we can see green, teal, indigo, and a slightly pinkish purple. It has brass hardware and is stiched along its length with cream stitches." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="gradient-purse-strap">gradient purse strap </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/gradient-purse-strap.jpg" alt="a coiled up purse strap in gradient cool colors - we can see green, teal, indigo, and a slightly pinkish purple. It has brass hardware and is stiched along its length with cream stitches." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/zipper-bifold-green/">
-			
-			<img src="/img/zipper-bifold-green.jpg" alt="A collage showing a green leather wallet with a zippered pocket built into one external side." loading="lazy" decoding="async" width="1000" height="1332">
-			
 			<h2 data-ha-exclude="" id="zipper-bifold-green">zipper bifold (green) </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/zipper-bifold-green.jpg" alt="A collage showing a green leather wallet with a zippered pocket built into one external side." loading="lazy" decoding="async" width="1000" height="1332">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/vix-collar/">
-			
-			<img src="/img/vix-collar.jpg" alt="A collar rests on a leather-wrapped lighter. It is lined with shearling and built of two other layers of leather - a wider mustard yellow layer and a thinner teal layer over that. the teal layer holds a heart shaped o-ring in place." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="vix-collar">vix collar </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/vix-collar.jpg" alt="A collar rests on a leather-wrapped lighter. It is lined with shearling and built of two other layers of leather - a wider mustard yellow layer and a thinner teal layer over that. the teal layer holds a heart shaped o-ring in place." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/trans-the-world/">
-			
-			<img src="/img/trans-the-world-print.jpg" alt="A print that reads &#39;trans the world&#39; surrounding an image of a globe and a trans symbol. It&#39;s in a ping-to-blue gradient." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="trans-the-world">trans the world </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1158,6 +1162,8 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-the-world-print.jpg" alt="A print that reads &#39;trans the world&#39; surrounding an image of a globe and a trans symbol. It&#39;s in a ping-to-blue gradient." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1214,6 +1220,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/6/` was built on 2026-04-06T17:26:34.082Z -->
+    <!-- This page `/6/` was built on 2026-05-04T22:39:29.471Z -->
   </body>
 </html>

_site/7/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,10 +981,8 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/slightly-weird-man-club/">
-			
-			<img src="/img/slightly-weird-man-club-print.jpg" alt="A print that reads &#39;slightly weird man club&#39; in a nonbinary flag colored gradient" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="slightly-weird-man-club">slightly weird man club </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -988,57 +992,57 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/slightly-weird-man-club-print.jpg" alt="A print that reads &#39;slightly weird man club&#39; in a nonbinary flag colored gradient" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/pins/">
-			
-			<img src="/img/trans-rights-and-wrongs-pins.jpg" alt="Two hard enamel pins in my trans rights and trans wrongs skulls designs." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="pins">pins! </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>pin</li>
 				
 			</ul>
+			<img src="/img/trans-rights-and-wrongs-pins.jpg" alt="Two hard enamel pins in my trans rights and trans wrongs skulls designs." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/mousie/">
-			
-			<img src="/img/mousie.jpg" alt="A cat in a sunbeam snuggles a little leather mouse-shaped cat toy." loading="lazy" decoding="async" width="1000" height="1499">
-			
 			<h2 data-ha-exclude="" id="mousie">mousie </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/mousie.jpg" alt="A cat in a sunbeam snuggles a little leather mouse-shaped cat toy." loading="lazy" decoding="async" width="1000" height="1499">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/long-zipper-bifold/">
-			
-			<img src="/img/long-zipper-bifold.jpg" alt="A collage showing an orange leather wallet with a long zipper running the length of the outside." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="long-zipper-bifold">long zipper bifold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/long-zipper-bifold.jpg" alt="A collage showing an orange leather wallet with a long zipper running the length of the outside." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/tooled-leather-patches/">
-			
-			<img src="/img/pronoun-patch-scroll.jpg" alt="two tooled leather patches. they have scrolls tooled on them that read various pronoun sets." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="tooled-leather-patches">tooled leather patches </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
@@ -1046,15 +1050,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/pronoun-patch-scroll.jpg" alt="two tooled leather patches. they have scrolls tooled on them that read various pronoun sets." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/fishhook-pride-keychains/">
-			
-			<img src="/img/fishhook-keychain-nonbinary.jpg" alt="a keychain with an iridescent fishhook style attachment linked via leather to an iridescent keyring. the leather is stitched with nonbinary flag colors." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="fishhook-pride-keychains">fishhook pride keychains </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
@@ -1062,104 +1066,106 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/fishhook-keychain-nonbinary.jpg" alt="a keychain with an iridescent fishhook style attachment linked via leather to an iridescent keyring. the leather is stitched with nonbinary flag colors." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/circle-bag/">
-			
-			<img src="/img/circle-bag.jpg" alt="A round bag in brown, mustard yellow, and rich deep orange, with a teal shoulder strap." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="circle-bag">circle bag </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/circle-bag.jpg" alt="A round bag in brown, mustard yellow, and rich deep orange, with a teal shoulder strap." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/on-pronouns/">
-			
-			<img src="/img/starling.jpg" alt="Image unrelated to post. A starling, a beautifully iridescent black bird, stands on a hanging suet feeder." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="on-pronouns">on pronouns </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/starling.jpg" alt="Image unrelated to post. A starling, a beautifully iridescent black bird, stands on a hanging suet feeder." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/stephanie-collar/">
-			
-			<img src="/img/stephanie-collar.jpg" alt="A white woman with a shaved side cut wearing a black leather collar with a large dangling o-ring." loading="lazy" decoding="async" width="1000" height="562">
-			
 			<h2 data-ha-exclude="" id="stephanie-collar">stephanie collar </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/stephanie-collar.jpg" alt="A white woman with a shaved side cut wearing a black leather collar with a large dangling o-ring." loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/tiny-mushrooms/">
-			
-			<img src="/img/pixels-mushrooms.jpg" alt="3 tiny mushroom stamps next to their impressions. They are all about 1 inch square. There is a chanterelle in yellow, a russula in pink, and witch&#39;s hat mycena in indigo." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="tiny-mushrooms">tiny mushrooms </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/pixels-mushrooms.jpg" alt="3 tiny mushroom stamps next to their impressions. They are all about 1 inch square. There is a chanterelle in yellow, a russula in pink, and witch&#39;s hat mycena in indigo." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/pinatex-wallet-with-zipper/">
-			
-			<img src="/img/pinatex-ten-pocket-bifold.jpg" alt="A two-picture collage showing the inside and outside of a wallet made with piñatex, a leather alternative made from pineapple leaves. It is two tone blue with a pink accent and has a zippered pocket built in." loading="lazy" decoding="async" width="1000" height="1331">
-			
 			<h2 data-ha-exclude="" id="pinatex-wallet-with-zipper">piñatex wallet with zipper </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/pinatex-ten-pocket-bifold.jpg" alt="A two-picture collage showing the inside and outside of a wallet made with piñatex, a leather alternative made from pineapple leaves. It is two tone blue with a pink accent and has a zippered pocket built in." loading="lazy" decoding="async" width="1000" height="1331">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/moss-harness/">
-			
-			<img src="/img/moss-harness.jpg" alt="A nylon webbing harness in bright teal laid out on a desk." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="moss-harness">moss harness </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/moss-harness.jpg" alt="A nylon webbing harness in bright teal laid out on a desk." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/makers-mark-keychain/">
-			
-			<img src="/img/makers-mark-keychain.jpg" alt="A keychain on an iridescent rainbow split ring. It is dark brown/grey leather and has LEE CAT ART stamped into it." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="makers-mark-keychain">maker&#39;s mark keychain </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/makers-mark-keychain.jpg" alt="A keychain on an iridescent rainbow split ring. It is dark brown/grey leather and has LEE CAT ART stamped into it." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
@@ -1216,6 +1222,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/7/` was built on 2026-04-06T17:26:34.237Z -->
+    <!-- This page `/7/` was built on 2026-05-04T22:39:29.809Z -->
   </body>
 </html>

_site/8/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,78 +981,76 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/brookes-collar/">
-			
-			<img src="/img/lined-shearling-collar.jpg" alt="A green leather collar lined with brown/grey shearling and fitted with two sizes of silver-toned spikes." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="brookes-collar">brooke&#39;s collar </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/lined-shearling-collar.jpg" alt="A green leather collar lined with brown/grey shearling and fitted with two sizes of silver-toned spikes." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/bag-strap/">
-			
-			<img src="/img/bag-strap.jpg" alt="A nylon webbing shoulder strap in bright teal with clips on each end." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="bag-strap">bag strap </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/bag-strap.jpg" alt="A nylon webbing shoulder strap in bright teal with clips on each end." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/artists-conk/">
-			
-			<img src="/img/artists-conk-leatherworking.jpg" alt="A hand holding a mushroom with a whitish surface. Scratched into the surface and showing up as brown lines is an illustration of many leatherworking tools." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="artists-conk">artists conk! </h2>
+			
 			<ul class="postlist-tags">
 				
 			</ul>
+			<img src="/img/artists-conk-leatherworking.jpg" alt="A hand holding a mushroom with a whitish surface. Scratched into the surface and showing up as brown lines is an illustration of many leatherworking tools." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/domain-and-site-setup/">
-			
-			<img src="/img/crinkly-mushrooms.jpg" alt="Picture unrelated to post. Some crinkly brown-orange mushrooms in vibrant green grass." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="domain-and-site-setup">domain and site setup </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/crinkly-mushrooms.jpg" alt="Picture unrelated to post. Some crinkly brown-orange mushrooms in vibrant green grass." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/x-acto-knife-sheath/">
-			
-			<img src="/img/knife-sheaths.jpg" alt="Several blades with leather sheaths, and a few extra sheaths. There&#39;s a #2 blade with an orange sheath with yellow stitching, a #11 blade with a blue sheath with light grey stitching, and a skiving knife with a plum sheath and pink stitching." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="x-acto-knife-sheath">x-acto knife sheath </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/knife-sheaths.jpg" alt="Several blades with leather sheaths, and a few extra sheaths. There&#39;s a #2 blade with an orange sheath with yellow stitching, a #11 blade with a blue sheath with light grey stitching, and a skiving knife with a plum sheath and pink stitching." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/little-critter-pouch/">
-			
-			<img src="/img/little-critter-pouch.jpg" alt="A leather pouch shaped a bit like a d10 but with eight sides. It has a rainbow zippered opening and a wristlet strap." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="little-critter-pouch">little critter pouch </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
@@ -1054,104 +1058,106 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/little-critter-pouch.jpg" alt="A leather pouch shaped a bit like a d10 but with eight sides. It has a rainbow zippered opening and a wristlet strap." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/zipper-bifold/">
-			
-			<img src="/img/zipper-bifold.jpg" alt="A collage showing a hand-stitched leather bifold with a zippered coin pocket on one exterior side." loading="lazy" decoding="async" width="1000" height="1777">
-			
 			<h2 data-ha-exclude="" id="zipper-bifold">zipper bifold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/zipper-bifold.jpg" alt="A collage showing a hand-stitched leather bifold with a zippered coin pocket on one exterior side." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/vertical-zipper-card-wallet/">
-			
-			<img src="/img/vertical-zipper-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets, a hidden pocket, and a zippered coin pouch." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="vertical-zipper-card-wallet">vertical zipper card wallet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/vertical-zipper-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets, a hidden pocket, and a zippered coin pouch." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/vertical-card-wallet/">
-			
-			<img src="/img/vertical-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets and 1 interior pocket." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="vertical-card-wallet">vertical card wallet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/vertical-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets and 1 interior pocket." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/vertical-bifold/">
-			
-			<img src="/img/vertical-bifold.jpg" alt="A collage showing a hand-stitched leather vertical bifold wallet with 6 card pockets, 2 hidden pockets, and 1 bill pocket." loading="lazy" decoding="async" width="1000" height="1777">
-			
 			<h2 data-ha-exclude="" id="vertical-bifold">vertical bifold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/vertical-bifold.jpg" alt="A collage showing a hand-stitched leather vertical bifold wallet with 6 card pockets, 2 hidden pockets, and 1 bill pocket." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/eight-pocket-bifold/">
-			
-			<img src="/img/eight-pocket-bifold.jpg" alt="A 3-picture collage showing a hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a asymmetrical interior with a hidden pocket and 3 card pockets on the right, and a hidden pocket and 2 card pockets on the left. The left front pocket has a small naturally occuring hole." loading="lazy" decoding="async" width="1000" height="1777">
-			
 			<h2 data-ha-exclude="" id="eight-pocket-bifold">eight pocket bifold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/eight-pocket-bifold.jpg" alt="A 3-picture collage showing a hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a asymmetrical interior with a hidden pocket and 3 card pockets on the right, and a hidden pocket and 2 card pockets on the left. The left front pocket has a small naturally occuring hole." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/double-bill-pocket-bifold/">
-			
-			<img src="/img/double-bill-pocket-bifold.jpg" alt="A 3-picture collage showing a hand-stitched leather wallet in plum and light natural leather, with a double bill pocket." loading="lazy" decoding="async" width="1000" height="1777">
-			
 			<h2 data-ha-exclude="" id="double-bill-pocket-bifold">double bill pocket bifold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/double-bill-pocket-bifold.jpg" alt="A 3-picture collage showing a hand-stitched leather wallet in plum and light natural leather, with a double bill pocket." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/nine-pocket-bifold/">
-			
-			<img src="/img/nine-pocket-bifold.jpg" alt="A hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a symmetrical interior with a hidden pocket and 3 card pockets on each side." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="nine-pocket-bifold">nine pocket bifold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/nine-pocket-bifold.jpg" alt="A hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a symmetrical interior with a hidden pocket and 3 card pockets on each side." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1208,6 +1214,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/8/` was built on 2026-04-06T17:26:34.503Z -->
+    <!-- This page `/8/` was built on 2026-05-04T22:39:30.391Z -->
   </body>
 </html>

_site/9/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="home">
+<meta property="og:title" content="home | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -975,52 +981,50 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/leather-lighter-case/">
-			
-			<img src="/img/leather-lighter-case.jpg" alt="A bic lighter wrapped in leather and hand-stitched up one side." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="leather-lighter-case">leather lighter case </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leather-lighter-case.jpg" alt="A bic lighter wrapped in leather and hand-stitched up one side." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/leather-chest-harness/">
-			
-			<img src="/img/leather-chest-harness.jpg" alt="Someone from chin to mid-torso, wearing a dark teal leather chest harness with matte black fittings over a t shirt." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="leather-chest-harness">leather chest harness </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leather-chest-harness.jpg" alt="Someone from chin to mid-torso, wearing a dark teal leather chest harness with matte black fittings over a t shirt." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/leatherworking-favorites/">
-			
-			<img src="/img/leather-harness-wip.jpg" alt="two pieces of a chest harness sitting on a messy workbench. both pieces are about 8 inches long total and consist of two large o-rings joined by a dark teal leather strap. the o rings and rivets are matte black." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="leatherworking-favorites">leatherworking favorites </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leather-harness-wip.jpg" alt="two pieces of a chest harness sitting on a messy workbench. both pieces are about 8 inches long total and consist of two large o-rings joined by a dark teal leather strap. the o rings and rivets are matte black." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/anarchy-autism/">
-			
-			<img src="/img/anarchy-autism-rainbow-print.jpg" alt="A print in rainbow ink that says autism with the anarchy A." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="anarchy-autism">anarchy autism </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1032,27 +1036,27 @@ footer a:focus-visible {
 				<li>pin</li>
 				
 			</ul>
+			<img src="/img/anarchy-autism-rainbow-print.jpg" alt="A print in rainbow ink that says autism with the anarchy A." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/ecommerce-options/">
-			
-			<img src="/img/loon.jpg" alt="Image unrelated to post. A loon rearing up with eir wings spread on a calm lake." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="ecommerce-options">ecommerce options </h2>
+			
 			<ul class="postlist-tags">
 				
 			</ul>
+			<img src="/img/loon.jpg" alt="Image unrelated to post. A loon rearing up with eir wings spread on a calm lake." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/rope-one/">
-			
-			<img src="/img/rope-print-1.jpg" alt="A print of a nude trans woman in an asymmetrical rope harness." class="blur" loading="lazy" decoding="async" width="1000" height="1242">
-			
 			<h2 data-ha-exclude="" id="rope-one-mature">rope (one) (mature)</h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1060,15 +1064,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/rope-print-1.jpg" alt="A print of a nude trans woman in an asymmetrical rope harness." class="blur" loading="lazy" decoding="async" width="1000" height="1242">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/artisans-cooperative-shirts/">
-			
-			<img src="/img/artisans-coop-shirt.jpg" alt="A black tank top laid on a desk. In white ink it reads &#39;Artisans Cooperative&#39; with a print of some chickens and a quail." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="artisans-cooperative-shirts">artisans cooperative shirts </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>shirt</li>
@@ -1076,15 +1080,15 @@ footer a:focus-visible {
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/artisans-coop-shirt.jpg" alt="A black tank top laid on a desk. In white ink it reads &#39;Artisans Cooperative&#39; with a print of some chickens and a quail." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/shrimp/">
-			
-			<img src="/img/shrimp-print.jpg" alt="A print of a small shrimp with slender little leggies in orange ink." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="shrimp">shrimp </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1096,29 +1100,29 @@ footer a:focus-visible {
 				<li>pin</li>
 				
 			</ul>
+			<img src="/img/shrimp-print.jpg" alt="A print of a small shrimp with slender little leggies in orange ink." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/in-the-news/">
-			
-			<img src="/img/shrimp-knitting.jpg" alt="Picture unrelated to post. Lee, sitting in a chair and seen in profile, looks up and smiles. Ze is holding and working on a partially knit shrimp." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="in-the-news">in the news </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/shrimp-knitting.jpg" alt="Picture unrelated to post. Lee, sitting in a chair and seen in profile, looks up and smiles. Ze is holding and working on a partially knit shrimp." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/girldick/">
-			
-			<img src="/img/girldick-shirt.jpg" alt="A butch cooking and wearing a cropped tee with blue cap sleeves that reads girldick in blue G.I.Joe font." class="blur" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="girldick-mature">girldick (mature)</h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1132,15 +1136,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/girldick-shirt.jpg" alt="A butch cooking and wearing a cropped tee with blue cap sleeves that reads girldick in blue G.I.Joe font." class="blur" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/boypussy/">
-			
-			<img src="/img/boypussy-shirt.jpg" alt="A butch holding a chainsaw and wearing a tank top that reads boypussy in pink Barbie font." class="blur" loading="lazy" decoding="async" width="1000" height="1250">
-			
 			<h2 data-ha-exclude="" id="boypussy-mature">boypussy (mature)</h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1154,15 +1158,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/boypussy-shirt.jpg" alt="A butch holding a chainsaw and wearing a tank top that reads boypussy in pink Barbie font." class="blur" loading="lazy" decoding="async" width="1000" height="1250">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/queer/">
-			
-			<img src="/img/queer-print.jpg" alt="A print of the word queer in black ink. The letters are rounded with elongated oval negative space." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="queer">queer </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1176,15 +1180,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/queer-print.jpg" alt="A print of the word queer in black ink. The letters are rounded with elongated oval negative space." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/coming-out/">
-			
-			<img src="/img/coming-out-card-print.jpg" alt="A card and print in the same design - a chick and a broken eggshell, and a simple font reading &#39;congrats on coming out of your shell&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="coming-out">coming out </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1194,6 +1198,8 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/coming-out-card-print.jpg" alt="A card and print in the same design - a chick and a broken eggshell, and a simple font reading &#39;congrats on coming out of your shell&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1250,6 +1256,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/9/` was built on 2026-04-06T17:26:34.847Z -->
+    <!-- This page `/9/` was built on 2026-05-04T22:39:31.067Z -->
   </body>
 </html>

_site/aarons-mask/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="aaron&#39;s mask">
+<meta property="og:title" content="aaron&amp;#39;s mask | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,44 +1479,46 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/foldy-wallet/">
+		<a class="postlink" href="/tooled-leather-patches/">
+			<h2 data-ha-exclude="" id="tooled-leather-patches">tooled leather patches </h2>
 			
-			<img src="/img/foldy-wallet.jpg" alt="A four part collage showing a single piece of deep red leather folding up to become a card wallet." loading="lazy" decoding="async" width="1000" height="1000">
+			<ul class="postlist-tags">
+				
+				<li>leather</li>
+				
+				<li>gender</li>
+				
+			</ul>
+			<img src="/img/pronoun-patch-scroll.jpg" alt="two tooled leather patches. they have scrolls tooled on them that read various pronoun sets." loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/vertical-card-wallet/">
+			<h2 data-ha-exclude="" id="vertical-card-wallet">vertical card wallet </h2>
 			
-			<h2 data-ha-exclude="" id="foldy-wallet">foldy wallet </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/vertical-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets and 1 interior pocket." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/swoop-wallet/">
+			<h2 data-ha-exclude="" id="swoop-wallet">swoop wallet </h2>
 			
+			<ul class="postlist-tags">
+				
+				<li>leather</li>
+				
+			</ul>
 			<img src="/img/swoop-wallet.jpg" alt="A collage showing 3 pictures of a red and brown leather card wallet. The red pocket separator folds around to the back to become a fetching curlicue." loading="lazy" decoding="async" width="900" height="1200">
 			
-			<h2 data-ha-exclude="" id="swoop-wallet">swoop wallet </h2>
-			<ul class="postlist-tags">
-				
-				<li>leather</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/bag-strap/">
-			
-			<img src="/img/bag-strap.jpg" alt="A nylon webbing shoulder strap in bright teal with clips on each end." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="bag-strap">bag strap </h2>
-			<ul class="postlist-tags">
-				
-				<li>leather</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1545,6 +1553,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/aarons-mask/` was built on 2026-04-06T17:26:29.544Z -->
+    <!-- This page `/aarons-mask/` was built on 2026-05-04T22:39:21.322Z -->
   </body>
 </html>

_site/about/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="about">
+<meta property="og:title" content="about | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -219,6 +219,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -849,12 +855,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -888,7 +894,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -945,7 +951,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1123,6 +1129,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/about/` was built on 2026-04-06T17:26:29.558Z -->
+    <!-- This page `/about/` was built on 2026-05-04T22:39:21.391Z -->
   </body>
 </html>

_site/acadia-coloring-journal/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="Acadia coloring journal">
+<meta property="og:title" content="Acadia coloring journal | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1489,44 +1495,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/green-memo-pad/">
+		<a class="postlink" href="/lined-notebook/">
+			<h2 data-ha-exclude="" id="lined-notebook">lined notebook </h2>
 			
-			<img src="/img/green-memo-pad.jpg" alt="A three panel collage showcasing a small green memo pad." loading="lazy" decoding="async" width="1000" height="1776">
-			
-			<h2 data-ha-exclude="" id="green-memo-pad">green memo pad </h2>
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/lined-notebook.jpg" alt="A three panel collage showing a the endpapers, cover, and pages of a small hardbound notebook." loading="lazy" decoding="async" width="1000" height="1776">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/square-watercolor-pad/">
+			<h2 data-ha-exclude="" id="square-watercolor-pad">square watercolor pad </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>book</li>
+				
+			</ul>
+			<img src="/img/square-watercolor-pad.jpg" alt="A two panel collage showing a square book with a tan cover and blue and gold endpapers." loading="lazy" decoding="async" width="1000" height="1331">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/orange-green-journal/">
+			<h2 data-ha-exclude="" id="orange-green-journal">orange green journal </h2>
 			
+			<ul class="postlist-tags">
+				
+				<li>book</li>
+				
+			</ul>
 			<img src="/img/orange-green-journal.jpg" alt="A 4-part collage of a slim handbound book." loading="lazy" decoding="async" width="1000" height="1777">
 			
-			<h2 data-ha-exclude="" id="orange-green-journal">orange green journal </h2>
-			<ul class="postlist-tags">
-				
-				<li>book</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/tiny-books/">
-			
-			<img src="/img/tiny-book.jpg" alt="A three panel collage showing a book held in the palm of a hand." loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="tiny-books">tiny books </h2>
-			<ul class="postlist-tags">
-				
-				<li>book</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1561,6 +1567,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/acadia-coloring-journal/` was built on 2026-04-06T17:26:29.516Z -->
+    <!-- This page `/acadia-coloring-journal/` was built on 2026-05-04T22:39:21.315Z -->
   </body>
 </html>

_site/acadia-mitts/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="acadia mitts">
+<meta property="og:title" content="acadia mitts | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,46 +1479,46 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/keffiyah-fishing-net-pattern/">
+		<a class="postlink" href="/brookes-socks/">
+			<h2 data-ha-exclude="" id="brookes-socks">brooke&#39;s socks </h2>
 			
-			<img src="/img/keffiyah-nets.jpg" alt="a knitted swatch. it&#39;s mostly white yarn, but a grid of dark red- purple- green yarn that looks like a chain link fence is built into it. the diagonal lines are achieved with floats of yarn from one row, then picked up and knit into several rows later." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="keffiyah-fishing-net-pattern">keffiyah fishing net pattern </h2>
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/brookes-socks/">
-			
 			<img src="/img/brooke-socks.jpg" alt="Feet in a pair of colorful socks. They are identically striped and quickly vary between yellow, green, blue, white, and gray." loading="lazy" decoding="async" width="1000" height="750">
 			
-			<h2 data-ha-exclude="" id="brookes-socks">brooke&#39;s socks </h2>
-			<ul class="postlist-tags">
-				
-				<li>knit</li>
-				
-			</ul>
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/pride-dice-bags/">
+		<a class="postlink" href="/butch-hands-pattern/">
+			<h2 data-ha-exclude="" id="butch-hands-pattern">butch hands pattern </h2>
 			
-			<img src="/img/pride-dice-bags.jpg" alt="Several knitted drawstring dice bags sit in front of a bookshelf. They are in different pride flag colors; from right to left (skipping a few duplicates) bisexual, lesbian, nonbinary, trans, and genderqueer. The trans-colored dice bag in the center opens towards the camera, showing a variety of colorful dice inside." loading="lazy" decoding="async" width="1000" height="500">
-			
-			<h2 data-ha-exclude="" id="pride-dice-bags">pride dice bags </h2>
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
-				<li>gender</li>
+				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/butch-hands.jpg" alt="Hands wearing a pair of pink and grey gloves with convertable mitten tops." loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/sideways-canvas-shirt/">
+			<h2 data-ha-exclude="" id="sideways-canvas-shirt">sideways canvas shirt </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>knit</li>
+				
+			</ul>
+			<img src="/img/sideways-canvas.jpg" alt="someone&#39;s torso in a knitted short sleeve shirt. the front is teal, and the bit of back we can see is mustard yellow. looking closely, it&#39;s notable that the stitches are turned 90 degrees from a standard knit garment." loading="lazy" decoding="async" width="1000" height="1338">
+			
 		</a>
 	</li>
 	
@@ -1547,6 +1553,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/acadia-mitts/` was built on 2026-04-06T17:26:29.552Z -->
+    <!-- This page `/acadia-mitts/` was built on 2026-05-04T22:39:21.379Z -->
   </body>
 </html>

_site/accessible-image-modals/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="accessible image modals">
+<meta property="og:title" content="accessible image modals | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1526,46 +1532,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/my-favorite-git-flag/">
+		<a class="postlink" href="/intro-to-wireframing/">
+			<h2 data-ha-exclude="" id="intro-to-wireframing">intro to wireframing </h2>
 			
-			<img src="/img/shelf-mushrooms.jpg" alt="Picture unrelated to post. Creamy beige shelf mushrooms on a mossy tree trunk." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="my-favorite-git-flag">my favorite git flag </h2>
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/intro-to-wireframing/">
-			
 			<img src="/img/aggregator-wireframes.jpg" alt="a figma page with 4 major sections titled aggregator, aggregator mobile, aggregator color, and aggregator mobile color. each section has 7 pages in it - all sections pretty clearly have the same 7 pages, with the mobile sections shown on mobile screens and the color sections in a rainbow of pastels rather than grayscale." loading="lazy" decoding="async" width="1000" height="1042">
 			
-			<h2 data-ha-exclude="" id="intro-to-wireframing">intro to wireframing </h2>
-			<ul class="postlist-tags">
-				
-				<li>software</li>
-				
-			</ul>
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/designing-a-bag/">
+		<a class="postlink" href="/my-favorite-git-flag/">
+			<h2 data-ha-exclude="" id="my-favorite-git-flag">my favorite git flag </h2>
 			
-			<img src="/img/shoelace-bag.jpg" alt="a 3-image collage showcasing a leather crossbody bag. the leather body is brown and fairly simple. up the narrow sides, rope is laced through grommets in a style resembling a shoe lacing. the rope forms the handle and loops seamlessly through the other side of the bag, joining in one point in a figure-8 follow-through knot. At the bottom corners, there are small diagonal lines of stitching to give the bag a small lip around the base and ensure small objects don&#39;t slide out." loading="lazy" decoding="async" width="1000" height="1777">
-			
-			<h2 data-ha-exclude="" id="designing-a-bag">designing a bag </h2>
 			<ul class="postlist-tags">
 				
-				<li>leather</li>
-				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/shelf-mushrooms.jpg" alt="Picture unrelated to post. Creamy beige shelf mushrooms on a mossy tree trunk." loading="lazy" decoding="async" width="1000" height="666">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/comparing-text-editors/">
+			<h2 data-ha-exclude="" id="comparing-text-editors">comparing text editors </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>software</li>
+				
+			</ul>
+			<img src="/img/horsetail.jpg" alt="Image unrelated to post. Close up on a horsetail plant&#39;s stem, with many small needle-like leaves emerging from all sides of the circular stem at each segmented joint." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
@@ -1600,6 +1604,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/accessible-image-modals/` was built on 2026-04-06T17:26:29.557Z -->
+    <!-- This page `/accessible-image-modals/` was built on 2026-05-04T22:39:21.389Z -->
   </body>
 </html>

_site/an-intro-to-git/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="an intro to git">
+<meta property="og:title" content="an intro to git | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1888,48 +1894,46 @@ codeberg  https://codeberg.org/inherentlee/git-intro.git (push)</code></pre>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/gender-in-data-models/">
+		<a class="postlink" href="/domain-and-site-setup/">
+			<h2 data-ha-exclude="" id="domain-and-site-setup">domain and site setup </h2>
 			
-			<img src="/img/peony.jpg" alt="Image unrelated to post. A light pink peony in full bloom, close up." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="gender-in-data-models">gender in data models </h2>
 			<ul class="postlist-tags">
 				
-				<li>gender</li>
-				
 				<li>software</li>
 				
-				<li>highlight</li>
-				
 			</ul>
+			<img src="/img/crinkly-mushrooms.jpg" alt="Picture unrelated to post. Some crinkly brown-orange mushrooms in vibrant green grass." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/backend-accessibility/">
+		<a class="postlink" href="/my-favorite-git-flag/">
+			<h2 data-ha-exclude="" id="my-favorite-git-flag">my favorite git flag </h2>
 			
-			<img src="/img/camelCase-print.jpg" alt="A carved stamp next to its print. The print reads &#39;#camelCase&#39; in a slightly formal-looking italic font." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="backend-accessibility">backend accessibility </h2>
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/shelf-mushrooms.jpg" alt="Picture unrelated to post. Creamy beige shelf mushrooms on a mossy tree trunk." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/screen-reader-optimizations/">
+		<a class="postlink" href="/designing-a-bag/">
+			<h2 data-ha-exclude="" id="designing-a-bag">designing a bag </h2>
 			
-			<img src="/img/crow.jpg" alt="Image unrelated to post. A crow poses on driftwood against a whitish sky." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="screen-reader-optimizations">screen reader optimizations </h2>
 			<ul class="postlist-tags">
 				
+				<li>leather</li>
+				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/shoelace-bag.jpg" alt="a 3-image collage showcasing a leather crossbody bag. the leather body is brown and fairly simple. up the narrow sides, rope is laced through grommets in a style resembling a shoe lacing. the rope forms the handle and loops seamlessly through the other side of the bag, joining in one point in a figure-8 follow-through knot. At the bottom corners, there are small diagonal lines of stitching to give the bag a small lip around the base and ensure small objects don&#39;t slide out." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
@@ -1964,6 +1968,6 @@ codeberg  https://codeberg.org/inherentlee/git-intro.git (push)</code></pre>
 </footer>
 
 
-    <!-- This page `/an-intro-to-git/` was built on 2026-04-06T17:26:29.555Z -->
+    <!-- This page `/an-intro-to-git/` was built on 2026-05-04T22:39:21.384Z -->
   </body>
 </html>

_site/anarchy-autism/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="anarchy autism">
+<meta property="og:title" content="anarchy autism | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1495,50 +1501,58 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/nonbinary-flag/">
+		<a class="postlink" href="/printmaking-paper-notes/">
+			<h2 data-ha-exclude="" id="printmaking-paper-notes">printmaking paper notes </h2>
 			
-			<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+			</ul>
+			<img src="/img/killdeer.jpg" alt="Image unrelated to post. A very fluffed up killdeer stands on a rocky beach." loading="lazy" decoding="async" width="1000" height="666">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/queer/">
+			<h2 data-ha-exclude="" id="queer">queer </h2>
 			
-			<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
+				<li>sticker</li>
+				
+				<li>pin</li>
+				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/queer-print.jpg" alt="A print of the word queer in black ink. The letters are rounded with elongated oval negative space." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/brown-creeper/">
+		<a class="postlink" href="/shrimp/">
+			<h2 data-ha-exclude="" id="shrimp">shrimp </h2>
 			
-			<img src="/img/brown-creeper-print.jpg" alt="2 copies of the same print side by side. In yellow, black, and purple ink, a brown creeper, a small bird, is depicted, well camouflaged against a tree trunk." loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="brown-creeper">brown creeper </h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/iris/">
-			
-			<img src="/img/iris-prints.jpg" alt="3 copies of the same print of iris flowers and a bud, done in slightly varied color schemes." loading="lazy" decoding="async" width="1000" height="562">
-			
-			<h2 data-ha-exclude="" id="iris">iris </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
+				<li>sticker</li>
+				
+				<li>pin</li>
+				
 			</ul>
+			<img src="/img/shrimp-print.jpg" alt="A print of a small shrimp with slender little leggies in orange ink." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1573,6 +1587,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/anarchy-autism/` was built on 2026-04-06T17:26:29.530Z -->
+    <!-- This page `/anarchy-autism/` was built on 2026-05-04T22:39:21.364Z -->
   </body>
 </html>

_site/art-shows-and-events/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="art shows and events">
+<meta property="og:title" content="art shows and events | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1509,6 +1515,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/art-shows-and-events/` was built on 2026-04-06T17:26:29.552Z -->
+    <!-- This page `/art-shows-and-events/` was built on 2026-05-04T22:39:21.377Z -->
   </body>
 </html>

_site/artisans-cooperative-cards/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="artisans cooperative cards">
+<meta property="og:title" content="artisans cooperative cards | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1480,27 +1486,27 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/spotted-towhee/">
+		<a class="postlink" href="/swallowtail-on-snowdrops/">
+			<h2 data-ha-exclude="" id="swallowtail-on-snowdrops">swallowtail on snowdrops </h2>
 			
-			<img src="/img/spotted-towhee-print.jpg" alt="A block print of a spotted towhee mid-leap." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="spotted-towhee">spotted towhee </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
+				<li>shirt</li>
+				
 			</ul>
+			<img src="/img/swallowtail-on-snowdrops-print.jpg" alt="A block print of a tiger swallowtail butterfly dangling from Japanese snowdrops, a white drooping flower." loading="lazy" decoding="async" width="1000" height="1332">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/luminescent/">
-			
-			<img src="/img/luminescent-print.jpg" alt="A print of a tattooed woman in bright highlighter yellow underwear." class="blur" loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="luminescent-mature">luminescent (mature)</h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1508,22 +1514,26 @@ export { HeadingAnchors }</script>
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/luminescent-print.jpg" alt="A print of a tattooed woman in bright highlighter yellow underwear." class="blur" loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/bottom-growth/">
+		<a class="postlink" href="/geese/">
+			<h2 data-ha-exclude="" id="geese">geese </h2>
 			
-			<img src="/img/bottom-growth-prints.jpg" alt="4 copies of the same print in various color schemes, laid out in a 2x2 grid. The print shows testosterone-driven bottom growth of a clitoris. The color schemes are, clockwise from top right, brown on turquoise, red on cornsilk (muted yellow), violet on magenta, and mint green on lilac." class="blur" loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="bottom-growth-mature">bottom growth (mature)</h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
-				<li>gender</li>
+				<li>card</li>
+				
+				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/geese-print.jpg" alt="Two Canada geese and their reflections in the water. One is calmly swimming away, while the over leans over and HONKS!" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1558,6 +1568,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/artisans-cooperative-cards/` was built on 2026-04-06T17:26:29.527Z -->
+    <!-- This page `/artisans-cooperative-cards/` was built on 2026-05-04T22:39:21.355Z -->
   </body>
 </html>

_site/artisans-cooperative-shirts/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="artisans cooperative shirts">
+<meta property="og:title" content="artisans cooperative shirts | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1481,11 +1487,45 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/spotted-towhee/">
+		<a class="postlink" href="/happy-bihrtday/">
+			<h2 data-ha-exclude="" id="happy-bihrtday">happy biHRTday </h2>
 			
-			<img src="/img/spotted-towhee-print.jpg" alt="A block print of a spotted towhee mid-leap." loading="lazy" decoding="async" width="1000" height="750">
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>card</li>
+				
+				<li>gender</li>
+				
+			</ul>
+			<img src="/img/happy-bihrtday-card-print.jpg" alt="A card and print in the same design - a bouncy, cheery font reading &#39;happy biHRTday&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/congrats-on-the-gay/">
+			<h2 data-ha-exclude="" id="congrats-on-the-gay">congrats on the gay </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>card</li>
+				
+				<li>gender</li>
+				
+			</ul>
+			<img src="/img/congrats-on-the-gay.jpg" alt="A greeting card reading, in black. &#39;Congrats on the,&#39; and then, in rainbow, &#39;Gay!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/iris/">
+			<h2 data-ha-exclude="" id="iris">iris </h2>
 			
-			<h2 data-ha-exclude="" id="spotted-towhee">spotted towhee </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1493,40 +1533,8 @@ export { HeadingAnchors }</script>
 				<li>card</li>
 				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/greeting-loons/">
+			<img src="/img/iris-prints.jpg" alt="3 copies of the same print of iris flowers and a bud, done in slightly varied color schemes." loading="lazy" decoding="async" width="1000" height="562">
 			
-			<img src="/img/greeting-loons.jpg" alt="A pile of hand-printed A2 size greeting cards. A loon rearing up with outstretched wings spans the front and back of the cards." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="greeting-loons">greeting loons </h2>
-			<ul class="postlist-tags">
-				
-				<li>card</li>
-				
-				<li>print</li>
-				
-				<li>highlight</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/quorbs/">
-			
-			<img src="/img/quorbs-print.jpg" alt="A print in two layers of color showing two rotund quails on a branch. Most of the details are in black ink, then there is a layer with a brown gradient filling in some color on the head and breast." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="quorbs">quorbs </h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-				<li>highlight</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1561,6 +1569,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/artisans-cooperative-shirts/` was built on 2026-04-06T17:26:29.529Z -->
+    <!-- This page `/artisans-cooperative-shirts/` was built on 2026-05-04T22:39:21.363Z -->
   </body>
 </html>

_site/artists-conk/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="artists conk!">
+<meta property="og:title" content="artists conk! | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1486,6 +1492,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/artists-conk/` was built on 2026-04-06T17:26:29.532Z -->
+    <!-- This page `/artists-conk/` was built on 2026-05-04T22:39:21.369Z -->
   </body>
 </html>

_site/azure-locations-and-file-crawling/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="azure locations and file crawling">
+<meta property="og:title" content="azure locations and file crawling | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1704,44 +1710,48 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/intro-to-wireframing/">
+		<a class="postlink" href="/butch-hands-pattern/">
+			<h2 data-ha-exclude="" id="butch-hands-pattern">butch hands pattern </h2>
 			
-			<img src="/img/aggregator-wireframes.jpg" alt="a figma page with 4 major sections titled aggregator, aggregator mobile, aggregator color, and aggregator mobile color. each section has 7 pages in it - all sections pretty clearly have the same 7 pages, with the mobile sections shown on mobile screens and the color sections in a rainbow of pastels rather than grayscale." loading="lazy" decoding="async" width="1000" height="1042">
-			
-			<h2 data-ha-exclude="" id="intro-to-wireframing">intro to wireframing </h2>
 			<ul class="postlist-tags">
 				
-				<li>software</li>
+				<li>knit</li>
+				
+				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/butch-hands.jpg" alt="Hands wearing a pair of pink and grey gloves with convertable mitten tops." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/an-intro-to-git/">
+		<a class="postlink" href="/dragon-mask/">
+			<h2 data-ha-exclude="" id="dragon-mask">dragon mask </h2>
 			
-			<img src="/img/goldeneye-tail.jpg" alt="Image unrelated to post. The tail of a diving duck pokes out from the water with a small splash." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="an-intro-to-git">an intro to git </h2>
 			<ul class="postlist-tags">
 				
-				<li>software</li>
+				<li>leather</li>
+				
+				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/dragon-mask.jpg" alt="lee (a white person with glasses and a side shave) holds up a leather dragon mask in black and dark green. ze sticks hir tongue out at it." loading="lazy" decoding="async" width="1000" height="746">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/handedness-toggle/">
+		<a class="postlink" href="/happy-solstice-2025/">
+			<h2 data-ha-exclude="" id="happy-solstice-2025">happy solstice 2025 </h2>
 			
-			<img src="/img/handedness-toggle-0.png" alt="A screenshot of the rescue trans rescue navbar centered on a button that shows a hand pointing left." loading="lazy" decoding="async" width="1000" height="257">
-			
-			<h2 data-ha-exclude="" id="handedness-toggle">handedness toggle </h2>
 			<ul class="postlist-tags">
 				
-				<li>software</li>
+				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/solstice-2025.jpg" alt="front and back of our solstice card from this year, designed in postcard format. long alt incoming... front - 4 picture collage. 1 - i&#39;m standing in the woods, looking to one side, wearing an elaborate knit scarf. 2 - silhouetted thistle-like flowers in front of a pink-purple sky. 3 - my wife brooke crouches down to draw a heart in charcoal on a beach log, with &#39;L + B&#39; written inside. 4 - brooke stands on a driftwood-covered beach looking hella cool in mirrored shades. our dog kes stands in front of her and looks off to one side eagerly. overlaid is the words &#39;happy solstice&#39; in cursive. back - split down the center like the back of a postcard. on the left side, a 5 picture collage. 1 - i stand on a rock at the edge of a calm alpine lake. overlaid is the words &#39;lee, brooke, kestrel, &amp; the flock&#39; in print lettering. 2 - an early spring fern curl. 3 - our six ducks, all facing to the left, not in a row but still very organized. 4 - brooke grins at the camera while hugging kestrel&#39;s head. kestrel looks maybe a bit distraught. 5 - silhouette of a heron in flight across an early morning blue sky. on the address side, i&#39;ve added a dahlia to represent the stamp, and written &#39;you!&#39; in the field that would normally hold the mailing address." loading="lazy" decoding="async" width="1000" height="1346">
+			
 		</a>
 	</li>
 	
@@ -1776,6 +1786,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/azure-locations-and-file-crawling/` was built on 2026-04-06T17:26:29.551Z -->
+    <!-- This page `/azure-locations-and-file-crawling/` was built on 2026-05-04T22:39:21.377Z -->
   </body>
 </html>

_site/backend-accessibility/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="backend accessibility">
+<meta property="og:title" content="backend accessibility | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1534,46 +1540,48 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/comparing-text-editors/">
+		<a class="postlink" href="/eleventy-lessons/">
+			<h2 data-ha-exclude="" id="eleventy-lessons">eleventy lessons </h2>
 			
-			<img src="/img/horsetail.jpg" alt="Image unrelated to post. Close up on a horsetail plant&#39;s stem, with many small needle-like leaves emerging from all sides of the circular stem at each segmented joint." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="comparing-text-editors">comparing text editors </h2>
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/hellebore.jpg" alt="Image unrelated to post. Close up on a pale green hellebore flower." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/designing-a-bag/">
+		<a class="postlink" href="/gender-in-data-models/">
+			<h2 data-ha-exclude="" id="gender-in-data-models">gender in data models </h2>
 			
-			<img src="/img/shoelace-bag.jpg" alt="a 3-image collage showcasing a leather crossbody bag. the leather body is brown and fairly simple. up the narrow sides, rope is laced through grommets in a style resembling a shoe lacing. the rope forms the handle and loops seamlessly through the other side of the bag, joining in one point in a figure-8 follow-through knot. At the bottom corners, there are small diagonal lines of stitching to give the bag a small lip around the base and ensure small objects don&#39;t slide out." loading="lazy" decoding="async" width="1000" height="1777">
-			
-			<h2 data-ha-exclude="" id="designing-a-bag">designing a bag </h2>
 			<ul class="postlist-tags">
 				
-				<li>leather</li>
+				<li>gender</li>
 				
 				<li>software</li>
 				
+				<li>highlight</li>
+				
 			</ul>
+			<img src="/img/peony.jpg" alt="Image unrelated to post. A light pink peony in full bloom, close up." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/redirections/">
+		<a class="postlink" href="/domain-and-site-setup/">
+			<h2 data-ha-exclude="" id="domain-and-site-setup">domain and site setup </h2>
 			
-			<img src="/img/angle-brackets-uwu.jpg" alt="Ascii art of an emoticon with pinched eyes and a small mouth made with two angle brackets." loading="lazy" decoding="async" width="1000" height="316">
-			
-			<h2 data-ha-exclude="" id="redirections">redirections </h2>
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/crinkly-mushrooms.jpg" alt="Picture unrelated to post. Some crinkly brown-orange mushrooms in vibrant green grass." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1608,6 +1616,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/backend-accessibility/` was built on 2026-04-06T17:26:29.522Z -->
+    <!-- This page `/backend-accessibility/` was built on 2026-05-04T22:39:21.349Z -->
   </body>
 </html>

_site/bag-strap/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="bag strap">
+<meta property="og:title" content="bag strap | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,44 +1479,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/eight-pocket-bifold/">
+		<a class="postlink" href="/vix-collar/">
+			<h2 data-ha-exclude="" id="vix-collar">vix collar </h2>
 			
-			<img src="/img/eight-pocket-bifold.jpg" alt="A 3-picture collage showing a hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a asymmetrical interior with a hidden pocket and 3 card pockets on the right, and a hidden pocket and 2 card pockets on the left. The left front pocket has a small naturally occuring hole." loading="lazy" decoding="async" width="1000" height="1777">
-			
-			<h2 data-ha-exclude="" id="eight-pocket-bifold">eight pocket bifold </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/vix-collar.jpg" alt="A collar rests on a leather-wrapped lighter. It is lined with shearling and built of two other layers of leather - a wider mustard yellow layer and a thinner teal layer over that. the teal layer holds a heart shaped o-ring in place." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/leather-chest-harness/">
+		<a class="postlink" href="/leather-keychains/">
+			<h2 data-ha-exclude="" id="leather-keychains">leather keychains </h2>
 			
-			<img src="/img/leather-chest-harness.jpg" alt="Someone from chin to mid-torso, wearing a dark teal leather chest harness with matte black fittings over a t shirt." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="leather-chest-harness">leather chest harness </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leather-keychains.jpg" alt="A picture of multiple leather keychains sitting on a wood table. Many of them are simple rectangle shapes with stitching around the edge; a few are odd wavy or geometric shapes. A few say things like &#39;MOM&#39; or &#39;EGG&#39;." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/leatherworking-favorites/">
+		<a class="postlink" href="/moss-harness/">
+			<h2 data-ha-exclude="" id="moss-harness">moss harness </h2>
 			
-			<img src="/img/leather-harness-wip.jpg" alt="two pieces of a chest harness sitting on a messy workbench. both pieces are about 8 inches long total and consist of two large o-rings joined by a dark teal leather strap. the o rings and rivets are matte black." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="leatherworking-favorites">leatherworking favorites </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/moss-harness.jpg" alt="A nylon webbing harness in bright teal laid out on a desk." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1545,6 +1551,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/bag-strap/` was built on 2026-04-06T17:26:29.532Z -->
+    <!-- This page `/bag-strap/` was built on 2026-05-04T22:39:21.369Z -->
   </body>
 </html>

_site/baseball-journal/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="baseball journal">
+<meta property="og:title" content="baseball journal | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1484,43 +1490,43 @@ export { HeadingAnchors }</script>
 	
   <li class="post">
 		<a class="postlink" href="/acadia-coloring-journal/">
+			<h2 data-ha-exclude="" id="acadia-coloring-journal">Acadia coloring journal </h2>
 			
+			<ul class="postlist-tags">
+				
+				<li>book</li>
+				
+			</ul>
 			<img src="/img/acadia-coloring-journal.jpg" alt="A five panel collage showcasing a book that is part graph papers of various sizes, and part coloring pages based on Acadia National Park." loading="lazy" decoding="async" width="1000" height="562">
 			
-			<h2 data-ha-exclude="" id="acadia-coloring-journal">Acadia coloring journal </h2>
-			<ul class="postlist-tags">
-				
-				<li>book</li>
-				
-			</ul>
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/leather-strap-journal/">
+		<a class="postlink" href="/green-memo-pad/">
+			<h2 data-ha-exclude="" id="green-memo-pad">green memo pad </h2>
 			
-			<img src="/img/leather-strap-journal.jpg" alt="A 3-part collage showing a blue journal with leather straps woven into the covers." loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="leather-strap-journal">leather strap journal </h2>
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/green-memo-pad.jpg" alt="A three panel collage showcasing a small green memo pad." loading="lazy" decoding="async" width="1000" height="1776">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/orange-journal/">
+		<a class="postlink" href="/flocked-notebook/">
+			<h2 data-ha-exclude="" id="flocked-notebook">flocked notebook </h2>
 			
-			<img src="/img/orange-journal.jpg" alt="A three panel collage showcasing a small book with foldout pages and a bright orange cover." loading="lazy" decoding="async" width="1000" height="1776">
-			
-			<h2 data-ha-exclude="" id="orange-journal">orange journal </h2>
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/flocked-notebook.jpg" alt="A two panel collage showing the cover and endpapers of a thick notebook." loading="lazy" decoding="async" width="1000" height="1331">
+			
 		</a>
 	</li>
 	
@@ -1555,6 +1561,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/baseball-journal/` was built on 2026-04-06T17:26:29.525Z -->
+    <!-- This page `/baseball-journal/` was built on 2026-05-04T22:39:21.352Z -->
   </body>
 </html>

_site/become-unbutterable/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="become unbutterable">
+<meta property="og:title" content="become unbutterable | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1480,54 +1486,52 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/quorbs/">
+		<a class="postlink" href="/loon/">
+			<h2 data-ha-exclude="" id="loon">loon </h2>
 			
-			<img src="/img/quorbs-print.jpg" alt="A print in two layers of color showing two rotund quails on a branch. Most of the details are in black ink, then there is a layer with a brown gradient filling in some color on the head and breast." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="quorbs">quorbs </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
-				<li>highlight</li>
-				
 			</ul>
+			<img src="/img/loon-print.jpg" alt="A print of a loon rearing up with wings spread" loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/fat-raccoon/">
+		<a class="postlink" href="/crow/">
+			<h2 data-ha-exclude="" id="crow">crow </h2>
 			
-			<img src="/img/fat-raccoon-print.jpg" alt="A block print in black ink of a rotund raccoon raising a welcoming paw towards the viewer." loading="lazy" decoding="async" width="1000" height="1333">
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+			</ul>
+			<img src="/img/crow-print.jpg" alt="a block print in dark indigo ink on white paper depicting a perched crow looking over one shoulder. one side of the crow is lit with fine feather detail, and the other side is almost entirely in shadow." loading="lazy" decoding="async" width="1000" height="1333">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/trans-rights-skull/">
+			<h2 data-ha-exclude="" id="trans-rights-skull">trans rights skull </h2>
 			
-			<h2 data-ha-exclude="" id="fat-raccoon">fat raccoon </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
-				<li>shirt</li>
+				<li>sticker</li>
+				
+				<li>pin</li>
+				
+				<li>gender</li>
 				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/stellars-jay/">
+			<img src="/img/trans-rights-print.jpg" alt="A print in mostly black ink of a smiling skull with a speech bubble. In pink and blue, the speech bubble reads &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
 			
-			<img src="/img/stellars-jay-print.jpg" alt="A print of a stellar&#39;s jay, a beautiful black and blue bird, about to take off from a branch" loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="stellars-jay">stellar&#39;s jay </h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-				<li>card</li>
-				
-				<li>shirt</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1562,6 +1566,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/become-unbutterable/` was built on 2026-04-06T17:26:29.516Z -->
+    <!-- This page `/become-unbutterable/` was built on 2026-05-04T22:39:21.314Z -->
   </body>
 </html>

_site/bfl-silk-handspun/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="BFL/silk handspun">
+<meta property="og:title" content="BFL/silk handspun | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1474,43 +1480,43 @@ export { HeadingAnchors }</script>
 	
   <li class="post">
 		<a class="postlink" href="/handcombed-jacobs-handspun/">
+			<h2 data-ha-exclude="" id="handcombed-jacobs-handspun">handcombed jacobs handspun </h2>
 			
+			<ul class="postlist-tags">
+				
+				<li>yarn</li>
+				
+			</ul>
 			<img src="/img/handcombed-jacobs.jpg" alt="a skein of dark grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
 			
-			<h2 data-ha-exclude="" id="handcombed-jacobs-handspun">handcombed jacobs handspun </h2>
-			<ul class="postlist-tags">
-				
-				<li>yarn</li>
-				
-			</ul>
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/charlie-the-alpaca-handspun/">
+		<a class="postlink" href="/petrichor-handspun/">
+			<h2 data-ha-exclude="" id="petrichor-handspun">petrichor handspun </h2>
 			
-			<img src="/img/charlie-alpaca-handspun.jpg" alt="one large skein (and technically a smaller skein hidden behind it) of sheen-y black alpaca handspun, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="charlie-the-alpaca-handspun">charlie the alpaca handspun </h2>
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/petrichor-handspun.jpg" alt="3 skeins of handspun yarn, 2 large and 1 small. the large ones are a rich earth-tone blend of reds, pinks, browns, and hints of green and gold. the smaller skein is similar but with a decidedly greener hue" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/light-grey-jacobs-handspun/">
+		<a class="postlink" href="/handspun-yarn-in-party-mix-and-orange-gold/">
+			<h2 data-ha-exclude="" id="handspun-yarn-in-party-mix-and-orange-gold">handspun yarn in party mix and orange-gold </h2>
 			
-			<img src="/img/light-grey-jacobs.jpg" alt="a skein of light grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="light-grey-jacobs-handspun">light grey jacobs handspun </h2>
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/handspun0.jpg" alt="4 skeins of handspun yarn, two in a somewhat pastel multicolor and two in a blend of orange, gold, and white." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1545,6 +1551,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/bfl-silk-handspun/` was built on 2026-04-06T17:26:29.555Z -->
+    <!-- This page `/bfl-silk-handspun/` was built on 2026-05-04T22:39:21.385Z -->
   </body>
 </html>

_site/big-pidge/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="big pidge">
+<meta property="og:title" content="big pidge | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1490,50 +1496,50 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/pronoun-patches/">
+		<a class="postlink" href="/nonbinary-flag/">
+			<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
 			
-			<img src="/img/pronoun-patch.jpg" alt="Rows of the same design, a skull with a speech bubble announcing varied pronoun sets, repeat in multiple colors along a stretch of off-white fabric." loading="lazy" decoding="async" width="1000" height="562">
-			
-			<h2 data-ha-exclude="" id="pronoun-patches">pronoun patches </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
-				<li>patch</li>
+				<li>card</li>
 				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/hair/">
+		<a class="postlink" href="/shirts/">
+			<h2 data-ha-exclude="" id="shirts">shirts! </h2>
 			
-			<img src="/img/hair-print.jpg" alt="A print in black ink of belly hair." loading="lazy" decoding="async" width="1000" height="710">
-			
-			<h2 data-ha-exclude="" id="hair">hair </h2>
 			<ul class="postlist-tags">
 				
-				<li>print</li>
-				
-				<li>gender</li>
+				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/shirts.jpg" alt="A row of shirts hanging in front of a window, with a variety of hand-printed designs." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/crow/">
+		<a class="postlink" href="/flatfish/">
+			<h2 data-ha-exclude="" id="flatfish">flatfish </h2>
 			
-			<img src="/img/crow-print.jpg" alt="a block print in dark indigo ink on white paper depicting a perched crow looking over one shoulder. one side of the crow is lit with fine feather detail, and the other side is almost entirely in shadow." loading="lazy" decoding="async" width="1000" height="1333">
-			
-			<h2 data-ha-exclude="" id="crow">crow </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
+				<li>card</li>
+				
 			</ul>
+			<img src="/img/flatfish-print.jpg" alt="A print of a simple flatfish design inked in sepia." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
@@ -1568,6 +1574,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/big-pidge/` was built on 2026-04-06T17:26:29.523Z -->
+    <!-- This page `/big-pidge/` was built on 2026-05-04T22:39:21.350Z -->
   </body>
 </html>

_site/block-printing-transfer-method/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="block printing transfer method">
+<meta property="og:title" content="block printing transfer method | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1415,6 +1421,15 @@ export { HeadingAnchors }</script>
       </p>
       
       
+      <ul class="post-tags">
+        
+        <li>
+          
+          <a href="/tags/print/">print</a>
+        </li>
+        
+      </ul>
+      
     </div>
 
     
@@ -1499,6 +1514,66 @@ export { HeadingAnchors }</script>
   
   
   
+  <section class="related-posts">
+    <h2 data-ha-exclude="" id="related-posts">related posts</h2>
+    <ol id="postlist">
+	
+  <li class="post">
+		<a class="postlink" href="/pronoun-patches/">
+			<h2 data-ha-exclude="" id="pronoun-patches">pronoun patches </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>patch</li>
+				
+				<li>gender</li>
+				
+			</ul>
+			<img src="/img/pronoun-patch.jpg" alt="Rows of the same design, a skull with a speech bubble announcing varied pronoun sets, repeat in multiple colors along a stretch of off-white fabric." loading="lazy" decoding="async" width="1000" height="562">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/heron/">
+			<h2 data-ha-exclude="" id="heron">heron </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>card</li>
+				
+				<li>shirt</li>
+				
+			</ul>
+			<img src="/img/heron-print.jpg" alt="A print in black ink of a great blue heron, leaning downwards so that eir beak is level with eir feet." loading="lazy" decoding="async" width="1000" height="1333">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/artisans-cooperative-shirts/">
+			<h2 data-ha-exclude="" id="artisans-cooperative-shirts">artisans cooperative shirts </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>shirt</li>
+				
+				<li>print</li>
+				
+			</ul>
+			<img src="/img/artisans-coop-shirt.jpg" alt="A black tank top laid on a desk. In white ink it reads &#39;Artisans Cooperative&#39; with a print of some chickens and a quail." loading="lazy" decoding="async" width="1000" height="1333">
+			
+		</a>
+	</li>
+	
+</ol>
+
+  </section>
+  
 
 </heading-anchors>
 
@@ -1526,6 +1601,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/block-printing-transfer-method/` was built on 2026-04-06T17:26:29.522Z -->
+    <!-- This page `/block-printing-transfer-method/` was built on 2026-05-04T22:39:21.348Z -->
   </body>
 </html>

_site/blue-and-brown-leather-journal/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="blue and brown leather journal">
+<meta property="og:title" content="blue and brown leather journal | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1489,46 +1495,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/flocked-notebook/">
+		<a class="postlink" href="/striped-journal/">
+			<h2 data-ha-exclude="" id="striped-journal">striped journal </h2>
 			
-			<img src="/img/flocked-notebook.jpg" alt="A two panel collage showing the cover and endpapers of a thick notebook." loading="lazy" decoding="async" width="1000" height="1331">
-			
-			<h2 data-ha-exclude="" id="flocked-notebook">flocked notebook </h2>
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/striped-journal.jpg" alt="A three panel collage showcasing a journal with a striped cover." loading="lazy" decoding="async" width="1000" height="1776">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/brookes-notebook/">
+		<a class="postlink" href="/orange-green-journal/">
+			<h2 data-ha-exclude="" id="orange-green-journal">orange green journal </h2>
 			
-			<img src="/img/brooke-notebook.jpg" alt="A six panel collage showing the covers, endpapers, and some of the pages of a notebook." loading="lazy" decoding="async" width="1000" height="1500">
-			
-			<h2 data-ha-exclude="" id="brookes-notebook">brooke&#39;s notebook </h2>
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
-				<li>highlight</li>
-				
 			</ul>
+			<img src="/img/orange-green-journal.jpg" alt="A 4-part collage of a slim handbound book." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/baseball-journal/">
+		<a class="postlink" href="/leather-strap-journal/">
+			<h2 data-ha-exclude="" id="leather-strap-journal">leather strap journal </h2>
 			
-			<img src="/img/baseball-journal.jpg" alt="A 3-part collage of a leather-covered book with baseball-style stitching across the spine." loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="baseball-journal">baseball journal </h2>
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/leather-strap-journal.jpg" alt="A 3-part collage showing a blue journal with leather straps woven into the covers." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
@@ -1563,6 +1567,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/blue-and-brown-leather-journal/` was built on 2026-04-06T17:26:29.516Z -->
+    <!-- This page `/blue-and-brown-leather-journal/` was built on 2026-05-04T22:39:21.316Z -->
   </body>
 </html>

_site/booby-congrats-on-the-top-surgery/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="booby (congrats on the top surgery)">
+<meta property="og:title" content="booby (congrats on the top surgery) | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1483,52 +1489,50 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/trans-rights-skull/">
+		<a class="postlink" href="/queer-book-list/">
+			<h2 data-ha-exclude="" id="queer-book-list">queer book list </h2>
 			
-			<img src="/img/trans-rights-print.jpg" alt="A print in mostly black ink of a smiling skull with a speech bubble. In pink and blue, the speech bubble reads &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="trans-rights-skull">trans rights skull </h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-				<li>card</li>
-				
-				<li>sticker</li>
-				
-				<li>pin</li>
-				
-				<li>gender</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/tiny-mushrooms/">
-			
-			<img src="/img/pixels-mushrooms.jpg" alt="3 tiny mushroom stamps next to their impressions. They are all about 1 inch square. There is a chanterelle in yellow, a russula in pink, and witch&#39;s hat mycena in indigo." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="tiny-mushrooms">tiny mushrooms </h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/on-pronouns/">
-			
-			<img src="/img/starling.jpg" alt="Image unrelated to post. A starling, a beautifully iridescent black bird, stands on a hanging suet feeder." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="on-pronouns">on pronouns </h2>
 			<ul class="postlist-tags">
 				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/rainbow-books.jpg" alt="A bookshelf with a variety of books on LGBTQ+ themes, arranged roughly in rainbow order" loading="lazy" decoding="async" width="1000" height="562">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/not-a-drill/">
+			<h2 data-ha-exclude="" id="not-a-drill">not a drill </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>shirt</li>
+				
+			</ul>
+			<img src="/img/not-a-drill-print.jpg" alt="A print in dark teal ink depicting a power drill with text in cursive below that reads &#39;ceci n&#39;est pas un exercice&#39; or &#39;this is not a drill&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/kestrel-zine/">
+			<h2 data-ha-exclude="" id="kestrel-zine">kestrel zine </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>zine</li>
+				
+				<li>highlight</li>
+				
+			</ul>
+			<img src="/img/kestrel-zine.jpg" alt="A 5 photo collage showing the front and back cover as well as 3 full spreads of a folded zine about Kestrel, my dog, who is a 65lb Malinois with a goofy smile and floppy ears. it is printed in two layers of color, blue and orange, and each image depicts Kestrel in various posts... alert and watchful, resting, looking mopey, wearing a sweatshirt." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
@@ -1563,6 +1567,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/booby-congrats-on-the-top-surgery/` was built on 2026-04-06T17:26:29.548Z -->
+    <!-- This page `/booby-congrats-on-the-top-surgery/` was built on 2026-05-04T22:39:21.332Z -->
   </body>
 </html>

_site/bottom-growth/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="bottom growth">
+<meta property="og:title" content="bottom growth | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1478,29 +1484,43 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/coming-out/">
+		<a class="postlink" href="/anarchy-autism/">
+			<h2 data-ha-exclude="" id="anarchy-autism">anarchy autism </h2>
 			
-			<img src="/img/coming-out-card-print.jpg" alt="A card and print in the same design - a chick and a broken eggshell, and a simple font reading &#39;congrats on coming out of your shell&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="coming-out">coming out </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
-				<li>card</li>
+				<li>sticker</li>
+				
+				<li>shirt</li>
+				
+				<li>pin</li>
+				
+			</ul>
+			<img src="/img/anarchy-autism-rainbow-print.jpg" alt="A print in rainbow ink that says autism with the anarchy A." loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/fd-signifier-and-oppositional-sexism/">
+			<h2 data-ha-exclude="" id="fd-signifier-and-oppositional-sexism">fd signifier &amp; oppositional sexism </h2>
+			
+			<ul class="postlist-tags">
 				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/sheep.jpg" alt="Image unrelated to post. A mama sheep with two babies curled up next to her in a grassy field." loading="lazy" decoding="async" width="1000" height="450">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/artisans-cooperative-cards/">
+		<a class="postlink" href="/junco/">
+			<h2 data-ha-exclude="" id="junco">junco </h2>
 			
-			<img src="/img/artisans-coop-cards.jpg" alt="2 white greeting cards with the Artisans Cooperative logo, a chicken. One card has a single print of the chicken in black ink, and the other has two overlapping prints in blue and red ink" loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="artisans-cooperative-cards">artisans cooperative cards </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1508,24 +1528,8 @@ export { HeadingAnchors }</script>
 				<li>card</li>
 				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/flicker/">
+			<img src="/img/junco-print.jpg" alt="A print of a junco mid-takeoff from a branch. Eir head is inked in black, body in gray, and the branch in sepia." loading="lazy" decoding="async" width="1000" height="1333">
 			
-			<img src="/img/flicker-print.jpg" alt="A print in black, brown, and red ink of a northern flicker (a type of woodpecker). Viewed from the back, he is looking over his shoulder and upward towards something unseen above him (my bird feeder)." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="flicker">flicker </h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-				<li>card</li>
-				
-				<li>shirt</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1560,6 +1564,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/bottom-growth/` was built on 2026-04-06T17:26:29.545Z -->
+    <!-- This page `/bottom-growth/` was built on 2026-05-04T22:39:21.324Z -->
   </body>
 </html>

_site/bowtie/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="bowtie">
+<meta property="og:title" content="bowtie | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,46 +1479,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/brookes-suspenders/">
+		<a class="postlink" href="/lobstah/">
+			<h2 data-ha-exclude="" id="lobstah">lobstah </h2>
 			
+			<ul class="postlist-tags">
+				
+				<li>leather</li>
+				
+			</ul>
+			<img src="/img/lobstah.jpg" alt="Two red leather lobster ornaments, about 4-5 in long each." loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/long-zipper-bifold/">
+			<h2 data-ha-exclude="" id="long-zipper-bifold">long zipper bifold </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>leather</li>
+				
+			</ul>
+			<img src="/img/long-zipper-bifold.jpg" alt="A collage showing an orange leather wallet with a long zipper running the length of the outside." loading="lazy" decoding="async" width="1000" height="1000">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/brookes-suspenders/">
+			<h2 data-ha-exclude="" id="brookes-suspenders">brooke&#39;s suspenders </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>leather</li>
+				
+			</ul>
 			<img src="/img/brooke-suspenders.jpg" alt="a two image collage showing the front and back of a person, neck to waist. she&#39;s wearing leather suspenders with a button attachment, buckles for adjustment, and a stitched diamond where the straps cross in the back." loading="lazy" decoding="async" width="1000" height="750">
 			
-			<h2 data-ha-exclude="" id="brookes-suspenders">brooke&#39;s suspenders </h2>
-			<ul class="postlist-tags">
-				
-				<li>leather</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/brookes-cuff-bracelets/">
-			
-			<img src="/img/brooke-cuffs.jpg" alt="Olive green leather cuffs with silver spikes and a shearling lining." loading="lazy" decoding="async" width="900" height="1200">
-			
-			<h2 data-ha-exclude="" id="brookes-cuff-bracelets">brooke&#39;s cuff bracelets </h2>
-			<ul class="postlist-tags">
-				
-				<li>leather</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/leather-long-stitch-journals/">
-			
-			<img src="/img/long-stitch-journals.jpg" alt="A stack of hand-bound journals showing long stitches aligned with the spines. They are leather bound and have tie closures." loading="lazy" decoding="async" width="1000" height="1333">
-			
-			<h2 data-ha-exclude="" id="leather-long-stitch-journals">leather long-stitch journals </h2>
-			<ul class="postlist-tags">
-				
-				<li>leather</li>
-				
-				<li>book</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1547,6 +1551,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/bowtie/` was built on 2026-04-06T17:26:29.546Z -->
+    <!-- This page `/bowtie/` was built on 2026-05-04T22:39:21.326Z -->
   </body>
 </html>

_site/boypussy/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="boypussy">
+<meta property="og:title" content="boypussy | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1500,25 +1506,39 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/gender/">
+		<a class="postlink" href="/crow/">
+			<h2 data-ha-exclude="" id="crow">crow </h2>
 			
-			<img src="/img/gender-notes.png" alt="A page of handwritten notes with some loosely drawn charts, described further in the post." loading="lazy" decoding="async" width="865" height="1080">
-			
-			<h2 data-ha-exclude="" id="gender">gender? </h2>
 			<ul class="postlist-tags">
 				
-				<li>gender</li>
+				<li>print</li>
 				
 			</ul>
+			<img src="/img/crow-print.jpg" alt="a block print in dark indigo ink on white paper depicting a perched crow looking over one shoulder. one side of the crow is lit with fine feather detail, and the other side is almost entirely in shadow." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/flicker/">
+		<a class="postlink" href="/rope-one/">
+			<h2 data-ha-exclude="" id="rope-one-mature">rope (one) (mature)</h2>
 			
-			<img src="/img/flicker-print.jpg" alt="A print in black, brown, and red ink of a northern flicker (a type of woodpecker). Viewed from the back, he is looking over his shoulder and upward towards something unseen above him (my bird feeder)." loading="lazy" decoding="async" width="1000" height="750">
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>gender</li>
+				
+			</ul>
+			<img src="/img/rope-print-1.jpg" alt="A print of a nude trans woman in an asymmetrical rope harness." class="blur" loading="lazy" decoding="async" width="1000" height="1242">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/big-pidge/">
+			<h2 data-ha-exclude="" id="big-pidge">big pidge </h2>
 			
-			<h2 data-ha-exclude="" id="flicker">flicker </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1528,22 +1548,8 @@ export { HeadingAnchors }</script>
 				<li>shirt</li>
 				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/luminescent/">
+			<img src="/img/big-pidge-print.jpg" alt="A block print of a superb speciman of pigeon, inked mostly in black but with patches of green, blue, and purple to indicate iridescence." loading="lazy" decoding="async" width="1000" height="750">
 			
-			<img src="/img/luminescent-print.jpg" alt="A print of a tattooed woman in bright highlighter yellow underwear." class="blur" loading="lazy" decoding="async" width="900" height="1200">
-			
-			<h2 data-ha-exclude="" id="luminescent-mature">luminescent (mature)</h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-				<li>gender</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1578,6 +1584,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/boypussy/` was built on 2026-04-06T17:26:29.528Z -->
+    <!-- This page `/boypussy/` was built on 2026-05-04T22:39:21.362Z -->
   </body>
 </html>

_site/brookes-collar/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="brooke&#39;s collar">
+<meta property="og:title" content="brooke&amp;#39;s collar | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,44 +1479,46 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/foldy-wallet/">
+		<a class="postlink" href="/leather-long-stitch-journals/">
+			<h2 data-ha-exclude="" id="leather-long-stitch-journals">leather long-stitch journals </h2>
 			
-			<img src="/img/foldy-wallet.jpg" alt="A four part collage showing a single piece of deep red leather folding up to become a card wallet." loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="foldy-wallet">foldy wallet </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
+				<li>book</li>
+				
 			</ul>
+			<img src="/img/long-stitch-journals.jpg" alt="A stack of hand-bound journals showing long stitches aligned with the spines. They are leather bound and have tie closures." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/vertical-zipper-card-wallet/">
-			
-			<img src="/img/vertical-zipper-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets, a hidden pocket, and a zippered coin pouch." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="vertical-zipper-card-wallet">vertical zipper card wallet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/vertical-zipper-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets, a hidden pocket, and a zippered coin pouch." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/bowtie/">
+		<a class="postlink" href="/sunflower/">
+			<h2 data-ha-exclude="" id="sunflower">sunflower </h2>
 			
-			<img src="/img/bowtie.jpg" alt="A black leather bow tie with black stitching." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="bowtie">bowtie </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/sunflower.jpg" alt="A sunflower made of leather. Many individual natural toned leather petals are sewn onto a brown center ." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1545,6 +1553,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/brookes-collar/` was built on 2026-04-06T17:26:29.533Z -->
+    <!-- This page `/brookes-collar/` was built on 2026-05-04T22:39:21.369Z -->
   </body>
 </html>

_site/brookes-cuff-bracelets/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="brooke&#39;s cuff bracelets">
+<meta property="og:title" content="brooke&amp;#39;s cuff bracelets | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,44 +1479,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/wrap-bracelets/">
+		<a class="postlink" href="/snap-pouch/">
+			<h2 data-ha-exclude="" id="snap-pouch">snap pouch </h2>
 			
+			<ul class="postlist-tags">
+				
+				<li>leather</li>
+				
+			</ul>
+			<img src="/img/snap-pouches.jpg" alt="4 square pouches that close with snaps. 2 have loops that attach keyrings. They are in various colors of leather." loading="lazy" decoding="async" width="900" height="1200">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/wrap-bracelets/">
+			<h2 data-ha-exclude="" id="wrap-bracelets">wrap bracelets </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>leather</li>
+				
+			</ul>
 			<img src="/img/leather-wrap-bracelets.jpg" alt="two wrists, each wearing a black leather wrap bracelet. the upper bracelet is a thin strap wrapped 3 times around the wrist. the lower bracelet wraps twice, with a thicker strap, and has carefully placed spikes that avoid the wrap spots." loading="lazy" decoding="async" width="1000" height="1333">
 			
-			<h2 data-ha-exclude="" id="wrap-bracelets">wrap bracelets </h2>
-			<ul class="postlist-tags">
-				
-				<li>leather</li>
-				
-			</ul>
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/rachels-bracelets/">
+		<a class="postlink" href="/pinatex-wallet-with-zipper/">
+			<h2 data-ha-exclude="" id="pinatex-wallet-with-zipper">piñatex wallet with zipper </h2>
 			
-			<img src="/img/rachel-bracelets.jpg" alt="Two pink leather bracelets with stainless steel hardware and aqua stitching." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="rachels-bracelets">rachel&#39;s bracelets </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/shrimp-cat-toy/">
+			<img src="/img/pinatex-ten-pocket-bifold.jpg" alt="A two-picture collage showing the inside and outside of a wallet made with piñatex, a leather alternative made from pineapple leaves. It is two tone blue with a pink accent and has a zippered pocket built in." loading="lazy" decoding="async" width="1000" height="1331">
 			
-			<img src="/img/two-shrimp.jpg" alt="Two leather shrimp-shaped cat toys. They have long dangly antennae and are stitched in red and orange." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="shrimp-cat-toy">shrimp cat toy </h2>
-			<ul class="postlist-tags">
-				
-				<li>leather</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1545,6 +1551,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/brookes-cuff-bracelets/` was built on 2026-04-06T17:26:29.544Z -->
+    <!-- This page `/brookes-cuff-bracelets/` was built on 2026-05-04T22:39:21.322Z -->
   </body>
 </html>

_site/brookes-notebook/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="brooke&#39;s notebook">
+<meta property="og:title" content="brooke&amp;#39;s notebook | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1488,48 +1494,50 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/leather-strap-journal/">
+		<a class="postlink" href="/little-critter-pouch/">
+			<h2 data-ha-exclude="" id="little-critter-pouch">little critter pouch </h2>
 			
-			<img src="/img/leather-strap-journal.jpg" alt="A 3-part collage showing a blue journal with leather straps woven into the covers." loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="leather-strap-journal">leather strap journal </h2>
 			<ul class="postlist-tags">
 				
-				<li>book</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/orange-green-journal/">
-			
-			<img src="/img/orange-green-journal.jpg" alt="A 4-part collage of a slim handbound book." loading="lazy" decoding="async" width="1000" height="1777">
-			
-			<h2 data-ha-exclude="" id="orange-green-journal">orange green journal </h2>
-			<ul class="postlist-tags">
-				
-				<li>book</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/gender-in-data-models/">
-			
-			<img src="/img/peony.jpg" alt="Image unrelated to post. A light pink peony in full bloom, close up." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="gender-in-data-models">gender in data models </h2>
-			<ul class="postlist-tags">
-				
-				<li>gender</li>
-				
-				<li>software</li>
+				<li>leather</li>
 				
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/little-critter-pouch.jpg" alt="A leather pouch shaped a bit like a d10 but with eight sides. It has a rainbow zippered opening and a wristlet strap." loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/happy-solstice-2025/">
+			<h2 data-ha-exclude="" id="happy-solstice-2025">happy solstice 2025 </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>highlight</li>
+				
+			</ul>
+			<img src="/img/solstice-2025.jpg" alt="front and back of our solstice card from this year, designed in postcard format. long alt incoming... front - 4 picture collage. 1 - i&#39;m standing in the woods, looking to one side, wearing an elaborate knit scarf. 2 - silhouetted thistle-like flowers in front of a pink-purple sky. 3 - my wife brooke crouches down to draw a heart in charcoal on a beach log, with &#39;L + B&#39; written inside. 4 - brooke stands on a driftwood-covered beach looking hella cool in mirrored shades. our dog kes stands in front of her and looks off to one side eagerly. overlaid is the words &#39;happy solstice&#39; in cursive. back - split down the center like the back of a postcard. on the left side, a 5 picture collage. 1 - i stand on a rock at the edge of a calm alpine lake. overlaid is the words &#39;lee, brooke, kestrel, &amp; the flock&#39; in print lettering. 2 - an early spring fern curl. 3 - our six ducks, all facing to the left, not in a row but still very organized. 4 - brooke grins at the camera while hugging kestrel&#39;s head. kestrel looks maybe a bit distraught. 5 - silhouette of a heron in flight across an early morning blue sky. on the address side, i&#39;ve added a dahlia to represent the stamp, and written &#39;you!&#39; in the field that would normally hold the mailing address." loading="lazy" decoding="async" width="1000" height="1346">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/kestrel-zine/">
+			<h2 data-ha-exclude="" id="kestrel-zine">kestrel zine </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>zine</li>
+				
+				<li>highlight</li>
+				
+			</ul>
+			<img src="/img/kestrel-zine.jpg" alt="A 5 photo collage showing the front and back cover as well as 3 full spreads of a folded zine about Kestrel, my dog, who is a 65lb Malinois with a goofy smile and floppy ears. it is printed in two layers of color, blue and orange, and each image depicts Kestrel in various posts... alert and watchful, resting, looking mopey, wearing a sweatshirt." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
@@ -1564,6 +1572,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/brookes-notebook/` was built on 2026-04-06T17:26:29.519Z -->
+    <!-- This page `/brookes-notebook/` was built on 2026-05-04T22:39:21.319Z -->
   </body>
 </html>

_site/brookes-scarf/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="brooke&#39;s scarf">
+<meta property="og:title" content="brooke&amp;#39;s scarf | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1480,46 +1486,48 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/butch-hands-pattern/">
+		<a class="postlink" href="/pride-dice-bags/">
+			<h2 data-ha-exclude="" id="pride-dice-bags">pride dice bags </h2>
 			
-			<img src="/img/butch-hands.jpg" alt="Hands wearing a pair of pink and grey gloves with convertable mitten tops." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="butch-hands-pattern">butch hands pattern </h2>
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
-				<li>highlight</li>
+				<li>gender</li>
 				
 			</ul>
+			<img src="/img/pride-dice-bags.jpg" alt="Several knitted drawstring dice bags sit in front of a bookshelf. They are in different pride flag colors; from right to left (skipping a few duplicates) bisexual, lesbian, nonbinary, trans, and genderqueer. The trans-colored dice bag in the center opens towards the camera, showing a variety of colorful dice inside." loading="lazy" decoding="async" width="1000" height="500">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/knit-shrimp/">
-			
-			<img src="/img/knit-shrimp.jpg" alt="Four knitted shrimp in various shades of pink. They are all somewhere around hand-sized, and have little yarn antennae and leggies." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="knit-shrimp">knit shrimp </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/knit-shrimp.jpg" alt="Four knitted shrimp in various shades of pink. They are all somewhere around hand-sized, and have little yarn antennae and leggies." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/keffiyah-fishing-net-pattern/">
+		<a class="postlink" href="/on-the-shoulders-of-giants/">
+			<h2 data-ha-exclude="" id="on-the-shoulders-of-giants">on the shoulders of giants </h2>
 			
-			<img src="/img/keffiyah-nets.jpg" alt="a knitted swatch. it&#39;s mostly white yarn, but a grid of dark red- purple- green yarn that looks like a chain link fence is built into it. the diagonal lines are achieved with floats of yarn from one row, then picked up and knit into several rows later." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="keffiyah-fishing-net-pattern">keffiyah fishing net pattern </h2>
 			<ul class="postlist-tags">
 				
+				<li>zine</li>
+				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/on-the-shoulders.jpg" alt="ok so. five image collage showing the front, 3 inner spreads, and back of a riso-printed zine in green and light blue. it&#39;s called &#39;on the shoulders of giants&#39; and it&#39;s about a knitting technique I learned from Stephen west and how I built on that technique. it talks about joining two adjacent panels without seaming, instead knitting the second panel onto the selvedge of the first. then it uses that technique to approach two panels knit with significantly different weights of yarn" loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
@@ -1554,6 +1562,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/brookes-scarf/` was built on 2026-04-06T17:26:29.553Z -->
+    <!-- This page `/brookes-scarf/` was built on 2026-05-04T22:39:21.381Z -->
   </body>
 </html>

_site/brookes-socks/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="brooke&#39;s socks">
+<meta property="og:title" content="brooke&amp;#39;s socks | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,46 +1479,46 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/keffiyah-fishing-net-pattern/">
+		<a class="postlink" href="/on-the-shoulders-of-giants/">
+			<h2 data-ha-exclude="" id="on-the-shoulders-of-giants">on the shoulders of giants </h2>
 			
-			<img src="/img/keffiyah-nets.jpg" alt="a knitted swatch. it&#39;s mostly white yarn, but a grid of dark red- purple- green yarn that looks like a chain link fence is built into it. the diagonal lines are achieved with floats of yarn from one row, then picked up and knit into several rows later." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="keffiyah-fishing-net-pattern">keffiyah fishing net pattern </h2>
 			<ul class="postlist-tags">
 				
+				<li>zine</li>
+				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/on-the-shoulders.jpg" alt="ok so. five image collage showing the front, 3 inner spreads, and back of a riso-printed zine in green and light blue. it&#39;s called &#39;on the shoulders of giants&#39; and it&#39;s about a knitting technique I learned from Stephen west and how I built on that technique. it talks about joining two adjacent panels without seaming, instead knitting the second panel onto the selvedge of the first. then it uses that technique to approach two panels knit with significantly different weights of yarn" loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/pride-dice-bags/">
+		<a class="postlink" href="/brookes-scarf/">
+			<h2 data-ha-exclude="" id="brookes-scarf">brooke&#39;s scarf </h2>
 			
-			<img src="/img/pride-dice-bags.jpg" alt="Several knitted drawstring dice bags sit in front of a bookshelf. They are in different pride flag colors; from right to left (skipping a few duplicates) bisexual, lesbian, nonbinary, trans, and genderqueer. The trans-colored dice bag in the center opens towards the camera, showing a variety of colorful dice inside." loading="lazy" decoding="async" width="1000" height="500">
-			
-			<h2 data-ha-exclude="" id="pride-dice-bags">pride dice bags </h2>
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
-				<li>gender</li>
-				
 			</ul>
+			<img src="/img/brooke-scarf.jpg" alt="A diaphanous knit lacework scarf draped over the back of a chair. It is split down the long way into two colors - one tinted orange and one tinted mint blue. Both colors, the orange and the blue, are held double with the same variegated gray, making the piece more cohesive. The yarn overs in the lacework create airy repeating holes." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/acadia-mitts/">
-			
-			<img src="/img/acadia-mitts.jpg" alt="a hand wearing a knitted fingerless mitten. it&#39;s knit in a slubby, almost tweedy yarn, with the body being blue grey stockinette and the cuffs and tips a vibrant green rib." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="acadia-mitts">acadia mitts </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/acadia-mitts.jpg" alt="a hand wearing a knitted fingerless mitten. it&#39;s knit in a slubby, almost tweedy yarn, with the body being blue grey stockinette and the cuffs and tips a vibrant green rib." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
@@ -1547,6 +1553,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/brookes-socks/` was built on 2026-04-06T17:26:29.518Z -->
+    <!-- This page `/brookes-socks/` was built on 2026-05-04T22:39:21.318Z -->
   </body>
 </html>

_site/brookes-suspenders/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="brooke&#39;s suspenders">
+<meta property="og:title" content="brooke&amp;#39;s suspenders | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,44 +1479,48 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/zipper-bifold-green/">
+		<a class="postlink" href="/sunflower/">
+			<h2 data-ha-exclude="" id="sunflower">sunflower </h2>
 			
-			<img src="/img/zipper-bifold-green.jpg" alt="A collage showing a green leather wallet with a zippered pocket built into one external side." loading="lazy" decoding="async" width="1000" height="1332">
-			
-			<h2 data-ha-exclude="" id="zipper-bifold-green">zipper bifold (green) </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/sunflower.jpg" alt="A sunflower made of leather. Many individual natural toned leather petals are sewn onto a brown center ." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/aarons-mask/">
+		<a class="postlink" href="/dragon-mask/">
+			<h2 data-ha-exclude="" id="dragon-mask">dragon mask </h2>
 			
-			<img src="/img/aaron-mask.jpg" alt="A brown/grey leather mask of a long snouted dog with visible teeth and red detailing." loading="lazy" decoding="async" width="900" height="1200">
-			
-			<h2 data-ha-exclude="" id="aarons-mask">aaron&#39;s mask </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
+				<li>highlight</li>
+				
 			</ul>
+			<img src="/img/dragon-mask.jpg" alt="lee (a white person with glasses and a side shave) holds up a leather dragon mask in black and dark green. ze sticks hir tongue out at it." loading="lazy" decoding="async" width="1000" height="746">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/leather-keychains/">
+		<a class="postlink" href="/fishhook-pride-keychains/">
+			<h2 data-ha-exclude="" id="fishhook-pride-keychains">fishhook pride keychains </h2>
 			
-			<img src="/img/leather-keychains.jpg" alt="A picture of multiple leather keychains sitting on a wood table. Many of them are simple rectangle shapes with stitching around the edge; a few are odd wavy or geometric shapes. A few say things like &#39;MOM&#39; or &#39;EGG&#39;." loading="lazy" decoding="async" width="1000" height="1333">
-			
-			<h2 data-ha-exclude="" id="leather-keychains">leather keychains </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
+				<li>gender</li>
+				
 			</ul>
+			<img src="/img/fishhook-keychain-nonbinary.jpg" alt="a keychain with an iridescent fishhook style attachment linked via leather to an iridescent keyring. the leather is stitched with nonbinary flag colors." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1545,6 +1555,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/brookes-suspenders/` was built on 2026-04-06T17:26:29.553Z -->
+    <!-- This page `/brookes-suspenders/` was built on 2026-05-04T22:39:21.380Z -->
   </body>
 </html>

_site/brown-creeper/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="brown creeper">
+<meta property="og:title" content="brown creeper | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1474,45 +1480,43 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/chanterelle/">
+		<a class="postlink" href="/foxgloves/">
+			<h2 data-ha-exclude="" id="foxgloves">foxgloves </h2>
 			
-			<img src="/img/chanterelle-print.jpg" alt="A print of two chanterelle mushrooms inked in a dark-to-light yellow gradient." loading="lazy" decoding="async" width="1000" height="1333">
-			
-			<h2 data-ha-exclude="" id="chanterelle">chanterelle </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
+				<li>shirt</li>
+				
 			</ul>
+			<img src="/img/foxgloves-print.jpg" alt="A print of a cluster of foxgloves. The background is inked in green, with negative space and pink details making up the foxgloves." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/slightly-weird-man-club/">
+		<a class="postlink" href="/rope-one/">
+			<h2 data-ha-exclude="" id="rope-one-mature">rope (one) (mature)</h2>
 			
-			<img src="/img/slightly-weird-man-club-print.jpg" alt="A print that reads &#39;slightly weird man club&#39; in a nonbinary flag colored gradient" loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="slightly-weird-man-club">slightly weird man club </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
-				<li>shirt</li>
-				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/rope-print-1.jpg" alt="A print of a nude trans woman in an asymmetrical rope harness." class="blur" loading="lazy" decoding="async" width="1000" height="1242">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/fat-raccoon/">
+		<a class="postlink" href="/flicker/">
+			<h2 data-ha-exclude="" id="flicker">flicker </h2>
 			
-			<img src="/img/fat-raccoon-print.jpg" alt="A block print in black ink of a rotund raccoon raising a welcoming paw towards the viewer." loading="lazy" decoding="async" width="1000" height="1333">
-			
-			<h2 data-ha-exclude="" id="fat-raccoon">fat raccoon </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1522,6 +1526,8 @@ export { HeadingAnchors }</script>
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/flicker-print.jpg" alt="A print in black, brown, and red ink of a northern flicker (a type of woodpecker). Viewed from the back, he is looking over his shoulder and upward towards something unseen above him (my bird feeder)." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1556,6 +1562,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/brown-creeper/` was built on 2026-04-06T17:26:29.550Z -->
+    <!-- This page `/brown-creeper/` was built on 2026-05-04T22:39:21.338Z -->
   </body>
 </html>

_site/butch-hands-pattern/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="butch hands pattern">
+<meta property="og:title" content="butch hands pattern | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1554,42 +1560,10 @@ export { HeadingAnchors }</script>
     <h2 data-ha-exclude="" id="related-posts">related posts</h2>
     <ol id="postlist">
 	
-  <li class="post">
-		<a class="postlink" href="/brookes-scarf/">
-			
-			<img src="/img/brooke-scarf.jpg" alt="A diaphanous knit lacework scarf draped over the back of a chair. It is split down the long way into two colors - one tinted orange and one tinted mint blue. Both colors, the orange and the blue, are held double with the same variegated gray, making the piece more cohesive. The yarn overs in the lacework create airy repeating holes." loading="lazy" decoding="async" width="1000" height="1333">
-			
-			<h2 data-ha-exclude="" id="brookes-scarf">brooke&#39;s scarf </h2>
-			<ul class="postlist-tags">
-				
-				<li>knit</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/pride-dice-bags/">
-			
-			<img src="/img/pride-dice-bags.jpg" alt="Several knitted drawstring dice bags sit in front of a bookshelf. They are in different pride flag colors; from right to left (skipping a few duplicates) bisexual, lesbian, nonbinary, trans, and genderqueer. The trans-colored dice bag in the center opens towards the camera, showing a variety of colorful dice inside." loading="lazy" decoding="async" width="1000" height="500">
-			
-			<h2 data-ha-exclude="" id="pride-dice-bags">pride dice bags </h2>
-			<ul class="postlist-tags">
-				
-				<li>knit</li>
-				
-				<li>gender</li>
-				
-			</ul>
-		</a>
-	</li>
-	
   <li class="post">
 		<a class="postlink" href="/quorbs/">
-			
-			<img src="/img/quorbs-print.jpg" alt="A print in two layers of color showing two rotund quails on a branch. Most of the details are in black ink, then there is a layer with a brown gradient filling in some color on the head and breast." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="quorbs">quorbs </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1597,6 +1571,38 @@ export { HeadingAnchors }</script>
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/quorbs-print.jpg" alt="A print in two layers of color showing two rotund quails on a branch. Most of the details are in black ink, then there is a layer with a brown gradient filling in some color on the head and breast." loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/azure-locations-and-file-crawling/">
+			<h2 data-ha-exclude="" id="azure-locations-and-file-crawling">azure locations and file crawling </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>software</li>
+				
+				<li>highlight</li>
+				
+			</ul>
+			<img src="/img/azure-locations.jpg" alt="A Linux terminal. There is a fun rainbow flag in ascii art at the top, and then the user has called a command asking Azure for a list of locations applicable to a specific resource type. The output is lengthy." loading="lazy" decoding="async" width="1000" height="827">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/knit-shrimp/">
+			<h2 data-ha-exclude="" id="knit-shrimp">knit shrimp </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>knit</li>
+				
+			</ul>
+			<img src="/img/knit-shrimp.jpg" alt="Four knitted shrimp in various shades of pink. They are all somewhere around hand-sized, and have little yarn antennae and leggies." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1631,6 +1637,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/butch-hands-pattern/` was built on 2026-04-06T17:26:29.520Z -->
+    <!-- This page `/butch-hands-pattern/` was built on 2026-05-04T22:39:21.342Z -->
   </body>
 </html>

_site/chanterelle/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="chanterelle">
+<meta property="og:title" content="chanterelle | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1485,54 +1491,58 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/slightly-weird-man-club/">
+		<a class="postlink" href="/iris/">
+			<h2 data-ha-exclude="" id="iris">iris </h2>
 			
-			<img src="/img/slightly-weird-man-club-print.jpg" alt="A print that reads &#39;slightly weird man club&#39; in a nonbinary flag colored gradient" loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="slightly-weird-man-club">slightly weird man club </h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-				<li>shirt</li>
-				
-				<li>gender</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/fix-your-hearts/">
-			
-			<img src="/img/fix-your-hearts-print.jpg" alt="2 copies of the same print, one in black ink and one in dark teal. The print is text that reads &#39;fix your hearts or die&#39;, with the text shaped into a somewhat long and narrow heart." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="fix-your-hearts">fix your hearts </h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/shrimp/">
-			
-			<img src="/img/shrimp-print.jpg" alt="A print of a small shrimp with slender little leggies in orange ink." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="shrimp">shrimp </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
+			</ul>
+			<img src="/img/iris-prints.jpg" alt="3 copies of the same print of iris flowers and a bud, done in slightly varied color schemes." loading="lazy" decoding="async" width="1000" height="562">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/boypussy/">
+			<h2 data-ha-exclude="" id="boypussy-mature">boypussy (mature)</h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
 				<li>sticker</li>
 				
+				<li>shirt</li>
+				
 				<li>pin</li>
 				
+				<li>gender</li>
+				
 			</ul>
+			<img src="/img/boypussy-shirt.jpg" alt="A butch holding a chainsaw and wearing a tank top that reads boypussy in pink Barbie font." class="blur" loading="lazy" decoding="async" width="1000" height="1250">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/geese/">
+			<h2 data-ha-exclude="" id="geese">geese </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>card</li>
+				
+				<li>shirt</li>
+				
+			</ul>
+			<img src="/img/geese-print.jpg" alt="Two Canada geese and their reflections in the water. One is calmly swimming away, while the over leans over and HONKS!" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1567,6 +1577,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/chanterelle/` was built on 2026-04-06T17:26:29.520Z -->
+    <!-- This page `/chanterelle/` was built on 2026-05-04T22:39:21.342Z -->
   </body>
 </html>

_site/charlie-the-alpaca-handspun/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="charlie the alpaca handspun">
+<meta property="og:title" content="charlie the alpaca handspun | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,44 +1479,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/orion-handspun/">
+		<a class="postlink" href="/petrichor-handspun/">
+			<h2 data-ha-exclude="" id="petrichor-handspun">petrichor handspun </h2>
 			
+			<ul class="postlist-tags">
+				
+				<li>yarn</li>
+				
+			</ul>
+			<img src="/img/petrichor-handspun.jpg" alt="3 skeins of handspun yarn, 2 large and 1 small. the large ones are a rich earth-tone blend of reds, pinks, browns, and hints of green and gold. the smaller skein is similar but with a decidedly greener hue" loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/orion-handspun/">
+			<h2 data-ha-exclude="" id="orion-handspun">orion handspun </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>yarn</li>
+				
+			</ul>
 			<img src="/img/orion-handspun.jpg" alt="3 skeins of handspun yarn, 1 large and 2 small. One of the small skeins is a little more inconsistent weight than the other two - this one was spun on drop spindle about 2 years ago. The other two are about a sport or maybe a DK weight. All three are a gold colorway with tiny hints of orange and a pale light green." loading="lazy" decoding="async" width="1000" height="666">
 			
-			<h2 data-ha-exclude="" id="orion-handspun">orion handspun </h2>
-			<ul class="postlist-tags">
-				
-				<li>yarn</li>
-				
-			</ul>
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/spinners-dream-handspun/">
+		<a class="postlink" href="/spinning-plants/">
+			<h2 data-ha-exclude="" id="spinning-plants">spinning plants </h2>
 			
-			<img src="/img/spinners-dream-handspun.jpg" alt="a skein of a lightly variegated grey yarn in about a sport or DK weight." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="spinners-dream-handspun">spinner&#39;s dream handspun </h2>
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/handspun-yarn-in-party-mix-and-orange-gold/">
+			<img src="/img/plant-handspun.jpg" alt="6 small skeins of handspun yarn, each made from a different plant fiber. from top, we have flax (medium brown, rough); what is probably lotus (golden, shiny and soft); banana (white and semi shiny); hemp (light brown, rough); tencel (white and very shiny); ramie (a particularly small skein, white and semi shiny)" loading="lazy" decoding="async" width="1000" height="874">
 			
-			<img src="/img/handspun0.jpg" alt="4 skeins of handspun yarn, two in a somewhat pastel multicolor and two in a blend of orange, gold, and white." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="handspun-yarn-in-party-mix-and-orange-gold">handspun yarn in party mix and orange-gold </h2>
-			<ul class="postlist-tags">
-				
-				<li>yarn</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1545,6 +1551,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/charlie-the-alpaca-handspun/` was built on 2026-04-06T17:26:29.556Z -->
+    <!-- This page `/charlie-the-alpaca-handspun/` was built on 2026-05-04T22:39:21.388Z -->
   </body>
 </html>

_site/circle-bag/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="circle bag">
+<meta property="og:title" content="circle bag | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,44 +1479,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/vertical-zipper-card-wallet/">
+		<a class="postlink" href="/soras-collar/">
+			<h2 data-ha-exclude="" id="soras-collar">sora&#39;s collar </h2>
 			
-			<img src="/img/vertical-zipper-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets, a hidden pocket, and a zippered coin pouch." loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="vertical-zipper-card-wallet">vertical zipper card wallet </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/sora-collar.jpg" alt="A collage showing a red and black leather dog collar tooled with roses and the name Sora. It&#39;s fully stitched with dark red stitching and has brass hardware." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/gradient-purse-strap/">
+		<a class="postlink" href="/leather-chest-harness/">
+			<h2 data-ha-exclude="" id="leather-chest-harness">leather chest harness </h2>
 			
-			<img src="/img/gradient-purse-strap.jpg" alt="a coiled up purse strap in gradient cool colors - we can see green, teal, indigo, and a slightly pinkish purple. It has brass hardware and is stiched along its length with cream stitches." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="gradient-purse-strap">gradient purse strap </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leather-chest-harness.jpg" alt="Someone from chin to mid-torso, wearing a dark teal leather chest harness with matte black fittings over a t shirt." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/sunflower/">
+		<a class="postlink" href="/x-acto-knife-sheath/">
+			<h2 data-ha-exclude="" id="x-acto-knife-sheath">x-acto knife sheath </h2>
 			
-			<img src="/img/sunflower.jpg" alt="A sunflower made of leather. Many individual natural toned leather petals are sewn onto a brown center ." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="sunflower">sunflower </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/knife-sheaths.jpg" alt="Several blades with leather sheaths, and a few extra sheaths. There&#39;s a #2 blade with an orange sheath with yellow stitching, a #11 blade with a blue sheath with light grey stitching, and a skiving knife with a plum sheath and pink stitching." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1545,6 +1551,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/circle-bag/` was built on 2026-04-06T17:26:29.535Z -->
+    <!-- This page `/circle-bag/` was built on 2026-05-04T22:39:21.371Z -->
   </body>
 </html>

_site/colophon/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="colophon">
+<meta property="og:title" content="colophon | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -219,6 +219,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -849,12 +855,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -888,7 +894,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -945,7 +951,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -977,7 +983,7 @@ export { HeadingAnchors }</script>
 <heading-anchors content="<i class='fa-solid fa-anchor'></i>">
   <h1 id="colophon">colophon</h1>
 
-  <p>This is v2 of my personal website, build with <a href="https://www.11ty.dev/" target="_blank" rel="external">Eleventy v3.1.2</a>. It's been hand-coded from the ground up.</p>
+  <p>This is v2 of my personal website, built with <a href="https://www.11ty.dev/" target="_blank" rel="external">Eleventy v3.1.2</a> and hosted by <a href="https://heckin.technology/" target="_blank" rel="external">heckin' technology</a>. It's been hand-coded from the ground up.</p>
 <p>v1 of this site began in 2022 and was based on <a href="https://lenpaul.github.io/Millennial/" target="_blank" rel="external">Millennial</a>, a minimalist Jekyll theme for running a blog or publication by Paul Le.</p>
 <p>The fonts are <a href="https://brailleinstitute.org/freefont" target="_blank" rel="external">Atkinson Hyperlegible Next and Atkinson Hyperlegible Mono</a> for standard text and monospace respectively, specifically designed for low-vision readers to improve character recognition. Also they look neat :)</p>
 <p>Thank you to some lovely friends for their feedback and help with the site! You should hire them. Yes, you.</p>
@@ -985,7 +991,7 @@ export { HeadingAnchors }</script>
 <li><a href="http://www.wondra.codes/" target="_blank" rel="external">Lenny</a>, especially for their HTML/CSS and accessibility expertise</li>
 <li><a href="https://shirgoldberg.com/" target="_blank" rel="external">Shir</a></li>
 </ul>
-<p>You can <a href="/accessibility">find the accessibility statement here</a>. You can also <a href="/sitemap.xml">explore the sitemap</a>. If you'd like, you can view the <a href="/palette">site's palette</a> or the <a href="/style">style overview</a>.</p>
+<p>You can <a href="/accessibility">find the accessibility statement here</a>. If you'd like, you can view the <a href="/palette">site's palette</a> or the <a href="/style">style overview</a>. You can also <a href="/sitemap.xml">explore the sitemap</a>.</p>
 <p>This site is created <a href="https://declare-ai.org/1.0.0/none.html" target="_blank" rel="external">without the use of generative AI</a>.</p>
 
 </heading-anchors>
@@ -1014,6 +1020,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/colophon/` was built on 2026-04-06T17:26:29.558Z -->
+    <!-- This page `/colophon/` was built on 2026-05-04T22:39:21.392Z -->
   </body>
 </html>

_site/coming-out/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="coming out">
+<meta property="og:title" content="coming out | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1489,50 +1495,50 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/quorbs/">
+		<a class="postlink" href="/brown-creeper/">
+			<h2 data-ha-exclude="" id="brown-creeper">brown creeper </h2>
 			
-			<img src="/img/quorbs-print.jpg" alt="A print in two layers of color showing two rotund quails on a branch. Most of the details are in black ink, then there is a layer with a brown gradient filling in some color on the head and breast." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="quorbs">quorbs </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
+			</ul>
+			<img src="/img/brown-creeper-print.jpg" alt="2 copies of the same print side by side. In yellow, black, and purple ink, a brown creeper, a small bird, is depicted, well camouflaged against a tree trunk." loading="lazy" decoding="async" width="1000" height="1000">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/greeting-loons/">
+			<h2 data-ha-exclude="" id="greeting-loons">greeting loons </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>card</li>
+				
+				<li>print</li>
+				
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/greeting-loons.jpg" alt="A pile of hand-printed A2 size greeting cards. A loon rearing up with outstretched wings spans the front and back of the cards." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/swallowtail-on-snowdrops/">
+		<a class="postlink" href="/killdeer/">
+			<h2 data-ha-exclude="" id="killdeer">killdeer </h2>
 			
-			<img src="/img/swallowtail-on-snowdrops-print.jpg" alt="A block print of a tiger swallowtail butterfly dangling from Japanese snowdrops, a white drooping flower." loading="lazy" decoding="async" width="1000" height="1332">
-			
-			<h2 data-ha-exclude="" id="swallowtail-on-snowdrops">swallowtail on snowdrops </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
-				<li>shirt</li>
-				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/in-the-news/">
+			<img src="/img/killdeer-print.jpg" alt="A print of a killdeer in black ink." loading="lazy" decoding="async" width="1000" height="1333">
 			
-			<img src="/img/shrimp-knitting.jpg" alt="Picture unrelated to post. Lee, sitting in a chair and seen in profile, looks up and smiles. Ze is holding and working on a partially knit shrimp." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="in-the-news">in the news </h2>
-			<ul class="postlist-tags">
-				
-				<li>gender</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1567,6 +1573,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/coming-out/` was built on 2026-04-06T17:26:29.527Z -->
+    <!-- This page `/coming-out/` was built on 2026-05-04T22:39:21.361Z -->
   </body>
 </html>

_site/comparing-text-editors/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="comparing text editors">
+<meta property="og:title" content="comparing text editors | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1694,26 +1700,10 @@ export { HeadingAnchors }</script>
     <h2 data-ha-exclude="" id="related-posts">related posts</h2>
     <ol id="postlist">
 	
-  <li class="post">
-		<a class="postlink" href="/backend-accessibility/">
-			
-			<img src="/img/camelCase-print.jpg" alt="A carved stamp next to its print. The print reads &#39;#camelCase&#39; in a slightly formal-looking italic font." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="backend-accessibility">backend accessibility </h2>
-			<ul class="postlist-tags">
-				
-				<li>software</li>
-				
-			</ul>
-		</a>
-	</li>
-	
   <li class="post">
 		<a class="postlink" href="/gender-in-data-models/">
-			
-			<img src="/img/peony.jpg" alt="Image unrelated to post. A light pink peony in full bloom, close up." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="gender-in-data-models">gender in data models </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>gender</li>
@@ -1723,20 +1713,38 @@ export { HeadingAnchors }</script>
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/peony.jpg" alt="Image unrelated to post. A light pink peony in full bloom, close up." loading="lazy" decoding="async" width="1000" height="666">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/designing-a-bag/">
+			<h2 data-ha-exclude="" id="designing-a-bag">designing a bag </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>leather</li>
+				
+				<li>software</li>
+				
+			</ul>
+			<img src="/img/shoelace-bag.jpg" alt="a 3-image collage showcasing a leather crossbody bag. the leather body is brown and fairly simple. up the narrow sides, rope is laced through grommets in a style resembling a shoe lacing. the rope forms the handle and loops seamlessly through the other side of the bag, joining in one point in a figure-8 follow-through knot. At the bottom corners, there are small diagonal lines of stitching to give the bag a small lip around the base and ensure small objects don&#39;t slide out." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/intro-to-wireframing/">
-			
-			<img src="/img/aggregator-wireframes.jpg" alt="a figma page with 4 major sections titled aggregator, aggregator mobile, aggregator color, and aggregator mobile color. each section has 7 pages in it - all sections pretty clearly have the same 7 pages, with the mobile sections shown on mobile screens and the color sections in a rainbow of pastels rather than grayscale." loading="lazy" decoding="async" width="1000" height="1042">
-			
 			<h2 data-ha-exclude="" id="intro-to-wireframing">intro to wireframing </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/aggregator-wireframes.jpg" alt="a figma page with 4 major sections titled aggregator, aggregator mobile, aggregator color, and aggregator mobile color. each section has 7 pages in it - all sections pretty clearly have the same 7 pages, with the mobile sections shown on mobile screens and the color sections in a rainbow of pastels rather than grayscale." loading="lazy" decoding="async" width="1000" height="1042">
+			
 		</a>
 	</li>
 	
@@ -1771,6 +1779,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/comparing-text-editors/` was built on 2026-04-06T17:26:29.555Z -->
+    <!-- This page `/comparing-text-editors/` was built on 2026-05-04T22:39:21.384Z -->
   </body>
 </html>

_site/congrats-on-the-autism-adhd/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="congrats on the autism/adhd">
+<meta property="og:title" content="congrats on the autism/adhd | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1486,27 +1492,9 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/luminescent/">
+		<a class="postlink" href="/big-pidge/">
+			<h2 data-ha-exclude="" id="big-pidge">big pidge </h2>
 			
-			<img src="/img/luminescent-print.jpg" alt="A print of a tattooed woman in bright highlighter yellow underwear." class="blur" loading="lazy" decoding="async" width="900" height="1200">
-			
-			<h2 data-ha-exclude="" id="luminescent-mature">luminescent (mature)</h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-				<li>gender</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/foxgloves/">
-			
-			<img src="/img/foxgloves-print.jpg" alt="A print of a cluster of foxgloves. The background is inked in green, with negative space and pink details making up the foxgloves." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="foxgloves">foxgloves </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1516,15 +1504,15 @@ export { HeadingAnchors }</script>
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/big-pidge-print.jpg" alt="A block print of a superb speciman of pigeon, inked mostly in black but with patches of green, blue, and purple to indicate iridescence." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/artisans-cooperative-shirts/">
-			
-			<img src="/img/artisans-coop-shirt.jpg" alt="A black tank top laid on a desk. In white ink it reads &#39;Artisans Cooperative&#39; with a print of some chickens and a quail." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="artisans-cooperative-shirts">artisans cooperative shirts </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>shirt</li>
@@ -1532,6 +1520,24 @@ export { HeadingAnchors }</script>
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/artisans-coop-shirt.jpg" alt="A black tank top laid on a desk. In white ink it reads &#39;Artisans Cooperative&#39; with a print of some chickens and a quail." loading="lazy" decoding="async" width="1000" height="1333">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/seedling/">
+			<h2 data-ha-exclude="" id="seedling">seedling </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>card</li>
+				
+			</ul>
+			<img src="/img/seedling-print.jpg" alt="A print of a 3-stage design of a green seedling barely open, starting to straighten up, and growing strong, with little piles of dirt beneath each one." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
@@ -1566,6 +1572,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/congrats-on-the-autism-adhd/` was built on 2026-04-06T17:26:29.516Z -->
+    <!-- This page `/congrats-on-the-autism-adhd/` was built on 2026-05-04T22:39:21.314Z -->
   </body>
 </html>

_site/congrats-on-the-gay/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="congrats on the gay">
+<meta property="og:title" content="congrats on the gay | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1492,27 +1498,47 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/five-of-them/">
+		<a class="postlink" href="/hair/">
+			<h2 data-ha-exclude="" id="hair">hair </h2>
 			
-			<img src="/img/five-of-them-print.jpg" alt="A block print of five mule deer grazing in a dark green field. The deer are partially negative space and partially brown ink detailing." loading="lazy" decoding="async" width="1000" height="594">
-			
-			<h2 data-ha-exclude="" id="five-of-them">five of them </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
-				<li>shirt</li>
+				<li>gender</li>
 				
 			</ul>
+			<img src="/img/hair-print.jpg" alt="A print in black ink of belly hair." loading="lazy" decoding="async" width="1000" height="710">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/artisans-cooperative-cards/">
+		<a class="postlink" href="/trans-rights-skull/">
+			<h2 data-ha-exclude="" id="trans-rights-skull">trans rights skull </h2>
 			
-			<img src="/img/artisans-coop-cards.jpg" alt="2 white greeting cards with the Artisans Cooperative logo, a chicken. One card has a single print of the chicken in black ink, and the other has two overlapping prints in blue and red ink" loading="lazy" decoding="async" width="1000" height="1000">
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>card</li>
+				
+				<li>sticker</li>
+				
+				<li>pin</li>
+				
+				<li>gender</li>
+				
+			</ul>
+			<img src="/img/trans-rights-print.jpg" alt="A print in mostly black ink of a smiling skull with a speech bubble. In pink and blue, the speech bubble reads &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/congrats-on-the-autism-adhd/">
+			<h2 data-ha-exclude="" id="congrats-on-the-autism-adhd">congrats on the autism/adhd </h2>
 			
-			<h2 data-ha-exclude="" id="artisans-cooperative-cards">artisans cooperative cards </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1520,20 +1546,8 @@ export { HeadingAnchors }</script>
 				<li>card</li>
 				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/tiny-mushrooms/">
+			<img src="/img/congrats-on-the.jpg" alt="4 greeting cards propped up on a keyboard. On the right hand side, two cards read &#39;Congrats on the Autism&#39;; one in rainbow ink and one in black ink with a glittery gold shadow. On the left, two cards read &#39;Congrats on the ADHD&#39;; one in red and one in black, both with glittery pink shadows." loading="lazy" decoding="async" width="1000" height="562">
 			
-			<img src="/img/pixels-mushrooms.jpg" alt="3 tiny mushroom stamps next to their impressions. They are all about 1 inch square. There is a chanterelle in yellow, a russula in pink, and witch&#39;s hat mycena in indigo." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="tiny-mushrooms">tiny mushrooms </h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1568,6 +1582,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/congrats-on-the-gay/` was built on 2026-04-06T17:26:29.519Z -->
+    <!-- This page `/congrats-on-the-gay/` was built on 2026-05-04T22:39:21.341Z -->
   </body>
 </html>

_site/contact/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="contact">
+<meta property="og:title" content="contact | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -219,6 +219,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -849,12 +855,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -888,7 +894,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -945,7 +951,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -980,11 +986,11 @@ export { HeadingAnchors }</script>
   <h2 id="contact-me">contact me</h2>
 <dl>
     <dt><i aria-hidden="true" class="fa-brands fa-signal-messenger"></i> signal</dt>
-    <dd><a href="https://signal.me/#eu/PcJ86iNQeAbC-SFbxqI00gFQb6zL4Y6QDCsFDU2mokM4K40djsdNYa3hJAee79ll">inherentlee.13</a></dd>
+    <dd><a href="https://signal.me/#eu/_-MvyOMcylLFTslDIzJnJkc4Yg1G_hpQt5wf-DVxS0ei4WhimMZLJYd_e28kcNCL">seven seven four, two four nine, zero five eight six</a></dd>
     <dt><i aria-hidden="true" class="fa-solid fa-envelope"></i> email</dt>
     <dd><a href="mailto:lee.cattarin@gmail.com" target="_blank">lee dot cattarin at gmail dot com</a></dd>
     <dt><i aria-hidden="true" class="fa-solid fa-mobile-retro"></i> text (no phone calls!)</dt>
-    <dd>seven seven four, two four nine, zero five eight six</dd>
+    <dd><a href="tel:17742490586">seven seven four, two four nine, zero five eight six</a></dd>
     <dt><i aria-hidden="true" class="fa-brands fa-discord"></i> discord</dt>
     <dd>inherentlee</dd>
     <dt><i aria-hidden="true" class="fa-solid fa-envelopes-bulk"></i> snail mail</dt>
@@ -1094,6 +1100,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/contact/` was built on 2026-04-06T17:26:29.559Z -->
+    <!-- This page `/contact/` was built on 2026-05-04T22:39:21.393Z -->
   </body>
 </html>

_site/coral-reef-handspun/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="coral reef handspun">
+<meta property="og:title" content="coral reef handspun | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1472,45 +1478,45 @@ export { HeadingAnchors }</script>
     <h2 data-ha-exclude="" id="related-posts">related posts</h2>
     <ol id="postlist">
 	
-  <li class="post">
-		<a class="postlink" href="/fire-and-ice-handspun/">
-			
-			<img src="/img/fire-ice-handspun.jpg" alt="2 skeins, one large and one small, of a heathered orange yarn with hints of blue in about a DK or worsted weight." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="fire-and-ice-handspun">fire &amp; ice handspun </h2>
-			<ul class="postlist-tags">
-				
-				<li>yarn</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/petrichor-handspun/">
-			
-			<img src="/img/petrichor-handspun.jpg" alt="3 skeins of handspun yarn, 2 large and 1 small. the large ones are a rich earth-tone blend of reds, pinks, browns, and hints of green and gold. the smaller skein is similar but with a decidedly greener hue" loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="petrichor-handspun">petrichor handspun </h2>
-			<ul class="postlist-tags">
-				
-				<li>yarn</li>
-				
-			</ul>
-		</a>
-	</li>
-	
   <li class="post">
 		<a class="postlink" href="/ruby-the-alpaca-handspun/">
+			<h2 data-ha-exclude="" id="ruby-the-alpaca-handspun">ruby the alpaca handspun </h2>
 			
+			<ul class="postlist-tags">
+				
+				<li>yarn</li>
+				
+			</ul>
 			<img src="/img/ruby-alpaca-handspun.jpg" alt="one large skein and two smaller skeins of a rich chocolatey brown alpaca handspun, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
 			
-			<h2 data-ha-exclude="" id="ruby-the-alpaca-handspun">ruby the alpaca handspun </h2>
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/spinners-dream-handspun/">
+			<h2 data-ha-exclude="" id="spinners-dream-handspun">spinner&#39;s dream handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/spinners-dream-handspun.jpg" alt="a skein of a lightly variegated grey yarn in about a sport or DK weight." loading="lazy" decoding="async" width="1000" height="666">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/light-grey-jacobs-handspun/">
+			<h2 data-ha-exclude="" id="light-grey-jacobs-handspun">light grey jacobs handspun </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>yarn</li>
+				
+			</ul>
+			<img src="/img/light-grey-jacobs.jpg" alt="a skein of light grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
@@ -1545,6 +1551,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/coral-reef-handspun/` was built on 2026-04-06T17:26:29.555Z -->
+    <!-- This page `/coral-reef-handspun/` was built on 2026-05-04T22:39:21.386Z -->
   </body>
 </html>

_site/crow/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="crow">
+<meta property="og:title" content="crow | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1472,54 +1478,50 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/hair/">
+		<a class="postlink" href="/stellars-jay/">
+			<h2 data-ha-exclude="" id="stellars-jay">stellar&#39;s jay </h2>
 			
-			<img src="/img/hair-print.jpg" alt="A print in black ink of belly hair." loading="lazy" decoding="async" width="1000" height="710">
-			
-			<h2 data-ha-exclude="" id="hair">hair </h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-				<li>gender</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/queer/">
-			
-			<img src="/img/queer-print.jpg" alt="A print of the word queer in black ink. The letters are rounded with elongated oval negative space." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="queer">queer </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
-				<li>sticker</li>
-				
-				<li>pin</li>
-				
-				<li>gender</li>
+				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/stellars-jay-print.jpg" alt="A print of a stellar&#39;s jay, a beautiful black and blue bird, about to take off from a branch" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/printmaking-paper-notes/">
+		<a class="postlink" href="/brown-creeper/">
+			<h2 data-ha-exclude="" id="brown-creeper">brown creeper </h2>
 			
-			<img src="/img/killdeer.jpg" alt="Image unrelated to post. A very fluffed up killdeer stands on a rocky beach." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="printmaking-paper-notes">printmaking paper notes </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/brown-creeper-print.jpg" alt="2 copies of the same print side by side. In yellow, black, and purple ink, a brown creeper, a small bird, is depicted, well camouflaged against a tree trunk." loading="lazy" decoding="async" width="1000" height="1000">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/chanterelle/">
+			<h2 data-ha-exclude="" id="chanterelle">chanterelle </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>card</li>
+				
+			</ul>
+			<img src="/img/chanterelle-print.jpg" alt="A print of two chanterelle mushrooms inked in a dark-to-light yellow gradient." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
@@ -1554,6 +1556,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/crow/` was built on 2026-04-06T17:26:29.557Z -->
+    <!-- This page `/crow/` was built on 2026-05-04T22:39:21.389Z -->
   </body>
 </html>

_site/designing-a-bag/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="designing a bag">
+<meta property="og:title" content="designing a bag | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1489,46 +1495,46 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/little-critter-pouch/">
+		<a class="postlink" href="/leather-chest-harness/">
+			<h2 data-ha-exclude="" id="leather-chest-harness">leather chest harness </h2>
 			
-			<img src="/img/little-critter-pouch.jpg" alt="A leather pouch shaped a bit like a d10 but with eight sides. It has a rainbow zippered opening and a wristlet strap." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="little-critter-pouch">little critter pouch </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
+			</ul>
+			<img src="/img/leather-chest-harness.jpg" alt="Someone from chin to mid-torso, wearing a dark teal leather chest harness with matte black fittings over a t shirt." loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/wrap-bracelets/">
+			<h2 data-ha-exclude="" id="wrap-bracelets">wrap bracelets </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>leather</li>
+				
+			</ul>
+			<img src="/img/leather-wrap-bracelets.jpg" alt="two wrists, each wearing a black leather wrap bracelet. the upper bracelet is a thin strap wrapped 3 times around the wrist. the lower bracelet wraps twice, with a thicker strap, and has carefully placed spikes that avoid the wrap spots." loading="lazy" decoding="async" width="1000" height="1333">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/azure-locations-and-file-crawling/">
+			<h2 data-ha-exclude="" id="azure-locations-and-file-crawling">azure locations and file crawling </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>software</li>
+				
 				<li>highlight</li>
 				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/aarons-mask/">
+			<img src="/img/azure-locations.jpg" alt="A Linux terminal. There is a fun rainbow flag in ascii art at the top, and then the user has called a command asking Azure for a list of locations applicable to a specific resource type. The output is lengthy." loading="lazy" decoding="async" width="1000" height="827">
 			
-			<img src="/img/aaron-mask.jpg" alt="A brown/grey leather mask of a long snouted dog with visible teeth and red detailing." loading="lazy" decoding="async" width="900" height="1200">
-			
-			<h2 data-ha-exclude="" id="aarons-mask">aaron&#39;s mask </h2>
-			<ul class="postlist-tags">
-				
-				<li>leather</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/makers-mark-keychain/">
-			
-			<img src="/img/makers-mark-keychain.jpg" alt="A keychain on an iridescent rainbow split ring. It is dark brown/grey leather and has LEE CAT ART stamped into it." loading="lazy" decoding="async" width="1000" height="1333">
-			
-			<h2 data-ha-exclude="" id="makers-mark-keychain">maker&#39;s mark keychain </h2>
-			<ul class="postlist-tags">
-				
-				<li>leather</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1563,6 +1569,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/designing-a-bag/` was built on 2026-04-06T17:26:29.553Z -->
+    <!-- This page `/designing-a-bag/` was built on 2026-05-04T22:39:21.380Z -->
   </body>
 </html>

_site/domain-and-site-setup/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="domain and site setup">
+<meta property="og:title" content="domain and site setup | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1524,48 +1530,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/gender-in-data-models/">
+		<a class="postlink" href="/moving-images/">
+			<h2 data-ha-exclude="" id="moving-images">moving images </h2>
 			
-			<img src="/img/peony.jpg" alt="Image unrelated to post. A light pink peony in full bloom, close up." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="gender-in-data-models">gender in data models </h2>
 			<ul class="postlist-tags">
 				
-				<li>gender</li>
-				
 				<li>software</li>
 				
-				<li>highlight</li>
-				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/moving-images/">
-			
 			<img src="/img/cormorant.jpg" alt="Image unrelated to post. A cormorant, a type of black waterfowl, poses with wings spread on a buoy in Puget Sound. Off to the left, another bird floats." loading="lazy" decoding="async" width="1000" height="666">
 			
-			<h2 data-ha-exclude="" id="moving-images">moving images </h2>
-			<ul class="postlist-tags">
-				
-				<li>software</li>
-				
-			</ul>
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/screen-reader-optimizations/">
+		<a class="postlink" href="/an-intro-to-git/">
+			<h2 data-ha-exclude="" id="an-intro-to-git">an intro to git </h2>
 			
-			<img src="/img/crow.jpg" alt="Image unrelated to post. A crow poses on driftwood against a whitish sky." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="screen-reader-optimizations">screen reader optimizations </h2>
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/goldeneye-tail.jpg" alt="Image unrelated to post. The tail of a diving duck pokes out from the water with a small splash." loading="lazy" decoding="async" width="1000" height="666">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/comparing-text-editors/">
+			<h2 data-ha-exclude="" id="comparing-text-editors">comparing text editors </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>software</li>
+				
+			</ul>
+			<img src="/img/horsetail.jpg" alt="Image unrelated to post. Close up on a horsetail plant&#39;s stem, with many small needle-like leaves emerging from all sides of the circular stem at each segmented joint." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
@@ -1600,6 +1602,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/domain-and-site-setup/` was built on 2026-04-06T17:26:29.532Z -->
+    <!-- This page `/domain-and-site-setup/` was built on 2026-05-04T22:39:21.368Z -->
   </body>
 </html>

_site/double-bill-pocket-bifold/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="double bill pocket bifold">
+<meta property="og:title" content="double bill pocket bifold | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,44 +1479,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/leather-lighter-case/">
+		<a class="postlink" href="/rachels-bracelets/">
+			<h2 data-ha-exclude="" id="rachels-bracelets">rachel&#39;s bracelets </h2>
 			
+			<ul class="postlist-tags">
+				
+				<li>leather</li>
+				
+			</ul>
+			<img src="/img/rachel-bracelets.jpg" alt="Two pink leather bracelets with stainless steel hardware and aqua stitching." loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/mousie/">
+			<h2 data-ha-exclude="" id="mousie">mousie </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>leather</li>
+				
+			</ul>
+			<img src="/img/mousie.jpg" alt="A cat in a sunbeam snuggles a little leather mouse-shaped cat toy." loading="lazy" decoding="async" width="1000" height="1499">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/leather-lighter-case/">
+			<h2 data-ha-exclude="" id="leather-lighter-case">leather lighter case </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>leather</li>
+				
+			</ul>
 			<img src="/img/leather-lighter-case.jpg" alt="A bic lighter wrapped in leather and hand-stitched up one side." loading="lazy" decoding="async" width="1000" height="750">
 			
-			<h2 data-ha-exclude="" id="leather-lighter-case">leather lighter case </h2>
-			<ul class="postlist-tags">
-				
-				<li>leather</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/shrimp-cat-toy/">
-			
-			<img src="/img/two-shrimp.jpg" alt="Two leather shrimp-shaped cat toys. They have long dangly antennae and are stitched in red and orange." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="shrimp-cat-toy">shrimp cat toy </h2>
-			<ul class="postlist-tags">
-				
-				<li>leather</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/vertical-card-wallet/">
-			
-			<img src="/img/vertical-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets and 1 interior pocket." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="vertical-card-wallet">vertical card wallet </h2>
-			<ul class="postlist-tags">
-				
-				<li>leather</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1545,6 +1551,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/double-bill-pocket-bifold/` was built on 2026-04-06T17:26:29.531Z -->
+    <!-- This page `/double-bill-pocket-bifold/` was built on 2026-05-04T22:39:21.366Z -->
   </body>
 </html>

_site/dragon-mask/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="dragon mask">
+<meta property="og:title" content="dragon mask | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1478,44 +1484,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/sunflower/">
+		<a class="postlink" href="/lobstah/">
+			<h2 data-ha-exclude="" id="lobstah">lobstah </h2>
 			
-			<img src="/img/sunflower.jpg" alt="A sunflower made of leather. Many individual natural toned leather petals are sewn onto a brown center ." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="sunflower">sunflower </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/lobstah.jpg" alt="Two red leather lobster ornaments, about 4-5 in long each." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/mom-bag/">
+		<a class="postlink" href="/leather-chest-harness/">
+			<h2 data-ha-exclude="" id="leather-chest-harness">leather chest harness </h2>
 			
-			<img src="/img/mom-bag.jpg" alt="A leather bag sized for a large smartphone with a main pocket and a wraparound smaller pocket. It has a magnetic clasp." loading="lazy" decoding="async" width="900" height="1200">
-			
-			<h2 data-ha-exclude="" id="mom-bag">mom bag </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leather-chest-harness.jpg" alt="Someone from chin to mid-torso, wearing a dark teal leather chest harness with matte black fittings over a t shirt." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/x-acto-knife-sheath/">
+		<a class="postlink" href="/nine-pocket-bifold/">
+			<h2 data-ha-exclude="" id="nine-pocket-bifold">nine pocket bifold </h2>
 			
-			<img src="/img/knife-sheaths.jpg" alt="Several blades with leather sheaths, and a few extra sheaths. There&#39;s a #2 blade with an orange sheath with yellow stitching, a #11 blade with a blue sheath with light grey stitching, and a skiving knife with a plum sheath and pink stitching." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="x-acto-knife-sheath">x-acto knife sheath </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/nine-pocket-bifold.jpg" alt="A hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a symmetrical interior with a hidden pocket and 3 card pockets on each side." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1550,6 +1556,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/dragon-mask/` was built on 2026-04-06T17:26:29.553Z -->
+    <!-- This page `/dragon-mask/` was built on 2026-05-04T22:39:21.381Z -->
   </body>
 </html>

_site/dyeing-fiber/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="dyeing fiber">
+<meta property="og:title" content="dyeing fiber | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1472,45 +1478,45 @@ export { HeadingAnchors }</script>
     <h2 data-ha-exclude="" id="related-posts">related posts</h2>
     <ol id="postlist">
 	
-  <li class="post">
-		<a class="postlink" href="/hand-dyed-gold-handspun/">
-			
-			<img src="/img/gold-handspun.jpg" alt="3 skeins, one small and two large, of a rich golden-orange handspun with light tonal effects, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="hand-dyed-gold-handspun">hand-dyed gold handspun </h2>
-			<ul class="postlist-tags">
-				
-				<li>yarn</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/light-grey-jacobs-handspun/">
-			
-			<img src="/img/light-grey-jacobs.jpg" alt="a skein of light grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="light-grey-jacobs-handspun">light grey jacobs handspun </h2>
-			<ul class="postlist-tags">
-				
-				<li>yarn</li>
-				
-			</ul>
-		</a>
-	</li>
-	
   <li class="post">
 		<a class="postlink" href="/handspun-yarn-in-party-mix-and-orange-gold/">
+			<h2 data-ha-exclude="" id="handspun-yarn-in-party-mix-and-orange-gold">handspun yarn in party mix and orange-gold </h2>
 			
+			<ul class="postlist-tags">
+				
+				<li>yarn</li>
+				
+			</ul>
 			<img src="/img/handspun0.jpg" alt="4 skeins of handspun yarn, two in a somewhat pastel multicolor and two in a blend of orange, gold, and white." loading="lazy" decoding="async" width="1000" height="750">
 			
-			<h2 data-ha-exclude="" id="handspun-yarn-in-party-mix-and-orange-gold">handspun yarn in party mix and orange-gold </h2>
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/rambouillet-handspun/">
+			<h2 data-ha-exclude="" id="rambouillet-handspun">rambouillet handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/rambouillet-handspun.jpg" alt="1 large and 2 small skeins of handspun yarn in a sport or DK weight that has been dyed in light and dark teal, green, and rusty green-gold." loading="lazy" decoding="async" width="1000" height="666">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/orion-handspun/">
+			<h2 data-ha-exclude="" id="orion-handspun">orion handspun </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>yarn</li>
+				
+			</ul>
+			<img src="/img/orion-handspun.jpg" alt="3 skeins of handspun yarn, 1 large and 2 small. One of the small skeins is a little more inconsistent weight than the other two - this one was spun on drop spindle about 2 years ago. The other two are about a sport or maybe a DK weight. All three are a gold colorway with tiny hints of orange and a pale light green." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
@@ -1545,6 +1551,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/dyeing-fiber/` was built on 2026-04-06T17:26:29.556Z -->
+    <!-- This page `/dyeing-fiber/` was built on 2026-05-04T22:39:21.386Z -->
   </body>
 </html>

_site/ecommerce-options/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="ecommerce options">
+<meta property="og:title" content="ecommerce options | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1527,6 +1533,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/ecommerce-options/` was built on 2026-04-06T17:26:29.529Z -->
+    <!-- This page `/ecommerce-options/` was built on 2026-05-04T22:39:21.364Z -->
   </body>
 </html>

_site/eight-pocket-bifold/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="eight pocket bifold">
+<meta property="og:title" content="eight pocket bifold | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,44 +1479,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/lobstah/">
+		<a class="postlink" href="/nine-pocket-bifold/">
+			<h2 data-ha-exclude="" id="nine-pocket-bifold">nine pocket bifold </h2>
 			
-			<img src="/img/lobstah.jpg" alt="Two red leather lobster ornaments, about 4-5 in long each." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="lobstah">lobstah </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/nine-pocket-bifold.jpg" alt="A hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a symmetrical interior with a hidden pocket and 3 card pockets on each side." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/leather-lighter-case/">
+		<a class="postlink" href="/zipper-bifold-green/">
+			<h2 data-ha-exclude="" id="zipper-bifold-green">zipper bifold (green) </h2>
 			
-			<img src="/img/leather-lighter-case.jpg" alt="A bic lighter wrapped in leather and hand-stitched up one side." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="leather-lighter-case">leather lighter case </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/zipper-bifold-green.jpg" alt="A collage showing a green leather wallet with a zippered pocket built into one external side." loading="lazy" decoding="async" width="1000" height="1332">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/leatherworking-favorites/">
+		<a class="postlink" href="/mom-bag/">
+			<h2 data-ha-exclude="" id="mom-bag">mom bag </h2>
 			
-			<img src="/img/leather-harness-wip.jpg" alt="two pieces of a chest harness sitting on a messy workbench. both pieces are about 8 inches long total and consist of two large o-rings joined by a dark teal leather strap. the o rings and rivets are matte black." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="leatherworking-favorites">leatherworking favorites </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/mom-bag.jpg" alt="A leather bag sized for a large smartphone with a main pocket and a wraparound smaller pocket. It has a magnetic clasp." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
@@ -1545,6 +1551,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/eight-pocket-bifold/` was built on 2026-04-06T17:26:29.531Z -->
+    <!-- This page `/eight-pocket-bifold/` was built on 2026-05-04T22:39:21.366Z -->
   </body>
 </html>

_site/eleventy-lessons/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="eleventy lessons">
+<meta property="og:title" content="eleventy lessons | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1764,46 +1770,44 @@ eleventyExcludeFromCollections: true
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/designing-a-bag/">
+		<a class="postlink" href="/redirections/">
+			<h2 data-ha-exclude="" id="redirections">redirections </h2>
 			
-			<img src="/img/shoelace-bag.jpg" alt="a 3-image collage showcasing a leather crossbody bag. the leather body is brown and fairly simple. up the narrow sides, rope is laced through grommets in a style resembling a shoe lacing. the rope forms the handle and loops seamlessly through the other side of the bag, joining in one point in a figure-8 follow-through knot. At the bottom corners, there are small diagonal lines of stitching to give the bag a small lip around the base and ensure small objects don&#39;t slide out." loading="lazy" decoding="async" width="1000" height="1777">
-			
-			<h2 data-ha-exclude="" id="designing-a-bag">designing a bag </h2>
 			<ul class="postlist-tags">
 				
-				<li>leather</li>
-				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/angle-brackets-uwu.jpg" alt="Ascii art of an emoticon with pinched eyes and a small mouth made with two angle brackets." loading="lazy" decoding="async" width="1000" height="316">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/comparing-text-editors/">
+		<a class="postlink" href="/screen-reader-optimizations/">
+			<h2 data-ha-exclude="" id="screen-reader-optimizations">screen reader optimizations </h2>
 			
-			<img src="/img/horsetail.jpg" alt="Image unrelated to post. Close up on a horsetail plant&#39;s stem, with many small needle-like leaves emerging from all sides of the circular stem at each segmented joint." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="comparing-text-editors">comparing text editors </h2>
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/crow.jpg" alt="Image unrelated to post. A crow poses on driftwood against a whitish sky." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/intro-to-wireframing/">
+		<a class="postlink" href="/moving-images/">
+			<h2 data-ha-exclude="" id="moving-images">moving images </h2>
 			
-			<img src="/img/aggregator-wireframes.jpg" alt="a figma page with 4 major sections titled aggregator, aggregator mobile, aggregator color, and aggregator mobile color. each section has 7 pages in it - all sections pretty clearly have the same 7 pages, with the mobile sections shown on mobile screens and the color sections in a rainbow of pastels rather than grayscale." loading="lazy" decoding="async" width="1000" height="1042">
-			
-			<h2 data-ha-exclude="" id="intro-to-wireframing">intro to wireframing </h2>
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/cormorant.jpg" alt="Image unrelated to post. A cormorant, a type of black waterfowl, poses with wings spread on a buoy in Puget Sound. Off to the left, another bird floats." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
@@ -1838,6 +1842,6 @@ eleventyExcludeFromCollections: true
 </footer>
 
 
-    <!-- This page `/eleventy-lessons/` was built on 2026-04-06T17:26:29.557Z -->
+    <!-- This page `/eleventy-lessons/` was built on 2026-05-04T22:39:21.389Z -->
   </body>
 </html>

_site/euphorbia/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="euphorbia">
+<meta property="og:title" content="euphorbia | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,50 +1479,56 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/luminescent/">
+		<a class="postlink" href="/greeting-loons/">
+			<h2 data-ha-exclude="" id="greeting-loons">greeting loons </h2>
 			
-			<img src="/img/luminescent-print.jpg" alt="A print of a tattooed woman in bright highlighter yellow underwear." class="blur" loading="lazy" decoding="async" width="900" height="1200">
-			
-			<h2 data-ha-exclude="" id="luminescent-mature">luminescent (mature)</h2>
 			<ul class="postlist-tags">
 				
+				<li>card</li>
+				
 				<li>print</li>
 				
-				<li>gender</li>
+				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/greeting-loons.jpg" alt="A pile of hand-printed A2 size greeting cards. A loon rearing up with outstretched wings spans the front and back of the cards." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/fix-your-hearts/">
-			
-			<img src="/img/fix-your-hearts-print.jpg" alt="2 copies of the same print, one in black ink and one in dark teal. The print is text that reads &#39;fix your hearts or die&#39;, with the text shaped into a somewhat long and narrow heart." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="fix-your-hearts">fix your hearts </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/fix-your-hearts-print.jpg" alt="2 copies of the same print, one in black ink and one in dark teal. The print is text that reads &#39;fix your hearts or die&#39;, with the text shaped into a somewhat long and narrow heart." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/geese/">
+		<a class="postlink" href="/trans-rights-skull/">
+			<h2 data-ha-exclude="" id="trans-rights-skull">trans rights skull </h2>
 			
-			<img src="/img/geese-print.jpg" alt="Two Canada geese and their reflections in the water. One is calmly swimming away, while the over leans over and HONKS!" loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="geese">geese </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
-				<li>shirt</li>
+				<li>sticker</li>
+				
+				<li>pin</li>
+				
+				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-rights-print.jpg" alt="A print in mostly black ink of a smiling skull with a speech bubble. In pink and blue, the speech bubble reads &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1551,6 +1563,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/euphorbia/` was built on 2026-04-06T17:26:29.549Z -->
+    <!-- This page `/euphorbia/` was built on 2026-05-04T22:39:21.334Z -->
   </body>
 </html>

_site/fat-raccoon/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="fat raccoon">
+<meta property="og:title" content="fat raccoon | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1490,45 +1496,41 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/greeting-loons/">
+		<a class="postlink" href="/tiny-portraits/">
+			<h2 data-ha-exclude="" id="tiny-portraits">tiny portraits </h2>
 			
-			<img src="/img/greeting-loons.jpg" alt="A pile of hand-printed A2 size greeting cards. A loon rearing up with outstretched wings spans the front and back of the cards." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="greeting-loons">greeting loons </h2>
 			<ul class="postlist-tags">
 				
-				<li>card</li>
-				
 				<li>print</li>
 				
-				<li>highlight</li>
-				
 			</ul>
+			<img src="/img/tiny-portrait-stamps.jpg" alt="A collage showing various small (around an inch) stamps that depict people or animals." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/seedling/">
+		<a class="postlink" href="/stellars-jay/">
+			<h2 data-ha-exclude="" id="stellars-jay">stellar&#39;s jay </h2>
 			
-			<img src="/img/seedling-print.jpg" alt="A print of a 3-stage design of a green seedling barely open, starting to straighten up, and growing strong, with little piles of dirt beneath each one." loading="lazy" decoding="async" width="1000" height="1333">
-			
-			<h2 data-ha-exclude="" id="seedling">seedling </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
+				<li>shirt</li>
+				
 			</ul>
+			<img src="/img/stellars-jay-print.jpg" alt="A print of a stellar&#39;s jay, a beautiful black and blue bird, about to take off from a branch" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/queer/">
+		<a class="postlink" href="/trans-wrongs-skull/">
+			<h2 data-ha-exclude="" id="trans-wrongs-skull">trans wrongs skull </h2>
 			
-			<img src="/img/queer-print.jpg" alt="A print of the word queer in black ink. The letters are rounded with elongated oval negative space." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="queer">queer </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1542,6 +1544,8 @@ export { HeadingAnchors }</script>
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-wrongs-print.jpg" alt="A smiling skull with devil horns and a little spiked tail, and a speech bubble reading &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1576,6 +1580,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/fat-raccoon/` was built on 2026-04-06T17:26:29.523Z -->
+    <!-- This page `/fat-raccoon/` was built on 2026-05-04T22:39:21.350Z -->
   </body>
 </html>

_site/fd-signifier-and-oppositional-sexism/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="fd signifier &amp; oppositional sexism">
+<meta property="og:title" content="fd signifier &amp;amp; oppositional sexism | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1507,60 +1513,50 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/boypussy/">
+		<a class="postlink" href="/trans-the-world/">
+			<h2 data-ha-exclude="" id="trans-the-world">trans the world </h2>
 			
-			<img src="/img/boypussy-shirt.jpg" alt="A butch holding a chainsaw and wearing a tank top that reads boypussy in pink Barbie font." class="blur" loading="lazy" decoding="async" width="1000" height="1250">
-			
-			<h2 data-ha-exclude="" id="boypussy-mature">boypussy (mature)</h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
-				<li>sticker</li>
-				
 				<li>shirt</li>
 				
-				<li>pin</li>
-				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-the-world-print.jpg" alt="A print that reads &#39;trans the world&#39; surrounding an image of a globe and a trans symbol. It&#39;s in a ping-to-blue gradient." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/gender-in-data-models/">
+		<a class="postlink" href="/pride-dice-bags/">
+			<h2 data-ha-exclude="" id="pride-dice-bags">pride dice bags </h2>
 			
-			<img src="/img/peony.jpg" alt="Image unrelated to post. A light pink peony in full bloom, close up." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="gender-in-data-models">gender in data models </h2>
 			<ul class="postlist-tags">
 				
+				<li>knit</li>
+				
 				<li>gender</li>
 				
-				<li>software</li>
-				
-				<li>highlight</li>
-				
 			</ul>
+			<img src="/img/pride-dice-bags.jpg" alt="Several knitted drawstring dice bags sit in front of a bookshelf. They are in different pride flag colors; from right to left (skipping a few duplicates) bisexual, lesbian, nonbinary, trans, and genderqueer. The trans-colored dice bag in the center opens towards the camera, showing a variety of colorful dice inside." loading="lazy" decoding="async" width="1000" height="500">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/nonbinary-flag/">
+		<a class="postlink" href="/give-to-trans-orgs-and-people/">
+			<h2 data-ha-exclude="" id="give-to-trans-orgs-and-people">give to trans orgs and people </h2>
 			
-			<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
 			<ul class="postlist-tags">
 				
-				<li>print</li>
-				
-				<li>card</li>
-				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/bouquet.jpg" alt="Image unrelated to post. A close up on a flower bouquet in shades of purple, pink, and white. Centered is a large, almost soft-looking pink flower that is still partially closed up." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1595,6 +1591,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/fd-signifier-and-oppositional-sexism/` was built on 2026-04-06T17:26:29.547Z -->
+    <!-- This page `/fd-signifier-and-oppositional-sexism/` was built on 2026-05-04T22:39:21.330Z -->
   </body>
 </html>

_site/fedizinefest-2025/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="fediZineFest 2025">
+<meta property="og:title" content="fediZineFest 2025 | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1472,12 +1478,42 @@ export { HeadingAnchors }</script>
     <h2 data-ha-exclude="" id="related-posts">related posts</h2>
     <ol id="postlist">
 	
+  <li class="post">
+		<a class="postlink" href="/gender-as-a-proxy-variable/">
+			<h2 data-ha-exclude="" id="gender-as-a-proxy-variable">gender as a proxy variable </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>gender</li>
+				
+				<li>zine</li>
+				
+			</ul>
+			<img src="/img/gender-zine-cover.png" alt="Part of a scan of the cover of my zine, Gender as a Proxy Variable. It shows the title and a bit of handsewn binding." loading="lazy" decoding="async" width="1000" height="444">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/on-the-shoulders-of-giants/">
+			<h2 data-ha-exclude="" id="on-the-shoulders-of-giants">on the shoulders of giants </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>zine</li>
+				
+				<li>knit</li>
+				
+			</ul>
+			<img src="/img/on-the-shoulders.jpg" alt="ok so. five image collage showing the front, 3 inner spreads, and back of a riso-printed zine in green and light blue. it&#39;s called &#39;on the shoulders of giants&#39; and it&#39;s about a knitting technique I learned from Stephen west and how I built on that technique. it talks about joining two adjacent panels without seaming, instead knitting the second panel onto the selvedge of the first. then it uses that technique to approach two panels knit with significantly different weights of yarn" loading="lazy" decoding="async" width="1000" height="1000">
+			
+		</a>
+	</li>
+	
   <li class="post">
 		<a class="postlink" href="/kestrel-zine/">
-			
-			<img src="/img/kestrel-zine.jpg" alt="A 5 photo collage showing the front and back cover as well as 3 full spreads of a folded zine about Kestrel, my dog, who is a 65lb Malinois with a goofy smile and floppy ears. it is printed in two layers of color, blue and orange, and each image depicts Kestrel in various posts... alert and watchful, resting, looking mopey, wearing a sweatshirt." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="kestrel-zine">kestrel zine </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1487,38 +1523,8 @@ export { HeadingAnchors }</script>
 				<li>highlight</li>
 				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/on-the-shoulders-of-giants/">
+			<img src="/img/kestrel-zine.jpg" alt="A 5 photo collage showing the front and back cover as well as 3 full spreads of a folded zine about Kestrel, my dog, who is a 65lb Malinois with a goofy smile and floppy ears. it is printed in two layers of color, blue and orange, and each image depicts Kestrel in various posts... alert and watchful, resting, looking mopey, wearing a sweatshirt." loading="lazy" decoding="async" width="1000" height="1000">
 			
-			<img src="/img/on-the-shoulders.jpg" alt="ok so. five image collage showing the front, 3 inner spreads, and back of a riso-printed zine in green and light blue. it&#39;s called &#39;on the shoulders of giants&#39; and it&#39;s about a knitting technique I learned from Stephen west and how I built on that technique. it talks about joining two adjacent panels without seaming, instead knitting the second panel onto the selvedge of the first. then it uses that technique to approach two panels knit with significantly different weights of yarn" loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="on-the-shoulders-of-giants">on the shoulders of giants </h2>
-			<ul class="postlist-tags">
-				
-				<li>zine</li>
-				
-				<li>knit</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/gender-as-a-proxy-variable/">
-			
-			<img src="/img/gender-zine-cover.png" alt="Part of a scan of the cover of my zine, Gender as a Proxy Variable. It shows the title and a bit of handsewn binding." loading="lazy" decoding="async" width="1000" height="444">
-			
-			<h2 data-ha-exclude="" id="gender-as-a-proxy-variable">gender as a proxy variable </h2>
-			<ul class="postlist-tags">
-				
-				<li>gender</li>
-				
-				<li>zine</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1553,6 +1559,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/fedizinefest-2025/` was built on 2026-04-06T17:26:29.549Z -->
+    <!-- This page `/fedizinefest-2025/` was built on 2026-05-04T22:39:21.335Z -->
   </body>
 </html>

_site/fire-and-ice-handspun/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="fire &amp; ice handspun">
+<meta property="og:title" content="fire &amp;amp; ice handspun | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1474,43 +1480,43 @@ export { HeadingAnchors }</script>
 	
   <li class="post">
 		<a class="postlink" href="/orion-handspun/">
+			<h2 data-ha-exclude="" id="orion-handspun">orion handspun </h2>
 			
+			<ul class="postlist-tags">
+				
+				<li>yarn</li>
+				
+			</ul>
 			<img src="/img/orion-handspun.jpg" alt="3 skeins of handspun yarn, 1 large and 2 small. One of the small skeins is a little more inconsistent weight than the other two - this one was spun on drop spindle about 2 years ago. The other two are about a sport or maybe a DK weight. All three are a gold colorway with tiny hints of orange and a pale light green." loading="lazy" decoding="async" width="1000" height="666">
 			
-			<h2 data-ha-exclude="" id="orion-handspun">orion handspun </h2>
-			<ul class="postlist-tags">
-				
-				<li>yarn</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/spinners-dream-handspun/">
-			
-			<img src="/img/spinners-dream-handspun.jpg" alt="a skein of a lightly variegated grey yarn in about a sport or DK weight." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="spinners-dream-handspun">spinner&#39;s dream handspun </h2>
-			<ul class="postlist-tags">
-				
-				<li>yarn</li>
-				
-			</ul>
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/handspun-yarn-in-party-mix-and-orange-gold/">
-			
-			<img src="/img/handspun0.jpg" alt="4 skeins of handspun yarn, two in a somewhat pastel multicolor and two in a blend of orange, gold, and white." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="handspun-yarn-in-party-mix-and-orange-gold">handspun yarn in party mix and orange-gold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/handspun0.jpg" alt="4 skeins of handspun yarn, two in a somewhat pastel multicolor and two in a blend of orange, gold, and white." loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/ruby-the-alpaca-handspun/">
+			<h2 data-ha-exclude="" id="ruby-the-alpaca-handspun">ruby the alpaca handspun </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>yarn</li>
+				
+			</ul>
+			<img src="/img/ruby-alpaca-handspun.jpg" alt="one large skein and two smaller skeins of a rich chocolatey brown alpaca handspun, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
@@ -1545,6 +1551,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/fire-and-ice-handspun/` was built on 2026-04-06T17:26:29.556Z -->
+    <!-- This page `/fire-and-ice-handspun/` was built on 2026-05-04T22:39:21.387Z -->
   </body>
 </html>

_site/fishhook-pride-keychains/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="fishhook pride keychains">
+<meta property="og:title" content="fishhook pride keychains | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1478,54 +1484,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/queer/">
+		<a class="postlink" href="/makers-mark-keychain/">
+			<h2 data-ha-exclude="" id="makers-mark-keychain">maker&#39;s mark keychain </h2>
 			
-			<img src="/img/queer-print.jpg" alt="A print of the word queer in black ink. The letters are rounded with elongated oval negative space." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="queer">queer </h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-				<li>card</li>
-				
-				<li>sticker</li>
-				
-				<li>pin</li>
-				
-				<li>gender</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/bottom-growth/">
-			
-			<img src="/img/bottom-growth-prints.jpg" alt="4 copies of the same print in various color schemes, laid out in a 2x2 grid. The print shows testosterone-driven bottom growth of a clitoris. The color schemes are, clockwise from top right, brown on turquoise, red on cornsilk (muted yellow), violet on magenta, and mint green on lilac." class="blur" loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="bottom-growth-mature">bottom growth (mature)</h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-				<li>gender</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/swoop-wallet/">
-			
-			<img src="/img/swoop-wallet.jpg" alt="A collage showing 3 pictures of a red and brown leather card wallet. The red pocket separator folds around to the back to become a fetching curlicue." loading="lazy" decoding="async" width="900" height="1200">
-			
-			<h2 data-ha-exclude="" id="swoop-wallet">swoop wallet </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/makers-mark-keychain.jpg" alt="A keychain on an iridescent rainbow split ring. It is dark brown/grey leather and has LEE CAT ART stamped into it." loading="lazy" decoding="async" width="1000" height="1333">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/on-pronouns/">
+			<h2 data-ha-exclude="" id="on-pronouns">on pronouns </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>gender</li>
+				
+			</ul>
+			<img src="/img/starling.jpg" alt="Image unrelated to post. A starling, a beautifully iridescent black bird, stands on a hanging suet feeder." loading="lazy" decoding="async" width="1000" height="666">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/snap-pouch/">
+			<h2 data-ha-exclude="" id="snap-pouch">snap pouch </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>leather</li>
+				
+			</ul>
+			<img src="/img/snap-pouches.jpg" alt="4 square pouches that close with snaps. 2 have loops that attach keyrings. They are in various colors of leather." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
@@ -1560,6 +1556,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/fishhook-pride-keychains/` was built on 2026-04-06T17:26:29.535Z -->
+    <!-- This page `/fishhook-pride-keychains/` was built on 2026-05-04T22:39:21.372Z -->
   </body>
 </html>

_site/five-of-them/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="five of them">
+<meta property="og:title" content="five of them | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1485,52 +1491,52 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/nonbinary-flag/">
+		<a class="postlink" href="/block-printing-transfer-method/">
+			<h2 data-ha-exclude="" id="block-printing-transfer-method">block printing transfer method </h2>
 			
-			<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
-				<li>card</li>
-				
-				<li>gender</li>
-				
 			</ul>
+			<img src="/img/transfer-wip.jpg" alt="A pink block of carving material with a printed design of a bird attached to it. The paper has been partially rubbed away (process described in this post) to reveal the inked design on the carving material." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/congrats-on-the-autism-adhd/">
+		<a class="postlink" href="/big-pidge/">
+			<h2 data-ha-exclude="" id="big-pidge">big pidge </h2>
 			
-			<img src="/img/congrats-on-the.jpg" alt="4 greeting cards propped up on a keyboard. On the right hand side, two cards read &#39;Congrats on the Autism&#39;; one in rainbow ink and one in black ink with a glittery gold shadow. On the left, two cards read &#39;Congrats on the ADHD&#39;; one in red and one in black, both with glittery pink shadows." loading="lazy" decoding="async" width="1000" height="562">
-			
-			<h2 data-ha-exclude="" id="congrats-on-the-autism-adhd">congrats on the autism/adhd </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
+				<li>shirt</li>
+				
 			</ul>
+			<img src="/img/big-pidge-print.jpg" alt="A block print of a superb speciman of pigeon, inked mostly in black but with patches of green, blue, and purple to indicate iridescence." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/flatfish/">
+		<a class="postlink" href="/fat-raccoon/">
+			<h2 data-ha-exclude="" id="fat-raccoon">fat raccoon </h2>
 			
-			<img src="/img/flatfish-print.jpg" alt="A print of a simple flatfish design inked in sepia." loading="lazy" decoding="async" width="1000" height="1333">
-			
-			<h2 data-ha-exclude="" id="flatfish">flatfish </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
+				<li>shirt</li>
+				
 			</ul>
+			<img src="/img/fat-raccoon-print.jpg" alt="A block print in black ink of a rotund raccoon raising a welcoming paw towards the viewer." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
@@ -1565,6 +1571,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/five-of-them/` was built on 2026-04-06T17:26:29.526Z -->
+    <!-- This page `/five-of-them/` was built on 2026-05-04T22:39:21.354Z -->
   </body>
 </html>

_site/fix-your-hearts/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="fix your hearts">
+<meta property="og:title" content="fix your hearts | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,10 +1479,8 @@ export { HeadingAnchors }</script>
 	
   <li class="post">
 		<a class="postlink" href="/fat-raccoon/">
-			
-			<img src="/img/fat-raccoon-print.jpg" alt="A block print in black ink of a rotund raccoon raising a welcoming paw towards the viewer." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="fat-raccoon">fat raccoon </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1486,38 +1490,46 @@ export { HeadingAnchors }</script>
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/fat-raccoon-print.jpg" alt="A block print in black ink of a rotund raccoon raising a welcoming paw towards the viewer." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/congrats-on-the-autism-adhd/">
+		<a class="postlink" href="/shrimp/">
+			<h2 data-ha-exclude="" id="shrimp">shrimp </h2>
 			
-			<img src="/img/congrats-on-the.jpg" alt="4 greeting cards propped up on a keyboard. On the right hand side, two cards read &#39;Congrats on the Autism&#39;; one in rainbow ink and one in black ink with a glittery gold shadow. On the left, two cards read &#39;Congrats on the ADHD&#39;; one in red and one in black, both with glittery pink shadows." loading="lazy" decoding="async" width="1000" height="562">
-			
-			<h2 data-ha-exclude="" id="congrats-on-the-autism-adhd">congrats on the autism/adhd </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
+				<li>sticker</li>
+				
+				<li>pin</li>
+				
 			</ul>
+			<img src="/img/shrimp-print.jpg" alt="A print of a small shrimp with slender little leggies in orange ink." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/artisans-cooperative-cards/">
+		<a class="postlink" href="/trans-the-world/">
+			<h2 data-ha-exclude="" id="trans-the-world">trans the world </h2>
 			
-			<img src="/img/artisans-coop-cards.jpg" alt="2 white greeting cards with the Artisans Cooperative logo, a chicken. One card has a single print of the chicken in black ink, and the other has two overlapping prints in blue and red ink" loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="artisans-cooperative-cards">artisans cooperative cards </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
-				<li>card</li>
+				<li>shirt</li>
+				
+				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-the-world-print.jpg" alt="A print that reads &#39;trans the world&#39; surrounding an image of a globe and a trans symbol. It&#39;s in a ping-to-blue gradient." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1552,6 +1564,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/fix-your-hearts/` was built on 2026-04-06T17:26:29.551Z -->
+    <!-- This page `/fix-your-hearts/` was built on 2026-05-04T22:39:21.376Z -->
   </body>
 </html>

_site/flatfish/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="flatfish">
+<meta property="og:title" content="flatfish | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1485,27 +1491,9 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/artisans-cooperative-shirts/">
+		<a class="postlink" href="/iris/">
+			<h2 data-ha-exclude="" id="iris">iris </h2>
 			
-			<img src="/img/artisans-coop-shirt.jpg" alt="A black tank top laid on a desk. In white ink it reads &#39;Artisans Cooperative&#39; with a print of some chickens and a quail." loading="lazy" decoding="async" width="1000" height="1333">
-			
-			<h2 data-ha-exclude="" id="artisans-cooperative-shirts">artisans cooperative shirts </h2>
-			<ul class="postlist-tags">
-				
-				<li>shirt</li>
-				
-				<li>print</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/killdeer/">
-			
-			<img src="/img/killdeer-print.jpg" alt="A print of a killdeer in black ink." loading="lazy" decoding="async" width="1000" height="1333">
-			
-			<h2 data-ha-exclude="" id="killdeer">killdeer </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1513,15 +1501,15 @@ export { HeadingAnchors }</script>
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/iris-prints.jpg" alt="3 copies of the same print of iris flowers and a bud, done in slightly varied color schemes." loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/slightly-weird-man-club/">
+		<a class="postlink" href="/geese-trans-wrongs/">
+			<h2 data-ha-exclude="" id="geese-trans-wrongs">geese/trans wrongs </h2>
 			
-			<img src="/img/slightly-weird-man-club-print.jpg" alt="A print that reads &#39;slightly weird man club&#39; in a nonbinary flag colored gradient" loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="slightly-weird-man-club">slightly weird man club </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1531,6 +1519,26 @@ export { HeadingAnchors }</script>
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-wrongs-geese-print.jpg" alt="Two Canada geese and their reflections in the water. One is calmly swimming away, while the over leans over towards them and HONKS! Both have speech bubbles; the calm goose says &#39;trans rights!&#39; while the honking goose says &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/happy-bihrtday/">
+			<h2 data-ha-exclude="" id="happy-bihrtday">happy biHRTday </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>card</li>
+				
+				<li>gender</li>
+				
+			</ul>
+			<img src="/img/happy-bihrtday-card-print.jpg" alt="A card and print in the same design - a bouncy, cheery font reading &#39;happy biHRTday&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1565,6 +1573,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/flatfish/` was built on 2026-04-06T17:26:29.520Z -->
+    <!-- This page `/flatfish/` was built on 2026-05-04T22:39:21.343Z -->
   </body>
 </html>

_site/flicker/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="flicker">
+<meta property="og:title" content="flicker | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1490,11 +1496,9 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/stellars-jay/">
+		<a class="postlink" href="/fat-raccoon/">
+			<h2 data-ha-exclude="" id="fat-raccoon">fat raccoon </h2>
 			
-			<img src="/img/stellars-jay-print.jpg" alt="A print of a stellar&#39;s jay, a beautiful black and blue bird, about to take off from a branch" loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="stellars-jay">stellar&#39;s jay </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1504,48 +1508,38 @@ export { HeadingAnchors }</script>
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/fat-raccoon-print.jpg" alt="A block print in black ink of a rotund raccoon raising a welcoming paw towards the viewer." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/queer/">
+		<a class="postlink" href="/killdeer/">
+			<h2 data-ha-exclude="" id="killdeer">killdeer </h2>
 			
-			<img src="/img/queer-print.jpg" alt="A print of the word queer in black ink. The letters are rounded with elongated oval negative space." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="queer">queer </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
-				<li>sticker</li>
-				
-				<li>pin</li>
-				
-				<li>gender</li>
-				
 			</ul>
+			<img src="/img/killdeer-print.jpg" alt="A print of a killdeer in black ink." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/anarchy-autism/">
+		<a class="postlink" href="/loon/">
+			<h2 data-ha-exclude="" id="loon">loon </h2>
 			
-			<img src="/img/anarchy-autism-rainbow-print.jpg" alt="A print in rainbow ink that says autism with the anarchy A." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="anarchy-autism">anarchy autism </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
-				<li>sticker</li>
-				
-				<li>shirt</li>
-				
-				<li>pin</li>
-				
 			</ul>
+			<img src="/img/loon-print.jpg" alt="A print of a loon rearing up with wings spread" loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
@@ -1580,6 +1574,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/flicker/` was built on 2026-04-06T17:26:29.522Z -->
+    <!-- This page `/flicker/` was built on 2026-05-04T22:39:21.347Z -->
   </body>
 </html>

_site/flocked-notebook/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="flocked notebook">
+<meta property="og:title" content="flocked notebook | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1486,44 +1492,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/orange-green-journal/">
+		<a class="postlink" href="/orange-journal/">
+			<h2 data-ha-exclude="" id="orange-journal">orange journal </h2>
 			
-			<img src="/img/orange-green-journal.jpg" alt="A 4-part collage of a slim handbound book." loading="lazy" decoding="async" width="1000" height="1777">
-			
-			<h2 data-ha-exclude="" id="orange-green-journal">orange green journal </h2>
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/orange-journal.jpg" alt="A three panel collage showcasing a small book with foldout pages and a bright orange cover." loading="lazy" decoding="async" width="1000" height="1776">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/leather-strap-journal/">
-			
-			<img src="/img/leather-strap-journal.jpg" alt="A 3-part collage showing a blue journal with leather straps woven into the covers." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="leather-strap-journal">leather strap journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/leather-strap-journal.jpg" alt="A 3-part collage showing a blue journal with leather straps woven into the covers." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/square-watercolor-pad/">
+		<a class="postlink" href="/tiny-books/">
+			<h2 data-ha-exclude="" id="tiny-books">tiny books </h2>
 			
-			<img src="/img/square-watercolor-pad.jpg" alt="A two panel collage showing a square book with a tan cover and blue and gold endpapers." loading="lazy" decoding="async" width="1000" height="1331">
-			
-			<h2 data-ha-exclude="" id="square-watercolor-pad">square watercolor pad </h2>
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/tiny-book.jpg" alt="A three panel collage showing a book held in the palm of a hand." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
@@ -1558,6 +1564,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/flocked-notebook/` was built on 2026-04-06T17:26:29.519Z -->
+    <!-- This page `/flocked-notebook/` was built on 2026-05-04T22:39:21.320Z -->
   </body>
 </html>

_site/foldy-wallet-with-thumb-slide/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="foldy wallet with thumb slide">
+<meta property="og:title" content="foldy wallet with thumb slide | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,46 +1479,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/designing-a-bag/">
+		<a class="postlink" href="/vix-collar/">
+			<h2 data-ha-exclude="" id="vix-collar">vix collar </h2>
 			
-			<img src="/img/shoelace-bag.jpg" alt="a 3-image collage showcasing a leather crossbody bag. the leather body is brown and fairly simple. up the narrow sides, rope is laced through grommets in a style resembling a shoe lacing. the rope forms the handle and loops seamlessly through the other side of the bag, joining in one point in a figure-8 follow-through knot. At the bottom corners, there are small diagonal lines of stitching to give the bag a small lip around the base and ensure small objects don&#39;t slide out." loading="lazy" decoding="async" width="1000" height="1777">
-			
-			<h2 data-ha-exclude="" id="designing-a-bag">designing a bag </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
-				<li>software</li>
-				
 			</ul>
+			<img src="/img/vix-collar.jpg" alt="A collar rests on a leather-wrapped lighter. It is lined with shearling and built of two other layers of leather - a wider mustard yellow layer and a thinner teal layer over that. the teal layer holds a heart shaped o-ring in place." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/pinatex-wallet-with-zipper/">
+		<a class="postlink" href="/leather-chest-harness/">
+			<h2 data-ha-exclude="" id="leather-chest-harness">leather chest harness </h2>
 			
-			<img src="/img/pinatex-ten-pocket-bifold.jpg" alt="A two-picture collage showing the inside and outside of a wallet made with piñatex, a leather alternative made from pineapple leaves. It is two tone blue with a pink accent and has a zippered pocket built in." loading="lazy" decoding="async" width="1000" height="1331">
-			
-			<h2 data-ha-exclude="" id="pinatex-wallet-with-zipper">piñatex wallet with zipper </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leather-chest-harness.jpg" alt="Someone from chin to mid-torso, wearing a dark teal leather chest harness with matte black fittings over a t shirt." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/leatherworking-favorites/">
+		<a class="postlink" href="/vertical-bifold/">
+			<h2 data-ha-exclude="" id="vertical-bifold">vertical bifold </h2>
 			
-			<img src="/img/leather-harness-wip.jpg" alt="two pieces of a chest harness sitting on a messy workbench. both pieces are about 8 inches long total and consist of two large o-rings joined by a dark teal leather strap. the o rings and rivets are matte black." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="leatherworking-favorites">leatherworking favorites </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/vertical-bifold.jpg" alt="A collage showing a hand-stitched leather vertical bifold wallet with 6 card pockets, 2 hidden pockets, and 1 bill pocket." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
@@ -1547,6 +1551,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/foldy-wallet-with-thumb-slide/` was built on 2026-04-06T17:26:29.545Z -->
+    <!-- This page `/foldy-wallet-with-thumb-slide/` was built on 2026-05-04T22:39:21.323Z -->
   </body>
 </html>

_site/foldy-wallet/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="foldy wallet">
+<meta property="og:title" content="foldy wallet | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1473,46 +1479,44 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/lobstah/">
+		<a class="postlink" href="/makers-mark-keychain/">
+			<h2 data-ha-exclude="" id="makers-mark-keychain">maker&#39;s mark keychain </h2>
 			
-			<img src="/img/lobstah.jpg" alt="Two red leather lobster ornaments, about 4-5 in long each." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="lobstah">lobstah </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/makers-mark-keychain.jpg" alt="A keychain on an iridescent rainbow split ring. It is dark brown/grey leather and has LEE CAT ART stamped into it." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/designing-a-bag/">
+		<a class="postlink" href="/circle-bag/">
+			<h2 data-ha-exclude="" id="circle-bag">circle bag </h2>
 			
-			<img src="/img/shoelace-bag.jpg" alt="a 3-image collage showcasing a leather crossbody bag. the leather body is brown and fairly simple. up the narrow sides, rope is laced through grommets in a style resembling a shoe lacing. the rope forms the handle and loops seamlessly through the other side of the bag, joining in one point in a figure-8 follow-through knot. At the bottom corners, there are small diagonal lines of stitching to give the bag a small lip around the base and ensure small objects don&#39;t slide out." loading="lazy" decoding="async" width="1000" height="1777">
-			
-			<h2 data-ha-exclude="" id="designing-a-bag">designing a bag </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
-				<li>software</li>
-				
 			</ul>
+			<img src="/img/circle-bag.jpg" alt="A round bag in brown, mustard yellow, and rich deep orange, with a teal shoulder strap." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/soras-collar/">
+		<a class="postlink" href="/snap-pouch/">
+			<h2 data-ha-exclude="" id="snap-pouch">snap pouch </h2>
 			
-			<img src="/img/sora-collar.jpg" alt="A collage showing a red and black leather dog collar tooled with roses and the name Sora. It&#39;s fully stitched with dark red stitching and has brass hardware." loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="soras-collar">sora&#39;s collar </h2>
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/snap-pouches.jpg" alt="4 square pouches that close with snaps. 2 have loops that attach keyrings. They are in various colors of leather." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
@@ -1547,6 +1551,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/foldy-wallet/` was built on 2026-04-06T17:26:29.544Z -->
+    <!-- This page `/foldy-wallet/` was built on 2026-05-04T22:39:21.321Z -->
   </body>
 </html>

_site/fountain-pen-friendly-stationery/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="fountain pen-friendly stationery">
+<meta property="og:title" content="fountain pen-friendly stationery | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1489,29 +1495,29 @@ export { HeadingAnchors }</script>
 	
   <li class="post">
 		<a class="postlink" href="/stationery-exchange/">
-			
-			<img src="/img/clustered-brown-mushrooms.jpg" alt="Picture unrelated to post. A tight close-up on a cluster of tannish brown mushrooms." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="stationery-exchange">stationery exchange </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>stationery</li>
 				
 			</ul>
+			<img src="/img/clustered-brown-mushrooms.jpg" alt="Picture unrelated to post. A tight close-up on a cluster of tannish brown mushrooms." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/siblinghood-of-the-traveling-greeting-card/">
-			
-			<img src="/img/rockery.jpg" alt="Image unrelated to post. A surprisingly neat pile of rounded beach rocks, mainly speckly grey-white-bluish ones, with trees in the background." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="siblinghood-of-the-traveling-greeting-card">siblinghood of the traveling greeting card </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>stationery</li>
 				
 			</ul>
+			<img src="/img/rockery.jpg" alt="Image unrelated to post. A surprisingly neat pile of rounded beach rocks, mainly speckly grey-white-bluish ones, with trees in the background." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
@@ -1546,6 +1552,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/fountain-pen-friendly-stationery/` was built on 2026-04-06T17:26:29.550Z -->
+    <!-- This page `/fountain-pen-friendly-stationery/` was built on 2026-05-04T22:39:21.339Z -->
   </body>
 </html>

_site/foxgloves/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="foxgloves">
+<meta property="og:title" content="foxgloves | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1489,11 +1495,9 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/swallowtail-on-snowdrops/">
+		<a class="postlink" href="/fat-raccoon/">
+			<h2 data-ha-exclude="" id="fat-raccoon">fat raccoon </h2>
 			
-			<img src="/img/swallowtail-on-snowdrops-print.jpg" alt="A block print of a tiger swallowtail butterfly dangling from Japanese snowdrops, a white drooping flower." loading="lazy" decoding="async" width="1000" height="1332">
-			
-			<h2 data-ha-exclude="" id="swallowtail-on-snowdrops">swallowtail on snowdrops </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1503,31 +1507,15 @@ export { HeadingAnchors }</script>
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/fat-raccoon-print.jpg" alt="A block print in black ink of a rotund raccoon raising a welcoming paw towards the viewer." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/spotted-towhee/">
+		<a class="postlink" href="/boypussy/">
+			<h2 data-ha-exclude="" id="boypussy-mature">boypussy (mature)</h2>
 			
-			<img src="/img/spotted-towhee-print.jpg" alt="A block print of a spotted towhee mid-leap." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="spotted-towhee">spotted towhee </h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-				<li>card</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/girldick/">
-			
-			<img src="/img/girldick-shirt.jpg" alt="A butch cooking and wearing a cropped tee with blue cap sleeves that reads girldick in blue G.I.Joe font." class="blur" loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="girldick-mature">girldick (mature)</h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1541,6 +1529,26 @@ export { HeadingAnchors }</script>
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/boypussy-shirt.jpg" alt="A butch holding a chainsaw and wearing a tank top that reads boypussy in pink Barbie font." class="blur" loading="lazy" decoding="async" width="1000" height="1250">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/congrats-on-the-gay/">
+			<h2 data-ha-exclude="" id="congrats-on-the-gay">congrats on the gay </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>card</li>
+				
+				<li>gender</li>
+				
+			</ul>
+			<img src="/img/congrats-on-the-gay.jpg" alt="A greeting card reading, in black. &#39;Congrats on the,&#39; and then, in rainbow, &#39;Gay!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1575,6 +1583,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/foxgloves/` was built on 2026-04-06T17:26:29.527Z -->
+    <!-- This page `/foxgloves/` was built on 2026-05-04T22:39:21.356Z -->
   </body>
 </html>

_site/gallery/1/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gallery">
+<meta property="og:title" content="gallery | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -977,66 +983,64 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/icelandic-lamb-handspun/">
-			
-			<img src="/img/icelandic-lamb.jpg" alt="a skein of black handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="icelandic-lamb-handspun">icelandic lamb handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/icelandic-lamb.jpg" alt="a skein of black handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/handcombed-jacobs-handspun/">
-			
-			<img src="/img/handcombed-jacobs.jpg" alt="a skein of dark grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="handcombed-jacobs-handspun">handcombed jacobs handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/handcombed-jacobs.jpg" alt="a skein of dark grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/happy-solstice-2025/">
-			
-			<img src="/img/solstice-2025.jpg" alt="front and back of our solstice card from this year, designed in postcard format. long alt incoming... front - 4 picture collage. 1 - i&#39;m standing in the woods, looking to one side, wearing an elaborate knit scarf. 2 - silhouetted thistle-like flowers in front of a pink-purple sky. 3 - my wife brooke crouches down to draw a heart in charcoal on a beach log, with &#39;L + B&#39; written inside. 4 - brooke stands on a driftwood-covered beach looking hella cool in mirrored shades. our dog kes stands in front of her and looks off to one side eagerly. overlaid is the words &#39;happy solstice&#39; in cursive. back - split down the center like the back of a postcard. on the left side, a 5 picture collage. 1 - i stand on a rock at the edge of a calm alpine lake. overlaid is the words &#39;lee, brooke, kestrel, &amp; the flock&#39; in print lettering. 2 - an early spring fern curl. 3 - our six ducks, all facing to the left, not in a row but still very organized. 4 - brooke grins at the camera while hugging kestrel&#39;s head. kestrel looks maybe a bit distraught. 5 - silhouette of a heron in flight across an early morning blue sky. on the address side, i&#39;ve added a dahlia to represent the stamp, and written &#39;you!&#39; in the field that would normally hold the mailing address." loading="lazy" decoding="async" width="1000" height="1346">
-			
 			<h2 data-ha-exclude="" id="happy-solstice-2025">happy solstice 2025 </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/solstice-2025.jpg" alt="front and back of our solstice card from this year, designed in postcard format. long alt incoming... front - 4 picture collage. 1 - i&#39;m standing in the woods, looking to one side, wearing an elaborate knit scarf. 2 - silhouetted thistle-like flowers in front of a pink-purple sky. 3 - my wife brooke crouches down to draw a heart in charcoal on a beach log, with &#39;L + B&#39; written inside. 4 - brooke stands on a driftwood-covered beach looking hella cool in mirrored shades. our dog kes stands in front of her and looks off to one side eagerly. overlaid is the words &#39;happy solstice&#39; in cursive. back - split down the center like the back of a postcard. on the left side, a 5 picture collage. 1 - i stand on a rock at the edge of a calm alpine lake. overlaid is the words &#39;lee, brooke, kestrel, &amp; the flock&#39; in print lettering. 2 - an early spring fern curl. 3 - our six ducks, all facing to the left, not in a row but still very organized. 4 - brooke grins at the camera while hugging kestrel&#39;s head. kestrel looks maybe a bit distraught. 5 - silhouette of a heron in flight across an early morning blue sky. on the address side, i&#39;ve added a dahlia to represent the stamp, and written &#39;you!&#39; in the field that would normally hold the mailing address." loading="lazy" decoding="async" width="1000" height="1346">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/brookes-scarf/">
-			
-			<img src="/img/brooke-scarf.jpg" alt="A diaphanous knit lacework scarf draped over the back of a chair. It is split down the long way into two colors - one tinted orange and one tinted mint blue. Both colors, the orange and the blue, are held double with the same variegated gray, making the piece more cohesive. The yarn overs in the lacework create airy repeating holes." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="brookes-scarf">brooke&#39;s scarf </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/brooke-scarf.jpg" alt="A diaphanous knit lacework scarf draped over the back of a chair. It is split down the long way into two colors - one tinted orange and one tinted mint blue. Both colors, the orange and the blue, are held double with the same variegated gray, making the piece more cohesive. The yarn overs in the lacework create airy repeating holes." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/dragon-mask/">
-			
-			<img src="/img/dragon-mask.jpg" alt="lee (a white person with glasses and a side shave) holds up a leather dragon mask in black and dark green. ze sticks hir tongue out at it." loading="lazy" decoding="async" width="1000" height="746">
-			
 			<h2 data-ha-exclude="" id="dragon-mask">dragon mask </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
@@ -1044,71 +1048,71 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/dragon-mask.jpg" alt="lee (a white person with glasses and a side shave) holds up a leather dragon mask in black and dark green. ze sticks hir tongue out at it." loading="lazy" decoding="async" width="1000" height="746">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/intro-to-wireframing/">
-			
-			<img src="/img/aggregator-wireframes.jpg" alt="a figma page with 4 major sections titled aggregator, aggregator mobile, aggregator color, and aggregator mobile color. each section has 7 pages in it - all sections pretty clearly have the same 7 pages, with the mobile sections shown on mobile screens and the color sections in a rainbow of pastels rather than grayscale." loading="lazy" decoding="async" width="1000" height="1042">
-			
 			<h2 data-ha-exclude="" id="intro-to-wireframing">intro to wireframing </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>software</li>
 				
 			</ul>
+			<img src="/img/aggregator-wireframes.jpg" alt="a figma page with 4 major sections titled aggregator, aggregator mobile, aggregator color, and aggregator mobile color. each section has 7 pages in it - all sections pretty clearly have the same 7 pages, with the mobile sections shown on mobile screens and the color sections in a rainbow of pastels rather than grayscale." loading="lazy" decoding="async" width="1000" height="1042">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/brookes-suspenders/">
-			
-			<img src="/img/brooke-suspenders.jpg" alt="a two image collage showing the front and back of a person, neck to waist. she&#39;s wearing leather suspenders with a button attachment, buckles for adjustment, and a stitched diamond where the straps cross in the back." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="brookes-suspenders">brooke&#39;s suspenders </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/brooke-suspenders.jpg" alt="a two image collage showing the front and back of a person, neck to waist. she&#39;s wearing leather suspenders with a button attachment, buckles for adjustment, and a stitched diamond where the straps cross in the back." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/wrap-bracelets/">
-			
-			<img src="/img/leather-wrap-bracelets.jpg" alt="two wrists, each wearing a black leather wrap bracelet. the upper bracelet is a thin strap wrapped 3 times around the wrist. the lower bracelet wraps twice, with a thicker strap, and has carefully placed spikes that avoid the wrap spots." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="wrap-bracelets">wrap bracelets </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leather-wrap-bracelets.jpg" alt="two wrists, each wearing a black leather wrap bracelet. the upper bracelet is a thin strap wrapped 3 times around the wrist. the lower bracelet wraps twice, with a thicker strap, and has carefully placed spikes that avoid the wrap spots." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/acadia-mitts/">
-			
-			<img src="/img/acadia-mitts.jpg" alt="a hand wearing a knitted fingerless mitten. it&#39;s knit in a slubby, almost tweedy yarn, with the body being blue grey stockinette and the cuffs and tips a vibrant green rib." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="acadia-mitts">acadia mitts </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/acadia-mitts.jpg" alt="a hand wearing a knitted fingerless mitten. it&#39;s knit in a slubby, almost tweedy yarn, with the body being blue grey stockinette and the cuffs and tips a vibrant green rib." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/on-the-shoulders-of-giants/">
-			
-			<img src="/img/on-the-shoulders.jpg" alt="ok so. five image collage showing the front, 3 inner spreads, and back of a riso-printed zine in green and light blue. it&#39;s called &#39;on the shoulders of giants&#39; and it&#39;s about a knitting technique I learned from Stephen west and how I built on that technique. it talks about joining two adjacent panels without seaming, instead knitting the second panel onto the selvedge of the first. then it uses that technique to approach two panels knit with significantly different weights of yarn" loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="on-the-shoulders-of-giants">on the shoulders of giants </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>zine</li>
@@ -1116,43 +1120,43 @@ footer a:focus-visible {
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/on-the-shoulders.jpg" alt="ok so. five image collage showing the front, 3 inner spreads, and back of a riso-printed zine in green and light blue. it&#39;s called &#39;on the shoulders of giants&#39; and it&#39;s about a knitting technique I learned from Stephen west and how I built on that technique. it talks about joining two adjacent panels without seaming, instead knitting the second panel onto the selvedge of the first. then it uses that technique to approach two panels knit with significantly different weights of yarn" loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/sideways-canvas-shirt/">
-			
-			<img src="/img/sideways-canvas.jpg" alt="someone&#39;s torso in a knitted short sleeve shirt. the front is teal, and the bit of back we can see is mustard yellow. looking closely, it&#39;s notable that the stitches are turned 90 degrees from a standard knit garment." loading="lazy" decoding="async" width="1000" height="1338">
-			
 			<h2 data-ha-exclude="" id="sideways-canvas-shirt">sideways canvas shirt </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/sideways-canvas.jpg" alt="someone&#39;s torso in a knitted short sleeve shirt. the front is teal, and the bit of back we can see is mustard yellow. looking closely, it&#39;s notable that the stitches are turned 90 degrees from a standard knit garment." loading="lazy" decoding="async" width="1000" height="1338">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/scrap-patches/">
-			
-			<img src="/img/scrap-patches.jpg" alt="a collage of 4 images, each showing a fabric patch created by collaging 5 or 6 scraps of fabric and joining them with a simple running stitch in white thread. patches of running stitch go back and forth both horizontally and vertically." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="scrap-patches">scrap patches </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>patch</li>
 				
 			</ul>
+			<img src="/img/scrap-patches.jpg" alt="a collage of 4 images, each showing a fabric patch created by collaging 5 or 6 scraps of fabric and joining them with a simple running stitch in white thread. patches of running stitch go back and forth both horizontally and vertically." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/textures-unite/">
-			
-			<img src="/img/textures-unite.jpg" alt="a largely unseen person holds up an expansive knitted shawl, built in 6 sections of different textures and colors. in the background, trees and dappled sunlight." loading="lazy" decoding="async" width="1000" height="1334">
-			
 			<h2 data-ha-exclude="" id="textures-unite">textures unite </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
@@ -1160,6 +1164,8 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/textures-unite.jpg" alt="a largely unseen person holds up an expansive knitted shawl, built in 6 sections of different textures and colors. in the background, trees and dappled sunlight." loading="lazy" decoding="async" width="1000" height="1334">
+			
 		</a>
 	</li>
 	
@@ -1216,6 +1222,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/gallery/1/` was built on 2026-04-06T17:26:32.386Z -->
+    <!-- This page `/gallery/1/` was built on 2026-05-04T22:39:26.034Z -->
   </body>
 </html>

_site/gallery/10/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gallery">
+<meta property="og:title" content="gallery | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -977,10 +983,8 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/iris/">
-			
-			<img src="/img/iris-prints.jpg" alt="3 copies of the same print of iris flowers and a bud, done in slightly varied color schemes." loading="lazy" decoding="async" width="1000" height="562">
-			
 			<h2 data-ha-exclude="" id="iris">iris </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -988,15 +992,15 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/iris-prints.jpg" alt="3 copies of the same print of iris flowers and a bud, done in slightly varied color schemes." loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/congrats-on-the-gay/">
-			
-			<img src="/img/congrats-on-the-gay.jpg" alt="A greeting card reading, in black. &#39;Congrats on the,&#39; and then, in rainbow, &#39;Gay!&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="congrats-on-the-gay">congrats on the gay </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1006,43 +1010,43 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/congrats-on-the-gay.jpg" alt="A greeting card reading, in black. &#39;Congrats on the,&#39; and then, in rainbow, &#39;Gay!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/lined-notebook/">
-			
-			<img src="/img/lined-notebook.jpg" alt="A three panel collage showing a the endpapers, cover, and pages of a small hardbound notebook." loading="lazy" decoding="async" width="1000" height="1776">
-			
 			<h2 data-ha-exclude="" id="lined-notebook">lined notebook </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/lined-notebook.jpg" alt="A three panel collage showing a the endpapers, cover, and pages of a small hardbound notebook." loading="lazy" decoding="async" width="1000" height="1776">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/flocked-notebook/">
-			
-			<img src="/img/flocked-notebook.jpg" alt="A two panel collage showing the cover and endpapers of a thick notebook." loading="lazy" decoding="async" width="1000" height="1331">
-			
 			<h2 data-ha-exclude="" id="flocked-notebook">flocked notebook </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/flocked-notebook.jpg" alt="A two panel collage showing the cover and endpapers of a thick notebook." loading="lazy" decoding="async" width="1000" height="1331">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/brookes-notebook/">
-			
-			<img src="/img/brooke-notebook.jpg" alt="A six panel collage showing the covers, endpapers, and some of the pages of a notebook." loading="lazy" decoding="async" width="1000" height="1500">
-			
 			<h2 data-ha-exclude="" id="brookes-notebook">brooke&#39;s notebook </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
@@ -1050,43 +1054,43 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/brooke-notebook.jpg" alt="A six panel collage showing the covers, endpapers, and some of the pages of a notebook." loading="lazy" decoding="async" width="1000" height="1500">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/pink-socks/">
-			
-			<img src="/img/pink-socks.jpg" alt="Feet propped up on a car dashboard, with a desert landscape beyond. The feet are in salmon-colored socks with black flecks, and decorative lines running down the socks." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="pink-socks">pink socks </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/pink-socks.jpg" alt="Feet propped up on a car dashboard, with a desert landscape beyond. The feet are in salmon-colored socks with black flecks, and decorative lines running down the socks." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/brookes-socks/">
-			
-			<img src="/img/brooke-socks.jpg" alt="Feet in a pair of colorful socks. They are identically striped and quickly vary between yellow, green, blue, white, and gray." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="brookes-socks">brooke&#39;s socks </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/brooke-socks.jpg" alt="Feet in a pair of colorful socks. They are identically striped and quickly vary between yellow, green, blue, white, and gray." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/pride-dice-bags/">
-			
-			<img src="/img/pride-dice-bags.jpg" alt="Several knitted drawstring dice bags sit in front of a bookshelf. They are in different pride flag colors; from right to left (skipping a few duplicates) bisexual, lesbian, nonbinary, trans, and genderqueer. The trans-colored dice bag in the center opens towards the camera, showing a variety of colorful dice inside." loading="lazy" decoding="async" width="1000" height="500">
-			
 			<h2 data-ha-exclude="" id="pride-dice-bags">pride dice bags </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
@@ -1094,76 +1098,78 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/pride-dice-bags.jpg" alt="Several knitted drawstring dice bags sit in front of a bookshelf. They are in different pride flag colors; from right to left (skipping a few duplicates) bisexual, lesbian, nonbinary, trans, and genderqueer. The trans-colored dice bag in the center opens towards the camera, showing a variety of colorful dice inside." loading="lazy" decoding="async" width="1000" height="500">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/square-watercolor-pad/">
-			
-			<img src="/img/square-watercolor-pad.jpg" alt="A two panel collage showing a square book with a tan cover and blue and gold endpapers." loading="lazy" decoding="async" width="1000" height="1331">
-			
 			<h2 data-ha-exclude="" id="square-watercolor-pad">square watercolor pad </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/square-watercolor-pad.jpg" alt="A two panel collage showing a square book with a tan cover and blue and gold endpapers." loading="lazy" decoding="async" width="1000" height="1331">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/tiny-books/">
-			
-			<img src="/img/tiny-book.jpg" alt="A three panel collage showing a book held in the palm of a hand." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="tiny-books">tiny books </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/tiny-book.jpg" alt="A three panel collage showing a book held in the palm of a hand." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/orange-journal/">
-			
-			<img src="/img/orange-journal.jpg" alt="A three panel collage showcasing a small book with foldout pages and a bright orange cover." loading="lazy" decoding="async" width="1000" height="1776">
-			
 			<h2 data-ha-exclude="" id="orange-journal">orange journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/orange-journal.jpg" alt="A three panel collage showcasing a small book with foldout pages and a bright orange cover." loading="lazy" decoding="async" width="1000" height="1776">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/striped-journal/">
-			
-			<img src="/img/striped-journal.jpg" alt="A three panel collage showcasing a journal with a striped cover." loading="lazy" decoding="async" width="1000" height="1776">
-			
 			<h2 data-ha-exclude="" id="striped-journal">striped journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/striped-journal.jpg" alt="A three panel collage showcasing a journal with a striped cover." loading="lazy" decoding="async" width="1000" height="1776">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/green-memo-pad/">
-			
-			<img src="/img/green-memo-pad.jpg" alt="A three panel collage showcasing a small green memo pad." loading="lazy" decoding="async" width="1000" height="1776">
-			
 			<h2 data-ha-exclude="" id="green-memo-pad">green memo pad </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/green-memo-pad.jpg" alt="A three panel collage showcasing a small green memo pad." loading="lazy" decoding="async" width="1000" height="1776">
+			
 		</a>
 	</li>
 	
@@ -1220,6 +1226,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/gallery/10/` was built on 2026-04-06T17:26:34.966Z -->
+    <!-- This page `/gallery/10/` was built on 2026-05-04T22:39:31.375Z -->
   </body>
 </html>

_site/gallery/11/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gallery">
+<meta property="og:title" content="gallery | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -977,38 +983,36 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/blue-and-brown-leather-journal/">
-			
-			<img src="/img/blue-brown-leather-journal.jpg" alt="A three panel collage showcasing a blue and brown leather-covered journal." loading="lazy" decoding="async" width="1000" height="1776">
-			
 			<h2 data-ha-exclude="" id="blue-and-brown-leather-journal">blue and brown leather journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/blue-brown-leather-journal.jpg" alt="A three panel collage showcasing a blue and brown leather-covered journal." loading="lazy" decoding="async" width="1000" height="1776">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/acadia-coloring-journal/">
-			
-			<img src="/img/acadia-coloring-journal.jpg" alt="A five panel collage showcasing a book that is part graph papers of various sizes, and part coloring pages based on Acadia National Park." loading="lazy" decoding="async" width="1000" height="562">
-			
 			<h2 data-ha-exclude="" id="acadia-coloring-journal">Acadia coloring journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/acadia-coloring-journal.jpg" alt="A five panel collage showcasing a book that is part graph papers of various sizes, and part coloring pages based on Acadia National Park." loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/pronoun-patches/">
-			
-			<img src="/img/pronoun-patch.jpg" alt="Rows of the same design, a skull with a speech bubble announcing varied pronoun sets, repeat in multiple colors along a stretch of off-white fabric." loading="lazy" decoding="async" width="1000" height="562">
-			
 			<h2 data-ha-exclude="" id="pronoun-patches">pronoun patches </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1018,15 +1022,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/pronoun-patch.jpg" alt="Rows of the same design, a skull with a speech bubble announcing varied pronoun sets, repeat in multiple colors along a stretch of off-white fabric." loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/congrats-on-the-autism-adhd/">
-			
-			<img src="/img/congrats-on-the.jpg" alt="4 greeting cards propped up on a keyboard. On the right hand side, two cards read &#39;Congrats on the Autism&#39;; one in rainbow ink and one in black ink with a glittery gold shadow. On the left, two cards read &#39;Congrats on the ADHD&#39;; one in red and one in black, both with glittery pink shadows." loading="lazy" decoding="async" width="1000" height="562">
-			
 			<h2 data-ha-exclude="" id="congrats-on-the-autism-adhd">congrats on the autism/adhd </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1034,20 +1038,22 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/congrats-on-the.jpg" alt="4 greeting cards propped up on a keyboard. On the right hand side, two cards read &#39;Congrats on the Autism&#39;; one in rainbow ink and one in black ink with a glittery gold shadow. On the left, two cards read &#39;Congrats on the ADHD&#39;; one in red and one in black, both with glittery pink shadows." loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/become-unbutterable/">
-			
-			<img src="/img/become-unbutterable.jpg" alt="3 copies of the same stamp in orange ink are spread out next to the hand carved rubber stamp they were made from. They show a cat lying on his back with paws curled, holding a butter knife in his mouth. Text around the cat reads, in all caps, &#39;become unbutterable.&#39;" loading="lazy" decoding="async" width="1000" height="562">
-			
 			<h2 data-ha-exclude="" id="become-unbutterable">become unbutterable </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/become-unbutterable.jpg" alt="3 copies of the same stamp in orange ink are spread out next to the hand carved rubber stamp they were made from. They show a cat lying on his back with paws curled, holding a butter knife in his mouth. Text around the cat reads, in all caps, &#39;become unbutterable.&#39;" loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
@@ -1098,6 +1104,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/gallery/11/` was built on 2026-04-06T17:26:35.188Z -->
+    <!-- This page `/gallery/11/` was built on 2026-05-04T22:39:32.108Z -->
   </body>
 </html>

_site/gallery/2/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gallery">
+<meta property="og:title" content="gallery | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -977,38 +983,36 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/fix-your-hearts/">
-			
-			<img src="/img/fix-your-hearts-print.jpg" alt="2 copies of the same print, one in black ink and one in dark teal. The print is text that reads &#39;fix your hearts or die&#39;, with the text shaped into a somewhat long and narrow heart." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="fix-your-hearts">fix your hearts </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/fix-your-hearts-print.jpg" alt="2 copies of the same print, one in black ink and one in dark teal. The print is text that reads &#39;fix your hearts or die&#39;, with the text shaped into a somewhat long and narrow heart." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/loon/">
-			
-			<img src="/img/loon-print.jpg" alt="A print of a loon rearing up with wings spread" loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="loon">loon </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/loon-print.jpg" alt="A print of a loon rearing up with wings spread" loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/kestrel-zine/">
-			
-			<img src="/img/kestrel-zine.jpg" alt="A 5 photo collage showing the front and back cover as well as 3 full spreads of a folded zine about Kestrel, my dog, who is a 65lb Malinois with a goofy smile and floppy ears. it is printed in two layers of color, blue and orange, and each image depicts Kestrel in various posts... alert and watchful, resting, looking mopey, wearing a sweatshirt." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="kestrel-zine">kestrel zine </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1018,15 +1022,15 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/kestrel-zine.jpg" alt="A 5 photo collage showing the front and back cover as well as 3 full spreads of a folded zine about Kestrel, my dog, who is a 65lb Malinois with a goofy smile and floppy ears. it is printed in two layers of color, blue and orange, and each image depicts Kestrel in various posts... alert and watchful, resting, looking mopey, wearing a sweatshirt." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/greeting-loons/">
-			
-			<img src="/img/greeting-loons.jpg" alt="A pile of hand-printed A2 size greeting cards. A loon rearing up with outstretched wings spans the front and back of the cards." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="greeting-loons">greeting loons </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>card</li>
@@ -1036,29 +1040,29 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/greeting-loons.jpg" alt="A pile of hand-printed A2 size greeting cards. A loon rearing up with outstretched wings spans the front and back of the cards." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/brown-creeper/">
-			
-			<img src="/img/brown-creeper-print.jpg" alt="2 copies of the same print side by side. In yellow, black, and purple ink, a brown creeper, a small bird, is depicted, well camouflaged against a tree trunk." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="brown-creeper">brown creeper </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/brown-creeper-print.jpg" alt="2 copies of the same print side by side. In yellow, black, and purple ink, a brown creeper, a small bird, is depicted, well camouflaged against a tree trunk." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/quorbs/">
-			
-			<img src="/img/quorbs-print.jpg" alt="A print in two layers of color showing two rotund quails on a branch. Most of the details are in black ink, then there is a layer with a brown gradient filling in some color on the head and breast." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="quorbs">quorbs </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1066,15 +1070,15 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/quorbs-print.jpg" alt="A print in two layers of color showing two rotund quails on a branch. Most of the details are in black ink, then there is a layer with a brown gradient filling in some color on the head and breast." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/not-a-drill/">
-			
-			<img src="/img/not-a-drill-print.jpg" alt="A print in dark teal ink depicting a power drill with text in cursive below that reads &#39;ceci n&#39;est pas un exercice&#39; or &#39;this is not a drill&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="not-a-drill">not a drill </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1082,15 +1086,15 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/not-a-drill-print.jpg" alt="A print in dark teal ink depicting a power drill with text in cursive below that reads &#39;ceci n&#39;est pas un exercice&#39; or &#39;this is not a drill&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/leather-long-stitch-journals/">
-			
-			<img src="/img/long-stitch-journals.jpg" alt="A stack of hand-bound journals showing long stitches aligned with the spines. They are leather bound and have tie closures." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="leather-long-stitch-journals">leather long-stitch journals </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
@@ -1098,29 +1102,29 @@ footer a:focus-visible {
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/long-stitch-journals.jpg" alt="A stack of hand-bound journals showing long stitches aligned with the spines. They are leather bound and have tie closures." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/lobstah/">
-			
-			<img src="/img/lobstah.jpg" alt="Two red leather lobster ornaments, about 4-5 in long each." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="lobstah">lobstah </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/lobstah.jpg" alt="Two red leather lobster ornaments, about 4-5 in long each." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/greeting-quorbs/">
-			
-			<img src="/img/greeting-quorbs.jpg" alt="A pile of hand-printed A2 size greeting cards. Only the front is visible, showing a particularly round quail." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="greeting-quorbs">greeting quorbs </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>card</li>
@@ -1128,29 +1132,29 @@ footer a:focus-visible {
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/greeting-quorbs.jpg" alt="A pile of hand-printed A2 size greeting cards. Only the front is visible, showing a particularly round quail." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/euphorbia/">
-			
-			<img src="/img/euphorbia-print.jpg" alt="A print in black ink on brown paper. It depicts a stem of euphorbia, a plant with long, thin leaves and many clustered flowers." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="euphorbia">euphorbia </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/euphorbia-print.jpg" alt="A print in black ink on brown paper. It depicts a stem of euphorbia, a plant with long, thin leaves and many clustered flowers." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/booby-congrats-on-the-top-surgery/">
-			
-			<img src="/img/booby-card.jpg" alt="A landscape-oriented white card with a two-color print of a blue-footed booby." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="booby-congrats-on-the-top-surgery">booby (congrats on the top surgery) </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1160,15 +1164,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/booby-card.jpg" alt="A landscape-oriented white card with a two-color print of a blue-footed booby." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/luminescent/">
-			
-			<img src="/img/luminescent-print.jpg" alt="A print of a tattooed woman in bright highlighter yellow underwear." class="blur" loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="luminescent-mature">luminescent (mature)</h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1176,6 +1180,8 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/luminescent-print.jpg" alt="A print of a tattooed woman in bright highlighter yellow underwear." class="blur" loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
@@ -1232,6 +1238,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/gallery/2/` was built on 2026-04-06T17:26:32.639Z -->
+    <!-- This page `/gallery/2/` was built on 2026-05-04T22:39:26.591Z -->
   </body>
 </html>

_site/gallery/3/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gallery">
+<meta property="og:title" content="gallery | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -977,150 +983,148 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/kniphofia/">
-			
-			<img src="/img/kniphofia-print.jpg" alt="A print of a brightly colored flower in 4 layers of color" loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="kniphofia">kniphofia </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/kniphofia-print.jpg" alt="A print of a brightly colored flower in 4 layers of color" loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/triangle-pouch/">
-			
-			<img src="/img/triangle-pouch.jpg" alt="5 small triangular pouches made of leather in two sizes and various colors." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="triangle-pouch">triangle pouch </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/triangle-pouch.jpg" alt="5 small triangular pouches made of leather in two sizes and various colors." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/tiny-portraits/">
-			
-			<img src="/img/tiny-portrait-stamps.jpg" alt="A collage showing various small (around an inch) stamps that depict people or animals." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="tiny-portraits">tiny portraits </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/tiny-portrait-stamps.jpg" alt="A collage showing various small (around an inch) stamps that depict people or animals." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/snap-pouch/">
-			
-			<img src="/img/snap-pouches.jpg" alt="4 square pouches that close with snaps. 2 have loops that attach keyrings. They are in various colors of leather." loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="snap-pouch">snap pouch </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/snap-pouches.jpg" alt="4 square pouches that close with snaps. 2 have loops that attach keyrings. They are in various colors of leather." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/o-ring-bracelet/">
-			
-			<img src="/img/oring-bracelet.jpg" alt="A green leather bracelet, stitched along the edges with dark blue thread, holds an ouroborous o-ring in place with two black snaps." loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="o-ring-bracelet">o-ring bracelet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/oring-bracelet.jpg" alt="A green leather bracelet, stitched along the edges with dark blue thread, holds an ouroborous o-ring in place with two black snaps." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/leaf-patches/">
-			
-			<img src="/img/leaf-patches-oak.jpg" alt="Several oak-leaf-shaped leather patches with stitching holes punched around the edges." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="leaf-patches">leaf patches </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leaf-patches-oak.jpg" alt="Several oak-leaf-shaped leather patches with stitching holes punched around the edges." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/bowtie/">
-			
-			<img src="/img/bowtie.jpg" alt="A black leather bow tie with black stitching." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="bowtie">bowtie </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/bowtie.jpg" alt="A black leather bow tie with black stitching." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/swoop-wallet/">
-			
-			<img src="/img/swoop-wallet.jpg" alt="A collage showing 3 pictures of a red and brown leather card wallet. The red pocket separator folds around to the back to become a fetching curlicue." loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="swoop-wallet">swoop wallet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/swoop-wallet.jpg" alt="A collage showing 3 pictures of a red and brown leather card wallet. The red pocket separator folds around to the back to become a fetching curlicue." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/squarsh/">
-			
-			<img src="/img/squarsh-prints.jpg" alt="Two identical prints of a delicata squash. The body of the squash is cornsilk (muted yellow), the stem and stripes in mint green, and the shadows in lilac." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="squarsh">squarsh </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/squarsh-prints.jpg" alt="Two identical prints of a delicata squash. The body of the squash is cornsilk (muted yellow), the stem and stripes in mint green, and the shadows in lilac." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/rachels-bracelets/">
-			
-			<img src="/img/rachel-bracelets.jpg" alt="Two pink leather bracelets with stainless steel hardware and aqua stitching." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="rachels-bracelets">rachel&#39;s bracelets </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/rachel-bracelets.jpg" alt="Two pink leather bracelets with stainless steel hardware and aqua stitching." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/bottom-growth/">
-			
-			<img src="/img/bottom-growth-prints.jpg" alt="4 copies of the same print in various color schemes, laid out in a 2x2 grid. The print shows testosterone-driven bottom growth of a clitoris. The color schemes are, clockwise from top right, brown on turquoise, red on cornsilk (muted yellow), violet on magenta, and mint green on lilac." class="blur" loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="bottom-growth-mature">bottom growth (mature)</h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1128,34 +1132,36 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/bottom-growth-prints.jpg" alt="4 copies of the same print in various color schemes, laid out in a 2x2 grid. The print shows testosterone-driven bottom growth of a clitoris. The color schemes are, clockwise from top right, brown on turquoise, red on cornsilk (muted yellow), violet on magenta, and mint green on lilac." class="blur" loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/soras-collar/">
-			
-			<img src="/img/sora-collar.jpg" alt="A collage showing a red and black leather dog collar tooled with roses and the name Sora. It&#39;s fully stitched with dark red stitching and has brass hardware." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="soras-collar">sora&#39;s collar </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/sora-collar.jpg" alt="A collage showing a red and black leather dog collar tooled with roses and the name Sora. It&#39;s fully stitched with dark red stitching and has brass hardware." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/shrimp-cat-toy/">
-			
-			<img src="/img/two-shrimp.jpg" alt="Two leather shrimp-shaped cat toys. They have long dangly antennae and are stitched in red and orange." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="shrimp-cat-toy">shrimp cat toy </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/two-shrimp.jpg" alt="Two leather shrimp-shaped cat toys. They have long dangly antennae and are stitched in red and orange." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
@@ -1212,6 +1218,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/gallery/3/` was built on 2026-04-06T17:26:32.938Z -->
+    <!-- This page `/gallery/3/` was built on 2026-05-04T22:39:27.196Z -->
   </body>
 </html>

_site/gallery/4/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gallery">
+<meta property="og:title" content="gallery | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -977,80 +983,78 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/foldy-wallet-with-thumb-slide/">
-			
-			<img src="/img/foldy-thumb-slide.jpg" alt="A card wallet with one main pocket and one quick access slot with a thumb slide. The cover of the main pocket curves around the thumb slide." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="foldy-wallet-with-thumb-slide">foldy wallet with thumb slide </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/foldy-thumb-slide.jpg" alt="A card wallet with one main pocket and one quick access slot with a thumb slide. The cover of the main pocket curves around the thumb slide." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/brookes-cuff-bracelets/">
-			
-			<img src="/img/brooke-cuffs.jpg" alt="Olive green leather cuffs with silver spikes and a shearling lining." loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="brookes-cuff-bracelets">brooke&#39;s cuff bracelets </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/brooke-cuffs.jpg" alt="Olive green leather cuffs with silver spikes and a shearling lining." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/aarons-mask/">
-			
-			<img src="/img/aaron-mask.jpg" alt="A brown/grey leather mask of a long snouted dog with visible teeth and red detailing." loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="aarons-mask">aaron&#39;s mask </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/aaron-mask.jpg" alt="A brown/grey leather mask of a long snouted dog with visible teeth and red detailing." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/sunflower/">
-			
-			<img src="/img/sunflower.jpg" alt="A sunflower made of leather. Many individual natural toned leather petals are sewn onto a brown center ." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="sunflower">sunflower </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/sunflower.jpg" alt="A sunflower made of leather. Many individual natural toned leather petals are sewn onto a brown center ." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/foldy-wallet/">
-			
-			<img src="/img/foldy-wallet.jpg" alt="A four part collage showing a single piece of deep red leather folding up to become a card wallet." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="foldy-wallet">foldy wallet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/foldy-wallet.jpg" alt="A four part collage showing a single piece of deep red leather folding up to become a card wallet." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/proud-dad-wallet/">
-			
-			<img src="/img/proud-dad-wallet.jpg" alt="A brown leather wallet with a subtle trans flag stitching across the top." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="proud-dad-wallet">proud dad wallet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
@@ -1058,85 +1062,85 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/proud-dad-wallet.jpg" alt="A brown leather wallet with a subtle trans flag stitching across the top." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/patchwork-wallet/">
-			
-			<img src="/img/patchwork-wallet.jpg" alt="A collage showing a wallet in a patchwork style, with different colors of leather all stitched together to make up the exterior and the top interior pockets. Other pockets inside are dyed various colors." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="patchwork-wallet">patchwork wallet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/patchwork-wallet.jpg" alt="A collage showing a wallet in a patchwork style, with different colors of leather all stitched together to make up the exterior and the top interior pockets. Other pockets inside are dyed various colors." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/mom-bag/">
-			
-			<img src="/img/mom-bag.jpg" alt="A leather bag sized for a large smartphone with a main pocket and a wraparound smaller pocket. It has a magnetic clasp." loading="lazy" decoding="async" width="900" height="1200">
-			
 			<h2 data-ha-exclude="" id="mom-bag">mom bag </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/mom-bag.jpg" alt="A leather bag sized for a large smartphone with a main pocket and a wraparound smaller pocket. It has a magnetic clasp." loading="lazy" decoding="async" width="900" height="1200">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/gradient-purse-strap/">
-			
-			<img src="/img/gradient-purse-strap.jpg" alt="a coiled up purse strap in gradient cool colors - we can see green, teal, indigo, and a slightly pinkish purple. It has brass hardware and is stiched along its length with cream stitches." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="gradient-purse-strap">gradient purse strap </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/gradient-purse-strap.jpg" alt="a coiled up purse strap in gradient cool colors - we can see green, teal, indigo, and a slightly pinkish purple. It has brass hardware and is stiched along its length with cream stitches." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/zipper-bifold-green/">
-			
-			<img src="/img/zipper-bifold-green.jpg" alt="A collage showing a green leather wallet with a zippered pocket built into one external side." loading="lazy" decoding="async" width="1000" height="1332">
-			
 			<h2 data-ha-exclude="" id="zipper-bifold-green">zipper bifold (green) </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/zipper-bifold-green.jpg" alt="A collage showing a green leather wallet with a zippered pocket built into one external side." loading="lazy" decoding="async" width="1000" height="1332">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/vix-collar/">
-			
-			<img src="/img/vix-collar.jpg" alt="A collar rests on a leather-wrapped lighter. It is lined with shearling and built of two other layers of leather - a wider mustard yellow layer and a thinner teal layer over that. the teal layer holds a heart shaped o-ring in place." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="vix-collar">vix collar </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/vix-collar.jpg" alt="A collar rests on a leather-wrapped lighter. It is lined with shearling and built of two other layers of leather - a wider mustard yellow layer and a thinner teal layer over that. the teal layer holds a heart shaped o-ring in place." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/trans-the-world/">
-			
-			<img src="/img/trans-the-world-print.jpg" alt="A print that reads &#39;trans the world&#39; surrounding an image of a globe and a trans symbol. It&#39;s in a ping-to-blue gradient." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="trans-the-world">trans the world </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1146,15 +1150,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-the-world-print.jpg" alt="A print that reads &#39;trans the world&#39; surrounding an image of a globe and a trans symbol. It&#39;s in a ping-to-blue gradient." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/slightly-weird-man-club/">
-			
-			<img src="/img/slightly-weird-man-club-print.jpg" alt="A print that reads &#39;slightly weird man club&#39; in a nonbinary flag colored gradient" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="slightly-weird-man-club">slightly weird man club </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1164,6 +1168,8 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/slightly-weird-man-club-print.jpg" alt="A print that reads &#39;slightly weird man club&#39; in a nonbinary flag colored gradient" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1220,6 +1226,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/gallery/4/` was built on 2026-04-06T17:26:33.310Z -->
+    <!-- This page `/gallery/4/` was built on 2026-05-04T22:39:27.948Z -->
   </body>
 </html>

_site/gallery/5/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gallery">
+<meta property="og:title" content="gallery | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -977,52 +983,50 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/pins/">
-			
-			<img src="/img/trans-rights-and-wrongs-pins.jpg" alt="Two hard enamel pins in my trans rights and trans wrongs skulls designs." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="pins">pins! </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>pin</li>
 				
 			</ul>
+			<img src="/img/trans-rights-and-wrongs-pins.jpg" alt="Two hard enamel pins in my trans rights and trans wrongs skulls designs." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/mousie/">
-			
-			<img src="/img/mousie.jpg" alt="A cat in a sunbeam snuggles a little leather mouse-shaped cat toy." loading="lazy" decoding="async" width="1000" height="1499">
-			
 			<h2 data-ha-exclude="" id="mousie">mousie </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/mousie.jpg" alt="A cat in a sunbeam snuggles a little leather mouse-shaped cat toy." loading="lazy" decoding="async" width="1000" height="1499">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/long-zipper-bifold/">
-			
-			<img src="/img/long-zipper-bifold.jpg" alt="A collage showing an orange leather wallet with a long zipper running the length of the outside." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="long-zipper-bifold">long zipper bifold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/long-zipper-bifold.jpg" alt="A collage showing an orange leather wallet with a long zipper running the length of the outside." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/tooled-leather-patches/">
-			
-			<img src="/img/pronoun-patch-scroll.jpg" alt="two tooled leather patches. they have scrolls tooled on them that read various pronoun sets." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="tooled-leather-patches">tooled leather patches </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
@@ -1030,15 +1034,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/pronoun-patch-scroll.jpg" alt="two tooled leather patches. they have scrolls tooled on them that read various pronoun sets." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/fishhook-pride-keychains/">
-			
-			<img src="/img/fishhook-keychain-nonbinary.jpg" alt="a keychain with an iridescent fishhook style attachment linked via leather to an iridescent keyring. the leather is stitched with nonbinary flag colors." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="fishhook-pride-keychains">fishhook pride keychains </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
@@ -1046,118 +1050,120 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/fishhook-keychain-nonbinary.jpg" alt="a keychain with an iridescent fishhook style attachment linked via leather to an iridescent keyring. the leather is stitched with nonbinary flag colors." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/circle-bag/">
-			
-			<img src="/img/circle-bag.jpg" alt="A round bag in brown, mustard yellow, and rich deep orange, with a teal shoulder strap." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="circle-bag">circle bag </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/circle-bag.jpg" alt="A round bag in brown, mustard yellow, and rich deep orange, with a teal shoulder strap." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/stephanie-collar/">
-			
-			<img src="/img/stephanie-collar.jpg" alt="A white woman with a shaved side cut wearing a black leather collar with a large dangling o-ring." loading="lazy" decoding="async" width="1000" height="562">
-			
 			<h2 data-ha-exclude="" id="stephanie-collar">stephanie collar </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/stephanie-collar.jpg" alt="A white woman with a shaved side cut wearing a black leather collar with a large dangling o-ring." loading="lazy" decoding="async" width="1000" height="562">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/tiny-mushrooms/">
-			
-			<img src="/img/pixels-mushrooms.jpg" alt="3 tiny mushroom stamps next to their impressions. They are all about 1 inch square. There is a chanterelle in yellow, a russula in pink, and witch&#39;s hat mycena in indigo." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="tiny-mushrooms">tiny mushrooms </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/pixels-mushrooms.jpg" alt="3 tiny mushroom stamps next to their impressions. They are all about 1 inch square. There is a chanterelle in yellow, a russula in pink, and witch&#39;s hat mycena in indigo." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/pinatex-wallet-with-zipper/">
-			
-			<img src="/img/pinatex-ten-pocket-bifold.jpg" alt="A two-picture collage showing the inside and outside of a wallet made with piñatex, a leather alternative made from pineapple leaves. It is two tone blue with a pink accent and has a zippered pocket built in." loading="lazy" decoding="async" width="1000" height="1331">
-			
 			<h2 data-ha-exclude="" id="pinatex-wallet-with-zipper">piñatex wallet with zipper </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/pinatex-ten-pocket-bifold.jpg" alt="A two-picture collage showing the inside and outside of a wallet made with piñatex, a leather alternative made from pineapple leaves. It is two tone blue with a pink accent and has a zippered pocket built in." loading="lazy" decoding="async" width="1000" height="1331">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/moss-harness/">
-			
-			<img src="/img/moss-harness.jpg" alt="A nylon webbing harness in bright teal laid out on a desk." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="moss-harness">moss harness </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/moss-harness.jpg" alt="A nylon webbing harness in bright teal laid out on a desk." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/makers-mark-keychain/">
-			
-			<img src="/img/makers-mark-keychain.jpg" alt="A keychain on an iridescent rainbow split ring. It is dark brown/grey leather and has LEE CAT ART stamped into it." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="makers-mark-keychain">maker&#39;s mark keychain </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/makers-mark-keychain.jpg" alt="A keychain on an iridescent rainbow split ring. It is dark brown/grey leather and has LEE CAT ART stamped into it." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/brookes-collar/">
-			
-			<img src="/img/lined-shearling-collar.jpg" alt="A green leather collar lined with brown/grey shearling and fitted with two sizes of silver-toned spikes." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="brookes-collar">brooke&#39;s collar </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/lined-shearling-collar.jpg" alt="A green leather collar lined with brown/grey shearling and fitted with two sizes of silver-toned spikes." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/bag-strap/">
-			
-			<img src="/img/bag-strap.jpg" alt="A nylon webbing shoulder strap in bright teal with clips on each end." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="bag-strap">bag strap </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/bag-strap.jpg" alt="A nylon webbing shoulder strap in bright teal with clips on each end." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1214,6 +1220,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/gallery/5/` was built on 2026-04-06T17:26:33.589Z -->
+    <!-- This page `/gallery/5/` was built on 2026-05-04T22:39:28.488Z -->
   </body>
 </html>

_site/gallery/6/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gallery">
+<meta property="og:title" content="gallery | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -977,24 +983,22 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/x-acto-knife-sheath/">
-			
-			<img src="/img/knife-sheaths.jpg" alt="Several blades with leather sheaths, and a few extra sheaths. There&#39;s a #2 blade with an orange sheath with yellow stitching, a #11 blade with a blue sheath with light grey stitching, and a skiving knife with a plum sheath and pink stitching." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="x-acto-knife-sheath">x-acto knife sheath </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/knife-sheaths.jpg" alt="Several blades with leather sheaths, and a few extra sheaths. There&#39;s a #2 blade with an orange sheath with yellow stitching, a #11 blade with a blue sheath with light grey stitching, and a skiving knife with a plum sheath and pink stitching." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/little-critter-pouch/">
-			
-			<img src="/img/little-critter-pouch.jpg" alt="A leather pouch shaped a bit like a d10 but with eight sides. It has a rainbow zippered opening and a wristlet strap." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="little-critter-pouch">little critter pouch </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
@@ -1002,141 +1006,141 @@ footer a:focus-visible {
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/little-critter-pouch.jpg" alt="A leather pouch shaped a bit like a d10 but with eight sides. It has a rainbow zippered opening and a wristlet strap." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/zipper-bifold/">
-			
-			<img src="/img/zipper-bifold.jpg" alt="A collage showing a hand-stitched leather bifold with a zippered coin pocket on one exterior side." loading="lazy" decoding="async" width="1000" height="1777">
-			
 			<h2 data-ha-exclude="" id="zipper-bifold">zipper bifold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/zipper-bifold.jpg" alt="A collage showing a hand-stitched leather bifold with a zippered coin pocket on one exterior side." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/vertical-zipper-card-wallet/">
-			
-			<img src="/img/vertical-zipper-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets, a hidden pocket, and a zippered coin pouch." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="vertical-zipper-card-wallet">vertical zipper card wallet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/vertical-zipper-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets, a hidden pocket, and a zippered coin pouch." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/vertical-card-wallet/">
-			
-			<img src="/img/vertical-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets and 1 interior pocket." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="vertical-card-wallet">vertical card wallet </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/vertical-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets and 1 interior pocket." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/vertical-bifold/">
-			
-			<img src="/img/vertical-bifold.jpg" alt="A collage showing a hand-stitched leather vertical bifold wallet with 6 card pockets, 2 hidden pockets, and 1 bill pocket." loading="lazy" decoding="async" width="1000" height="1777">
-			
 			<h2 data-ha-exclude="" id="vertical-bifold">vertical bifold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/vertical-bifold.jpg" alt="A collage showing a hand-stitched leather vertical bifold wallet with 6 card pockets, 2 hidden pockets, and 1 bill pocket." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/eight-pocket-bifold/">
-			
-			<img src="/img/eight-pocket-bifold.jpg" alt="A 3-picture collage showing a hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a asymmetrical interior with a hidden pocket and 3 card pockets on the right, and a hidden pocket and 2 card pockets on the left. The left front pocket has a small naturally occuring hole." loading="lazy" decoding="async" width="1000" height="1777">
-			
 			<h2 data-ha-exclude="" id="eight-pocket-bifold">eight pocket bifold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/eight-pocket-bifold.jpg" alt="A 3-picture collage showing a hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a asymmetrical interior with a hidden pocket and 3 card pockets on the right, and a hidden pocket and 2 card pockets on the left. The left front pocket has a small naturally occuring hole." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/double-bill-pocket-bifold/">
-			
-			<img src="/img/double-bill-pocket-bifold.jpg" alt="A 3-picture collage showing a hand-stitched leather wallet in plum and light natural leather, with a double bill pocket." loading="lazy" decoding="async" width="1000" height="1777">
-			
 			<h2 data-ha-exclude="" id="double-bill-pocket-bifold">double bill pocket bifold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/double-bill-pocket-bifold.jpg" alt="A 3-picture collage showing a hand-stitched leather wallet in plum and light natural leather, with a double bill pocket." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/nine-pocket-bifold/">
-			
-			<img src="/img/nine-pocket-bifold.jpg" alt="A hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a symmetrical interior with a hidden pocket and 3 card pockets on each side." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="nine-pocket-bifold">nine pocket bifold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/nine-pocket-bifold.jpg" alt="A hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a symmetrical interior with a hidden pocket and 3 card pockets on each side." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/leather-lighter-case/">
-			
-			<img src="/img/leather-lighter-case.jpg" alt="A bic lighter wrapped in leather and hand-stitched up one side." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="leather-lighter-case">leather lighter case </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leather-lighter-case.jpg" alt="A bic lighter wrapped in leather and hand-stitched up one side." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/leather-chest-harness/">
-			
-			<img src="/img/leather-chest-harness.jpg" alt="Someone from chin to mid-torso, wearing a dark teal leather chest harness with matte black fittings over a t shirt." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="leather-chest-harness">leather chest harness </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leather-chest-harness.jpg" alt="Someone from chin to mid-torso, wearing a dark teal leather chest harness with matte black fittings over a t shirt." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/anarchy-autism/">
-			
-			<img src="/img/anarchy-autism-rainbow-print.jpg" alt="A print in rainbow ink that says autism with the anarchy A." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="anarchy-autism">anarchy autism </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1148,15 +1152,15 @@ footer a:focus-visible {
 				<li>pin</li>
 				
 			</ul>
+			<img src="/img/anarchy-autism-rainbow-print.jpg" alt="A print in rainbow ink that says autism with the anarchy A." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/rope-one/">
-			
-			<img src="/img/rope-print-1.jpg" alt="A print of a nude trans woman in an asymmetrical rope harness." class="blur" loading="lazy" decoding="async" width="1000" height="1242">
-			
 			<h2 data-ha-exclude="" id="rope-one-mature">rope (one) (mature)</h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1164,6 +1168,8 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/rope-print-1.jpg" alt="A print of a nude trans woman in an asymmetrical rope harness." class="blur" loading="lazy" decoding="async" width="1000" height="1242">
+			
 		</a>
 	</li>
 	
@@ -1220,6 +1226,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/gallery/6/` was built on 2026-04-06T17:26:33.896Z -->
+    <!-- This page `/gallery/6/` was built on 2026-05-04T22:39:29.086Z -->
   </body>
 </html>

_site/gallery/7/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gallery">
+<meta property="og:title" content="gallery | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -977,10 +983,8 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/artisans-cooperative-shirts/">
-			
-			<img src="/img/artisans-coop-shirt.jpg" alt="A black tank top laid on a desk. In white ink it reads &#39;Artisans Cooperative&#39; with a print of some chickens and a quail." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="artisans-cooperative-shirts">artisans cooperative shirts </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>shirt</li>
@@ -988,15 +992,15 @@ footer a:focus-visible {
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/artisans-coop-shirt.jpg" alt="A black tank top laid on a desk. In white ink it reads &#39;Artisans Cooperative&#39; with a print of some chickens and a quail." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/shrimp/">
-			
-			<img src="/img/shrimp-print.jpg" alt="A print of a small shrimp with slender little leggies in orange ink." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="shrimp">shrimp </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1008,15 +1012,15 @@ footer a:focus-visible {
 				<li>pin</li>
 				
 			</ul>
+			<img src="/img/shrimp-print.jpg" alt="A print of a small shrimp with slender little leggies in orange ink." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/girldick/">
-			
-			<img src="/img/girldick-shirt.jpg" alt="A butch cooking and wearing a cropped tee with blue cap sleeves that reads girldick in blue G.I.Joe font." class="blur" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="girldick-mature">girldick (mature)</h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1030,15 +1034,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/girldick-shirt.jpg" alt="A butch cooking and wearing a cropped tee with blue cap sleeves that reads girldick in blue G.I.Joe font." class="blur" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/boypussy/">
-			
-			<img src="/img/boypussy-shirt.jpg" alt="A butch holding a chainsaw and wearing a tank top that reads boypussy in pink Barbie font." class="blur" loading="lazy" decoding="async" width="1000" height="1250">
-			
 			<h2 data-ha-exclude="" id="boypussy-mature">boypussy (mature)</h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1052,15 +1056,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/boypussy-shirt.jpg" alt="A butch holding a chainsaw and wearing a tank top that reads boypussy in pink Barbie font." class="blur" loading="lazy" decoding="async" width="1000" height="1250">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/queer/">
-			
-			<img src="/img/queer-print.jpg" alt="A print of the word queer in black ink. The letters are rounded with elongated oval negative space." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="queer">queer </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1074,15 +1078,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/queer-print.jpg" alt="A print of the word queer in black ink. The letters are rounded with elongated oval negative space." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/coming-out/">
-			
-			<img src="/img/coming-out-card-print.jpg" alt="A card and print in the same design - a chick and a broken eggshell, and a simple font reading &#39;congrats on coming out of your shell&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="coming-out">coming out </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1092,15 +1096,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/coming-out-card-print.jpg" alt="A card and print in the same design - a chick and a broken eggshell, and a simple font reading &#39;congrats on coming out of your shell&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/happy-bihrtday/">
-			
-			<img src="/img/happy-bihrtday-card-print.jpg" alt="A card and print in the same design - a bouncy, cheery font reading &#39;happy biHRTday&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="happy-bihrtday">happy biHRTday </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1110,15 +1114,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/happy-bihrtday-card-print.jpg" alt="A card and print in the same design - a bouncy, cheery font reading &#39;happy biHRTday&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/foxgloves/">
-			
-			<img src="/img/foxgloves-print.jpg" alt="A print of a cluster of foxgloves. The background is inked in green, with negative space and pink details making up the foxgloves." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="foxgloves">foxgloves </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1128,15 +1132,15 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/foxgloves-print.jpg" alt="A print of a cluster of foxgloves. The background is inked in green, with negative space and pink details making up the foxgloves." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/artisans-cooperative-cards/">
-			
-			<img src="/img/artisans-coop-cards.jpg" alt="2 white greeting cards with the Artisans Cooperative logo, a chicken. One card has a single print of the chicken in black ink, and the other has two overlapping prints in blue and red ink" loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="artisans-cooperative-cards">artisans cooperative cards </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1144,43 +1148,43 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/artisans-coop-cards.jpg" alt="2 white greeting cards with the Artisans Cooperative logo, a chicken. One card has a single print of the chicken in black ink, and the other has two overlapping prints in blue and red ink" loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/stickers/">
-			
-			<img src="/img/trans-rights-stickers.jpg" alt="Clear and holographic stickers in the same design - a smiling skull with speech bubble reading &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="stickers">stickers! </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>sticker</li>
 				
 			</ul>
+			<img src="/img/trans-rights-stickers.jpg" alt="Clear and holographic stickers in the same design - a smiling skull with speech bubble reading &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/shirts/">
-			
-			<img src="/img/shirts.jpg" alt="A row of shirts hanging in front of a window, with a variety of hand-printed designs." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="shirts">shirts! </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/shirts.jpg" alt="A row of shirts hanging in front of a window, with a variety of hand-printed designs." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/nonbinary-flag/">
-			
-			<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1190,15 +1194,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/five-of-them/">
-			
-			<img src="/img/five-of-them-print.jpg" alt="A block print of five mule deer grazing in a dark green field. The deer are partially negative space and partially brown ink detailing." loading="lazy" decoding="async" width="1000" height="594">
-			
 			<h2 data-ha-exclude="" id="five-of-them">five of them </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1206,6 +1210,8 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/five-of-them-print.jpg" alt="A block print of five mule deer grazing in a dark green field. The deer are partially negative space and partially brown ink detailing." loading="lazy" decoding="async" width="1000" height="594">
+			
 		</a>
 	</li>
 	
@@ -1262,6 +1268,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/gallery/7/` was built on 2026-04-06T17:26:34.197Z -->
+    <!-- This page `/gallery/7/` was built on 2026-05-04T22:39:29.724Z -->
   </body>
 </html>

_site/gallery/8/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gallery">
+<meta property="og:title" content="gallery | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -977,10 +983,8 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/swallowtail-on-snowdrops/">
-			
-			<img src="/img/swallowtail-on-snowdrops-print.jpg" alt="A block print of a tiger swallowtail butterfly dangling from Japanese snowdrops, a white drooping flower." loading="lazy" decoding="async" width="1000" height="1332">
-			
 			<h2 data-ha-exclude="" id="swallowtail-on-snowdrops">swallowtail on snowdrops </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -990,29 +994,29 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/swallowtail-on-snowdrops-print.jpg" alt="A block print of a tiger swallowtail butterfly dangling from Japanese snowdrops, a white drooping flower." loading="lazy" decoding="async" width="1000" height="1332">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/leather-strap-journal/">
-			
-			<img src="/img/leather-strap-journal.jpg" alt="A 3-part collage showing a blue journal with leather straps woven into the covers." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="leather-strap-journal">leather strap journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/leather-strap-journal.jpg" alt="A 3-part collage showing a blue journal with leather straps woven into the covers." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/hummingbird-become-ungovernable/">
-			
-			<img src="/img/hummingbird-ungovernable-print.jpg" alt="A block print in black and orange ink of a rufous hummingbird, tail flared, hovering in midair. Clutched in eir tiny claws is a banner that waves in the wind and reads &#39;become ungovernable&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="hummingbird-become-ungovernable">hummingbird become ungovernable </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1022,57 +1026,57 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/hummingbird-ungovernable-print.jpg" alt="A block print in black and orange ink of a rufous hummingbird, tail flared, hovering in midair. Clutched in eir tiny claws is a banner that waves in the wind and reads &#39;become ungovernable&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/stampede-journal/">
-			
-			<img src="/img/stampede-journal.jpg" alt="A 4-part collage of a hardcover book, showing a coloring page with &#39;stampede!&#39; written across it." loading="lazy" decoding="async" width="1000" height="1777">
-			
 			<h2 data-ha-exclude="" id="stampede-journal">stampede journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/stampede-journal.jpg" alt="A 4-part collage of a hardcover book, showing a coloring page with &#39;stampede!&#39; written across it." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/orange-green-journal/">
-			
-			<img src="/img/orange-green-journal.jpg" alt="A 4-part collage of a slim handbound book." loading="lazy" decoding="async" width="1000" height="1777">
-			
 			<h2 data-ha-exclude="" id="orange-green-journal">orange green journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/orange-green-journal.jpg" alt="A 4-part collage of a slim handbound book." loading="lazy" decoding="async" width="1000" height="1777">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/baseball-journal/">
-			
-			<img src="/img/baseball-journal.jpg" alt="A 3-part collage of a leather-covered book with baseball-style stitching across the spine." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="baseball-journal">baseball journal </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>book</li>
 				
 			</ul>
+			<img src="/img/baseball-journal.jpg" alt="A 3-part collage of a leather-covered book with baseball-style stitching across the spine." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/trans-wrongs-skull/">
-			
-			<img src="/img/trans-wrongs-print.jpg" alt="A smiling skull with devil horns and a little spiked tail, and a speech bubble reading &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="trans-wrongs-skull">trans wrongs skull </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1086,15 +1090,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-wrongs-print.jpg" alt="A smiling skull with devil horns and a little spiked tail, and a speech bubble reading &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/geese-trans-wrongs/">
-			
-			<img src="/img/trans-wrongs-geese-print.jpg" alt="Two Canada geese and their reflections in the water. One is calmly swimming away, while the over leans over towards them and HONKS! Both have speech bubbles; the calm goose says &#39;trans rights!&#39; while the honking goose says &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="geese-trans-wrongs">geese/trans wrongs </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1104,15 +1108,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-wrongs-geese-print.jpg" alt="Two Canada geese and their reflections in the water. One is calmly swimming away, while the over leans over towards them and HONKS! Both have speech bubbles; the calm goose says &#39;trans rights!&#39; while the honking goose says &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/spotted-towhee/">
-			
-			<img src="/img/spotted-towhee-print.jpg" alt="A block print of a spotted towhee mid-leap." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="spotted-towhee">spotted towhee </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1120,29 +1124,29 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/spotted-towhee-print.jpg" alt="A block print of a spotted towhee mid-leap." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/knit-shrimp/">
-			
-			<img src="/img/knit-shrimp.jpg" alt="Four knitted shrimp in various shades of pink. They are all somewhere around hand-sized, and have little yarn antennae and leggies." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="knit-shrimp">knit shrimp </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>knit</li>
 				
 			</ul>
+			<img src="/img/knit-shrimp.jpg" alt="Four knitted shrimp in various shades of pink. They are all somewhere around hand-sized, and have little yarn antennae and leggies." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/geese/">
-			
-			<img src="/img/geese-print.jpg" alt="Two Canada geese and their reflections in the water. One is calmly swimming away, while the over leans over and HONKS!" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="geese">geese </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1152,15 +1156,15 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/geese-print.jpg" alt="Two Canada geese and their reflections in the water. One is calmly swimming away, while the over leans over and HONKS!" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/fat-raccoon/">
-			
-			<img src="/img/fat-raccoon-print.jpg" alt="A block print in black ink of a rotund raccoon raising a welcoming paw towards the viewer." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="fat-raccoon">fat raccoon </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1170,15 +1174,15 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/fat-raccoon-print.jpg" alt="A block print in black ink of a rotund raccoon raising a welcoming paw towards the viewer." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/big-pidge/">
-			
-			<img src="/img/big-pidge-print.jpg" alt="A block print of a superb speciman of pigeon, inked mostly in black but with patches of green, blue, and purple to indicate iridescence." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="big-pidge">big pidge </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1188,6 +1192,8 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/big-pidge-print.jpg" alt="A block print of a superb speciman of pigeon, inked mostly in black but with patches of green, blue, and purple to indicate iridescence." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1244,6 +1250,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/gallery/8/` was built on 2026-04-06T17:26:34.329Z -->
+    <!-- This page `/gallery/8/` was built on 2026-05-04T22:39:30.003Z -->
   </body>
 </html>

_site/gallery/9/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gallery">
+<meta property="og:title" content="gallery | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -977,10 +983,8 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/trans-rights-skull/">
-			
-			<img src="/img/trans-rights-print.jpg" alt="A print in mostly black ink of a smiling skull with a speech bubble. In pink and blue, the speech bubble reads &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="trans-rights-skull">trans rights skull </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -994,15 +998,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-rights-print.jpg" alt="A print in mostly black ink of a smiling skull with a speech bubble. In pink and blue, the speech bubble reads &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/stellars-jay/">
-			
-			<img src="/img/stellars-jay-print.jpg" alt="A print of a stellar&#39;s jay, a beautiful black and blue bird, about to take off from a branch" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="stellars-jay">stellar&#39;s jay </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1012,15 +1016,15 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/stellars-jay-print.jpg" alt="A print of a stellar&#39;s jay, a beautiful black and blue bird, about to take off from a branch" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/hair/">
-			
-			<img src="/img/hair-print.jpg" alt="A print in black ink of belly hair." loading="lazy" decoding="async" width="1000" height="710">
-			
 			<h2 data-ha-exclude="" id="hair">hair </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1028,15 +1032,15 @@ footer a:focus-visible {
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/hair-print.jpg" alt="A print in black ink of belly hair." loading="lazy" decoding="async" width="1000" height="710">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/flicker/">
-			
-			<img src="/img/flicker-print.jpg" alt="A print in black, brown, and red ink of a northern flicker (a type of woodpecker). Viewed from the back, he is looking over his shoulder and upward towards something unseen above him (my bird feeder)." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="flicker">flicker </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1046,15 +1050,15 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/flicker-print.jpg" alt="A print in black, brown, and red ink of a northern flicker (a type of woodpecker). Viewed from the back, he is looking over his shoulder and upward towards something unseen above him (my bird feeder)." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/heron/">
-			
-			<img src="/img/heron-print.jpg" alt="A print in black ink of a great blue heron, leaning downwards so that eir beak is level with eir feet." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="heron">heron </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1064,15 +1068,15 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/heron-print.jpg" alt="A print in black ink of a great blue heron, leaning downwards so that eir beak is level with eir feet." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/seedling/">
-			
-			<img src="/img/seedling-print.jpg" alt="A print of a 3-stage design of a green seedling barely open, starting to straighten up, and growing strong, with little piles of dirt beneath each one." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="seedling">seedling </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1080,15 +1084,15 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/seedling-print.jpg" alt="A print of a 3-stage design of a green seedling barely open, starting to straighten up, and growing strong, with little piles of dirt beneath each one." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/lupine/">
-			
-			<img src="/img/lupine-prints.jpg" alt="6 versions of a print of lupine flowers with the leaves inked in light green and the blossoms inked in a variety of blues, purples, and pinks." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="lupine">lupine </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1098,29 +1102,29 @@ footer a:focus-visible {
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/lupine-prints.jpg" alt="6 versions of a print of lupine flowers with the leaves inked in light green and the blossoms inked in a variety of blues, purples, and pinks." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/leather-keychains/">
-			
-			<img src="/img/leather-keychains.jpg" alt="A picture of multiple leather keychains sitting on a wood table. Many of them are simple rectangle shapes with stitching around the edge; a few are odd wavy or geometric shapes. A few say things like &#39;MOM&#39; or &#39;EGG&#39;." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="leather-keychains">leather keychains </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>leather</li>
 				
 			</ul>
+			<img src="/img/leather-keychains.jpg" alt="A picture of multiple leather keychains sitting on a wood table. Many of them are simple rectangle shapes with stitching around the edge; a few are odd wavy or geometric shapes. A few say things like &#39;MOM&#39; or &#39;EGG&#39;." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/killdeer/">
-			
-			<img src="/img/killdeer-print.jpg" alt="A print of a killdeer in black ink." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="killdeer">killdeer </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1128,15 +1132,15 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/killdeer-print.jpg" alt="A print of a killdeer in black ink." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/junco/">
-			
-			<img src="/img/junco-print.jpg" alt="A print of a junco mid-takeoff from a branch. Eir head is inked in black, body in gray, and the branch in sepia." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="junco">junco </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1144,29 +1148,29 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/junco-print.jpg" alt="A print of a junco mid-takeoff from a branch. Eir head is inked in black, body in gray, and the branch in sepia." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/handspun-yarn-in-party-mix-and-orange-gold/">
-			
-			<img src="/img/handspun0.jpg" alt="4 skeins of handspun yarn, two in a somewhat pastel multicolor and two in a blend of orange, gold, and white." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="handspun-yarn-in-party-mix-and-orange-gold">handspun yarn in party mix and orange-gold </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/handspun0.jpg" alt="4 skeins of handspun yarn, two in a somewhat pastel multicolor and two in a blend of orange, gold, and white." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/flatfish/">
-			
-			<img src="/img/flatfish-print.jpg" alt="A print of a simple flatfish design inked in sepia." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="flatfish">flatfish </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1174,15 +1178,15 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/flatfish-print.jpg" alt="A print of a simple flatfish design inked in sepia." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/chanterelle/">
-			
-			<img src="/img/chanterelle-print.jpg" alt="A print of two chanterelle mushrooms inked in a dark-to-light yellow gradient." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="chanterelle">chanterelle </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1190,6 +1194,8 @@ footer a:focus-visible {
 				<li>card</li>
 				
 			</ul>
+			<img src="/img/chanterelle-print.jpg" alt="A print of two chanterelle mushrooms inked in a dark-to-light yellow gradient." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
@@ -1246,6 +1252,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/gallery/9/` was built on 2026-04-06T17:26:34.617Z -->
+    <!-- This page `/gallery/9/` was built on 2026-05-04T22:39:30.640Z -->
   </body>
 </html>

_site/gallery/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gallery">
+<meta property="og:title" content="gallery | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -442,6 +442,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -938,7 +944,7 @@ footer a:focus-visible {
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -977,183 +983,183 @@ footer a:focus-visible {
 	
   <li class="post">
 		<a class="postlink" href="/crow/">
-			
-			<img src="/img/crow-print.jpg" alt="a block print in dark indigo ink on white paper depicting a perched crow looking over one shoulder. one side of the crow is lit with fine feather detail, and the other side is almost entirely in shadow." loading="lazy" decoding="async" width="1000" height="1333">
-			
 			<h2 data-ha-exclude="" id="crow">crow </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 			</ul>
+			<img src="/img/crow-print.jpg" alt="a block print in dark indigo ink on white paper depicting a perched crow looking over one shoulder. one side of the crow is lit with fine feather detail, and the other side is almost entirely in shadow." loading="lazy" decoding="async" width="1000" height="1333">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/charlie-the-alpaca-handspun/">
-			
-			<img src="/img/charlie-alpaca-handspun.jpg" alt="one large skein (and technically a smaller skein hidden behind it) of sheen-y black alpaca handspun, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="charlie-the-alpaca-handspun">charlie the alpaca handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/charlie-alpaca-handspun.jpg" alt="one large skein (and technically a smaller skein hidden behind it) of sheen-y black alpaca handspun, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/ruby-the-alpaca-handspun/">
-			
-			<img src="/img/ruby-alpaca-handspun.jpg" alt="one large skein and two smaller skeins of a rich chocolatey brown alpaca handspun, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="ruby-the-alpaca-handspun">ruby the alpaca handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/ruby-alpaca-handspun.jpg" alt="one large skein and two smaller skeins of a rich chocolatey brown alpaca handspun, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/hand-dyed-gold-handspun/">
-			
-			<img src="/img/gold-handspun.jpg" alt="3 skeins, one small and two large, of a rich golden-orange handspun with light tonal effects, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="hand-dyed-gold-handspun">hand-dyed gold handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/gold-handspun.jpg" alt="3 skeins, one small and two large, of a rich golden-orange handspun with light tonal effects, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/spinners-dream-handspun/">
-			
-			<img src="/img/spinners-dream-handspun.jpg" alt="a skein of a lightly variegated grey yarn in about a sport or DK weight." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="spinners-dream-handspun">spinner&#39;s dream handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/spinners-dream-handspun.jpg" alt="a skein of a lightly variegated grey yarn in about a sport or DK weight." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/rambouillet-handspun/">
-			
-			<img src="/img/rambouillet-handspun.jpg" alt="1 large and 2 small skeins of handspun yarn in a sport or DK weight that has been dyed in light and dark teal, green, and rusty green-gold." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="rambouillet-handspun">rambouillet handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/rambouillet-handspun.jpg" alt="1 large and 2 small skeins of handspun yarn in a sport or DK weight that has been dyed in light and dark teal, green, and rusty green-gold." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/fire-and-ice-handspun/">
-			
-			<img src="/img/fire-ice-handspun.jpg" alt="2 skeins, one large and one small, of a heathered orange yarn with hints of blue in about a DK or worsted weight." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="fire-and-ice-handspun">fire &amp; ice handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/fire-ice-handspun.jpg" alt="2 skeins, one large and one small, of a heathered orange yarn with hints of blue in about a DK or worsted weight." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/dyeing-fiber/">
-			
-			<img src="/img/dyed-fiber.jpg" alt="4oz of yarn and a pound of wool, chunked out, drying on a drying rack outdoors. the yarn and half the wool is a mix of teals and greens; the other half of the wool is a beautiful orange-gold." loading="lazy" decoding="async" width="1000" height="1000">
-			
 			<h2 data-ha-exclude="" id="dyeing-fiber">dyeing fiber </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/dyed-fiber.jpg" alt="4oz of yarn and a pound of wool, chunked out, drying on a drying rack outdoors. the yarn and half the wool is a mix of teals and greens; the other half of the wool is a beautiful orange-gold." loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/coral-reef-handspun/">
-			
-			<img src="/img/coral-reef-handspun.jpg" alt="2 skeins, one large and one small, of a heathered grey yarn with hints of blue and orange in about a sport or DK weight." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="coral-reef-handspun">coral reef handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/coral-reef-handspun.jpg" alt="2 skeins, one large and one small, of a heathered grey yarn with hints of blue and orange in about a sport or DK weight." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/bfl-silk-handspun/">
-			
-			<img src="/img/bfl-silk-handspun.jpg" alt="a spinning wheel bobbin full of undyed white handspun yarn in about a sport or DK weight." loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="bfl-silk-handspun">BFL/silk handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/bfl-silk-handspun.jpg" alt="a spinning wheel bobbin full of undyed white handspun yarn in about a sport or DK weight." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/orion-handspun/">
-			
-			<img src="/img/orion-handspun.jpg" alt="3 skeins of handspun yarn, 1 large and 2 small. One of the small skeins is a little more inconsistent weight than the other two - this one was spun on drop spindle about 2 years ago. The other two are about a sport or maybe a DK weight. All three are a gold colorway with tiny hints of orange and a pale light green." loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="orion-handspun">orion handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/orion-handspun.jpg" alt="3 skeins of handspun yarn, 1 large and 2 small. One of the small skeins is a little more inconsistent weight than the other two - this one was spun on drop spindle about 2 years ago. The other two are about a sport or maybe a DK weight. All three are a gold colorway with tiny hints of orange and a pale light green." loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/petrichor-handspun/">
-			
-			<img src="/img/petrichor-handspun.jpg" alt="3 skeins of handspun yarn, 2 large and 1 small. the large ones are a rich earth-tone blend of reds, pinks, browns, and hints of green and gold. the smaller skein is similar but with a decidedly greener hue" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="petrichor-handspun">petrichor handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/petrichor-handspun.jpg" alt="3 skeins of handspun yarn, 2 large and 1 small. the large ones are a rich earth-tone blend of reds, pinks, browns, and hints of green and gold. the smaller skein is similar but with a decidedly greener hue" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/light-grey-jacobs-handspun/">
-			
-			<img src="/img/light-grey-jacobs.jpg" alt="a skein of light grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
-			
 			<h2 data-ha-exclude="" id="light-grey-jacobs-handspun">light grey jacobs handspun </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>yarn</li>
 				
 			</ul>
+			<img src="/img/light-grey-jacobs.jpg" alt="a skein of light grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
+			
 		</a>
 	</li>
 	
@@ -1204,6 +1210,6 @@ footer a:focus-visible {
 </footer>
 
 
-    <!-- This page `/gallery/` was built on 2026-04-06T17:26:29.557Z -->
+    <!-- This page `/gallery/` was built on 2026-05-04T22:39:21.390Z -->
   </body>
 </html>

_site/geese-trans-wrongs/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="geese/trans wrongs">
+<meta property="og:title" content="geese/trans wrongs | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1490,46 +1496,56 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/on-the-ubiquity-of-enby/">
+		<a class="postlink" href="/big-pidge/">
+			<h2 data-ha-exclude="" id="big-pidge">big pidge </h2>
 			
-			<img src="/img/gender-census.jpg" alt="A screenshot of part of the Gender Census reports page, showing the header bar and a title that reads &#39;Gender Census 2023 Worldwide Report&#39;" loading="lazy" decoding="async" width="1000" height="364">
-			
-			<h2 data-ha-exclude="" id="on-the-ubiquity-of-enby">on the ubiquity of &#39;enby&#39; </h2>
-			<ul class="postlist-tags">
-				
-				<li>gender</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/congrats-on-the-autism-adhd/">
-			
-			<img src="/img/congrats-on-the.jpg" alt="4 greeting cards propped up on a keyboard. On the right hand side, two cards read &#39;Congrats on the Autism&#39;; one in rainbow ink and one in black ink with a glittery gold shadow. On the left, two cards read &#39;Congrats on the ADHD&#39;; one in red and one in black, both with glittery pink shadows." loading="lazy" decoding="async" width="1000" height="562">
-			
-			<h2 data-ha-exclude="" id="congrats-on-the-autism-adhd">congrats on the autism/adhd </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
 				<li>card</li>
 				
+				<li>shirt</li>
+				
 			</ul>
+			<img src="/img/big-pidge-print.jpg" alt="A block print of a superb speciman of pigeon, inked mostly in black but with patches of green, blue, and purple to indicate iridescence." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/in-the-news/">
+		<a class="postlink" href="/pronoun-patches/">
+			<h2 data-ha-exclude="" id="pronoun-patches">pronoun patches </h2>
 			
-			<img src="/img/shrimp-knitting.jpg" alt="Picture unrelated to post. Lee, sitting in a chair and seen in profile, looks up and smiles. Ze is holding and working on a partially knit shrimp." loading="lazy" decoding="async" width="1000" height="666">
-			
-			<h2 data-ha-exclude="" id="in-the-news">in the news </h2>
 			<ul class="postlist-tags">
 				
+				<li>print</li>
+				
+				<li>patch</li>
+				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/pronoun-patch.jpg" alt="Rows of the same design, a skull with a speech bubble announcing varied pronoun sets, repeat in multiple colors along a stretch of off-white fabric." loading="lazy" decoding="async" width="1000" height="562">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/greeting-loons/">
+			<h2 data-ha-exclude="" id="greeting-loons">greeting loons </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>card</li>
+				
+				<li>print</li>
+				
+				<li>highlight</li>
+				
+			</ul>
+			<img src="/img/greeting-loons.jpg" alt="A pile of hand-printed A2 size greeting cards. A loon rearing up with outstretched wings spans the front and back of the cards." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1564,6 +1580,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/geese-trans-wrongs/` was built on 2026-04-06T17:26:29.524Z -->
+    <!-- This page `/geese-trans-wrongs/` was built on 2026-05-04T22:39:21.351Z -->
   </body>
 </html>

_site/geese/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="geese">
+<meta property="og:title" content="geese | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1490,43 +1496,25 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/greeting-loons/">
+		<a class="postlink" href="/bottom-growth/">
+			<h2 data-ha-exclude="" id="bottom-growth-mature">bottom growth (mature)</h2>
 			
-			<img src="/img/greeting-loons.jpg" alt="A pile of hand-printed A2 size greeting cards. A loon rearing up with outstretched wings spans the front and back of the cards." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="greeting-loons">greeting loons </h2>
-			<ul class="postlist-tags">
-				
-				<li>card</li>
-				
-				<li>print</li>
-				
-				<li>highlight</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/brown-creeper/">
-			
-			<img src="/img/brown-creeper-print.jpg" alt="2 copies of the same print side by side. In yellow, black, and purple ink, a brown creeper, a small bird, is depicted, well camouflaged against a tree trunk." loading="lazy" decoding="async" width="1000" height="1000">
-			
-			<h2 data-ha-exclude="" id="brown-creeper">brown creeper </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
+				<li>gender</li>
+				
 			</ul>
+			<img src="/img/bottom-growth-prints.jpg" alt="4 copies of the same print in various color schemes, laid out in a 2x2 grid. The print shows testosterone-driven bottom growth of a clitoris. The color schemes are, clockwise from top right, brown on turquoise, red on cornsilk (muted yellow), violet on magenta, and mint green on lilac." class="blur" loading="lazy" decoding="async" width="1000" height="1000">
+			
 		</a>
 	</li>
 	
   <li class="post">
 		<a class="postlink" href="/stellars-jay/">
-			
-			<img src="/img/stellars-jay-print.jpg" alt="A print of a stellar&#39;s jay, a beautiful black and blue bird, about to take off from a branch" loading="lazy" decoding="async" width="1000" height="750">
-			
 			<h2 data-ha-exclude="" id="stellars-jay">stellar&#39;s jay </h2>
+			
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1536,6 +1524,24 @@ export { HeadingAnchors }</script>
 				<li>shirt</li>
 				
 			</ul>
+			<img src="/img/stellars-jay-print.jpg" alt="A print of a stellar&#39;s jay, a beautiful black and blue bird, about to take off from a branch" loading="lazy" decoding="async" width="1000" height="750">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/quorbs/">
+			<h2 data-ha-exclude="" id="quorbs">quorbs </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>print</li>
+				
+				<li>highlight</li>
+				
+			</ul>
+			<img src="/img/quorbs-print.jpg" alt="A print in two layers of color showing two rotund quails on a branch. Most of the details are in black ink, then there is a layer with a brown gradient filling in some color on the head and breast." loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1570,6 +1576,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/geese/` was built on 2026-04-06T17:26:29.524Z -->
+    <!-- This page `/geese/` was built on 2026-05-04T22:39:21.351Z -->
   </body>
 </html>

_site/gender-as-a-proxy-variable/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gender as a proxy variable">
+<meta property="og:title" content="gender as a proxy variable | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1662,11 +1668,37 @@ export { HeadingAnchors }</script>
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/luminescent/">
+		<a class="postlink" href="/gender/">
+			<h2 data-ha-exclude="" id="gender-2">gender? </h2>
 			
-			<img src="/img/luminescent-print.jpg" alt="A print of a tattooed woman in bright highlighter yellow underwear." class="blur" loading="lazy" decoding="async" width="900" height="1200">
+			<ul class="postlist-tags">
+				
+				<li>gender</li>
+				
+			</ul>
+			<img src="/img/gender-notes.png" alt="A page of handwritten notes with some loosely drawn charts, described further in the post." loading="lazy" decoding="async" width="865" height="1080">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/on-pronouns/">
+			<h2 data-ha-exclude="" id="on-pronouns">on pronouns </h2>
+			
+			<ul class="postlist-tags">
+				
+				<li>gender</li>
+				
+			</ul>
+			<img src="/img/starling.jpg" alt="Image unrelated to post. A starling, a beautifully iridescent black bird, stands on a hanging suet feeder." loading="lazy" decoding="async" width="1000" height="666">
+			
+		</a>
+	</li>
+	
+  <li class="post">
+		<a class="postlink" href="/bottom-growth/">
+			<h2 data-ha-exclude="" id="bottom-growth-mature">bottom growth (mature)</h2>
 			
-			<h2 data-ha-exclude="" id="luminescent-mature">luminescent (mature)</h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
@@ -1674,38 +1706,8 @@ export { HeadingAnchors }</script>
 				<li>gender</li>
 				
 			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/nonbinary-flag/">
+			<img src="/img/bottom-growth-prints.jpg" alt="4 copies of the same print in various color schemes, laid out in a 2x2 grid. The print shows testosterone-driven bottom growth of a clitoris. The color schemes are, clockwise from top right, brown on turquoise, red on cornsilk (muted yellow), violet on magenta, and mint green on lilac." class="blur" loading="lazy" decoding="async" width="1000" height="1000">
 			
-			<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
-			<ul class="postlist-tags">
-				
-				<li>print</li>
-				
-				<li>card</li>
-				
-				<li>gender</li>
-				
-			</ul>
-		</a>
-	</li>
-	
-  <li class="post">
-		<a class="postlink" href="/on-the-ubiquity-of-enby/">
-			
-			<img src="/img/gender-census.jpg" alt="A screenshot of part of the Gender Census reports page, showing the header bar and a title that reads &#39;Gender Census 2023 Worldwide Report&#39;" loading="lazy" decoding="async" width="1000" height="364">
-			
-			<h2 data-ha-exclude="" id="on-the-ubiquity-of-enby">on the ubiquity of &#39;enby&#39; </h2>
-			<ul class="postlist-tags">
-				
-				<li>gender</li>
-				
-			</ul>
 		</a>
 	</li>
 	
@@ -1740,6 +1742,6 @@ export { HeadingAnchors }</script>
 </footer>
 
 
-    <!-- This page `/gender-as-a-proxy-variable/` was built on 2026-04-06T17:26:29.546Z -->
+    <!-- This page `/gender-as-a-proxy-variable/` was built on 2026-05-04T22:39:21.328Z -->
   </body>
 </html>

_site/gender-in-data-models/index.html

@@ -9,7 +9,7 @@
 <meta name="description" content="Lee Cattarin... on the internet!">
 <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="hello hello">
 
-<meta property="og:title" content="gender in data models">
+<meta property="og:title" content="gender in data models | hello hello">
 <meta property="og:type" content="website">
 <meta property="og:description" content="Lee Cattarin... on the internet!">
 <meta property="og:site_name" content="hello hello">
@@ -645,6 +645,12 @@ ul, ol, dl, li {
 	margin-left: 1rem;
 }
 
+@media (max-width: 650px) {
+	ul, ol, dl {
+		margin-left: 0;
+	}
+}
+
 li {
 	line-height: 1.2	5;
 	margin-top: .65rem;
@@ -1275,12 +1281,12 @@ class HeadingAnchors extends HTMLElement {
 			}
 		}
 	}
-
+/* no longer used, using aria-labelledby instead - see getAnchorElement
 	getAccessibleTextPrefix() {
 		// Useful for i18n
 		return this.getAttribute(HeadingAnchors.attributes.prefix) || "Jump to section titled";
 	}
-
+*/
 	getContent() {
 		if(this.hasAttribute(HeadingAnchors.attributes.content)) {
 			return this.getAttribute(HeadingAnchors.attributes.content);
@@ -1314,7 +1320,7 @@ class HeadingAnchors extends HTMLElement {
 		anchor.classList.add(HeadingAnchors.classes.anchor);
 
 		let content = this.getContent();
-		anchor.innerHTML = `<span class="${HeadingAnchors.classes.srOnly}">${this.getAccessibleTextPrefix()}: ${heading.textContent}</span>${content ? `<span aria-hidden="true">${content}</span>` : ""}`;
+		anchor.innerHTML = `<span aria-labelledby=${heading.id}>${content}</span>`;
 
 		anchor.addEventListener("focus", e => {
 			let anchor = e.target.closest(`.${HeadingAnchors.classes.anchor}`);
@@ -1371,7 +1377,7 @@ export { HeadingAnchors }</script>
       </li>
       
       <li>
-        <a href="/" title="">
+        <a href="/" title="home">
           <i class="fa fa-solid fa-crow" aria-hidden="true"></i>
           <span class="menu-text">home</span>
         </a>
@@ -1712,52 +1718,56 @@ This may also be expanded to a multi-step approach, with questions covering some
     <ol id="postlist">
 	
   <li class="post">
-		<a class="postlink" href="/brookes-notebook/">
+		<a class="postlink" href="/happy-solstice-2025/">
+			<h2 data-ha-exclude="" id="happy-solstice-2025">happy solstice 2025 </h2>
 			
-			<img src="/img/brooke-notebook.jpg" alt="A six panel collage showing the covers, endpapers, and some of the pages of a notebook." loading="lazy" decoding="async" width="1000" height="1500">
-			
-			<h2 data-ha-exclude="" id="brookes-notebook">brooke&#39;s notebook </h2>
 			<ul class="postlist-tags">
 				
-				<li>book</li>
-				
 				<li>highlight</li>
 				
 			</ul>
+			<img src="/img/solstice-2025.jpg" alt="front and back of our solstice card from this year, designed in postcard format. long alt incoming... front - 4 picture collage. 1 - i&#39;m standing in the woods, looking to one side, wearing an elaborate knit scarf. 2 - silhouetted thistle-like flowers in front of a pink-purple sky. 3 - my wife brooke crouches down to draw a heart in charcoal on a beach log, with &#39;L + B&#39; written inside. 4 - brooke stands on a driftwood-covered beach looking hella cool in mirrored shades. our dog kes stands in front of her and looks off to one side eagerly. overlaid is the words &#39;happy solstice&#39; in cursive. back - split down the center like the back of a postcard. on the left side, a 5 picture collage. 1 - i stand on a rock at the edge of a calm alpine lake. overlaid is the words &#39;lee, brooke, kestrel, &amp; the flock&#39; in print lettering. 2 - an early spring fern curl. 3 - our six ducks, all facing to the left, not in a row but still very organized. 4 - brooke grins at the camera while hugging kestrel&#39;s head. kestrel looks maybe a bit distraught. 5 - silhouette of a heron in flight across an early morning blue sky. on the address side, i&#39;ve added a dahlia to represent the stamp, and written &#39;you!&#39; in the field that would normally hold the mailing address." loading="lazy" decoding="async" width="1000" height="1346">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/hair/">
+		<a class="postlink" href="/trans-rights-skull/">
+			<h2 data-ha-exclude="" id="trans-rights-skull">trans rights skull </h2>
 			
-			<img src="/img/hair-print.jpg" alt="A print in black ink of belly hair." loading="lazy" decoding="async" width="1000" height="710">
-			
-			<h2 data-ha-exclude="" id="hair">hair </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
+				<li>card</li>
+				
+				<li>sticker</li>
+				
+				<li>pin</li>
+				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/trans-rights-print.jpg" alt="A print in mostly black ink of a smiling skull with a speech bubble. In pink and blue, the speech bubble reads &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
   <li class="post">
-		<a class="postlink" href="/trans-the-world/">
+		<a class="postlink" href="/congrats-on-the-gay/">
+			<h2 data-ha-exclude="" id="congrats-on-the-gay">congrats on the gay </h2>
 			
-			<img src="/img/trans-the-world-print.jpg" alt="A print that reads &#39;trans the world&#39; surrounding an image of a globe and a trans symbol. It&#39;s in a ping-to-blue gradient." loading="lazy" decoding="async" width="1000" height="750">
-			
-			<h2 data-ha-exclude="" id="trans-the-world">trans the world </h2>
 			<ul class="postlist-tags">
 				
 				<li>print</li>
 				
-				<li>shirt</li>
+				<li>card</li>
 				
 				<li>gender</li>
 				
 			</ul>
+			<img src="/img/congrats-on-the-gay.jpg" alt="A greeting card reading, in black. &#39;Congrats on the,&#39; and then, in rainbow, &#39;Gay!&#39;" loading="lazy" decoding="async" width="1000" height="750">
+			
 		</a>
 	</li>
 	
@@ -1792,6 +1802,6 @@ This may also be expanded to a multi-step approach, with questions covering some
 </footer>
 
 
-    <!-- This page `/gender-in-data-models/` was built on 2026-04-06T17:26:29.526Z -->
+    <!-- This page `/gender-in-data-models/` was built on 2026-05-04T22:39:21.354Z -->
   </body>
 </html>