A/B Preview · devreports “new” icon
Date: 2026-05-13 Surface: devreports.dare.co.uk catalog index — the per-row “new” indicator on report links HTML preview: dare_ab_preview_devreports_new_icon_2026-05-13.html Status: ✅ Resolved — Variant B (dot) wired in. The other four are tracked here as deliberation artefact.
The problem
The catalog index was attaching an uppercase white-on-accent NEW badge to every row where the report-type appeared in the catalog for the first time on that day. By 2026-05-13 the catalog had grown enough that 40 of these badges were rendering at once on the index page. The signal collapsed into visual noise — “when everything is new, nothing is.”
What we considered
Five treatments rendered side-by-side at realistic density in the HTML preview:
| Letter | Treatment | Visual weight | Verdict |
|---|---|---|---|
| A | Uppercase badge (current) — NEW white-on-accent, letterspaced |
Loud — overwhelming at 40 instances | Status quo, rejected |
| B | Dot — 6px accent circle after the title | Lowest — almost invisible at scan, intentional on close look | ✅ Chosen |
| C | Subtle italic — new in accent color, no fill | Low-medium — readable but discreet | Runner-up — keep in pocket if dot becomes unreadable at scale |
| D | Underline only — accent line under title | Lowest — marks new without inserting anything | Considered; the underline conflicts with :hover semantics |
| E | Tilde glyph — ~ in DM Mono before title |
Low — typographic, plays with mono timestamps | Charming but unfamiliar idiom |
Why B
Three reasons:
- Lowest visual weight at high density — even at 40 instances, dots disappear into the table rhythm rather than fighting for attention. The “this is new” signal is preserved without being shouted.
- Compatible with the catalog’s existing aesthetic — the dot picks up the accent color used elsewhere, matches the type rhythm of DM Sans, and doesn’t introduce a new typographic idiom.
- Accessibility-preserving — implemented as
<span class="new-badge" aria-label="new"></span>so screen readers still announce “new” on those rows.
What also got reconsidered while we were here
Mid-deliberation, the framing shifted from “which badge variant?” to “does this row-level flag need to exist at all?” The position (newest at top of each day’s group) and the timestamp column already do the work. A future iteration parked for next session: a “Today” anchor block at the top of the catalog — narrator paragraph + linked latest reports — replacing per-row flags entirely with a persistent daily-status surface.
For now, the dot ships. The anchor-block iteration is parked with resume signal: “first time you wish the catalog had a daily reading anchor.”
What landed (the code)
~/bin/seo_render_html.py:181-194—.new-badgeCSS swapped from text-badge to 6px dot~/bin/dare_dev_reports_publish.py:406— markup changed from<span class="new-badge">NEW</span>to<span class="new-badge" aria-label="new"></span>
Single class name preserved (.new-badge), no template-wide refactor. Next publish run renders the dot.
Linked memories
“When everything is new, nothing is” — Dan, 2026-05-13. The dot is the smallest signal that still tells the truth.