Daily Shaarli

All links of one day in a single page.

December 1, 2023

a11y.css’ documentation | a11y.css

This CSS file intends to warn developers about possible risks and mistakes that exist in HTML code. It can also be used to roughly evaluate a site's quality by simply including it as an external stylesheet.

Underline your fucking links
How To README · Matthias Ott – User Experience Designer

A proposal for a good README format

  • Name and description
  • Installation
  • Configuration and use
  • Deployment
  • Testing (unit tests? Lol)
  • How to contribute
  • Licence
  • Roadmap (future changes)
  • Author(s) / Contributors
  • add a demo link
  • AND A FUCKING SCREENSHOT!
LibreOffice pour les utilisateurs d’OpenOffice.org

Comment OpenOffice est devenu LibreOffice suite à un fork de la cokmunauté.

Des Etats-Unis à la France, comment la société s’imprègne de l’imaginaire complotiste de QAnon
Switch Role Support — Adrian Roselli

Use <button> if you can count on JavaScript being available, and flipping the switch has an immediate effect.
Use <input type="checkbox" if you want to progressively enhance the control, and flipping the switch will only take effect when the user submits it.

The post explains how.

Signal accuse la France de dire n'importe quoi sur sa messagerie sécurisée - Numerama
Nonogrammes - Instructions
HTML Validator
HTML Inputs and Labels: A Love Story | CSS-Tricks - CSS-Tricks
Not Your Typical Horizontal Rules – Sara Soueidan, inclusive design engineer
Note: Semantische HTML

Ja klar, bei manchen Sachen sollte man das mit ARIA Elementen anreichern, aber bei vielem könnte man es verbessern indem man einfach die richtigen HTML Tags/Attribute verwendet.

Use Cases anzeigen und sie durchsuchen können.

Beispielen:

  • Accordion: <details>/<summary>
  • <dialog>
  • Definitionsliste: <dl> / <dt> / <dd>
  • Definition steht im Paragraph <dfn>
  • Listen: <ol> / <ul>
  • Mehr Kontekt <time>,<kbd>, <abbr>
  • Separator zwischen Paragraphen: <hr>
  • Abkürzung:
  • <address>
  • <quote> / <blockquote> / <cite>
  • semantische Struktur der Seite: <article> / <section> mit o. ohne Heading / <footer> / <header> / <main> / <aside> / <nav>