1
0
Fork 0
mirror of https://git.sr.ht/~seirdy/seirdy.one synced 2024-11-30 15:22:09 +00:00

Compare commits

..

3 commits

Author SHA1 Message Date
Rohan Kumar
b00a608f51
New note: "agent optimization" 2022-06-23 16:12:21 -07:00
Rohan Kumar
e2704fab7c
Fix bad links 2022-06-23 16:10:11 -07:00
Rohan Kumar
7546bd1c20
Fix heading permalinks in reading mode
horrible hack, crimes.
2022-06-22 21:18:32 -07:00
6 changed files with 38 additions and 12 deletions

View file

@ -112,7 +112,7 @@ html {
input, input,
dt > a, dt > a,
summary, summary,
h2 + a, aside > a, /* Used for section permalinks */
li > a { li > a {
padding: .75em .25em; padding: .75em .25em;
} }
@ -136,7 +136,7 @@ html {
margin-bottom: -1em; margin-bottom: -1em;
} }
h2 + a { aside > a {
margin: -.75em -.25em; margin: -.75em -.25em;
} }
@ -144,7 +144,7 @@ html {
header > nav, header > nav,
/* List items with direct hyperlink children should only have one hyperlink. */ /* List items with direct hyperlink children should only have one hyperlink. */
li > a, li > a,
h2 + a, aside > a,
nav ol a { nav ol a {
margin-left: -.25em; margin-left: -.25em;
display: inline-block; display: inline-block;

View file

@ -14,9 +14,6 @@
* use, see below. */ * use, see below. */
article summary, article summary,
section[aria-labelledby="webmentions"], section[aria-labelledby="webmentions"],
/* Currently only used for in-page heading anchors,
* useless in printouts. */
h2 + a,
/* You can't navigate in a printout. */ /* You can't navigate in a printout. */
footer, footer,
/* splitting up sections with <hr> is unnecesary if those /* splitting up sections with <hr> is unnecesary if those

View file

@ -0,0 +1,14 @@
---
title: "Agent optimization"
date: 2022-06-23T16:12:13-07:00
---
I'm thinking about coining a term to reflect a non-toxic alternative to "search engine optimization" (SEO). Working name: "agent optimization".
[MDN has SEO guidelines](https://developer.mozilla.org/en-US/docs/MDN/Contribute/Howto/Write_for_SEO) because people often find MDN articles through general-purpose search engines. I noticed that a subset of their advice is directly beneficial to readers.
For example: imagine two pages have almost the same content (e.g. pages on the `width` and `height` CSS properties). Nearly-identical pages confuse search engines. To avoid duplicate content, authors are encouraged to differentiate the pages by using different examples. This is actually great for readers: when a reader navigates from one page to the next, it'd be unhelpful to present the same example again. Perhaps the `width` example could describe adaptation to a narrow viewport, while the `height` example could describe the trick for handling image aspect ratios with `height: auto`.
Lots of SEO is actually just basic design and accessibility guidelines: use good link names, remember alt-text, be mobile-friendly, use headings, don't require tons of JS to display content, prefer semantic HTML, etc. Stuff like structured data also helps improve reader-mode implementations and makes content-blocking easier.
SEO gets toxic when it veers into copywriting guidelines, tricks like adding the current year to your heading ("Best products to buy in <var>CURRENT_YEAR</var>"), backlink-building, etc. Much of this does include so-called "white-hat SEO". I think that I should distinguish "agent optimization" from "search engine optimization" by making it about accommodating the tools people use to find information, rather than about ranking high in search results or getting clicks. Once I finish my current <abbr title="Work In Progress">WIP</abbr> blog post (it's about how to make privacy recommendations for different audiences), I think I'll write about this. In the meantime, any ideas you have are welcome; please share them.

View file

@ -1,8 +1,22 @@
<!--
Intended properties of this render-hook:
1. Headings are focusable, but not from the keyboard. This allows VoiceOver to navigate to a heading from the TOC.
2. <h2> elements are followed by a section permalink, which is useful for sharing a subset of an article.
3. The page looks as similar as possible to graphical-browsers, textual browsers (e.g. Lynx), and assistive technologies.
4. Reading-mode implementations preserve headings without getting confused by the section permalinks.
5. Machine-translation works as intended with or without assistive technologies.
6. All of this applies with or without CSS.
To achieve all these properties, I had to break the first rule of ARIA and misuse <aside>.
I'm a markup criminal now.
-->
<h{{ .Level }} id="{{ .Anchor | safeURL }}" tabindex="-1">{{ .Text | safeHTML -}}</h{{ .Level }}> <h{{ .Level }} id="{{ .Anchor | safeURL }}" tabindex="-1">{{ .Text | safeHTML -}}</h{{ .Level }}>
{{- if and (eq .Level 2) (eq .Page.Section "posts") }} {{- if and (eq .Level 2) (eq .Page.Section "posts") -}}
<a <!--crimes-->
<aside role="none"><a
id="{{ .Anchor | safeURL }}-anchor" href="#{{ .Anchor | safeURL }}" id="{{ .Anchor | safeURL }}-anchor" href="#{{ .Anchor | safeURL }}"
aria-labelledby="{{ .Anchor | safeURL }}-prefix {{ .Anchor | safeURL }}"> aria-labelledby="{{ .Anchor | safeURL }}-prefix {{ .Anchor | safeURL }}">
<span id="{{ .Anchor | safeURL }}-prefix">Permalink to section</span> <span id="{{ .Anchor | safeURL }}-prefix">Permalink to section</span>
</a> </a></aside>
{{- end }} {{- end }}

View file

@ -1,4 +1,4 @@
{{- $wbmLinks := (slice "https://si3t.ch/log/2021-04-18-entetes-floc.html" "https://xmpp.org/2021/02/newsletter-02-feburary/") -}} {{- $wbmLinks := (slice "https://si3t.ch/log/2021-04-18-entetes-floc.html" "https://xmpp.org/2021/02/newsletter-02-feburary/" "https://gurlic.com/technology/post/393626430212145157" "https://gurlic.com/technology/post/343249858599059461") -}}
<hr /> <hr />
<section aria-labelledby="webmentions"> <section aria-labelledby="webmentions">
<h2 id="webmentions" tabindex="-1">Webmen&#173;tions</h2> <h2 id="webmentions" tabindex="-1">Webmen&#173;tions</h2>

View file

@ -1,12 +1,13 @@
DirectoryPath: "public" DirectoryPath: "public"
IgnoreDirs: IgnoreDirs:
- "search" - "search"
CacheExpires: "96h" # four days CacheExpires: "168h" # seven days
CheckFavicon: true CheckFavicon: true
EnforceHTML5: true EnforceHTML5: true
IgnoreAltMissing: true # an empty alt makes presentation-role explicit, it's not a defect. IgnoreAltMissing: true # an empty alt makes presentation-role explicit, it's not a defect.
EnforceHTTPS: true EnforceHTTPS: true
ExternalTimeout: 30 ExternalTimeout: 180
HTTPConcurrencyLimit: 96
IgnoreHTTPS: IgnoreHTTPS:
- "http://192.168.1" - "http://192.168.1"
- "http://localhost:" - "http://localhost:"