chore: add "sources"

.gitignore

@@ -3,5 +3,4 @@
 _site/
 dist/
 node_modules/
-package-lock.json
 src/compiled-assets

package.json

@@ -9,7 +9,7 @@
     "del:dist": "rimraf ./dist",
     "dev": "npm run dev:assets & npm run dev:site",
     "dev:assets": "webpack --config webpack.config.dev.js",
-    "dev:site": "ELEVENTY_ENV=development npx eleventy --serve",
+    "dev:site": "cross-env ELEVENTY_ENV=development npx eleventy --serve",
     "prod": "npm-run-all del:dist del:assets build:assets build:site",
     "serve:prod": "serve ./dist/"
   },
@@ -51,6 +51,7 @@
     "webpack-merge": "^5.8.0"
   },
   "devDependencies": {
+    "cross-env": "^7.0.3",
     "prettier": "^2.0.5"
   }
 }

src/_pages/blog/article/guide_developpeuse-euse_lecteur_d_ecran.md

@@ -1,5 +1,5 @@
 ---
-title: "Guide pour développeur.euse web : débuter avec un lecteur d'écran sur une page web"
+title: "Guide d'accessibilité pour développeur·euse web : débuter avec un lecteur d'écran sur une page web"
 description : Quelques configurations et commandes utiles à connaître pour quiconque souhaite se familiariser avec un lecteur d'écran 
 date: 2024-04-23
 tags:
@@ -10,11 +10,11 @@ draft: false
 layout: article.njk
 ---
 
-Quand on débute en accessibilité, on est rapidement confronté au besoin de pouvoir se plonger en condition réelle. Se mettre à la place de la personne qui a besoin d'un service accessible reste un bon moyen de mettre en place les bonnes conditions d'utilisabilité.
+En tant que développeur·euse web, quand on débute en accessibilité, on est rapidement confronté au besoin de pouvoir se plonger en condition réelle. Se mettre à la place de la personne qui a besoin d'un service accessible reste un bon moyen de mettre en place les bonnes conditions d'utilisabilité.
 
 Parmi le panel d'outils à connaître, le lecteur d'écran est une des solutions utilisées par les personnes en situation de handicap. Mais voilà, la prise en main de ce genre d'outil n'est pas des plus évidentes, et peut même parfois rebuter une personne motivée.
 
-Un lecteur d'écran est une application capable de restituer le contenu d'une page web (ou toute application d'ailleurs) via une voix synthétique, en s'appuyant sur la structure de la page, pour permettre à une personne en situation de handicap visuel de pouvoir comprendre comment l'information est organisée. L'outil permet également de fournir une aide pour interagir avec la page.
+Un lecteur d'écran est une application capable de restituer le contenu d'une page web (ou toute application d'ailleurs) via une voix synthétique, en s'appuyant sur la structure de la page, pour permettre à une personne en situation de handicap (majoritairement visuel, mais aussi moteur, auditif, cognitif...) de pouvoir comprendre comment l'information est organisée. L'outil permet également de fournir une aide pour interagir avec la page.
 
 Oui mais voilà : au premier abord, un lecteur d'écran semble produire un flot ininterrompu de paroles de façon incontrôlable, et  pourrait en rebuter plus d'un. Je suis passé par cette phase où le lecteur d'écran était une sorte de monstre métamorphe difficile à dompter. Et pourtant, il suffit de pas grand chose pour commencer à comprendre comment s'en servir basiquement, et faire déjà de belles avancées.
 
@@ -26,7 +26,7 @@ Vouloir tester une page web avec NVDA est une bonne chose. Mais lorsqu'on n'a pa
 
 ## Activer la mise en surbrillance du focus
 
-Quiconque a déjà lancé un lecteur d’écran sans y être habitué.e peut se retrouver rapidement perdu.e sans savoir exactement où le lecteur d’écran en est dans la page. Lorsqu’on n’a pas de handicap visuel, autant profiter des capacités supplémentaires de l’outil pour permettre de mieux s’y retrouver.
+Quiconque a déjà lancé un lecteur d’écran sans y être habitué·e peut se retrouver rapidement perdu·e sans savoir exactement où le lecteur d’écran en est dans la page. Lorsqu’on n’a pas de handicap visuel, autant profiter des capacités supplémentaires de l’outil pour permettre de mieux s’y retrouver.
 
 Il est possible de configurer NVDA pour qu’il mette en exergue (via un encadrement coloré) différents types de focus. Ces options se trouvent dans les préférences de NVDA. Pour y accéder, lancez NVDA. Par défaut, il va se retrouver minimisé dans les applications masquées sur Windows (sur Mac, je ne saurais pas dire) :
 
@@ -62,9 +62,19 @@ Démonstration de la visionneuse de parole sur une page de site e-commerce pour
 
 Pour activer le journal de lecture, cliquez sur NVDA dans les applications masquées (comme pour l’ouverture des paramètres du paragraphe sur le focus), puis **Outils**, puis **Visionneuse de parole**.
 
+## Vitesse de vocalisation
+
+Une alternative au journal de vocalisation est de réduire la vitesse de la vocalisation. En effet, en jouant sur la vitesse de prononciation, notamment en la ralentissant, il est plus facile de comprendre ce qui est dit sans avoir à se reposer sur une retranscription écrite, qui peut ne pas être toujours pratique à utiliser dans certains contextes.
+
+Pour jouer sur la vitesse de la vocalisation, cliquez sur NVDA dans les applications masquées (comme précédemment), puis **Préférences**, puis **Paramètres**, puis **Parole**.
+
+![Fenêtre de configuration de NVDA pour la configuration de la vitesse de vocalisation](/blog_images/articles/guide_de_survie_lecteur_d_ecran/image-5.png)
+
+Une fois dans cette fenêtre, il ne reste plus qu'à jouer avec le slider correspondant à l'étiquette **Débit**.
+
 ## Prendre le contrôle de la vocalisation
 
-Maintenant que vous êtes doté.e du bagage utile, il est temps de ne plus subir le lecteur d’écran.
+Maintenant que vous êtes doté·e du bagage utile, il est temps de ne plus subir le lecteur d’écran.
 
 Par défaut, le lecteur d’écran commencera à vocaliser dès que le contexte change. Par exemple lorsque vous passez d’un onglet à un autre dans votre navigateur, ou que vous changez d’application au premier plan, le lecteur d’écran restituera vocalement ce qui se passe. Cela a pour conséquence qu’il pourrait vous donner l’impression de ne jamais vous laisser en paix. C’est ici qu’interviennent les deux premières commandes à connaître.
 

src/_pages/blog/article/impacts_envrionnementaux_du_numerique.md

@@ -216,3 +216,7 @@ Les membres du collectif IT’s on us [accompagnent les organisations](https://w
 - écoconcevoir les services numériques en les dotant de couches applicatives fonctionnant sur de vieux équipements et
 - [changer de modèle économique](https://www.itsonus.fr/nos_services/developper_modeles_durables/), quand elles appartiennent secteur du numérique, afin de sortir de la logique de volume
   et corréler leurs intérêts économiques avec les intérêts socio-environnementaux.
+
+
+## Sources
+- [https://www.arcep.fr/uploads/tx_gspublication/etude-numerique-environnement-ademe-arcep-volet02_janv2022.pdf](https://www.arcep.fr/uploads/tx_gspublication/etude-numerique-environnement-ademe-arcep-volet02_janv2022.pdf)