larlet-fr-david/david/2024/_sources/2024-03-12 - Surligner.md

# Surligner

> [en] A small JavaScript library ==to create and animate annotations on a web page==
>
> Rough Notation uses RoughJS to create a hand-drawn look and feel. Elements can be annotated in a number of different styles. Animation duration and delay can be configured, or just turned off.
>
> Rough Notation is 3.8kb in size when gzipped, and the code is available on GitHub.
>
> <cite>*[Rough Notation](https://roughnotation.com/)*</cite>

J’utilise cette façon de mettre en avant des fragments de citations [depuis un petit moment](/david/2020/02/21/#surlignage) et en passant [par chez Biou](https://vanschklift.com/blog/post/2020/06/19/Time-for-a-refresh%21) aujourd’hui, j’ai trouvé l’effet bien sympathique. Je ne l’applique pour l’instant(?) que sur la balise `<mark>` (relativement inoffensif si ça casse), en respectant `prefers-reduced-motion` et en animant que lorsque la partie surlignée devient visible grâce à [IntersectionObserver](https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserver).

Cela peut se révéler être distrayant pour certaines personnes car ça bouge à un endroit éloigné du point de lecture (merci @maiwann), invisible pour d’autres qui chargent les onglets sans être dessus (merci @lamecarlate). Il s’agit d’une famille d’animations pas trop invasives, encore moins essentielles, qui peuvent se révéler être de fausses bonnes idées. Je vais tester pour un temps, toujours dans cette recherche d’aller [vers un peu plus de fantaisie](/david/2024/03/09/#hr-106).

N’hésitez pas à me faire des retours.

==Plus tard dans la journée==, Nicolas Hoizey m’indique qu’il sera possible d’avoir un [comportement approchant en CSS](https://frontendmasters.com/blog/highlight-text-when-a-user-scrolls-down-to-that-piece-of-text/) [prochainement](https://caniuse.com/mdn-css_properties_animation-range).

==Le lendemain==, [j’ai désactivé l’animation](/david/2024/03/13/#hr-114) suite à plusieurs retours de lecteur·ices.

---

> Ce qu’Hashbang propose est de créer un registrar sous forme de SCIC avec en plus un processus participatif pour définir les services et leurs tarifs. Le premier service proposé sera certainement le nom de domaine, mais personne ne peut actuellement définir quel tarif sera proposé. ==Ce sera issu d’un processus participatif en fonction des participant·e·s au départ.==
>
> Chez Hashbang, nous portons un regard attentif aux enjeux environnementaux et nous proposons donc de mesurer et limiter l’impact environnemental des activités du registrar.
>
> Nous souhaitons également s’assurer qu’il n’y ait pas de discriminations et que les personnes minorisé·e·s puissent s’emparer de cet espace. Il faut donc s’attendre à ce qu’il y ait des événements en mixité choisie et du langage inclusif.
> 
> <cite>*[Appel à intérêt pour un bureau d’enregistrement coopératif](https://hashbang.coop/blog/appel-a-interet-pour-un-bureau-denregistrement-cooperatif/)*</cite>

Superbe initiative, coopératives pour tou·tes !

---

> [en] I know a lot of people hate anti-ad-block popups, but to me they are perfect.
>
> In presenting those popups, those websites demonstrate that they realize the lack of control they have. They show us so plainly that they are unable to make money from us, which leaves them no option but to grovel and beg us to turn off ad-blocking.[…]
>
> When we use web browsers, **we** are in more control than **they** are. ==That’s simply not the case when we’re inside an app they get to control.==
> 
> <cite>*[Anti-Ad-Block](https://lmnt.me/blog/anti-ad-block.html)*</cite>

Ma configuration à ce sujet est assez extrême et il n’est pas rare (surtout sur les boutiques !) que je doive m’y reprendre à pas mal de fois pour débloquer les [megabytes de JavaScript](https://tonsky.me/blog/js-bloat/) à télécharger qui sont pertinents, ou plutôt nécessaires aux personnes ayant développé ces sites. Car pour ma part, je n’aurais besoin que de HTML dans 99% des cas…

…dit-il en venant d’ajouter 13Ko de JS 😬.

#partage #technique #web