Post on 07-Nov-2014
description
L’ergonomie
d’un site web
par Fred ColantonioAtelier donné en 2013
J’ai besoin de com.com accompagne les indépendants, TPE et PME du Hainaut et du Brabant wallon dans le développement de leur communication.
L’ergonomie d’un site webCréez des sites web pensés pour les utilisateurs
et leur faciliter l’utilisation et l’action
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
5. RESSOURCES
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
www.ergolab.net • www.ergologique.com • www.ergonomie-web.com • blog.webatou.info • blog-ergonomieweb.com
DOUBLE CONSTAT« Le constat est édifiant : un site sur deux est mal conçu, mal écrit et mal pensé.
Donc logiquement peu attrayant, peu vendeur et globalement peu efficace. »
Collectif, Ecrire et manager sa communication, EdiPro, 2008, p.78.
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
« La plupart des sites actuels manquent encore de l’essentiel : un vrai souci des internautes, de qui ils sont et de leurs besoins. »
BOUCHER A., Ergonomie web - Pour des sites web efficaces, Eyrolles, Accès libre, 2009, p.XIV.
FAIRE UN BON SITE WEB ?
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
Jean-Claude Dusse (Michel Blanc) dans Les Bronzés, réalisé par Patrice Leconte, 1978.
Seule certitude :
« Sur un malentendu, ça peut marcher »
Oubliez !
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. CE QUE VOUS CROYEZ SAVOIR
5 idées reçues sur l’ergonomie
1. CE QUE VOUS CROYEZ SAVOIR
Enoncé
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. L’internaute est sot ou, au contraire, il sait tout
Contre-productivité :
1. Interfaces ultra-guidées ou simplifiées
2. Interfaces manquant d’intuitivité
Un enfant de 10ans sait le faire, l’internaute aussi
L’internaute sait qu’en cliquant sur le logo, il reviendra à la page d’accueil
Risques
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Oubliez le « si ma grand-mère sait le faire »
2. Individualisez : visez le bien-être de vos internautes
Pens
ez
malin !
1. Evitez de penser pour les internautes
2. Cherchez à connaître les utilisateurs de votre site pour l’adapter à leurs besoinsLe
point
sur l
a
1. CE QUE VOUS CROYEZ SAVOIR
1. L’internaute est sot ou, au contraire, il sait tout
1. CE QUE VOUS CROYEZ SAVOIR
Enoncé
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
2. Le mythe des 3 clics
1. Personne au scénario ≠ utilisateur final
2. Multiplication des clics en cas d’erreur
L’information doit être accessible à l’utilisateur en 3 clics maximum
Risques
Source : BOUCHER A., ergonomie web, Eyrolles, 2009, p.19.
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Le clic n’est pas un facteur pour quitter un site
2. Mieux vaut 2 clics simples qu’un clic compliqué
3. Chaque clic doit être réfléchi et avoir un intérêtPens
ez
malin !
1. Les 3 clics ont aidé à une époque
2. Ils peuvent compliquer la navigationLe po
int
sur l
a
1. CE QUE VOUS CROYEZ SAVOIR
2. Le mythe des 3 clics
1. CE QUE VOUS CROYEZ SAVOIR
Enoncé
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
3. Ergonomie et design graphique ne vont pas ensemble
1. Maquette ergonomique ≠ maquette graphique
2. Opposer ergonomie et graphisme
L’ergonomie entrave la créativité du graphiste
Risques
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Agencez, séparez les zones, laissez respirer…
2. Faites des aller-retour graphisme / ergonomie
3. Sachez que l’esthétique influence la perceptionPens
ez
malin !
1. Sans graphisme, l’ergonomie est laide
2. Le graphisme vient renforcer l’ergonomieLe po
int
sur l
a
1. CE QUE VOUS CROYEZ SAVOIR
3. Ergonomie et design graphique ne vont pas ensemble
1. CE QUE VOUS CROYEZ SAVOIR
Enoncé
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. Un site ergonomique sinon rien
1. Croire que le site ergonomique existe
2. Croire qu’il existe une façon de faire
« Faites-moi un site ergonomique »
Risques
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Contextualisez : un internaute donné, à un instant donné, dans un contexte donné
2. Ciblez l’internaute dans sa pratique du sitePe
nsez
malin !
1. L’ergonomie se travaille au cas par cas
2. L’ergonomie est «objectivement subjective»Le po
int
sur l
a
1. CE QUE VOUS CROYEZ SAVOIR
4. Un site ergonomique sinon rien
1. CE QUE VOUS CROYEZ SAVOIR
Enoncé
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
5. Les internautes lisent en F (Z ou E)
1. Croire aux schémas intellectuels de lecture
2. Se baser sur une règle sans fondement scientifique
Le regard de l’internaute suit une trajectoire unique et prédéterminée
Risques
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Apparence + animations –> parcours visuel
2. De haut en bas et de gauche à droite…
Pens
ez
malin !
1. Les habitudes conditionnent les réflexes
2. Les pages produisent les comportements (pas les internautes)Le
point
sur l
a
1. CE QUE VOUS CROYEZ SAVOIR
5. Les internautes lisent en F (Z ou E)
2. CE QU’EST L’ERGONOMIE
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Les différents niveaux de l’ergonomie
2. La «qualité web» ou e-qualité
Ergonomie générale
2. CE QU’EST L’ERGONOMIE
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Les différents niveaux de l’ergonomie
Interface homme-machineInformatique
Web
2. CE QU’EST L’ERGONOMIE
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
3. La qualité web ou e-qualité
1. Visibilité
1. Référencement
2. Outils de recherche
3. Positionnement
4. Webmarketing
5. Mesure d’audience
6. Communication
2. CE QU’EST L’ERGONOMIE
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
3. La qualité web ou e-qualité
2. Perception
1. Utilisabilité ou usability
2. Ergonomie
3. Design
4. Webdesign
5. Accessibilité
6. Navigation
2. CE QU’EST L’ERGONOMIE
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
3. La qualité web ou e-qualité
3. Technique
1. Sécurité
2. Hardware (matériel)
3. Hébergement
4. Qualité logicielle
5. Qualité du réseau
6. Conformité technique
2. CE QU’EST L’ERGONOMIE
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
3. La qualité web ou e-qualité
4. Contenu
1. Ligne éditoriale
2. Rédaction
3. Traduction, localisation
4. Syndication
5. Fraîcheur
6. Nétiquette
2. CE QU’EST L’ERGONOMIE
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
3. La qualité web ou e-qualité
5. E-services
1. Réponse aux e-mails
2. E-commerce
3. Services et e-services
4. E-logistique
5. Support, SAV, garantie
6. Relation client/usager
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Les principes de la Gestalt2. La loi de Fitts3. L’affordance4. Le nombre magique de Miller et la loi de Hick
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Les principes de la Gestalt
1. Loi de similarité
Si deux éléments sont similaires en taille et en forme (*), alors le cerveau les associera
(*) couleur et orientation comptent moins
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Les principes de la Gestalt
2. Loi de proximité
Le cerveau associe des éléments visuels lorsqu’ils sont proches les uns des autres ou si les espaces entre eux sont équivalents.
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Les principes de la Gestalt
3. Loi de bonne continuité
Nous préférons percevoir des formes continues en termes de formes, tailles et espacement formant un pattern plutôt que des changements abrupts.
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Les principes de la Gestalt
4. Loi de clôture
Une forme fermée est plus facilement identifiée comme une figure (ou comme une forme) qu’une forme ouverte.
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Les principes de la Gestalt
5. Loi de symétrie
Un ensemble de formes sera mieux perçu si les formes composant l’ensemble sont symétriques entre elles.
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
2. La loi de Fitts
1. Les éléments clicables doivent être gros
2. Les éléments clicables doivent être proches
Le temps mis pour atteindre une cible est proportionnel à sa distance et inversement proportionnel à sa taille
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
2. La loi de Fitts
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
2. La loi de Fitts
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
3. L’affordance
1. Définition Possibilités d’action suggérées par les caractéristiques d’un objet
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
3. L’affordance
2. Affordance web1. Cliquez-moi
2. Interagissez avec moi
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. Le nombre magique de Miller et la loi de Hick
1. Définition Au-delà de 7 objets, notre cerveau s’embrouille !
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. Le nombre magique de Miller et la loi de Hick
2. Middle-point De 5 à 9 éléments !
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. Le nombre magique de Miller et la loi de Hick
3. Loi de Hick Il est plus facile de décider parmi un nombre réduit d’éléments
3. L’INTERNAUTE, UN HUMAIN
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
5. Exercice
Analyse ergonomique de sites web
1. Le cahier des charges
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
C’est la feuille de route de votre site web !
1. Généralités : nom du site, URL, cible, langues…
2. Equipe mobilisée : fonction, rôle, identité…
3. Fonctionnalités : ce que doit précisément faire le site + description des interactions avec l’internaute…
4. Graphisme : charte graphique, webdesign…
5. Technique : sécurité, fréquentation estimée…
6. Rétro-planning & budget
4. L’ERGONOMIE WEB EN PRATIQUE
2. Un site lisible
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
1. Ecrivez en minuscules
2. Utilisez des polices standard
3. Exploitez une taille de caractère 12 à 14px
4. Gérez les couleurs et la signalétique
5. Facilitez l’accès aux rubriques d’aide
4. L’ERGONOMIE WEB EN PRATIQUE
3. Un site compréhensible
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
Cf. Ma présentation «communiquez pour le web» !
+ /!\ au son
+ Facilité à prendre contact
4. L’ERGONOMIE WEB EN PRATIQUE
4. Un site rapide
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
1. Les éléments et contenus se chargent rapidement
2. L’internaute trouve rapidement ce qu’il cherche
3. Le moteur de recherche du site donne des résultats pertinents
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
5. Un site accessible
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
1. L’accessibilité technologique
2. L’accessibilité aux seniors et personnes moins valides
5. Un site accessible> 1. L’accessibilité technologique
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
Elle prend en compte :
1. Le système d’exploitation
2. Le navigateur
3. La résolution d’écran
4. Les logiciels et plug-in installés
5. Un site accessible> 1. L’accessibilité technologique
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
Qualité ergonomique d’une interface (norme ISO 9241)
1. Choix technologique à effectuer selon la cible visée
2. Notion de « dégradabilité » du site
5. Un site accessible> 2. L’accessibilité aux seniors et personnes moins valides
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
•US : 1999, Section 508 du Rehabilitation Act
•Europe : plans 2002 et 2005 confirment la priorité des actions à mener pour « lever toute forme de discrimination par Internet »
•UK : un utilisateur peut attaquer un site non accessible
5. Un site accessible> 2. L’accessibilité aux seniors et personnes moins valides
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
Source : http://www.dailymotion.com/video/xb3kxy_maria-breffy-standard-et-secretaria_news
5. Un site accessible> 2. L’accessibilité aux seniors et personnes moins valides
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
Différents handicaps à considérer :
• Visuels : daltonisme, cécité
• Auditifs : surdité
• Moteurs et psychologiques
5. Un site accessible> 2. L’accessibilité aux seniors et personnes moins valides
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
Outils exploités pour répondre à ces handicaps :
• Toucher : afficheur braille, clavier virtuel
• Ouïe : synthèse vocale
5. Un site accessible> 2. L’accessibilité aux seniors et personnes moins valides
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
Source : http://www.youtube.com/watch?v=SZ0bgMjYG_E&feature=related
5. Un site accessible> 2. L’accessibilité aux seniors et personnes moins valides
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
La WAI (Web Accessibility Initiative) :
• Créée en 1997 par le W3C
• +500 membres
• A l’origine des WCAG (Web Content Accessibility Guidelines)
5. Un site accessible> 2. L’accessibilité aux seniors et personnes moins valides
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
Les WCAG = 4 principes pour les contenus web accessibles :
• Perceptibles
• Utilisables
• Compréhensibles
• Robustes
5. Un site accessible> 2. L’accessibilité aux seniors et personnes moins valides
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
Les contenus doivent être perceptibles :
• Tout contenu multimédia doit proposer une alternative textuelle
• Exemple :
• <img src=“fichier.jpg” alt=“” />
5. Un site accessible> 2. L’accessibilité aux seniors et personnes moins valides
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
Les contenus doivent être utilisables :
• Tout contenu multimédia doit être accessible par l’utilisation du clavier ou d’un autre dispositif adapté
• Exemple :
• <a href=“lien.html” tabindex=“n“>
• n = ordre de la tabulation
5. Un site accessible> 2. L’accessibilité aux seniors et personnes moins valides
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
Les contenus doivent être compréhensibles :
• Tout contenu doit être compréhensible par tous
• Exemple :
• Aides pour guider la navigation
• Explications des erreurs de navigation
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
5. Un site accessible> 2. L’accessibilité aux seniors et personnes moins valides
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
Les contenus doivent être « robustes » :
• Le contenu ne doit pas être altéré par un tiers
6. Les 10 ingrédients d’une page web ergonomique
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
4. L’ERGONOMIE WEB EN PRATIQUE
1. Charte graphique: logo, baseline, slogan, design en grille2. Langues3. Cibles4. Navigation5. Moteur de recherche interne6. Fil d’Ariane7. Mise en évidence de la page en cours8. Facilite de retour la page d'accueil9. Facilite d'accès aux rubriques d’aide10. Coordonnées de contact ou lien visible vers la rubrique
1. L’ergonomie ne s’improvise pas
2. L’ergonomie excède le web et nous concerne au quotidien
3. L’ergonomie concerne bien plus que le layout du site
4. Un site ergonomique tient compte des attentes des internautes
5. Un site ergonomique impose le moins possible de contraintes à l’utilisateur
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
6. CONCLUSIONS, MERCI ET VOS QUESTIONS
1. En guise de conclusion
La mise à disposition gratuite est un choix, la propriété intellectuelle un droit.En cas d’utilisation des informations de cette présentation, merci d’en citer la source de la façon suivante :
© Fred Colantonio, tous droits réservés | www.fredcolantonio.com | contact@fredcolantonio.com
6. CONCLUSIONS, MERCI ET VOS QUESTIONS
2. Merci et vos questions
Crédit images : www.sxc.hu
Merci de votre attention !Je réponds avec plaisir à vos questions.
Fred Colantonio+32 486 99 58 68contact@fredcolantonio.comwww.fredcolantonio.com
: : FredColantonio
En savoir plus sur J’ai besoin de com.com ?
www.jaibesoindecom.comfacebook.com/jaibesoindecomtwitter.com/jaibesoindecom
info@jaibesoindecom.comTél : 071/58 53 15Tél : 071/58 53 15
J’ai besoin de com.com accompagne les indépendants, TPE et PME du Hainaut et du Brabant wallon dans le développement de leur communication.