redesign 09 — a11y & print sweep (rebuilt on current base) #15

Merged

michalvankodev merged 2 commits from redesign/09-a11y-print-v2 into redesign/08-syndication-perf 2026-09-09 15:36:36 +02:00

Conversation 0 Commits 2 Files changed 6 +148 -22

michalvankodev commented 2026-09-09 15:27:32 +02:00

Owner

Copy link

What

Rebuild of the stale #14 — re-implemented from intent directly on the current base (post-#13, incl. cache/CSS-hashing follow-ups). The old branch carried superseded copies of slices 5–8 and conflicted with its base; this one is the slice only.

• Skip-to-content — first tab stop, jumps to <main id="main-content" tabindex="-1">; visually hidden until focused.
• aria-current="page" on the active masthead nav item — tiny inline script (the header is a static include; must survive the wget export). Active styling moved into CSS: #site-nav a[aria-current="page"], so it can't silently drop out of the Tailwind bundle (the old draft relied on a coincidental class usage elsewhere).
• Print — white page surface; the print:hidden chrome (header, footer, TOC rail, further reading, progress bar, year headers, back-to-top) verified on the new base; article body prints as flowing text.
• Reduced motion — the four social brand hovers (twitch shift, youtube scale, instagram dim, tiktok glitch) now gated behind prefers-reduced-motion: no-preference; smooth scrolling was already gated.
• View-transition polish — authored hero cover ↔ article cover plate morph (post_cover_<slug> on both ends); list-row ↔ title names already existed.

Deliberately not in this PR

• Per-post lang — dropped: the site is English-only.
• Contrast sweep — deferred; full inventory (actual vs proposed, with measured ratios) written up in specs/contrast-sweep.md for separate review. Headline: slate-500 metadata on blue-50 measures 4.37:1 — below the 4.5:1 AA bar; 8 spots to bump to slate-600.

Verification

• cargo test --all-features — 32 passed
• Tailwind build emits .skip-link, #site-nav a[aria-current='page'], @media print, 4× reduced-motion blocks
• Served output verified on a dev instance (skip link first in <body>, landmark target, VT names on hero + article cover)

## What Rebuild of the stale #14 — re-implemented from intent directly on the current base (post-#13, incl. cache/CSS-hashing follow-ups). The old branch carried superseded copies of slices 5–8 and conflicted with its base; this one is the slice only. - **Skip-to-content** — first tab stop, jumps to `<main id="main-content" tabindex="-1">`; visually hidden until focused. - **`aria-current="page"`** on the active masthead nav item — tiny inline script (the header is a static include; must survive the wget export). Active styling moved into CSS: `#site-nav a[aria-current="page"]`, so it can't silently drop out of the Tailwind bundle (the old draft relied on a coincidental class usage elsewhere). - **Print** — white page surface; the `print:hidden` chrome (header, footer, TOC rail, further reading, progress bar, year headers, back-to-top) verified on the new base; article body prints as flowing text. - **Reduced motion** — the four social brand hovers (twitch shift, youtube scale, instagram dim, tiktok glitch) now gated behind `prefers-reduced-motion: no-preference`; smooth scrolling was already gated. - **View-transition polish** — authored hero cover ↔ article cover plate morph (`post_cover_<slug>` on both ends); list-row ↔ title names already existed. ## Deliberately not in this PR - **Per-post `lang`** — dropped: the site is English-only. - **Contrast sweep** — deferred; full inventory (actual vs proposed, with measured ratios) written up in [`specs/contrast-sweep.md`](https://forgejo.katelyn.michalvanko.dev/michalvankodev/michalvankodev-site/src/branch/redesign/09-a11y-print-v2/specs/contrast-sweep.md) for separate review. Headline: slate-500 metadata on blue-50 measures 4.37:1 — below the 4.5:1 AA bar; 8 spots to bump to slate-600. ## Verification - `cargo test --all-features` — 32 passed - Tailwind build emits `.skip-link`, `#site-nav a[aria-current='page']`, `@media print`, 4× reduced-motion blocks - Served output verified on a dev instance (skip link first in `<body>`, landmark target, VT names on hero + article cover)

michalvankodev added 2 commits 2026-09-09 15:27:32 +02:00

redesign: a11y & print sweep — skip link, aria-current nav, print, reduced motion, cover morph ... 0d0f68af7a

- Skip-to-content link as first tab stop → <main id=main-content
  tabindex=-1> landmark; visually hidden until focused
- aria-current=page on the active masthead nav item (tiny inline script —
  the header is a static include and must survive the static export).
  Active styling lives in CSS: #site-nav a[aria-current='page'] — not a
  JS-injected class, so it can't silently fall out of the Tailwind bundle
- Print: white page surface; chrome already carries print:hidden
- Reduced motion: the four social brand hovers (twitch shift, youtube
  scale, instagram dim, tiktok glitch) gated behind
  prefers-reduced-motion: no-preference; smooth scrolling was already gated
- View transitions: authored hero cover ↔ article cover plate morph via
  post_cover_<slug> on both ends (list-row ↔ title names already existed)
- Dropped from the stale draft of this slice: per-post lang front matter
  (site is English-only) and the contrast sweep (deferred, see
  specs/contrast-sweep.md)

specs: contrast sweep decision record — actual vs proposed state (deferred) ... 7c4c442277

Metadata text on the blue-50 page surface: slate-500 measures 4.37:1 and
slate-400 2.36:1 — both below the 4.5:1 AA bar for normal-size text.
slate-600 (6.96:1) is the floor. Inventory of the 8 failing spots with
proposed fixes; white-plate card labels already pass and are optional to
normalize. Review separately before implementing.

michalvankodev changed title from WIP: redesign 09 — a11y & print sweep (rebuilt on current base) to redesign 09 — a11y & print sweep (rebuilt on current base) 2026-09-09 15:35:53 +02:00

michalvankodev merged commit 68c5ba277d into redesign/08-syndication-perf 2026-09-09 15:36:36 +02:00

michalvankodev referenced this pull request from a commit 2026-09-09 15:36:37 +02:00

Merge pull request 'redesign 09 — a11y & print sweep (rebuilt on current base)' (#15) from redesign/09-a11y-print-v2 into redesign/08-syndication-perf

michalvankodev referenced this pull request 2026-09-09 15:36:45 +02:00

WIP: redesign 09 — a11y & print sweep (stack tip) #14

michalvankodev referenced this pull request 2026-09-09 15:37:37 +02:00

redesign: a11y & print sweep into foundation #16

Sign in to join this conversation.

Reviewers

No reviewers

Labels

Clear labels

No items

No labels

Milestone

Clear milestone

No items

No milestone

Projects

Clear projects

No items

No project

Assignees

Clear assignees

No assignees

1 participant

Notifications

Subscribe

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference

michalvankodev/michalvankodev-site!15

No description provided.