Le Numérique Responsable constitue un enjeu majeur de notre époque et il incombe à chacun d’entre nous de contribuer à cet effort, quel que soit notre niveau d’implication. Des millions de sites sont créés avec WordPress qui est devenu un vrai standard dans la conception des sites web. Ce livre s’adresse donc à tous les développeurs qui souhaitent concevoir des sites web écoresponsables avec WordPress, en consi­dérant les deux principaux axes de l’écoconception : l’accessibilité et le Green IT.

Dans une première partie, les auteurs exposent les fondations du Numérique Responsable, en abordant le développement durable, le Green IT, l’accessibilité et les déficiences qui sont un frein à l’accès aux services numériques. Les différents référentiels et réglementations concernant l’accessibilité au niveau mondial et francophone, ainsi que les méthodes et outils pour auditer un site existant sont ensuite pré­sentés. Les auteurs poursuivent en vous donnant les clés essentielles pour concevoir un site WordPress accessible, en mettant en évidence l’importance de la personnalisation des thèmes.

Par la suite, le livre explique de manière très pratique comment appli­quer les règles d’accessibilité aux contenus rédactionnels, avec les textes, les tableaux et la personnalisation des blocs de contenu. La création de nouveaux types de champs de saisie pour les contenus structurés sera également traitée. Les médias jouent un rôle crucial dans les sites web actuels et les rendre écoresponsables, accessibles et adaptés à tous requiert certains ajustements dans WordPress. Vous verrez comment mettre en oeuvre les règles essentielles d’accessibilité applicables aux images, vidéos, fichiers audio, documents téléchar­geables et fichiers PDF.

L’utilisation des formulaires par les personnes en difficulté est souvent délicate. Nous devons donc tout mettre en oeuvre pour les rendre acces­sibles et adaptés. Enfin, les auteurs proposent des pistes de réflexion pour obtenir un hébergement écoresponsable.

Avant-propos

1. Introduction

Introduction au numérique responsable

1. Le développement durable
2. Le Green IT
   1. La multiplication des équipements informatiques
   2. La fabrication des équipements informatiques
   3. La consommation d’électricité
   4. La fin de vie des équipements informatiques
   5. Le traitement des déchets
   6. Le Green for IT
   7. L’IT for Green
3. L'accessibilité
4. Les différents types de déficiences
   1. Les déficiences visuelles
      1. La cécité
      2. Les déficiences visuelles chez les seniors
      3. Le daltonisme
      4. La photophobie et la photosensibilité
   2. Les déficiences auditives
      1. La surdité profonde et totale
      2. La surdité partielle
   3. Les déficiences motrices
      1. La paralysie
      2. Les membres manquants ou incomplètement développés
      3. Les tremblements
   4. Les déficiences intellectuelles
   5. Les déficiences cognitives
   6. Le polyhandicap
   7. La fracture numérique
5. Les référentiels et la réglementation
   1. Le référentiel au niveau mondial
   2. Le cadre réglementaire dans l’Union européenne
   3. Le cadre réglementaire en France
   4. Le cadre réglementaire au Luxembourg
   5. Le cadre réglementaire en Belgique
   6. Le cadre réglementaire en Suisse
   7. Le cadre réglementaire au Canada
   8. Le cadre réglementaire en Afrique francophone
6. La performance
7. Le numérique responsable

Exploiter WordPress

1. Pourquoi utiliser WordPress ?
2. La structure de WordPress
3. Les contenus rédactionnels
4. Les médias
5. Les extensions
6. Les thèmes
7. Les comptes utilisateurs
8. Une méthodologie de conception
9. Le développement du site en local

L'audit d'un site WordPress existant

1. Introduction
2. Les cadres des audits
   1. L’accessibilité
      1. Le WCAG
      2. Le RGAA
   2. Le Green IT
3. Les outils automatisés
   1. La validité du code
   2. L’accessibilité
      1. Tanaguru
      2. Les outils de développement et les plug-insdes navigateurs
   3. Le Green IT et la performance
      1. Ecometer, EcoIndex et GreenITAnalysis
      2. Carbonalyser
      3. Lighthouse
4. Les tests manuels simples pour l'accessibilité
   1. La navigation sans l’aide de la souris
   2. La navigation à l’aide d’un lecteur d’écran
   3. La navigation sans mise en forme et sans couleur
5. Les tests simples pour le Green IT

La conception d'un site

1. Introduction
2. Les fonctionnalités essentielles
3. Le choix du thème
   1. Les thèmes pour WordPress
   2. Les thèmes optimisés pour l’accessibilité
   3. Les thèmes optimisés pour le GreenIT
   4. La gestion des thèmes et des extensions pourle Green IT
4. La personnalisation des thèmes
   1. Les différents niveaux de personnalisation
   2. La personnalisation des styles
      1. Accéder aux styles du thème
      2. Le contraste des couleurs
      3. Personnaliser les couleurs des styles du thème
      4. Personnaliser la typographie
      5. Personnaliser les couleurs
      6. Personnaliser les ombres
      7. Personnaliser la mise en page
      8. Personnaliser tous les types de blocs
      9. Personnaliser les styles CSS
   3. La personnalisation des menus
   4. La personnalisation des compositions
   5. La personnalisation des modèles
5. Le choix de la langue
6. Les extensions
   1. Le choix des extensions
   2. Les extensions pour l’accessibilité
   3. Les extensions pour le Green IT
7. Le décommissionnement

La gestion des contenus et du texte dans WordPress

1. Les contenus rédactionnels dans WordPress
2. L’éditeur Gutenberg
   1. Le principe des blocs
   2. L’insertion des blocs
   3. La gestion des blocs
   4. Le code généré par WordPress
