Navigation et ergonomie des sites Internet Titre Navigation et ergonomie des sites Internet

Intervenant Vincent Moreau, Directeur Systonic Toulouse (v.moreau@systonic.fr) Pilotage de projets internet et consultant (ergonomie et conception, tourisme)

Agenda Comment naissent les sites Internet ? Ergonomie et usabilité

Comment naissent les sites Internet? Passer d’une démarche intuitive (et partant souvent du visuel) A une méthodologie qui puisse vous guider

Objectifs stratégiques Quelles sont les objectifs clés ? Informer, séduire ? Un service complet ? Un outil de prise de contact ? Quelles cibles ? Usagers, administrés, décideurs économiques, touristes, acteurs locaux ?

Identifier les contenus Recensement des contenus existants Étude des besoins Contenus produits Contenus attendus Matrice cibles-contenus

Cartographie des contenus

Navigation par cibles ou par ressources ? Avantages et limites de chaque logique Segmentation, sous-segmentation et sur-segmentation Focus sur le tourisme Faut-il proposer une double navigation (2 façons d’accéder au même contenu) ?

La double navigation

Navigation par cibles et par ressources ? Concilier les 2 approches Identifier les contenus communs à toutes les cibles (cf exemple : circuits, entreprises) Identifier les contenus spécifiques aux cibles (exemple : S’implanter, Piloter, Louer nos circuits) Il faut proposer à l’internaute une logique cohérente, ensuite il s’adapte

Dissocier différents types de contenus Informations de fond, stables dans le temps Informations de flux : actualités – agenda Distinction rubriquage – mise en avant Utilitaires

Architecture de site ou architecture de sites ? Site unique ou site principal + satellites Les limites d’un site unique (évolutivité, réactivité) Définir une architecture globale Un site principal Des sites satellites, 2 niveaux : Le plus souple : charter bandeau type de retours des sites satellites vers le site principal, Charter la navigation mais laisser libre l’implémentation technologique

Site principal + satellites

Comment définir la navigation ? Définir les contenus Hiérarchiser (regrouper en 2 à 5 zones) Rubriquage = regroupement logiques Cinématique de navigation Zoning Cinématique des menus

Le zoning (concept général)

Le zoning (appliqué)

Cinématique Cinématique générale Maquettage fonctionnel exhaustif de chaque écran

Et le design ? Souhaitable de le faire après le zoning Le brief doit intégrer des contraintes de structuration de la navigation et des contraintes de style de communication (valeurs, style, tonalité…)

Utiliser des outils stables de gestion des contenus Pages éditoriales (gabarits types) Actualités, Agenda (catégories, mode liste – mode fiche détaillée) Dossiers (pages spécifiques + regroupement d’informations présentes à différents endroits du site)

Principes de navigation Favoriser la navigation horizontale de préférence à la multiplication des contenus (cf le référencement) Limiter le nombre de niveaux d’arborescence (3 ou 4, pas 8 ou 9), quitte à charter des pages orphelines

Agenda Comment naissent les sites Internet ? Ergonomie et usabilité

Principes de navigation et d’ergonomie La Home page 2 objectifs : Faciliter la navigation dans le site et Communiquer To flash or not to flash ?

La Home page (portail)

La Home page (communicante)

Réaliser des pages attractives Respecter des règles d’écriture web Respecter des règles d’ergonomie internet

L’écriture web: les 10 règles à respecter (1) Favoriser la lecture rapide (en diagonale) Être concis et factuel (phrases courtes pas plus de 20 mots) Éviter les effets stylistiques trop recherchés (métaphores...) Ne pas dépasser 2000 / 2500 signes par page (soit 1/3 d’une page A4) Créer des paragraphes aérés

L’écriture web: les 10 points clés (2) Rédigez des contenus clairs (titres, sous-titres, accroches…) Mettre en avant les liens hypertextes internes et externes permettant d’aller plus loin dans l’information Favorisez l’impression des contenus denses qu’il vaut mieux lire sur papier (téléchargement d’un fichier pdf+ outil « imprimez cette page ») Donnez des éléments de contextualisation pour identifier la nature des sources d’information Datez le contenu (dernière mise à jour…)

L’ergonomie sur Internet, rappel des points clés (1) Bien guider l’internaute, il doit pouvoir répondre à ces questions : Qu’ai-je fait? Où suis-je? Que puis-je faire? Être compatible avec l'environnement informatique du plus grand nombre (browser, définition d’écran…)

L’ergonomie sur Internet, rappel des points clés (2) Ne pas perturber le parcours de l'internaute, respectez son temps (pop up intempestifs, publicités..) (lenteur du flash utilisé mal à propos..) Prévoir et gérer les erreurs des utilisateurs Éviter l'excès d'information sur une même page Permettre à l'internaute de revenir sur votre site (url claire + url contextuelle + bookmark graphique..) Faire des tests utilisateurs (cf. selon J. Nielsen à partir de 5 bêta testeurs = 80% des erreurs identifiées)

Bibliographie et liens Nielsen Jakob, « Conception de sites Web, l’art de la simplicité », Campupress Barroca Cristina, « Graphisme et ergonomie des sites web », Dunod Nogier Jean-françois, « De l’ergonomie du logiciel au design des sites Web », Dunod Liens: www.useit.com www.veblog.com www.lergonome.org