Développer des sites web écoresponsables 

Vous avez suivi une formation théorique sur les impacts environnementaux et sociétaux du Numérique et sur la démarche d’écoconception ? Apprenez maintenant à développer des services numériques plus respectueux de l’environnement et de l’humain !

Date de mise à jour des informations

22 mai 2023.

Durée

14 heures (2 x 7 heures, soit 2 jours).

Tarif et modalités d’accès

Cette formation est disponible :

  • En intra-entreprise (tarification établie sur demande) ;
  • En inter-entreprises : 1250 € HT / par personne.

Format distanciel ou présentiel (présentiel recommandé).

Prochaine session

La prochaine session de formation “Développer des sites web écoresponsables” en inter-entreprises se tiendra à Paris le 26 et 27 septembre 2023.

Nombre de participants : 3 à 12.

Pour vous inscrire, contactez-nous.

Délais d’accès

Entre 10 et 30 jours selon la disponibilité des formateurs. En cas de prise en charge par un OPCO (OPérateur de COmpétences), le délai d’accès peut être allongé.

Profils des stagiaires

  • Product owner ;
  • Chef de projet technique ;
  • Développeur web ;
  • Intégrateur web.

Prérequis

  • Comprendre les notions de client, de serveur, de réseau (les 3 tiers du Numérique) ;
  • Maîtriser les fondamentaux des langages HTML, CSS et JavaScript ;
  • Avoir suivi une formation de sensibilisation aux impacts environnementaux et sociétaux du Numérique et à la démarche d’écoconception de services numériques, ou pouvoir justifier des connaissances théoriques requises.

Objectifs de la formation

À l’issue de la formation, le stagiaire doit être en capacité de :

  • Mesurer avec fiabilité le poids des pages côté client afin d’évaluer la charge environnementale d’une proposition de valeur ;
  • Appliquer les bonnes pratiques de configuration d’un serveur web et vérifier la mise en œuvre ;
  • Connaitre les variables d’ajustement utiles à l’optimisation des ressources de type multimédia et textuel ;
  • Lister les principales approches de mise en œuvre d’un projet web et avoir conscience de leurs impacts environnementaux éventuels ;
  • Rédiger du code portable et efficient avec HTLM5 et CSS3 ;
  • Intégrer des médias dans une logique d’écoconception avec HTML5 ;
  • Explorer d’autres leviers d’action pour limiter (encore plus) l’impact environnemental de son service numérique.

Contenu et mise en œuvre de la formation

Variée dans le fond et dans la forme, cette formation de 2 jours permet d’acquérir les compétences théoriques et techniques essentielles au développement d’une solution web écoresponsable.

1. Outils de développement web et mesure côté client

  • Durée : 2 heures.
  • Contenu :
    • Métriques client (requêtes réseau, données transférées, données décodées) ;
    • Outils de développement web Firefox (panneau “Réseau”, vue adaptive) ;
    • Procédure de mesure (configuration, documentation, exploitation).
  • Méthodes d’animation :
    • Exposé du formateur ;
    • Atelier de mesure avec les outils de développement web de Firefox.

2. Bonnes pratiques de configuration d’un serveur web

  • Durée : 1,5 heure.
  • Contenu :
    • Compression réseau ;
    • Mise en cache côté client ;
    • Protocole HTTPS ;
    • HTTP/2.
  • Méthodes d’animation :
    • Exposé du formateur ;
    • Atelier de vérification avec les outils de développement web de Firefox.

3. Optimisation des ressources

  • Durée : 2,5 heures.
  • Contenu :
    • Formats d’images pour le Web ;
    • Variables d’ajustement utiles à l’optimisation des ressources de type multimédia (images, vidéos, documents, fontes), par exemple la compression ou le redimensionnement ;
    • Principales techniques d’optimisation des ressources de type textuel (HTML, CSS, JS), par exemple la minification ou la concaténation.
  • Méthodes d’animation :
    • Exposé du formateur ;
    • Exemples interactifs d’optimisation (WebPerfLab Temesis) ;
    • Autres exemples d’optimisation à titre démonstratif (ligne de commande).

4. Approches de mise en œuvre d’un projet web

  • Durée : 1 heure.
  • Contenu :
    • Génération dynamique / Génération statique ;
    • Server Side Rendering (SSR) / Client Side Rendering (CSR) ;
    • Single Page Application (SPA).
  • Méthodes d’animation :
    • Exposé du formateur ;
    • Exemples (bons et mauvais élèves).

5. Du code efficient, portable et valide avec HTLM5 et CSS3

  • Durée : 2,5 heures.
  • Contenu :
    • Sémantique HTML moderne (nav, section, article, etc.) ;
    • Gestion des formulaires (contraintes, validation) ;
    • CSS3 (media queries, flexbox, grid, etc.) ;
    • Validation officielle du code (W3C) ;
    • Support cross-browser.
  • Méthodes d’animation :
    • Exposé du formateur ;
    • Atelier de création de code (HTML seul) ;
    • Atelier de correction de code (CSS seul).

6. Intégration de médias dans une logique d’écoconception

  • Durée : 2,5 heures.
  • Contenu :
    • Intégration d’images (<img>, <picture>) ;
    • Intégration audio, vidéo (<audio>, <video>, <source>) ;
    • Attributs magiques (“loading”, “srcset”, “media”, etc.) ;
    • Autres balises à considérer (<a>).
  • Méthodes d’animation :
    • Exposé du formateur ;
    • Atelier de correction de code.

7. Quelques pistes pour limiter (encore plus) l’impact environnemental d’un service numérique

  • Durée : 0,5 heure.
  • Contenu :
    • Conception dite “mobile first” ;
    • Amélioration dite “progressive” ;
    • Activation à la demande (façades).
  • Méthodes d’animation :
    • Exposé du formateur.

8. Évaluation finale et conclusion

  • Durée : 1,5 heure.
  • Méthodes d’animation : quiz.

Organisation de la formation

Profil du formateur

À la fois analyste en performance web environnementale, formateur en écoconception numérique et développeur web écoresponsable, Julien Wilhelm intervient en tant que spécialiste de la conception responsable auprès des entreprises privées et publiques. Autodidacte validé par ses pairs, il promeut la qualité, l’efficience et l’efficacité des solutions web.

Moyens pédagogiques et techniques

  • Exposés théoriques ;
  • Ateliers de mesure, de rédaction et de correction de code ;
  • Étude de cas concrets et mises en situation ;
  • Exemples interactifs (laboratoire Temesis) ;
  • Mise à disposition du document support à la suite de la formation.

Dispositif de suivi de l’exécution de l’évaluation des résultats de la formation

  • Certificat de réalisation ;
  • Évaluation des acquis au cours de la formation sous forme d’ateliers ;
  • Questionnaire d’évaluation en fin de session dans lequel le participant évalue les apports de la formation et sa capacité à les mettre en œuvre.

Accessibilité aux personnes handicapées

Les personnes en situation de handicap souhaitant suivre cette formation sont invitées à nous contacter directement, afin d’étudier ensemble les possibilités d’adapter la formation.

Satisfaction

Les indicateurs de satisfaction des participants à cette formation seront communiqués dès que disponibles.

Afin d’en savoir plus sur la formation “Développer des sites web écoresponsables” :