Le document présente des bonnes pratiques pour améliorer la qualité des projets web, en se concentrant sur l'expérience utilisateur, l'accessibilité et la performance. Il aborde des éléments concrets comme la structuration des exigences utilisateurs, le référencement, et la gestion des formulaires. L'auteur souligne l'importance de la communication et de la visibilité pour éviter que l'utilisateur ne se sente piégé dans les processus en ligne.

1. Elie Sloïm
@ElieSL
Bonnes pratiques qualité
pour le projet Web
4 avril 2017 - Québec
Elie Sloïm - @ElieSL

2. Le Web c’est facile

3. Tu peux me faire un
site (vite fait) ?

4. Quelles sont les exigences
des utilisateurs ?

5. @
Structurer les exigences utilisateurs
UI
UX
Modèle VPTCS - Elie Sloïm - Eric Gateau - 2000
Infographie @nissone http://w3qualite.net/outils/qualite-web-les-bonnes-pratiques-pour-ameliorer-vos-sites-une-premiere-impression

6. SEO
Cookies
Référencement
Performances
Accessibilité
E-commerce
Contenus
Standards
Serveur
Code
Formulaires
Impression
Téléchargement
Traductions
Marketing
Sécurité
Ergonomie
Design
Mobile
Le Web
c’est facile

7. Bonnes
pratiques
Utiles
Réalistes
Universelles
Vérifiables
?

11. Bonne pratique
Objectif
Mise en œuvre
Contrôle

12. Une fiche par bonne pratique

14. Les processus complexes sont
accompagnés de la liste de leurs étapes
• Donner de la visibilité
à l’utilisateur sur les
actions qu’il va réaliser
• Éviter que l’utilisateur
ne se sente piégé dans
un processus
Identifier les objectifs et risques
Confiance
Abandon

15. Label ?
Menu ?
Onglet ?
Serveur ?

16. • Améliorer la vitesse de rendu de la page
Le serveur transmet des contenus compressés
aux clients qui les acceptent
• Diminuer les coûts de bande passante
Identifier le vocabulaire

17. Connaissance
des risques
Décisions en
connaissance
de cause

18. Voiture A Voiture B

19. Nom :
Prénom :
Société :
Message :
Formulaire A Formulaire B
Envoyer
Nom :
Prénom :
Société :
Message :
Envoyer

20. Formulaire A Formulaire B
• Chaque demande d’information fait l’objet d’un
accusé de réception
• L'étiquette de chaque champ de formulaire
indique si la saisie est obligatoire.
• L'étiquette de chaque champ de formulaire
indique, le cas échéant, quel format de saisie doit
être respecté.
• Chaque étiquette de formulaire est visuellement
rattachée au champ qu'elle décrit.
• En cas de rejet des données saisies, les champs
contenant les données rejetées sont indiqués à
l'utilisateur.
• En cas de rejet des données saisies, les raisons du
rejet sont indiquées / toutes les données saisies
peuvent être modifiées par l'utilisateur.
• La page affichée après l'envoi d'un formulaire
permet de reprendre directement la navigation.
• La soumission d'un formulaire est suivie d'un
message indiquant la réussite ou non de l'action
souhaitée.
• Le copier coller est possible dans les champs de
formulaire.
•Quand on
clique sur
envoyer ça
envoie le
formulaire
Etc.

21. Quel degré de
maîtrise des
bonnes
pratiques, du
vocabulaire et
des risques
?

22. Examen en ligne
125 questions
1h30

23. 0 1000500 600 700 800 900

24. Chefs de projets, graphistes,
designers UX, ergonomes
développeurs, intégrateurs,
webmestres, experts SEO et
accessibilité, community
managers, commerciaux,
webmarketeurs…

25. Agences
Ecoles Entreprises
1500 certifiés

26. Agences
Ecoles

27. RDA : Risques Des Autres

28. Empathie pour les fournisseurs
Compréhension des prix, de la
valeur, de la culture,
Empathie

29. Culture et assurance
commune pour le projet Web

30. Merci
Elie Sloïm
@ElieSL