PostERG/xamxam
1
0
Fork 0
mirror of https://codeberg.org/PostERG/xamxam.git synced 2026-05-07 03:29:19 +02:00
Code Issues Packages Projects Releases Wiki Activity
Files
234d7bae40545e41d8956cade90564158464b98d
xamxam/todo/04-accessibility.md
Pontoporeia ff8e33727d admin: semantic HTML pass — checkbox fieldset, landmarks, dl/dt, autocomplete, inline styles 
checkbox-list.php partial:
- Replace outer <div>/<label> with <div>/<span class="admin-row-label"> + inner
  <fieldset class="admin-checkbox-group"><legend class="sr-only"> to satisfy
  WCAG 1.3.1 (group label for multi-checkbox rows without duplicating visible text)
- Replace <div class="admin-checkbox-list"> with <ul>; each checkbox wrapped in <li>

admin.css:
- Drop .admin-checkbox-list; add .admin-body fieldset.admin-checkbox-group rules
  (border/padding reset so it doesn't inherit jury-fieldset box styling)
- Extend form-row label rule to span.admin-row-label
- .admin-inline-form + .admin-inline-form { margin-top:.35rem } replaces inline style
- .admin-input--inline / .admin-select--inline get width:160px (was inline style)
- .admin-tags-count + table th sizing via :has() replaces th inline styles

login.php: wrap content in <main id="main-content"> (missing landmark)

account.php:
- <div class="admin-account-status"> → <dl>; __label <span> → <dt>
- <div class="admin-danger-zone__description"> → <p>

index.php: <div class="admin-maintenance-bar"> → <aside role="status" aria-label="Statut du site">

add.php / edit.php: autocomplete="name" on author field, autocomplete="email" on
contact field (WCAG 1.3.5 / input purpose)

tags.php: all inline style= attributes removed (width, text-align, margin-top,
display:inline); all moved to CSS classes
2026-04-06 15:33:08 +02:00

4.4 KiB
Raw Blame History

Accessibility Audit (WCAG 2.1 AA)

1.1.1 Non-text content (alt text)

  • Admin <nav> "✕ Réinitialiser" and "✕" remove buttons — wrap ✕ in <span aria-hidden="true">✕</span>; add aria-label="Supprimer ce membre du jury" on jury remove buttons in add.php/edit.php

1.3.1 Info and relationships

  • Admin form rows: multi-input rows (languages, formats) — checkbox-list.php partial now wraps checkboxes in <fieldset class="admin-checkbox-group"> with a <legend class="sr-only"> for AT grouping

  • Status badges in admin/index.php convey state by colour alone — add visible non-colour distinction (prefix icon with aria-hidden="true") and aria-label="Statut : Publié" on badge <span>

1.3.4 / 1.3.5 Orientation & Input purpose

  • No autocomplete attributes on personal data fields — add.php/edit.php: autocomplete="name" on author fields, autocomplete="email" on mail fields (via $attrs in text-field.php)

1.4.1 Use of colour

  • Active nav link has no non-colour indicator — must include a non-colour signal (underline, border, weight change) alongside aria-current="page"

  • Admin purple #9557b5 as text colour on dark #1a1a1a: 3.57:1 — audit every use of var(--admin-purple) as text; ensure it is only used at large-text sizes (≥18pt/24px or bold ≥14pt)

1.4.4 Resize text

  • Verify no text is set in px — ensure width: 14px; height: 14px on checkboxes and similar elements do not prevent text scaling

1.4.12 Text spacing

  • No text-spacing override test done — verify WCAG 1.4.12 bookmarklet does not cause content clipping (especially overflow: hidden on .card__media and tight aspect-ratio: 4/3)

2.1.1 Keyboard

  • Jury "✕" remove buttons in add.php/edit.php — add aria-label for keyboard discoverability

2.4.3 Focus order

  • On tfe.php the ← Retour back link is at the bottom of the left column in DOM — consider moving above <h1> or adding a copy at the top so keyboard users can exit quickly

2.4.4 Link purpose

  • Home page cards: if two theses share the same title, identical link texts exist — append year in <span class="sr-only"> to disambiguate

2.5.3 Label in name

  • <a class="clear-filter">✕ Réinitialiser</a> — wrap ✕ in <span aria-hidden="true">
  • Admin jury remove buttons ✕ — aria-label="Supprimer ce lecteur" replaces the symbol

2.5.5 Target size

  • Pagination buttons are 2rem (32px) — increase to min-height: 2.75rem; min-width: 2.75rem (44px)
  • Admin .admin-btn-sm (~28px) — increase to minimum 32px with padding
  • Admin bulk action buttons and jury remove ✕ buttons (~28px) — increase target size

3.1.1 Language of page

  • All public pages have <html lang="fr"> — verify this is true after any template changes ✓ (no action needed unless templates change)

3.3.1 Error identification

  • add.php/edit.php validation errors — flash-messages.php already emits <p role="alert" data-type="error"> for errors and <p role="status"> for success
  • add.php/edit.php autofocus on first invalid field — requires controller to pass back which field failed; deferred (larger refactor)

3.3.2 Labels or instructions

  • Admin jury "Lecteur·ices" label has no for attribute — wrap lecteur rows in <fieldset>/<legend> or use aria-describedby

4.1.2 Name, role, value

  • Custom "Externe" checkbox for jury members has no group context — add aria-label="[Nom du promoteur] est externe" dynamically via JS, or aria-describedby pointing to the adjacent name input

  • <video> elements on tfe.php have no captions — add <track kind="captions"> slot in template; document caption requirement in admin upload form

  • Admin <select> for visibility/access in edit.php uses truncated option text — use full description in option text (or title attribute); keep truncated text only for visual display

  • Bulk publish/unpublish JS does not announce result to screen readers — add role="alert" to error messages and role="status" to success messages across all admin pages

5 - Motion & user preferences

  • prefers-color-scheme not respected — site has fixed white public / fixed dark admin themes; consider a dark-mode variant for public pages (not a WCAG failure, but quality-of-life)
Reference in New Issue View Git Blame Copy Permalink