Ergonomie d’un site internet

Présentation au sujet: "Ergonomie d’un site internet"— Transcription de la présentation:

1 Ergonomie d’un site internet

2 Ergonomie d’un site : sommaire
Rappel des éléments indispensables Les éléments clés d’un bon site Quelques éléments qui gênent la consultation Références

3 Les éléments indispensables : la page
Lecture à l’écran = +25% du temps/papier Titre concis et significatif <title> titre explicite </title> apparaît dans les résultats des robots de recherche le titre peut être identique à celui de la page visible le titre peut condenser celui de la page visible Page légère : 20 à 30 ko (images + texte +animations)

4 Les éléments indispensables : la page
Des listes d’item courtes Prévoir un nombre de liens limités à 7 ou 8 par page de texte (sauf s’il s’agit de signets classés et organisés en page d’accueil sur les postes de la bibliothèque !) Utiliser peu : Les LETTRES CAPITALES Les italiques Les clignotements Les gifs animés en sur-excès

5 Les éléments indispensables : la page
Page courte : Evite le recours à l’ascenseur latéral Evite le recours à la circulation droite gauche = meilleur temps de chargement = meilleure lisibilité Page longue : Prévoir un sommaire au début Prévoir des liens vers les paragraphes Prévoir des retours au sommaire après chaque partie Prévoir des liens vers les références internes à la page internes au site bibliographie notes

6 Les éléments indispensables : la page
Bas de page : Le courriel de l’auteur ou du webmestre Le nom de l’institution L’adresse complète de la page pour ceux qui impriment… pour ceux qui sauvent leurs pages avant de les lire… La date de mise à jour (de dernière vérification) Le copyright Haut de page : Le retour vers la page d’accueil Le nom de l’institution ou tout autre élément de répérage (image, logo, <URFIST de Paris, <FOURMI sommaire, <Netiquette

7 Les éléments indispensables : la page
Les petits conforts du lecteur Les téléchargements : plusieurs formats génériques si possible la taille et le format des fichiers un lien vers les outils gratuits (acrobat reader, etc…) Les images : utiliser systématiquement l’attribut “alt” de la balise <img> exemple : <img src="../gif/URFIST.png" NOSAVE border=0 height=23 width=56 align=LEFT name="urfist.png » alt =« logo URFIST de Paris «> Les cartes images (images mappées): indiquer clairement les zones activables (changement d’état du curseur ou texte en clair etc…)

8 Les éléments indispensables : le site
Les petits conforts de l’utilisateur (1) “Mon site” a un nom, une page d’accueil (index.htm, accueil.htm etc…..) ou page de référence Site important : une carte du site permet à l’utilisateur de se situer Index, glossaire Table des matières Un moteur interne Je fais tester la circulation entre les pages par un “amateur non éclairé” Je remets tout en question régulièrement et inlassablement : on peut toujours l’améliorer !

9 Les éléments indispensables : le site
Les petits conforts de l’utilisateur (2) “Mon site”a une unité Si possible Sous réserve d’avoir un webmestre autoritaire Sous réserve d’avoir un seul concepteur Sous réserve que tous les auteurs utilisent les mêmes outils (rarissime) Sinon S’organiser pour avoir une charte graphique minimale S’échiner à retravailler les pages des autres, avec tact et diplomatie !

10 Attention à ce qui gène L ’ouverture inopinées de petites fenêtres (publicité ou effets spéciaux…) Avoir à télécharger un très long temps des « plug ’in » merveilleusement animés et révolutionnaires et avant même de savoir si le jeu en vaut la chandelle (penser à proposer une solution texte alternative) Les formulaires longs qui ne se chargent pas une fois renseignés et qu ’il faut recommencer à remplir …… lassant ! Ne pas demander de données privées (sauf avec l ’accord des intéressés) les numéros de téléphones les adresses postales

11 L ’utilisation des cadres ou frames :
Attention à ce qui gène L ’utilisation des cadres ou frames : A n ’utiliser que si la pédagogie l’exige ! Se demander s ’il n ’y aurait pas une autre solution plus « pratique » Penser à ce nouvel internaute, qui ouvre un cadre, et au bout de 2 clics de souris se retrouve devant un échiquier de toutes petites fenêtres… Penser que de toute façon, il aura des difficultés, ce nouvel internaute, à imprimer (sauf s ’il pense à surligner un peu la page qu ’il souhaite imprimer….

12 Les éléments clés d’un bon site
Un site a une utilité, une fonction claire Un contenu défini et destiné à un public précis Sa présentation est simple Son organisation est claire La navigation est intuitive, l’orientation évidente Les informations sont hiérarchisées Des liens à jour (vérifiés régulièrement)

13 Les éléments clés d’un bon site
Un site peut être vu à l’aide de la plupart des navigateurs, sur des écrans petits, moyens ou immenses, utilisant des systèmes d’exploitation variés (Linux, Unix, Mac, PC, etc…) Netscape Internet explorer Opéra Mozilla Staroffice etc...

14 Bibliographie succinte
Créer et maintenir un site web, cours INRIA 1998, ADBS éditions Admiroutes : le guide-âne du webmestre < Les recommandations du W3C : Web content accessibility guidelines 1.0 en anglais le Guide officile du savoir vivre web, sa traduction en français < « Writing for the web », par Jacob Nielsen < Netiquette, etc…. << Ergonomie d’un site internet <