MICROBIOLOGIE ENDODONTIQUE english and frensh 25 nov 2020.pdf
ergonomie
1. » Le contenu et le contenant
Introduction
> Doivent répondre aux attentes utilisateurs
> Doivent y répondre facilement et rapidement
www.simaway.com
1 LPRO – Lionel DAMM - 2008
2. » En un coup d’œil, l’internaute doit comprendre
le but du site internet
> Site informatif
> Site de vente
> Site communautaire
» En un coup d’œil, l’internaute doit comprendre
le secteur d’activité
> Le type de produits
> Le positionnement de gamme de l’enseigne
www.simaway.com
2 LPRO – Lionel DAMM - 2008
3. » Déterminer les fonctionnalités principales du e-
commerce
> Rappel du panier
> Retour à la HomePage GARDER EN TÊTE
L’OBJECTIF
> Ajouter au panier
PRINCIPAL :
> Les menus de navigation AMELIORER LE TAUX
> Le moteur de recherche DE
TRANSFORMATION
> Mon compte
> SAV
www.simaway.com
3 LPRO – Lionel DAMM - 2008
5. » Permet d’obtenir une vue globale du site
» Permet de segmenter chaque partie
Construction du site
» Il regroupe l’ensemble des pages du site avec
certaines informations clés
» C’est un document clé du développement
» Elle peut évoluer avec le temps
» C’est un des premiers documents créés
www.simaway.com
» Voir PDF
5 LPRO – Lionel DAMM - 2008
7. » Construire son menu en fonction de
l’arborescence
Construction du site
» Construire une navigation intuitive pour les
visiteurs
» Respecter au maximum la règle des 3 clics
pour accéder à l’information
www.simaway.com
7 LPRO – Lionel DAMM - 2008
8. » Une navigation intuitive ?
> Répondre aux attentes des internautes
> Faire en fonction du comportement de l’internaute
> Prendre en compte l’âge de la cible
> Peu importe le niveau de pratique de l’internaute, il
doit trouver l’information rapidement
ADAPTER LA NAVIGATION OU OFFRIR
PLUSIEURS CHOIX
www.simaway.com
8 LPRO – Lionel DAMM - 2008
9. » Le cerveau humain est capable d’intégrer plus
ou moins 7 éléments dans la mémoire à court
terme
» Ne pas exagérer sur vos menus de navigation
PRÉFÉREZ FAIRE UN MENU AVEC DES
SOUS MENUS PLUTÔT QU’UN MENU
UNIQUE TROP CHARGÉ
www.simaway.com
LPRO – Lionel DAMM - 2008
10. » Menus par onglets
» Menus déroulants
» Listes déroulantes
» Zone de recherche
» FAQ
» Chemin de navigation
www.simaway.com
10 LPRO – Lionel DAMM - 2008
11. » Le chemin de navigation (breadcrumbs trail)
> Connaître facilement sa position dans le site
> Pouvoir facilement revenir à la rubrique supérieure
www.simaway.com
11 LPRO – Lionel DAMM - 2008
12. » Faire un plan du site
> Plan par catégorie et index alphabétique
» Mettre en avant un bouton « Accueil »
> Le standard est de mettre ce lien sur le logo du site
» Faire des URLs explicites
> http://www.rueducommerce.fr/Ordinateurs/Ordinateur-Portable/Ordinateur-
Portable-Professionnel/APPLE/389584-MacBook-Pro-17-2-33GHz-Intel-
Core-2-Duo.htm
www.simaway.com
» Eviter l’utilisation du Flash
12 LPRO – Lionel DAMM - 2008
13. » Les liens
> Mettre en avant les liens cliquables
• Couleur, épaisseur, soulignement…
> Mettre en avant les liens visités
» Offre une navigation plus rapide et plus
intuitive
» Définir la destination du lien (pdf, externe,
www.simaway.com
image, langue)
13 LPRO – Lionel DAMM - 2008
15. » Choisir la bonne taille
Construction du site
» En fonction des statistiques de son
lectorat
www.simaway.com
15 LPRO – Lionel DAMM - 2008
16. » Choisir la bonne présentation
> En fonction du nombre d’informations
> Du nombre de menus
Construction du site
> De la publicité éventuelle
» Permet de choisir un navigation à droite ou à
gauche
» Permet de choisir la largeur des colonnes
www.simaway.com
16 LPRO – Lionel DAMM - 2008
17. » Choisir la bonne présentation
Construction du site
www.simaway.com
17 LPRO – Lionel DAMM - 2008
18. » Choisir la bonne présentation
Construction du site
www.simaway.com
18 LPRO – Lionel DAMM - 2008
19. » Choisir la bonne présentation
Construction du site
www.simaway.com
19 LPRO – Lionel DAMM - 2008
20. » Le site doit être accessible pour tous quelque
soit :
> Le navigateur
> L’OS
> La taille d’écran / les couleurs
> Les plugins installés (flash, quicktime, java…)
> La connexion internet
www.simaway.com
20 LPRO – Lionel DAMM - 2008
21. » Développer le site sur des standards web
d’accessibilité
» Utilisation du XHTML et CSS pour
l’optimisation des pages
> Poids plus léger
> Accessibilité pour les non voyants
» Lisibilité accrue pour tous
www.simaway.com
> Limiter l’accès aux plugins externes
21 LPRO – Lionel DAMM - 2008
22. » Structurer l’information
> Utiliser des typologies identiques pour les items
semblables
> Utiliser la même mise en forme
• Couleur, espacement, alignement…
> Mettre en avant les éléments importants
www.simaway.com
> Bien nommer les pages
22 LPRO – Lionel DAMM - 2008
23. » Attention à la compatibilité entre les
ordinateurs
» Ne pas utiliser de polices « exotiques »
» Utiliser uniquement 1 ou 2 polices sur
l’ensemble du site
» Utiliser des polices standards
> Verdana, tahoma, times, lucida, helvetica
» Respecter les tailles en fonction :
> De l’importance de l’information
www.simaway.com
> De la hiérarchisation
23 LPRO – Lionel DAMM - 2008
24. » Images ? Animations ? Vidéos ?
» Bien choisir ses images en fonction de ses
La mise en forme
besoins
> JPG
> PNG
> GIF
» Flash
www.simaway.com
> Présentation de produit
24 LPRO – Lionel DAMM - 2008
25. » Image ou couleur
» Permet de créer une ambiance
» Peut faciliter la lecture
La mise en forme
» Attention à l’intégration et à la lisibilité
» Problème de contraste sur une couleur
» Problème d’image et de transparence
www.simaway.com
25 LPRO – Lionel DAMM - 2008
26. » Certaines icones ont des significations fortes
www.simaway.com
26 LPRO – Lionel DAMM - 2008
28. » Le graphisme du site doit être en accord avec
la cible client (couleur, forme, technologie)
» Le fond est important mais la forme
également.
> Elle facilite la lecture
> Elle facilite l’adhésion
> Elle facilite la reconnaissance
> Elle développe l’image
> Elle fidélise
www.simaway.com
28 LPRO – Lionel DAMM - 2008