My collection of over 80 88x31 badges, representing what I and this site use and stand for. If you have a badge you'd like me to add, just ask; it needs to have a format under 3 kb and avoid excessively flashy animations for me to consider it. [See some tools I use for image optimization]({{<relref "/posts/website-best-practices.md#image-optimization">}}).
<ahref="https://seirdy.one/">{{<picturename="b/sticker_88x31"alt="My favicon, a white colon and semicolon on a black backround, next to the word “Seirdy”."width="176"height="62"class="pix">}}</a>
Note that this image's URL is cache-busted. It will change any time I alter my badge, and is **not** hotlink-friendly. If you wish to hotlink, use one of these URLs:
- Use `image-rendering: pixelated;` in your CSS for most 88x31 badges, so upscaling filters don't ruin pixel art.
- Double the width and height in your HTML to `width="176" height="62"` to make them easier to read on higher-resolution screens.
- The more consecutive badges you have, the shorter your alt-text should be. Balance the need for detail against the need to skim.
- If you want to detect my button programmatically, consider the [`.well-known/button.json` schema](https://codeberg.org/LunarEclipse/well-known-button).
<ahref="https://anybrowser.org/campaign/">{{<picturename="b/any_browser"alt="The text “any browser you like.” next to a light prism."width="176"height="62"class="pix">}}</a>
<ahref="https://validator.w3.org/feed/check.cgi?url=https%3A%2F%2Fseirdy.one%2Fatom.xml">{{<picturename="b/valid-atom"alt="Valid Atom feed."width="176"height="62"class="pix">}}</a>
<ahref="https://www.mabsland.com/Adoption.html">{{<picturename="b/panda_14c"alt="Smug panda fursona next to the text “Web 14”."width="176"height="62"class="pix">}}</a>
<ahref="https://internet.nl/faqs/ipv6/">{{<picturename="b/ipv6"alt="The word “IPv6” next to a green checkmark."width="176"height="62"class="pix">}}</a>
<ahref="https://www.gnu.org/licenses/agpl-3.0.en.html">{{<picturename="b/agplv3"alt="AGPL v3: Free Software. It stands for GNU Affero General Public Licence, version 3."width="176"height="62"class="pix">}}</a>
The W3C Valid HTML5 badge isn't offered by the new Nu HTML Checker because [HTML5 is about conformance, not validity](https://html5doctor.com/html5-check-it-before-you-wreck-it-with-miketm-smith/). I use it anyways because my markup does fully conform _and_ is well-formed polygot XHTML5, despite false-positives from validators; [see my conformance statement]({{<relref "/meta/site-design.md#conformance">}}).
I build Nginx, Conduit, Webmentiond, and other software for seirdy.one using LLVM in a Chimera Linux container, due to LLVM's release-build-optimized sanitizers such as ControlFlowIntegrity.
{{<picturename="b/anonymize"alt="Anonymize the web now!"width="176"height="62"class="pix">}}
<ahref="https://justinjackson.ca/webmaster/">{{<picturename="b/fckingwww"alt="The dark green text “fucking webmaster” on a shell prompt in a terminal window."width="176"height="62"class="pix">}}</a>
{{<picturename="b/frames-suck"alt="The text “Campaign against frames!” next to a crossed-out webpage full of frames."width="176"height="62"class="pix">}}
{{<picturename="b/right2repair"alt="I support right to repair."width="176"height="62"class="pix">}}
<ahref="https://www.w3.org/Promotion/WIP/">{{<picturename="b/wip"alt="The text “Web Interoperability Pledge” next to a drawing of gears."width="176"height="62"class="pix">}}</a>
<ahref="https://archive.webstandards.org/bannerx.html">{{<picturename="b/wpsnowbord"alt="A wasp next to the words “standards NOW!”"width="176"height="62"class="pix">}}</a>
<ahref="https://web.archive.org/web/20060206224207fw_/http://www.subreality.com/yellow.htm">{{<picturename="b/yellow_ribbon"alt="Yellow ribbon: online friendship means something!"width="176"height="62"class="pix">}}</a>
### Notes on "Ideological affinity, Web-related" badges
I included "Right to repair" in this section because I think that page-alteration (via adblockers, inspect-element, userstyles, etc.) counts as exercising one's right to (software) repair. Free software, accessibility, and Right to Repair are interlinked. I previously microblogged [in defense of content blocking from a right-to-repair perspective]({{<relref "/notes/in-defense-of-content-blocking.md">}}).
<ahref="https://www.autisticasfxxk.com/">{{<picturename="b/autisticasfxxk.com"alt="The words “autistic as fuck” flash over a pick background. The word “fuck” is censored."width="176"height="62"class="pix">}}</a>
<ahref="https://www.defectivebydesign.org/">{{<picturename="b/dbd"alt="Defective by design. Eliminate DRM now!"width="176"height="62"class="pix">}}</a>
<ahref="https://en.wikipedia.org/wiki/Illegal_number?useskin=vector">{{<picturename="b/aacs"alt="The characters “8 8 8 C 0” over the vertical strips of the digital free speech flag."width="176"height="62"class="pix">}}</a>
<ahref="https://github.com/yt-dlp/yt-dlp">{{<picturename="b/yt-dl"alt="The word “youtube-dl” flashes on a command prompt."width="176"height="62"class="pix">}}</a>
<ahref="https://tea.cuddleslut.fr/">{{<picturename="b/tea_banner"alt="the word “tea” over a nonbinary flag next to a blushing personified teacup."width="176"height="62"class="pix">}}</a>
<ahref="https://www.theresnotime.co.uk/">{{<picturename="b/theresnotime"alt="fox head over the words “TheresNoTime”."width="176"height="62"class="pix">}}</a>
<ahref="https://keithhacks.cyou/">{{<picturename="b/keith"alt="the word “keith” after a tilde and a bone, with a rainbow border."width="176"height="62"class="pix">}}</a>
<ahref="https://moth.monster/">{{<picturename="b/moth"alt="The word “moth” in a brown-on-orange palette next to a flat inverted moth icon."width="176"height="62"class="pix">}}</a>
The Yesterweb is winding down its social activity after admin burnout, but it remains an important place during the Old Web revival of the late-2010s to early-2020s. I'm keeping the badge even if the rest of the shuts down (though it'll probably stick around in archived form).
<ahref="https://www.nbcuni.co.jp/rondorobe/anime/lain/">{{<picturename="b/lain"alt="Close-up of Lain Iwakura’s eyes with a static filter."width="176"height="62"class="pix">}}</a>
<ahref="https://ooo.eeeee.ooo/">{{<picturename="b/miku"alt="The text “This site is Miku-approved” next to Hatsune Miku."width="176"height="62"class="pix">}}</a>
{{<picturename="b/graphicdesign"alt="The words “graphic design is my passion” next to a bad drawing of a frog. Sarcasm implied."width="176"height="62"class="pix">}}
- All "friendly sites" badges except xkcd (I don't know who made that)
Other credits:
- The W3C CSS badge is from {{<mention-workrole="doc-credit"itemtype="Article"itemprop="citation">}}{{<cited-workname="The W3C “validation” icons"url="https://www.w3.org/QA/Tools/Icons"extraName="headline">}} by the <abbritemscope=""itemtype="https://schema.org/Organization"itemprop="publisher"title="World Wide Web Consortium">W3C</abbr>{{</mention-work>}}
- I took the WAI-AA WCAG 2.2 badge from {{<mention-workrole="doc-credit"itemtype="WebPage"itemprop="citation">}}{{<cited-workname="Adding WCAG Conformance Logos"url="https://www.w3.org/WAI/standards-guidelines/wcag/conformance-logos/"extraName="headline">}} by the <abbritemscope=""itemtype="https://schema.org/Organization"itemprop="publisher"title="Web Accessibility Initiative">WAI</abbr>{{</mention-work>}}.
- I cropped the "I ❤ Validator" badge from {{<mention-workrole="doc-credit"itemtype="Article"itemprop="citation">}}{{<cited-workname="W3C launches Validator Donation and Sponsorship Campaign"url="https://www.w3.org/news/2008/w3c-launches-validator-donation-and-sponsorship-campaign/"extraName="headline">}} by the <abbritemscope=""itemtype="https://schema.org/Organization"itemprop="publisher"title="World Wide Web Consortium">W3C</abbr>{{</mention-work>}}.
- The El Goonish Shive badge is from [an old archived version of its website](https://web.archive.org/web/20071223104609/http://www.egscomics.com:80/banners.html).
