Accessibilitat

Els estàndards amb què està construït el lloc, mesurats contra WCAG 2.2 amb AA com a objectiu. El que segueix és el que fa realment el codi, inclòs on el verd de marca va obligar a un compromís honest.

Els estàndards

  1. Enllaç per ometre i regions de referència

    2.4.1 Bypass Blocks · A

    Un visitant amb teclat aterra primer en un enllaç Skip to content que salta per sobre de la interfície fins a la regió principal. La pàgina està construïda amb regions de referència reals: un main, elements de navegació etiquetats i un footer.

  2. Focus visible

    2.4.7 Focus Visible · AA

    Cada control es focalitza amb un anell verd de dos píxels situat a dos píxels de la vora, que es mostra per al focus de teclat i no per a un clic de ratolí.

  3. Mida de l'objectiu

    2.5.8 AA · 2.5.5 AAA

    Els controls tàctils principals (el dock de pestanyes, les files del full, les pastilles de crida a l'acció) fan de 44 a 48 píxels; el control de punter més petit encara supera els 24. Així, cada control compleix el mínim de l'AA, i els controls tàctils compleixen la mida AAA, més estricta.

  4. Moviment reduït

    2.3.3 · AAA

    Quan el sistema d'un visitant demana menys moviment, el lloc redueix cada animació i transició a una mica per sobre de zero, i converteix el desplaçament suau en un salt simple.

  5. Paritat de tema, sense flaix

    El clar i el fosc són tots dos de primera classe: cada superfície es dissenya en tots dos, i el tema es resol abans del primer pintat perquè un visitant en mode fosc mai no rebi un flaix blanc.

  6. El color no és l'únic senyal

    1.4.1 Use of Colour · A

    Els enllaços en la prosa dels articles estan subratllats, de manera que el seu significat mai no depèn només del verd.

El verd llegible

El verd de marca és una llima brillant, i la llima brillant no es llegeix com a text sobre blanc: --color-green mesura 2,2:1 allà. D'aquí surten dues decisions. El text que ha d'anar sobre el verd fa servir --color-on-green, una tinta gairebé negra a 8,8:1, i per això cap botó ni enllaç de salt pinta blanc sobre la llima. I el verd fet servir com a text fa servir --color-green-text, un verd més profund que supera el llindar de 4,5:1 per al text normal en tots els fons clars on apareix: 5,6:1 sobre blanc, 5,2:1 sobre les bandes tintades i 4,9:1 sobre l'emplenat de les etiquetes. El mode fosc conserva la llima de marca, que es llegeix a 8,6:1 a la pàgina.

Un enllaç verd Un enllaç verd
Un enllaç verd
Token Sobre blanc Sobre gairebé negre
--color-green
2.2:1 8.6:1
--color-green-text
5.6:1 8.6:1
--color-on-green
8.8:1 6.2:1

Compleix l'AA Només text gran i interfície No arriba al llindar

Fins a l'agost del 2026 això era un compromís. --color-green-text era un verd més clar que només superava el llindar de 3:1 per a text gran i interfície, i només sobre blanc; sobre les bandes tintades baixava a 2,9:1, que és precisament on hi ha la targeta de l'autor, les etiquetes d'anterior i següent i l'enllaç de privadesa del formulari de subscripció. Un token que es fa servir en un centenar de llocs no es protegeix amb una frase que expliqui on pertoca, així que es va moure el valor en comptes de la documentació, i ara tots els usos superen el llindar de text normal en tots dos temes. Els enllaços dels articles continuen subratllats, de manera que el color mai no és l'únic senyal, i el text del cos continua sent neutre.

Abast

Això cobreix el lloc web. L'aplicació de React Native i les plantilles de correu són superfícies pròpies, amb els seus propis estàndards, i no es documenten aquí.

Has vist alguna cosa que no quadra en aquesta pàgina? Escriu-me