3. Les blocs pour le texte
   1. Les titres
   2. Les paragraphes
   3. Les listes
   4. Les citations
   5. Les blocs affichables à la demande
4. Les tableaux
5. La mise en forme commune des blocs de texte
   1. Où appliquer les mises en forme sur le texte ?
   2. Les mises en forme des blocs
   3. Les couleurs du texte
   4. La typographie
   5. La mise en forme du texte et l’accessibilité

La navigation dans WordPress

1. Introduction
2. L'accessibilité et les liens de navigation
3. L'importance du thème
4. Les menus de navigation
   1. Les emplacements des menus de navigation
   2. Les contenus des menus de navigation
   3. Le menu de navigation principal
   4. La personnalisation des élémentsde menu
   5. Les liens et l’accessibilité
   6. Les liens personnalisés
5. Les liens dans les contenus
6. Les widgets de navigation

Les images dans WordPress

1. Introduction
2. Le nombre d'images
3. Le format des images
   1. Les logos, les icônes et les schémas
      1. Le format SVG
      2. Le format PNG
   2. Les photographies
      1. Le format JPEG
      2. Les formats WebP et AVIF
   3. La transparence
4. La compression
   1. Avec une parfaite qualité d’image
   2. Avec une qualité dégradée
5. La taille des images
6. Les alternatives textuelles
   1. Les images décoratives
   2. Les images porteuses d’informations
      1. Alternative courte
      2. Alternative longue
7. Les réglages des médias dans WordPress
8. La gestion de la médiathèque WordPress
   1. Ajouter des images dans la médiathèque
   2. La compression des images par WordPress et les tailles
   3. Modifier les images dans la médiathèque
   4. Supprimer une image de la médiathèque
9. Insérer et personnaliser une image dans un contenu
   1. Insérer une image
   2. Afficher le code généré
   3. Le chargement paresseux
   4. Gérer la légende
   5. Modifier le texte alternatif
   6. Personnaliser les dimensions de l’image
   7. Changer la taille de l’image
   8. Recadrer l’image
   9. Travailler les images pour la publication
10. Les autres blocs pour les images

Les contenus embarqués dans WordPress

1. Introduction
2. Insérer une vidéo
   1. Optimiser le poids d’une vidéo
      1. Diminuer le poids des vidéos par la définition
      2. Diminuer le poids des vidéos par la durée
      3. Diminuer le poids des vidéos par la compression
   2. Les différents types d’insertion de vidéo
   3. Insérer une vidéo depuis la médiathèque
      1. Utiliser le bloc dédié Vidéo
      2. Ajouter des sous-titres
   4. Insérer une vidéo depuis une plateformede partage
3. Insérer de l'audio
   1. L’audio au format MP3
   2. D’autres formats audio
4. Proposer des documents à télécharger
   1. L’accessibilité des documents
      1. Le format HTML
      2. Les formats bureautiques
      3. Le format PDF
      4. Les documents inaccessibles
   2. Les fichiers à téléchargerdans WordPress
5. Afficher des documents PDF

Les formulaires dans WordPress

1. La conception du formulaire
   1. Les prérequis
   2. Les données nécessaires
   3. L’égalité femme-homme
2. Installer un constructeur de formulaires : l'extension WPForms
3. Créer le formulaire
4. Ajouter et personnaliser un champ de saisie simple
   1. Ajouter et paramétrer un champ de saisie
   2. Personnaliser le champ de saisie
5. Ajouter un groupe de boutons radio
   1. Insérer des choix uniques
   2. Déplacer les options des choix
6. Insérer d'autres champs
7. Paramétrer le formulaire
   1. Gérer les champs
   2. Personnaliser le texte du bouton d’envoi
   3. Personnaliser l’affichage du formulaire
   4. Paramétrer l’envoi du formulaire
   5. Exploiter un captcha accessible et Green IT
      1. La solution hCaptcha
      2. Les captchas proposés par WPForms
8. Afficher le formulaire dans une page
   1. Insérer le formulaire
   2. Mettre en forme le formulaire
   3. Afficher le formulaire publié

Les nouveaux types de champs dans WordPress

1. Introduction
2. L'extension Secure Custom Fields
3. Créer un groupe de champs personnalisés
   1. Créer le groupe de champs
   2. Le champ Texte
   3. Le champ Image
   4. Le champ Nombre
   5. Le champ Bouton radio
   6. Le champ Sélecteur de date
   7. Gérer les champs personnalisés
4. Créer une vue pour afficher le groupe de champs SCF
   1. Installer l’extension Advanced Views Framework
   2. Créer la vue AVF
5. Créer un modèle de page dédié à la vue AVF
   1. Créer le modèle de page
   2. Lier la vue AVF et le modèle de page
   3. Lier le groupe de champs SCF et le modèlede page
6. Créer un article avec le modèle de page
   1. Sélectionner le modèle de page
   2. Saisir les données personnalisées

L'hébergeur et le paramétrage de WordPress

1. Introduction
2. Le choix de l'hébergeur
3. Le développement du site en local
4. L'exportation du site local
5. Le téléchargement de WordPress chez un hébergeur
6. L'installation de WordPress chez l'hébergeur
   1. L’installation de WordPress
   2. L’importation du site local chez l’hébergeur
   3. La sécurisation du compte de l’administrateur
7. La sauvegarde du site chez l'hébergeur
8. Optimiser un site WordPress grâce au cache
   1. Le cache navigateur
   2. Le cache du serveur web
   3. Les extensions de cache de WordPress