ecommerce 12regles ameliebouchez technofutur
DESCRIPTION
Conférence ecommerce et slides de présentation des orateursTRANSCRIPT
![Page 1: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/1.jpg)
12 règles d’ergonomie web
TECHNOFUTUR TIC
Mercredi 12 Décembre 2007
Amélie Boucher www.ergolab.net www.ergonomie-sites-web.com
![Page 2: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/2.jpg)
2 / 28
Avant toute chose ...
» 12 règles d’ergonomie
= un outil ≠ une finalité
» De grands principes
= objectifs à atteindre≠ moyens
» Pré-règle = connaître votre internaute
![Page 3: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/3.jpg)
3 / 28
Règle n°1 : Architecture
ORGANISATION
Le site doit être bien rangé
» Qu’est-ce qui fait que l’on se repère facilement ?
![Page 4: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/4.jpg)
4 / 28
» Pensez l'architecture pour vos visiteurs !
Que viennent-ils faire ? Quelles sont leurs connaissances ?
Règle n°1 : Architecture
Une architecture orientée stratégie de marque
![Page 5: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/5.jpg)
5 / 28
» Architecture de l'information= Les fondations de votre site
Règle n°1 : Architecture
» Niveau de l'organisation conceptuelleOn ne s'occupe pas de l'écran(Mais l'écran peut compenser une mauvaise architecture)
![Page 6: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/6.jpg)
6 / 28
Règle n°2 : Organisation visuelle
La page doit être bien rangée
» Limiter la surcharge visuelle
» Quantité d’informations réelle≠ quantité d’informations perçue
![Page 7: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/7.jpg)
7 / 28
Règle n°3 : Cohérence
On capitalise sur l’apprentissage interne
» On ne change pas les choses d’endroit
» On ne supprime pas des choses utiles sans raison
» Une chose = un mot
» Formats de présentation (exemple des liens)
» Comportement du site
![Page 8: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/8.jpg)
8 / 28
Règle n°4 : Conventions
On capitalise sur l’apprentissage externe
» Vous n’êtes pas le 1er sur l’Internet
» Avantages objectifs et subjectifs
» L’ergonomie ne sert pas à être original
![Page 9: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/9.jpg)
9 / 28
Règle n°4 : Conventions
"Une case à cocher, je peux la cocher"
www.clarins.fr
![Page 10: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/10.jpg)
10 / 28
Règle n°4 : Conventions
"Une case à cocher, je peux la cocher"
![Page 11: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/11.jpg)
11 / 28
Règle n°5 : Information
Le site informe l’internaute et lui répond
» Information générale sur le site
» Information ponctuelle
![Page 12: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/12.jpg)
12 / 28
Règle n°5 : Information
» Notion de feedback : L’ordinateur doit acquiescer
www.virgin-mega.fr
Attention à la visibilité du feedback !
![Page 13: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/13.jpg)
13 / 28
Règle n°6 : Compréhension
» Choix des mots et symboles
75% du travail d’ergonomie
. Utiliser les mots
. Bien les choisir
![Page 14: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/14.jpg)
14 / 28
Règle n°7 : Assistance
On doit guider l’internaute
» Mots (mots uniques, légendes, textes explicatifs)à défaut d’autre chose
» Organisation visuelle» Format et comportement des objets
Explicitement Et / ou Implicitement
![Page 15: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/15.jpg)
15 / 28
Règle n°7 : Assistance
» La notion d’affordances
= possibilités d’action suggérées par un objet
![Page 16: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/16.jpg)
16 / 28
Règle n°7 : Assistance
» Visibilité des objets-clés
![Page 17: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/17.jpg)
17 / 28
Règle n°7 : Assistance
» Attention aux contre-affordances
= on incite à emprunter une impasse= on risque la déception
![Page 18: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/18.jpg)
18 / 28
» 3 manières de gérer les erreurs :
Avant l’erreur :
protéger
Après l’erreur :
faciliter le repérage de l’erreurfaciliter la compréhension de l’erreur
Au-delà de l’erreur :
faciliter la correction
Règle n°8 : Gestion des erreurs
Postulat de base : L’internaute va se tromper
![Page 19: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/19.jpg)
19 / 28
Règle n°8 : Gestion des erreurs
» Attention à la sur-protection !
www.rememberthemilk.com
![Page 20: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/20.jpg)
20 / 28
» Ne pas recourir à la mémoire
Règle n°9 : Rapidité
» Pas d'actions inutiles / Pas 2 fois la même chose
» Des fonctionnalités raccourcis(exemple : ListExpress sur Telemarket)
» Faciliter les clics et les interactions (cf. la loi de Fitts)
L’internaute ne doit pas perdre son temps
![Page 21: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/21.jpg)
21 / 28
Règle n°10 : Liberté
C'est l’internaute qui commande
www.labanquepostale.fr
» Attention aux actions au survol !
» Respecter les contrôles utilisateur de base
» L'internaute est acteur : Attention au site qui se prend pour une télé
![Page 22: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/22.jpg)
22 / 28
» Limiter toute intrusion
Règle n°10 : Liberté
![Page 23: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/23.jpg)
23 / 28
Règle n°11 : Accessibilité
» Un site facile d'accès pour tous
Accessibilité physique
Accessibilitétechnologique
![Page 24: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/24.jpg)
24 / 28
Règle n°12 : Satisfaction de votre internaute
» 4 dimensions :
UtilitéDes micro-fonctionnalités pensées sur-mesure pour votre internaute
www.threadless.com
![Page 25: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/25.jpg)
25 / 28
Règle n°12 : Satisfaction de votre internaute
Micro-fonctionnalités : l’exemple du “Browze by size” sur Threadless
![Page 26: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/26.jpg)
26 / 28
Puissance et fiabilité technique
Règle n°12 : Satisfaction de votre internaute
Qualité du service
Esthétique & expérience utilisateur globale
![Page 27: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/27.jpg)
27 / 28
Au-delà des règles
» Pondération des règles
» Un guide mental plutôt qu'une checklist
![Page 28: Ecommerce 12regles Ameliebouchez Technofutur](https://reader034.vdocuments.mx/reader034/viewer/2022042614/5564d8e3d8b42a0a178b557d/html5/thumbnails/28.jpg)
28 / 28
Ceci est la fin, merci et rendez-vous ci-dessous :
www.ergolab.net
Site éditorial
www.ergonomie-sites-web.com
Le site du livre