Skip to content

feat(ux): wave 3 — copy, E-E-A-T metadata, a11y polish - #19

Merged
Bissbert merged 2 commits into
mainfrom
feature/wave3-copy-eeat
May 5, 2026
Merged

Bissbert merged 2 commits into
mainfrom
feature/wave3-copy-eeat

Conversation

@Bissbert

@Bissbert Bissbert commented May 5, 2026

Copy link
Copy Markdown
Contributor

Summary

Implements Wave 3 of the 2026-05-05 UX review — copy refinements, E-E-A-T credibility metadata, and accessibility polish. Final wave; closes the prioritised review backlog.

Copy

  • Homepage hero, feature-grid heading, BrE consistency ("practising"/"colour")
  • /quiz, /gallery, /tools, /404 body copy and CTA labels
  • Footer FGA reference now underlined for affordance

E-E-A-T

  • Author byline ("By gemmology.dev editors") and "Last updated" line on every learn article
  • LearningResource + Article JSON-LD with headline, author, publisher, dateModified, datePublished, about
  • File-mtime fallback for dateModified so unreviewed articles still emit a date

A11y / Visual

  • Decorative arrows in link text wrapped with aria-hidden=\"true\" across tools, references, counterparts
  • Gallery search input given proper ``, id, and name
  • Mineral detail page: CrystalStructureCard moved to top of left column so the SVG renders above the fold on every viewport
  • Acronym-aware formatLabel (CVD, HPHT, FTIR, …) shared between mineral detail, FamilyModal, and CounterpartsSection — no more `Cvd Diamond`
  • Synthetics list strips parenthetical expression (e.g. "Diamond (Octahedron)" → "Diamond") since the list is family-scoped
  • "Difficulty (optional)" spacing fix
  • 404 "Return to homepage" CTA replaces dead Playground link

Deferred (P2 nice-to-have, content-dependent)

  • Article intros restructured to lead with the citable answer (requires editing YAML in gemmology-knowledge)
  • References footer rendering for [ref:slug] markers (dormant — no markers in current content)
  • Sticky progress + collapsible TOC for long articles (>6 H2)
  • Asterism / point-group bridge content extension

Test plan

  • Build succeeds (`npm run build`)
  • Mineral detail at narrow lg width shows the crystal SVG above QuickFacts
  • Synthetics card on /minerals/diamond-octahedron says "Diamond", not "Diamond (Octahedron)"
  • CVD/HPHT acronyms render uppercase in growth_method labels
  • Footer FGA link visibly underlined
  • Gallery search input has accessible label

Bissbert added 2 commits May 5, 2026 18:14
Hero, gallery, tools, quiz, 404, and footer rewrites driven by the 2026-05-05
UX review.

Copy:
- Hero headline now describes the actual product ("Crystal morphology, rendered
  precisely"); subhead trimmed to two sentences with concrete numbers.
- Feature-grid heading rewritten for the FGA + developer audience.
- Quiz page H1 + subhead promoted from "Quiz" to "Practice and Exam Mode" with
  question count.
- Gallery subhead drives off live family + expression counts (was "90+").
- Tools subhead enumerates the actual calculators on the bench.
- 404 body copy rewritten ("This page doesn't crystallise…"); CDL Playground
  swapped for Quiz in the popular-pages grid; "Go Home" → "Return to homepage".
- Synthetics section subhead strips the "(Octahedron)" expression suffix.
- "Start practicing now" → "Start practising now" (BrE consistency).

Accessibility:
- Wrap every trailing → in user-facing link text in <span aria-hidden="true">
  so screen readers don't announce "right arrow" after the link label.
- Footer FGA link gets underline + offset (fixes Lighthouse
  link-in-text-block).
- Gallery search input now has a visually-hidden label, id, and name
  attribute.
- CVD/HPHT capitalisation: extracted shared formatLabel() so growth_method
  fields render "CVD" / "HPHT", not "Cvd" / "Hpht", everywhere
  (FamilyModal, CounterpartsSection).
- Move CrystalStructureCard to top of left column so the rendered crystal
  appears above QuickFacts on every viewport, not below the property table
  at narrower lg widths.
- Replace inline ACRONYMS/formatLabel with the shared src/lib/format-label.ts
  helper used by FamilyModal and CounterpartsSection.
@Bissbert
Bissbert merged commit 316fa22 into main May 5, 2026
1 of 2 checks passed
@github-actions

github-actions Bot commented May 5, 2026

Copy link
Copy Markdown

🚀 Preview deployed to: https://98521bbf.gemmology-dev.pages.dev

Bissbert added a commit that referenced this pull request May 5, 2026
Wave 3 merged via PR #19 (commit 316fa22). Records what shipped and what
was explicitly deferred (content-dependent items + obsolete dark-band chip).
Bissbert added a commit that referenced this pull request May 11, 2026
* feat(ux): wave 3 batch 1 — copy + a11y polish

Hero, gallery, tools, quiz, 404, and footer rewrites driven by the 2026-05-05
UX review.

Copy:
- Hero headline now describes the actual product ("Crystal morphology, rendered
  precisely"); subhead trimmed to two sentences with concrete numbers.
- Feature-grid heading rewritten for the FGA + developer audience.
- Quiz page H1 + subhead promoted from "Quiz" to "Practice and Exam Mode" with
  question count.
- Gallery subhead drives off live family + expression counts (was "90+").
- Tools subhead enumerates the actual calculators on the bench.
- 404 body copy rewritten ("This page doesn't crystallise…"); CDL Playground
  swapped for Quiz in the popular-pages grid; "Go Home" → "Return to homepage".
- Synthetics section subhead strips the "(Octahedron)" expression suffix.
- "Start practicing now" → "Start practising now" (BrE consistency).

Accessibility:
- Wrap every trailing → in user-facing link text in <span aria-hidden="true">
  so screen readers don't announce "right arrow" after the link label.
- Footer FGA link gets underline + offset (fixes Lighthouse
  link-in-text-block).
- Gallery search input now has a visually-hidden label, id, and name
  attribute.
- CVD/HPHT capitalisation: extracted shared formatLabel() so growth_method
  fields render "CVD" / "HPHT", not "Cvd" / "Hpht", everywhere
  (FamilyModal, CounterpartsSection).

* fix(ux): mineral detail — crystal SVG above the fold; dedupe formatLabel

- Move CrystalStructureCard to top of left column so the rendered crystal
  appears above QuickFacts on every viewport, not below the property table
  at narrower lg widths.
- Replace inline ACRONYMS/formatLabel with the shared src/lib/format-label.ts
  helper used by FamilyModal and CounterpartsSection.
Bissbert added a commit that referenced this pull request May 11, 2026
Wave 3 merged via PR #19 (commit 66776b3). Records what shipped and what
was explicitly deferred (content-dependent items + obsolete dark-band chip).

This branch was successfully deployed

1 active deployment
gemmology-dev (Preview) — d6c05ea0 Deployed May 5, 2026 by github-actions[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant