Accessible Footnotes with CSS

Hop :)
►http://seenthis.net/messages/383517

Je continue à trouver les footnotes particulièrement inadaptées au web.

J’ai bidouillé un peu de JS pour les ramasser et les réinsérer dans le flux du texte, pour pouvoir les transformer en « sidenotes » ou en « infocards », mais :
– ça pose des soucis de rendu et d’accessibilité
– j’ai vraiment l’impression de faire du bidouillage. La solution propre serait d’intervenir au niveau du générateur de HTML, plutôt que sur la sortie finale.

Mon essai (pas sec) ici : ▻https://github.com/0gust1/md-vanilla-sidenotes

Il faudrait maintenant que je regarde pour implémenter tant que possible les bonne pratiques exposées dans le billet linké (et finir un truc un peu propre/isolé niveau JS).

fun fact : j’ai tout codé avec vim (pour voir) : j’en ai un peu bavé ^^

@0gust1 je ne sais pas si tu connais ce script :

▻http://www.bigfootjs.com

Il pourrait être intéressant d’y intégrer les recommandations citées ici si elles n’y sont pas.

Je l’ai passé en plugin SPIP dernièrement :

▻http://seenthis.net/messages/381417

Merci @b_b !

Je vais regarder ce que ça fait (beaucoup (trop ?) de choses visiblement). Par contre la dépendance à jQuery me chiffonne un peu. Beaucoup de plugins jQuery pourraient s’en passer.

Ce qui est intéressant c’est justement de sortir de la logique de notes de “bas de page”, tout en gardant la possibilité d’annoter un texte/document.

La note permet d’alléger la rédaction du texte en en sortant des références ou des éléments complémentaires, et de hiérarchiser le contenu (le propos et le contexte ou les références).

Par contre, comme @0gust1 la dépendance à JQuery me chagrine aussi un peu...