www.archive-net-2013.com » NET » E » ERGOLAB

Choose link from "Titles, links and description words view":

Or switch to "Titles and links view".

    Archived pages: 258 . Archive date: 2013-09.

  • Title: Publicité sur le web : que fait l'ergonomie ? - Ergolab
    Descriptive info: 29 Mai 2007.. Publicité sur le web :.. que fait l'ergonomie ?.. TAGS :.. Animations.. Banner blindness.. Crédibilité.. Intrusion.. Publicité.. Son.. éléments d interface.. Publicité sur le web : que fait l ergonomie ?.. Liste des articles.. Version imprimable.. Introduction.. 1.. De la publicité pour des internautes.. 2.. Au niveau d'un site : le rôle du type de page.. 3.. Au niveau d'une page : désignation, emplacements et formats.. 4.. A l'intérieur de la pub : optimisation ergonomique du contenu.. 5.. En résumé - Publicité : les ennemis de l'ergonomie.. Pour en savoir plus.. Introduction.. La publicité sur le web est omniprésente.. Comme tout élément de contenu constitutif d'un site Internet, elle entraîne des questionnements ergonomiques.. Notre objectif consiste à laisser la publicité jouer son rôle, tout en limitant ses défauts potentiels du point de vue de la qualité d'utilisation d'un site.. Cet article traitera à la fois du fond et de la forme des contenus publicitaires, en évoquant l'ergonomie des publicités d'abord du point de vue du web en général, puis à l'intérieur d'un site, et enfin dans une page donnée.. Véritable fondement de l'économie numérique, la publicité sur le web existe et ne peut pas être exclue sous prétexte qu'elle est susceptible de gêner l'internaute.. Les bannières, animations et autres pop-up faisaient déjà partie des.. Top Ten Mistakes in Web Design.. de Nielsen en 1999.. C'est toujours le cas en 2007.. Or, la publicité peut co-exister avec le contenu d'un site Internet, si l'on s'impose quelques interdits dans l'objectif de respecter les internautes.. La réflexion ergonomique consiste donc à.. "faire avec" la pub.. , en appliquant quelques règles de base afin qu'elle perturbe le moins possible la visite du site et la réalisation des objectifs utilisateur.. Pour.. Alex Kirtland.. , intégrer les publicités dans le travail de conception d'un site peut même devenir un défi pour le concepteur web.. Il s'agit donc de les considérer pour ce qu'elles sont : un contenu comme un autre, ou presque.. Les contenus publicitaires ont en effet des caractéristiques qui font qu'ils sont particulièrement difficiles à traiter, à commencer par le fait qu'ils sont finalement toujours des intrus.. Ce sont.. des éléments rapportés venant se greffer.. sur des contenus qu'il est souvent déjà complexe d'organiser et de présenter.. La publicité est la cerise sur le gâteau de la complexité de la conception d'un site web.. L'objectif consiste alors à apporter nos connaissances ergonomique pour concevoir au mieux un site intégrant des publicités, afin que ces dernières.. gênent le moins possible ce qui fait le véritable coeur du site.. Le travail est encore complexifié lorsque la publicité vient se surajouter à une conception déjà établie.. Si votre site doit contenir de la publicité, vous devez le savoir au plus tôt, afin de pouvoir anticiper les débordements d'un point de vue ergonomique, mais aussi afin de concevoir votre site de manière optimale en tenant compte des contraintes publicitaires :.. Lorsqu'une publicité d'un format donné vient se greffer à une organisation déjà existante, tout la conception est à repenser en intégrant cet élément.. Il convient donc de savoir le plus tôt possible si des publicités doivent figurer dans le site, ainsi que leurs formats s'ils sont imposés.. Si vous obtenez ces informations suffisamment tôt, vous éviterez de devoir recommencer le travail de conception et casser une organisation que vous estimiez idéale.. Nous partons ici du principe que la nécessité de présenter des contenus publicitaires sur le site a été questionnée en amont, et que l'on se trouve ainsi confronté au constat suivant :.. "J'ai des contenus, services et fonctionnalités à présenter sur un site Internet.. Ce contenu qui forme le coeur de mon site doit cohabiter avec des contenus promotionnels renvoyant sur d'autres sites Internet".. Cet article traite essentiellement de ces.. publicités.. dites.. externes.. , en mettant de côté les publicités internes (ou "auto-promotions"), qui entraînent des problématiques ergonomiques bien spécifiques.. De la publicité pour les internautes.. La première question à se poser lorsque l'on travaille sur l'ergonomie d'une campagne publicitaire sur le web, c'est de l'envisager au regard des envies et besoins de l'internaute qui va y être confronté.. On revient donc aux basiques de l'ergonomie, c'est à dire à.. penser les utilisateurs.. et leurs objectifs.. comme déterminants de la conception.. de tout élément d'interface.. Bien que la publicité soit un facteur de désagrément pour la plupart des internautes, elle peut correspondre à un besoin utilisateur, pas au sens où on l'entend a priori, mais comme une source de contentement.. Autrement dit, sur Internet, je peux découvrir des choses qui m'intéressent par le biais de publicités, et en être satisfait.. Il faudrait partir de cet objectif et veiller à ce que les contenus publicitaires d'un site soient susceptibles de venir satisfaire ses lecteurs.. Notre objectif n'est pas que les internautes soient heureux de voir de la publicité, mais qu'ils.. acceptent sa présence.. Il existe deux manières de faire accepter un tel contenu : qu'il puisse correspondre à une envie de l'utilisateur à un moment donné, et qu'il n'entrave pas son exploration du site web.. Il convient donc dans un premier temps de se demander comment être au plus proche des envies de l'internaute en matière publicitaire.. Trois grands critères peuvent vous y aider : le contenu du site ou de la page (et notamment, les sujets dont ils traitent), le moment de la journée, et les actions explicites de l'utilisateur.. 1.. Quelle publicité sur quel site?.. Un des principaux critères pour faire de la publicité en ligne "de qualité" consiste à choisir des.. annonceurs en rapport avec le contenu.. et les services de votre site.. Avoir une vraie réflexion sur les publicités que vous acceptez sur votre site permettra de limiter les réactions négatives de vos internautes à propos de ces publicités.. En effet, les publicités ont une incidence de.. 13.. 8%.. sur le jugement du niveau de.. crédibilité d'un site.. de la part des internautes (Etude de.. Fogg al (2003).. sur 2600 participants).. La plupart du temps, ce jugement va dans le sens d'une appréciation négative.. Notons toutefois que si les contenus publicitaires sont bien choisis et respectent le sentiment de contrôle de l'internaute, ils peuvent ne pas influencer le jugement de crédibilité sur un site, voire participer d'une vision positive de ce même site.. Les mêmes auteurs ont montré que le contenu des bannières publicitaires influence la manière dont les internautes perçoivent l'information du site.. Ils constatent ainsi qu'un article est jugé plus crédible lorsqu'il est accompagné d'une publicité pour les voitures Lexus que pour un site de jeux de paris.. Le caractère "respectable" de la publicité a donc un effet significatif sur le crédit apporté par les internautes à votre propre contenu.. Adapter le type de publicité à votre type de sites est donc une des premières recommandations pour faire accepter la présence de la publicité.. En outre, les bannières publicitaires fonctionnent d'autant mieux qu'elles correspondent aux besoins ou aux envies des internautes du site concerné.. Par "mieux", on entend qu'elles seront potentiellement mieux acceptées, et donc qu'elles participeront d'une qualité ergonomique générale du site support.. La publicité, qui est par essence anti-ergonomique (elle ne répond à aucun besoin explicitement formulé), peut ainsi gagner de la valeur en étant intéressante pour l'internaute (et sous réserve qu'elle soit implantée en respectant l'utilisateur).. Deux techniques permettent d'obtenir une publicité qui intéresse vos visiteurs : l'adaptation à la cible lectrice du site support, ou l'adaptation au thème abordé sur la page support.. Analysons ces deux critères de sélection d'un contenu publicitaire à travers les exemples suivants :.. La publicité vise la même population cible que le site support.. Un type de site correspond normalement à un type d'utilisateur (ce type pouvant être défini par leur sexe, leur tranche d'âge, leur catégorie socio-professionnelle, leur localisation géographique, etc.. ).. Plus cette cible est précise, plus il sera facile de lui proposer des publicités en rapport avec ses caractéristiques socio-démographiques.. Sur le site de L'Equipe, on trouve de la publicité pour un parfum homme de Chanel.. Le produit proposé n'a donc rien à voir avec le sujet du site, mais correspond à une préoccupation du visiteur-type du site de l'Equipe.. Source:.. www.. lequipe.. fr.. La publicité évoque un sujet en rapport avec le site support.. On peut encore augmenter le niveau d'acceptabilité d'une publicité en établissant une règle de correspondance thématique entre le site éditeur et l'annonceur.. Plus la publicité est contextuelle, plus elle a de chances de fonctionner.. Sur le site SeLoger.. com, la publicité est essentiellement "thématique": à l'inverse du site de l'Equipe, peu importe la cible d'un point de vue général, ce qui importe est ce qu'elle vient faire sur ce site.. SeLoger propose donc des annonces de crédit bancaire, d'assurances, de cartes de visite, de meubles, etc.. seloger.. com.. On observe le même type de principe sur le site des Inrockuptibles, où l'on trouve des publicités pour des téléphones mp3, des enceintes audio, d'autres magazines, etc.. lesinrocks.. Plus le site support sera précis en termes de sujet ou d'audience, plus vous aurez de chances de toucher vos internautes.. Il est ainsi beaucoup plus difficile d'atteindre un haut niveau d'acceptabilité sur des sites généralistes tels que des journaux en ligne, des portails grand public ou des webmail (hotmail, yahoo mail, caramail, etc).. Le passage du.. pay per view.. au.. pay per click.. et au.. pay per action.. souligne l'importance de l'adaptation des publicités au public qui y est confronté (pour avoir une vue rapide des modalités de rémunération des publicités web, vous pouvez consulter l'article de.. Wikipedia sur la publicité.. en ligne [en anglais]).. Autrement dit, on se dirige de plus en plus vers de la publicité qui veuille dire quelque chose.. 2.. Quelle publicité à quel moment ?.. Une publicité n'est pas adaptée dans l'absolu, mais peut le devenir en fonction de nombreux critères, dont le moment de présentation.. On sera plus sûr d'intéresser l'internaute par un contenu publicitaire (et partant, de moins le gêner) en choisissant le moment le plus adapté pour lui soumettre ce contenu.. Le moment de présentation a des implications sur les points suivants :.. Intérêts ponctuels de l'internaute.. (du type: ".. J'ai faim, donc je vais être plus sensible à une publicité pour un produit alimentaire.. ").. Disponibilité de l'internaute.. Je suis chez moi et pas au travail, je vais donc être plus sensible à des contenus publicitaires du domaine du loisir.. ").. Ce moment de présentation peut être choisi sur différents niveaux :.. Un moment de l'année.. (on ne propose pas les mêmes accroches publicitaires l'hiver que l'été, pendant les vacances scolaires que pendant l'année courante, etc.. ).. Un moment de la semaine.. (l'approche du week-end, le dimanche, le lundi, le mercredi, sont notamment des moments bien précis pour proposer des contenus publicitaires spécifiques).. Un moment de la journée.. (à chaque moment de la journée correspond une tendance à visiter un type de contenu bien spécifique, et correspond aussi une "disponibilité d'esprit", notamment pour les internautes qui travaillent sur des plages horaires conventionnelles).. Des recherches très poussées sont menées à cet égard dans le domaine de l'informatique appliquée (voir Nakamura, 2002, dans les.. lectures complémentaires.. ).. Un événement.. médiatique ou commercial, lié à un jour ou à une période calendaire.. 3.. Une publicité influencée par le comportement réel de l'internaute.. Enfin, la manière la plus fine d'adapter un contenu publicitaire à un internaute est de faire coller ce contenu non pas aux besoins de tous vos internautes, mais d'.. UN.. internaute en particulier.. Il s'agit donc de.. personnaliser les publicités.. que vous allez lui proposer.. en fonction des actions.. qu'il aura accompli.. Deux grands types d'actions régissent l'utilisation du web : le clic et la saisie.. C'est principalement grâce à l'interaction par saisie clavier que l'on va pouvoir adopter des stratégies d'adaptation des contenus publicitaires aux actions utilisateur.. Classiquement, l'internaute effectue une.. recherche sur un mot-clé.. , et on lui fournit une liste des liens sponsorisés en rapport direct avec le mot-clé saisi.. Le mot-clé fait donc office d'indice pour restreindre le spectre des publicités à un thème en particulier.. Dans ce type de stratégie publicitaire, c'est donc presque l'internaute qui "fabrique" ses propres publicités.. C'est ainsi que l'on peut se situer au plus près de ses préoccupations à un instant t.. Ce type de contextualisation est surtout utilisée dans le cadre de publicités sous forme de texte.. Elles nécessitent souvent le recours à un intermédiaire capable de vous fournir une base de liens sponsorisés (Google et Yahoo par exemple).. Des partenariats spécifiques peuvent aussi être mis en place lorsque le spectre des recherches sur votre site est assez limité (cf.. par exemple Dell sur Presence PC).. Sur le site de Presence PC, les résultats de recherche sur les contenus du site sont précédés de 2 résultats sponsorisés en rapport direct avec le mot-clé recherché par l'internaute : si je recherche des mots tels que "écran 22 pouces", "adsl" ou "ordinateur portable", on me propose des liens vers des marchands proposant ce type de produit.. Attention cependant avec l'application visuelle de ce genre de pratiques : vos propres résultats ne doivent pas être placés trop bas dans la page sous prétexte de devoir présenter des résultats sponsorisés, comme c'est le cas ici.. presencepc.. Le site de Monster applique le même type de principe dans le domaine de la recherche d'emploi : on considère que si je cherche un emploi dans un secteur donné, je peux être intéressé par des produits ou services relevant du même domaine.. Ainsi, si je cherche un emploi dans l'immobilier, on me propose des liens sponsorisés vers des recruteurs, mais aussi pour acheter des biens immobiliers.. On est ici dans une application à l'extrême du principe d'adaptation à un mot-clé, qui donne des résultats éloignés des intérêts de l'internaute (ce n'est pas parce que je cherche un emploi dans l'immobilier que je veux acheter un bien immobilier).. Ici, à l'inverse de Présence PC, les liens sponsorisés sont présentés sur la droite de l'écran.. Ils ont donc une apparence plus "conventionnelle" pour des liens sponsorisés, mais sont moins visibles que ceux de l'exemple précédent.. monster.. Ce type de contextualisation des liens publicitaires aux saisies de l'utilisateur est aussi le fondement des propositions faites par Gmail en fonction du contenu des e-mails que vous échangez avec vos correspondants.. Notez enfin que l'adaptation des contenus publicitaires peut aussi prendre en compte les actions utilisateur de type "clics".. C'est ainsi le cas si vous adaptez vos accroches publicitaires dans le panier aux produits ajoutés dans ce panier.. Au niveau d'un site : le rôle du type de page.. Les publicités peuvent être placés à divers endroits d'un site.. Selon cet endroit, la publicité sera plus ou moins gênante en termes ergonomiques.. Plus les objectifs utilisateur sont gourmands en termes de ressources mentales (exemple: lecture d'un article versus scan d'une page d'accueil), plus l'effet distractif d'une publicité pourra gêner la réalisation de la tâche.. Source :.. allocine.. Sur le site d'Allociné, plus on avance dans l'architecture du site, moins les publicités sont présentes, et plus l'on peut se concentrer sur la lecture du contenu.. Certaines pages-clés finales (notamment les résultats de recherche) font exception à cette règle, et sont adaptées pour proposer de la publicité, d'autant plus que cette dernière est contextuelle.. Même si ce genre de pratique est la conséquence du budget consenti par les annonceurs en fonction du nombre de visites par page, elle est tout à fait en accord avec les recommandations ergonomiques (on accepte de charger l'interface lorsque l'activité de l'utilisateur est la moins difficile en termes de charge mentale, c'est à dire dans les premières étapes de navigation).. Paradoxalement, c'est souvent dans les premières pages que l'espace écran disponible est le plus critique.. En insérant de la publicité sur ces pages, on se rajoute donc encore une contrainte au niveau de la conception.. Pour choisir au mieux le type de page sur lequel placer une publicité, il faut en outre prendre en considération que le clic sur une bannière publicitaire peut devenir un.. objectif secondaire de navigation.. (".. Je viens sur un site dans un objectif précis, je l'accomplis, et suis ensuite disponible pour continuer ma visite si l'on sait me donner suffisamment envie.. Il est donc intéressant de placer une accroche publicitaire à des "endroits" virtuels susceptibles de constituer une.. fin de navigation.. (par exemple, la fin d'un article ou le récapitulatif d'un processus d'achat).. On doit aussi coupler l'emplacement en terme de type de page et le contenu de la publicité.. Grossièrement, plus on descend en profondeur dans un site, plus les publicités devraient être ciblées et adaptées à la section consultée.. Si le nombre d'emplacements publicitaires doit être le plus réduit possible, vous devez aussi veiller à.. limiter le nombre de publicités différentes dans un même site.. En effet, même si une publicité le dérange, une fois qu'il l'a analysée, l'utilisateur peut essayer d'en faire abstraction.. Si la zone publicitaire change trop souvent de contenu, on risque d'augmenter sérieusement le caractère distractif de cette zone.. Au niveau d'une page : désignation, emplacements et formats.. A ce stade, vous avez choisi le thème des publicités ou les sites sur lesquels vous allez apparaître, ainsi que l'emplacement des publicités en termes de page dans le site.. Reste à décider sous quelle forme vont se présenter les publicités.. Un mauvais choix à cette étape peut tout à fait ruiner vos efforts sur les étapes précédentes.. La recommandation qui va guider vos choix de formats doit être la suivante : pour optimiser l'ergonomie de votre publicité, vous devez laisser la possibilité aux internautes de s'abstraire de cette publicité.. Contenu ou publicité ?.. Tous les médias (TV, radio, papier, web, mobile) ont des caractéristiques physiques qui permettent d'entreprendre des actions de contournement des contenus publicitaires.. Selon le média, ces actions sont plus ou moins facilitées.. Le caractère linéaire des programmes télé et radio fait ainsi que l'on peut décider de ne pas se soumettre au message publicitaire (".. Je m'extrais  ...   le site initial.. aufeminin.. Liens textuels.. Les liens textuels peuvent être présentés de diverses manières: sous forme de blocs, de liens transversaux à l'intérieur du contenu du site, simples ou agrémentés de descriptifs courts, etc.. Les formats textes auront d'autant plus de chances d'être cliqués si leur contenu est adapté aux intérêts de l'utilisateur.. Vous pouvez donc les préférer si vous avez une idée précise de votre cible et de ses préoccupations, ou un système fonctionnel vous permettant de proposer des liens de manière contextuelle.. Différentes manières de présenter des publicités sous forme textuelle (que ce soit des liens sponsorisés, de l'affiliation ou de la publicité classique), sur les sites de Maison Facile, d'Eurosport et de JeuxVideo.. Attention aux publicités textes présentées uniquement.. au survol de la souris.. sur certains liens.. Ce type de procédé paraît à première vue très intéressant puisqu'il permet de ne pas charger l'interface initiale.. Il devient cependant rapidement anti-ergonomique, à mesure que l'on multiplie les liens sources.. En effet, pour une grande partie des internautes, l'exploration visuelle d'une page web va de pair avec son survol à la souris.. Vous risquez donc de réduire la visite d'une page à l'affichage successif de multiples publicités, apparaissant au survol de chaque lien.. Pour une actualité console, le survol du mot "Friends" génère l'affichage de plusieurs liens publicitaires très forts en termes visuels, qui viennent masquer le mot en question.. cinemablend.. Si vous utilisez ce type d'affichage, vous devez donc respecter 4 recommandations :.. » Fixez-vous une limite maximale en termes de nombre de liens publicitaires par page (dans l'idéal, mesurez-la par "écran", c'est à dire pour une surface de pixels carrés donnée).. » Restreignez ce type d'affichage aux thèmes les plus pertinents pour l'internaute (dans l'exemple ci-dessus, il n'y aucun intérêt à proposer des liens publicitaires au survol du mot "Friends").. » Affectez un format spécifique aux liens publicitaires (ces derniers ne doivent pas ressembler aux liens hypertextes classiques).. » Ne masquez pas l'élément au survol duquel la publicité s'est affichée.. Jeux et bannières interactives.. On rencontre de plus en plus de bannières interactives, ou proposant des sortes de mini-jeux en ligne afin d'attirer les internautes.. Ce type de publicité fonctionne en général très bien, puisqu'elles permettent d'impliquer l'utilisateur, en lui donnant ainsi un rôle beaucoup plus "actif" que tous les autres formats publicitaires.. Si ces formats sont bien gérés en termes d'interaction, ils vous permettront donc d'intéresser vos utilisateurs plus que dans le cas d'une bannière classique.. La principale règle consiste à laisser l'internaute maître de ses actes.. Autrement dit, c'est lui qui doit décider de s'impliquer dans l'interaction que vous lui proposez, via un clic sur un libellé explicite.. Cette publicité pour l'Ipod est parfaitement représentative de ces "jeux" publicitaires.. Elle permet aux internautes de "dessiner" sur un tableau noir: chaque Ipod Nano devient un feutre d'une couleur différente.. Outils fonctionnels.. Une dernière manière de proposer des publicités consiste à fournir des extraits d'interfaces fonctionnelles.. C'est un très bon moyen de s'adapter aux intérêts de votre internaute.. En effet, si ce dernier utilise l'outil, c'est que cela correspond à un besoin chez lui.. Vous aurez donc beaucoup moins de risques, voire aucun, de le gêner.. Ce procédé permet surtout de s'assurer de transformer le clic en une réelle navigation sur le site cible.. Le site de Télérama fournit un formulaire de recherche directe sur le site de la Fnac, clairement identifié comme tel.. A l'intérieur de la pub : optimisation ergonomique du contenu.. La plupart des formats que l'on a évoqué peuvent contenir le même type de contenu (image, animation, texte, son, etc.. Sur le sujet de la publicité, on n'aborde que rarement le contenu des annonces.. En effet, puisque les campagnes publicitaires changent, tout ce que l'on détermine lors de la conception d'un site est un "emplacement" publicitaire, réservé à l'affichage des publicités.. Ensuite, tout dépend des publicités proposées par l'annonceur.. Si vous êtes en charge d'un site intégrant des espaces publicitaires dynamiques, vous devez décider au moins du type de publicité (animée ou pas, sonore ou non, etc.. ), et avoir un regard sur chacune des campagnes menées afin de prévenir de trop grosses erreurs d'un point de vue ergonomique.. Il paraît par exemple tout à fait impossible d'intégrer dans un site institutionnel une publicité sonore se lançant automatiquement.. Bien sûr, ce genre d'écueil est limité par l'adaptation du type de publicité au type de site.. Différents types de contenus peuvent composer une bannière publicitaire.. En fonction de la nature de ces contenus se posent différentes problématiques ergonomiques.. Nous abordons essentiellement les défauts les plus souvent rencontrés aujourd'hui sur le web du point de vue des interactions (parallèlement, on devra s'occuper des problématiques de lisibilité, d'incitation et de pertinence du message, très dépendantes de l'annonceur et de ce qu'il souhaite faire passer chez les gens).. Bannières images ou animées.. Chargement.. Lorsque vous présentez des publicités sous forme de bannières classiques, il est recommandé de.. ne pas attendre que la publicité soit chargée.. pour afficher le contenu du site.. Les bannières étant souvent les éléments les plus lourds d'une page web, ce sont aussi ceux qui demandent le plus de temps de chargement.. Donner la priorité d'affichage au contenu permet aux internautes de commencer à s'approprier la page et à pouvoir interagir avec le site sans nécessairement "attendre" les publicités afin de pouvoir effectuer des actions.. Cette recommandation est cependant rarement appliquée, puisqu'elle signifie que l'on ne peut pas s'assurer que l'internaute aura été confronté au message publicitaire.. » Détournement de conventions d'interface.. Une seconde recommandation consiste à éviter d'utiliser une convention d'interface connue des internautes dans un contexte de page web pour les inciter à cliquer.. Plus précisément, si vous utilisez un objet d'interface signifiant la fermeture (cf.. exemple ci-dessous), le clic sur cet objet doit réellement avoir pour effet de cacher la publicité, et non mener sur le site de l'annonceur.. La publicité de Trombi.. com sur le site de France 5 se présente sous la forme d'une fenêtre système classique, avec notamment une croix rouge dans son extrémité supérieure droite.. On incite donc l'internaute à croire que s'il clique sur cette croix, la publicité se fermera.. Si ce n'est pas le cas et qu'il se trouve redirigé sur le site de Trombi.. com, l'internaute risque d'être très agacé.. Même chose dans la publicité pour le site du magazine Elle: le formulaire représenté dans la bannière publicitaire est un "faux" formulaire: où que l'internaute clique, il sera renvoyé sur la même page du site de Elle.. On demande donc à l'internaute de s'impliquer dans la sélection d'une des options, puis de cliquer sur "Je vote", sans que cela ait aucune utilité.. Ces exemples illustrent parfaitement l'importance de surveiller ce que proposent les annonceurs, et d'être en mesure de refuser une publicité si elle vous semble irrespectueuse de l'internaute au sens large, ou risquée pour votre image de marque.. C'est en effet sa crédibilité, mais aussi la votre en tant qu'éditeur, et donc cautionnant ce genre de pratique, qui est en jeu.. Gestion des zones multi-publicitaires.. Il est très courant que plusieurs bannières aparaissent successivement dans une même zone publicitaire, l'une venant remplacer la précédente (de manière aléatoire ou prévue).. Lorsque vous utilisez un tel système d'affichage, vous devez veiller à fournir un contrôle utilisateur permettant à vos internautes de visualiser chacune des publicités grâce à un clic.. En effet, le clic sur une bannière publicitaire peut devenir un objectif secondaire de navigation d'un internaute qui vient sur un site web pour accomplir une tâche donnée.. S'il ne retrouve pas une publicité qu'il a vu quelques minutes auparavant, il sera déçu.. Il faut donc savoir profiter de ce que l'on amorce chez l'internaute, et lui donner une possibilité explicite de retrouver le message publicitaire l'ayant attiré.. » Bannières animées.. Une grande partie des bannières sur le web sont animées, c'est à dire qu'elles présentent leur contenu sous forme dynamique pendant un laps de temps donné.. Les études sur l'efficacité de l'animation des bannières publicitaires sont contradictoires.. Une étude a montré qu'il semble qu'une version animée d'une bannière en facilite le rappel et la reconnaissance (en comparaison d'une version statique de la même bannière).. Cependant, ces résultats paraissent fragiles, et très contextuels: le contenu de la publicité, son apparence graphique et la marque annoncée sont autant de variables qui peuvent les affecter.. Vous devez d'abord penser à prévoir une version statique si les internautes ne disposent pas de la configuration nécessaire.. Ensuite, quelques recommandations vous permettront de vous assurer d'une qualité ergonomique minimale de vos bannières animées :.. » Durée.. La durée d'une bannière animée affecte à la fois l'ergonomie et l'impact marketing de cette bannière.. Par durée, on entend longueur du message avant d'arriver à la "chute".. L'IAB recommande une durée de 15 secondes, correspondant au seuil au-dessus duquel vous risquez que l'internaute détourne son attention.. En termes purement ergonomiques, plus une animation est longue, plus le message sera complexe à intégrer d'un point de vue mental.. De plus, plus l'animation est longue, plus elle gêne l'exploration du reste de la page par son caractère distractif.. » Mouvement.. Les bannières animées les plus gênantes sont celles qui se jouent en boucle, de manière permanente.. Vous devez éviter à tout prix ce type de bannières, qui ne laissent pas beaucoup d'espace de concentration à l'internaute qui voudrait faire autre chose que regarder la publicité.. Une solution de compromis consiste à.. jouer une fois l'animation.. , puis à laisser la possibilité à l'internaute de revoir l'animation (on trouve souvent à cet effet un lien libellé "revoir" ou "rejouer", le second étant quelque peu ambigu quand à l'action attendue par l'internaute, qui peut croire avoir affaire à un réel jeu en ligne).. Vous devez donc laisser au maximum à l'utilisateur le contrôle du mouvement, et qu'il ne se sente pas assailli par un mouvement continu à l'écran.. Cette recommandation consistant à ne pas jouer une animation en permanence est encore plus critique dans les pages de contenu, nécessitant une disponibilité mentale plus importante pour se concentrer sur la lecture et la compréhension du contenu.. Difficile de lire tranquillement un article sur le web lorsqu'une publicité bouge continuellement à l'écran en plein coeur de l'article en question.. Le non-respect de cette recommandation se transforme en grave erreur dans le cas d'.. animations simultanées.. Il est en premier lieu déconseillé d'avoir plusieurs publicités animées sur la même page.. Lorsqu'en outre celles-ci se jouent en permanence, on obtient une page très désagréable à regarder, qui donne juste envie de fuir.. Prenez donc en compte le nombre de publicités simultanées et leur nature.. Lorsqu'un site contient une seule publicité animée, l'internaute peut engager des stratégies conscientes ou inconscientes de banner blindess.. A partir de deux animations, il devient difficile de s'abstraire de leur mouvement (d'autant qu'ils sont souvent à deux endroits différents de l'écran), et cela demande un effort conscient.. Résultat: l'internaute quitte le site.. Une tendance actuelle consiste pour un même annonceur à présenter la même publicité dans différents formats sur une même page.. On obtient ainsi un effet d'immersion intéressant.. Il faut alors veiller à ce qu'une seule de ces bannières soit animée à la fois, quitte à faire jouer chacune des bannières successivement.. » Message textuel.. Lorsque l'animation contient du texte, vous devez laisser la possibilité de lire correctement le message.. L'animation simultanée est ici encore peu recommandée, puisqu'elle complexifie beaucoup l'activité de lecture (nos ressources attentionnelles sont alors partagées entre les différents espaces animés à l'écran).. De plus, le fait que la lecture soit une activité automatique (on ne peut s'empêcher de lire, et encore moins un message qui nous est présenté dynamiquement) rend l'intégration mentale de tous ces espaces d'autant plus difficile.. Enfin, veillez au temps d'exposition de vos messages: vous devez laisser aux internautes le temps de lire chacune des bribes qui composent votre message final.. Faites donc des ajustements très précis en fonction du contenu de votre message.. Notez que les défauts ergonomiques liés au format animé sont moins critiques sur des pages de navigation (page d'accueil, page de rubrique, etc.. ) que sur des pages réservées à un contenu en profondeur, nécessitant de la concentration.. Le son dans les publicités web.. La première erreur ergonomique des publicités sonores est le déclenchement automatique du son au chargement de la page.. En effet, si notre système visuel peut discriminer un contenu d'une bannière publicitaire, c'est plus compliqué concernant le son, puisqu'on ne sait pas d'où il vient.. Il est donc primordial de fournir à l'écran un indicateur visuel qui traduise l'état d'activation du son.. Selon le type de sites, le déclenchement automatique du son peut être plus ou moins condamnable.. Dans l'absolu, il est moins gênant sur un site de divertissement qui utilise déjà le son ou la vidéo pour présenter certains de ses contenus, que sur un site bancaire ou institutionnel.. Quoiqu'il en soit, tous les contrôles utilisateur permettant à l'internaute d'agir sur votre bannière multimédia doivent être visibles, explicites et utilisables.. Publicités vidéo.. Les vidéos publicitaires intégrées à un site posent des problématiques croisées à celles du son et de l'animation.. Vous pouvez donc appliquer aux vidéos les recommandations précédemment citées.. Si votre site intègre une publicité vidéo, il peut être intéressant de faire jouer cette vidéo sans le son, afin d'attirer l'attention de l'internaute sur la zone publicitaire, et qu'il puisse activer le son lui-même de manière explicite.. En résumé - Publicité : les ennemis de l'ergonomie.. L'ensemble des constats précédents nous amène à distinguer quelques pratiques qui mettent particulièrement en danger l'ergonomie d'une publicité web.. En voici la liste :.. Tromper l'internaute pour l'inciter à cliquer.. Immobilisation des actions utilisateur.. Utilisation de pop-up co.. Déclenchement automatique du son.. Animations permanentes et / ou simultanées.. Temps de chargement trop long.. Non adaptation à l'historique de visite.. Déclenchement d'actions au survol de la souris (plutôt qu'au clic).. Notez que la plupart de ces points recoupent deux grands critères en ergonomie web, le contrôle utilisateur et la charge mentale (pour en savoir plus, vous pouvez lire l'article que nous avons consacré aux.. critères ergonomiques.. de Bastien Scapin).. Parmi toutes les remarques que l'on a évoquées, une grande partie relève de la notion d'.. intrusion.. Vous devez éviter à tout prix que l'internaute se sente empêché ou brusqué par la publicité.. A la différence d'un media plus "passif", les utilisateurs ont besoin d'avoir le.. contrôle de leur navigation.. sur Internet, et acceptent mal de se faire imposer quoique ce soit par un site Internet (temps d'attente, animations à subir, etc.. A chaque fois que l'on emploie un procédé un tant soit peu intrusif, il est donc indispensable de fournir le contrôle correspondant afin que l'internaute puisse contourner la publicité.. Comme à la télévision, on risque que les internautes zappent pendant la pub.. Sur le web cependant, vous avez peu de chances qu'ils reviennent.. Et ça continue après la pub.. Une campagne publicitaire sur le web a souvent de multiples objectifs: générer des clics directs, entraîner des actions différées (de type: ".. J'ai vu que X lançait tel type de produit, je vais donc me renseigner sur le site de l'annonceur en question, ou en magasin.. ") ou venir nourrir une image de marque.. Or, il n'existe souvent pas de gestion à moyen terme des campagnes publicitaires, c'est à dire pas de relais d'une visibilité à un instant t, sur un site donné, pouvant générer du clic mais aussi rester en mémoire pour une utilisation ultérieure.. Lorsque vous faites de la publicité sur le web, veillez donc à ce que votre offre soit accessible à travers votre propre site web, notamment par l'utilisation de mots-clés qui vont venir faire écho chez les internautes.. Enfin, la conception d'une campagne publicitaire sur le web est trop souvent centrée sur la conception de la bannière à poser dans un site support.. Trop peu d'annonceurs se préoccuppent de ce qui arrive lorsque l'internaute clique, et renvoient automatiquement sur leur page d'accueil.. Pensez donc à soigner vos ".. landing pages.. ", c'est à dire la page cible de votre publicité, pour être réellement efficace.. Pour en savoir plus.. Online Ads Tested.. , Adam Lapp, Marketing Experiments Journal (2007).. , Alertbox Useit.. com (2007).. Ads Are Here To Stay: Planning For Ad Placement.. , Alex Kirtland, Boxes and Arrows (2005).. The Most Hated Advertising Techniques.. com (2004).. Pop-up Guidelines.. , IAB Standards and Guidelines (2004).. Rich Media Guidelines.. (PDF 45 Ko), IAB Standards and Guidelines (2004).. Eyetracker Study gives Guidance on how to Place Ads, Etc.. , Ann Light, UsabilityNews.. com (2003).. Eyetracking Research Report - The Times, The Guardian, The Financial Times.. (PDF 943 Ko), The Usability Company Eyetracker (2003).. Making Web Advertisements Work.. Will Plain-Text Ads Continue to Rule?.. Stanford-Makovsky Web Credibility Study 2002: Investigating what makes Web sites credible today.. (PDF, 461 Ko), Fogg al, Stanford Persuasive Technology Lab Makovsky Company (2002).. Improvements in practical aspects of optimally scheduling web advertising.. , Nakamura, In Proceedings of the 11th international Conference on World Wide Web, ACM Press, New York (2002).. Why Are Users Banner-Blind? The Impact of Navigation Style on the Perception of Web Banners.. , Pagendarm Schaumburg, Journal of Digital Information, Volume 2 Issue 1 (2001).. Advertising: A Cry for Usability.. , Kim Brooks, Clickz.. com (2001).. Designing Web Ads Using Click-Through Data.. Just How 'Blind' Are We to Advertising Banners on the Web?.. , Michelle Bayles, Usability News (2000).. Click Here, You Idiot.. , Jeffrey Veen, Webmonkey.. com (2000).. Banner Blindness, Human Cognition and Web Design.. , Norman, jnd.. org (1999).. Banner Blindness: Web Searchers Often Miss "Obvious" Links.. , Benway Lane, ITG Newsletter (1998).. Accès réservé aux abonnés.. How do users evaluate the credibility of Web sites?: a study with over 2,500 participants.. , Fogg al, Proceedings of the 2003 Conference on Designing For User Experiences (2003).. Web credibility research: a method for online experiments and early study results.. Fogg al, CHI '01 Extended Abstracts on Human Factors in Computing Systems (2001)..

    Original link path: /articles/publicite-sur-le-web-que-fait-l-ergonomie-.php
    Open archive

  • Title: Banner blindness - Ergolab, ergonomie sites web
    Descriptive info: TAG : Banner blindness.. Voir tous les tags.. tags.. Banner blindness.. Voir ce tag dans :.. les articles.. les chroniques de livres.. les liens.. le bloc-notes.. afficher.. liste des tags.. 1 ressource(s).. portent le tag.. "Banner blindness".. [article].. Publicité sur le web : que fait l ergonomie ?.. Notre objectif consiste à laisser la publicité jouer son rôle, tout en limitant ses défauts potentiels.. Lire l article.. Voir tous  ...   déposer sont parmi celles qui font le plus rêver les concepteurs web.. Qu'en est-il vraiment du côté utilisateur, et qu'en dit l'ergonomie? Cet article liste chaque point d'accroche des interfaces de drag drop, et émet pour chacun des recommandations, tant du point de vue de l'utilité que de l'utilisabilité de ce mode d'interaction.. dernière note.. [05.. Lorsqu une fiche produit sort de sa page.. Lire la note n°12.. dernière chronique..

    Original link path: /tags/tag.php?id=28
    Open archive

  • Title: Crédibilité - Ergolab, ergonomie sites web
    Descriptive info: TAG : Crédibilité.. Crédibilité.. "Crédibilité"..

    Original link path: /tags/tag.php?id=27
    Open archive
  •  

  • Title: Intrusion - Ergolab, ergonomie sites web
    Descriptive info: TAG : Intrusion.. Intrusion.. "Intrusion"..

    Original link path: /tags/tag.php?id=30
    Open archive

  • Title: Publicité - Ergolab, ergonomie sites web
    Descriptive info: TAG : Publicité.. Publicité.. "Publicité"..

    Original link path: /tags/tag.php?id=25
    Open archive

  • Title: Son - Ergolab, ergonomie sites web
    Descriptive info: TAG : Son.. Son.. "Son"..

    Original link path: /tags/tag.php?id=29
    Open archive

  • Title: Utilisabilité des adresses web - Ergolab
    Descriptive info: 30 Mars 2005.. Utilisabilité des adresses web.. Navigation.. URL.. Utilisabilité.. Utilisabilité des adresses web.. Les URL, outils de communication et de navigation.. Simplifier les URL.. Qualité du contenu d'une URL.. Prévoir les comportements utilisateur hors norme.. Validité des URL.. Conclusion.. Les adresses web font partie de notre environnement.. Crachées par nos ordinateurs, nos radios, nos téléphones, elles envahissent aussi nos publicités, nos boutiques, nos cinémas, nos magazines, nos blocs-notes et nos paquets de céréales.. Leur "vie ergonomique" commence dès l'instant où elles sont communiquées: il faut qu'elles soient perçues, analysées, lues ou entendues, cliquées, mémorisées, notées, dictées, tapées sur un clavier, etc.. Nous évoquons dans cet article l'utilisabilité de ces adresses web, ou URL (Uniform Resource Locator, par exemple: [ http://www.. ergolab.. net/articles/index.. html ]).. Cette URL, qui n'est au départ qu'un objet "technique", moyen permettant d'accéder à un site, est devenue élément d'interface à part entière, et donc susceptible d'être plus ou moins bien adaptée aux activités des internautes.. L'adresse web est aussi devenue objet de communication, on la retrouve donc dans des contextes non informatiques (publicité papier, magazine, livre, etc.. Une adresse web touche l'ergonomie de tous les formats sur lesquels elle apparaît.. En fonction de ses caractéristiques, elle peut diminuer la facilité d'utilisation d'un site internet ou en limiter l'accès.. Elle peut aussi optimiser l'interaction site / internaute, en anticipant les comportements de ce dernier et en lui permettant d'avoir un rôle "actif".. Nous présentons dans cet article les différents thèmes liés à l'ergonomie des URL, en recommandant pour chacun des pistes d'amélioration.. Il s'agit que les adresses web facilitent les activités des utilisateurs plutôt que l'inverse.. Les recommandations concernent aussi bien des utilisateurs novices que des experts du web.. Ces derniers développent en effet des stratégies de navigation qui peuvent être supportées par une conception réfléchie des URL.. Les URL, outils de communication et de navigation.. Pour bien saisir l'importance de l'ergonomie d'une adresse web, on doit la replacer dans ses contextes d'utilisation.. Elle intervient sur de nombreuses interfaces, et a une vie au-delà de l'écran.. On doit donc traiter le versant "informatique" et le versant "non informatique" des adresses web.. L'optimisation des URL est en général bénéfique pour tous les formats sur lesquelles elles interviennent.. » L'URL dans un contexte de communication informatique.. Une URL est l'adresse par laquelle un utilisateur accède à un site.. Dans le domaine informatique, elle susceptible d'être vue par l'utilisateur à de nombreux endroits:.. - Barre d'adresse du navigateur.. - Barre de chargement du navigateur.. - E-mail.. - Sites web: résultats d'un moteur de recherche, lien sur un site.. - Document électronique (fichiers pdf, Word, Powerpoint, etc.. - Etc.. Voici quelques exemples de ces occurrences des URL dans le monde informatique:.. Les URL dans les éléments du navigateur: barre d'adresse et barre de chargement.. Les URL sur le web: dans les résultats des moteurs de recherche, dans des liens sur d'autres sites.. Les URL dans les documents électroniques: fichiers pdf, Word, Powerpoint, etc.. Dans ce contexte informatique, on peut distinguer plusieurs types d'interaction avec les URL selon leur présentation et l'objectif de l'utilisateur:.. L'URL est souvent un lien, un objet sur lequel on peut cliquer.. Elle est alors élément de navigation.. Dans ce contexte informatique, on observe la prédominance de deux comportements: le clic et le copier/coller.. Moins fréquemment, l'URL est glissée/déposée.. Enfin, lorsque le format de présentation de l'URL ne permet pas de cliquer ni de copier (par exemple lorsqu'elle n'est pas sélectionnable: présentée dans une image, dans une animation flash non optimisée), les utilisateurs sont amenés à la recopier au clavier.. L'URL peut aussi, au-delà de ces fonctions de navigation, devenir vecteur de communication.. Elle peut en effet être vue à l'écran et retranscrite dans un autre format:.. - Retranscription sous forme orale (je dicte à mon collègue Bertrand une adresse web pour que l'on puisse discuter d'un site / un client m'appelle, je lui demande de me lire l'adresse dans la barre d'adresses, etc.. - Retranscription sous forme écrite (je note sur un bloc-notes, un post-it, mon palm, l'adresse d'un site afin de pouvoir la transporter et l'utiliser dans un autre environnement).. » L'URL dans un contexte de communication plus traditionnel.. Une adresse web est aussi communiquée par des canaux plus traditionnels: vue sur une publicité et mémorisée, lue sur un carnet, écoutée au téléphone, à la radio, etc.. Elle est donc susceptible d'être entendue, écrite, dictée.. La communication d'une URL s'effectue par divers moyens:.. - Document papier de travail.. - Publicité sur divers supports de communication (magazines, prospectus, sacs, bâtiments, etc.. - Livre.. - Téléphone.. - Radio.. - Synthèse vocale.. Un exemple dans le monde physique: l'URL sur un livre.. L'adresse web dans ces contextes est alors objet de communication, et ne devient outil de navigation que lorsqu'elle est retranscrite par l'utilisateur sous forme de lien (dans un document, un e-mail, une page internet, etc.. Toute la problématique de l'utilisabilité des URL en tant qu'objet de communication se situe dans ce transfert vers l'informatique.. Ce transfert suppose en effet des activités cognitives qui peuvent être complexes si l'URL est mal conçue.. On observera alors des difficultés de répétition (la retranscription sous forme écrite ou orale sera plus difficile), de mémorisation, une augmentation du risque d'erreurs.. » Objectifs de l'optimisation des URL.. 3 domaines sont concernés par l'optimisation de l'ergonomie d'une adresse web:.. Optimisation du site Internet.. : l'URL fait partie du contenu d'un site, elle est un élément d'interface, elle participe de l'ergonomie de ce site Internet.. Optimisation du transfert entre les différents formats informatiques.. Optimisation du transfert entre informatique et monde physique.. Les croisements entre l'URL dans un contexte informatique et dans un contexte physique sont permanents, on doit donc essayer d'optimiser ces transferts dans les deux sens.. » L'optimisation ergonomique bénéficiera à ces 3 contextes d'utilisation des URL.. Simplifier les URL.. L'idée la plus courante pour améliorer l'ergonomie d'une adresse web consiste à la simplifier.. Différentes astuces permettent de simplifier les URL:.. » Toujours écrire en minuscules.. Une adresse web écrite uniquement en minuscules, sans mélange de casses, est plus facile à taper, à écrire, à dire à voix haute, à mémoriser.. Elle permet aussi d'éviter les erreurs de direction en fonction du comportement du serveur (la plupart des systèmes font en effet la distinction entre majuscules et minuscules).. » Ecrire avec des termes compréhensibles.. Pour qu'une URL soit simple, elle doit exclure tout vocabulaire technique et "codes" obscurs, qui n'ont aucune signification pour les utilisateurs.. Les adresses web intègrent souvent de tels éléments lorsque les pages sont dynamiques et que l'URL contient des paramètres déterminant le contenu de la page.. C'est aussi le cas lorsque des pages sont générées à partir d'une application de gestion de contenu, et que les règles de génération de l'URL contiennent des éléments techniques et non orientés utilisateurs:.. » Réduire le nombre de caractères de l'adresse.. Il semble évident qu'une URL courte est plus simple qu'une URL longue.. Une adresse web courte est plus facile à lire, à analyser.. Elle est aussi plus facile à sélectionner à la souris, donc à copier / coller:.. En 1, l'URL est moins utilisable qu'en 2: sa longueur fait qu'elle est plus difficile à lire (selon la largeur de la fenêtre, elle peut ne pas apparaître en totalité), à analyser, à mémoriser, à sélectionner (pour copier / coller, supprimer une partie de l'adresse, se déplacer dans la barre d'adresses, etc.. Le fait de concevoir des URL plus courtes facilite aussi des aspects moins évidents.. Cela permet par exemple d'éviter aux liens d'être "coupés" dans les applications de messagerie.. Certains clients mails coupent les adresses web au format texte à environ 80 caractères, ce qui rend plus difficile l'interaction.. Dans ce cas, l'utilisateur est obligé de copier-coller l'URL sur deux lignes au lieu de cliquer sur un lien.. De plus, si le début de l'adresse reste cliquable, il est très fréquent que l'utilisateur clique dessus et ne comprenne pas (ou pas immédiatement) pourquoi il obtient une page introuvable.. On observe souvent dans ce cas que l'erreur est attribuée à l'expéditeur du message ("il a mal orthographié le lien", "la page n'existe même pas.. ", etc.. Peu d'utilisateurs ont les compétences nécessaires pour essayer de comprendre l'erreur et d'où elle provient.. Enfin, une URL courte s'adaptera mieux dans les sites sur lesquels elle apparaît.. Pour l'éditeur du site, elle sera plus facile à présenter, car plus susceptible de s'intégrer dans le  ...   il faut prévoir tous les comportements utilisateur qui pourraient les amener à interagir avec les URL.. Ce n'est qu'en connaissant et en anticipant ces comportements que l'on pourra optimiser l'utilisabilité des adresses web.. Les utilisateurs voient, lisent et parfois modifient les URL afin d'arriver à leur objectif.. Le but de la démarche ergonomique dans la conception des URL est d'optimiser ces adresses en les rendant plus utilisables, quelque soit le comportement de l'utilisateur et son niveau d'expertise.. » Lecture d'une URL dans la barre de chargement.. Lorsque les utilisateurs ont atteint un certain niveau d'expertise, ils se rendent compte que l'adresse exacte d'un lien apparaît dans la barre de chargement du navigateur lorsque l'on survole ce lien.. Cet état de fait leur permet d'adopter des stratégies anti-erreurs, afin de limiter la visite de pages inintéressantes ou qui ne correspondent pas à leur objectif.. Lire une URL dans la barre de chargement donne notamment une information sur le format du document, en fonction du type d'extension: [.. doc ], [.. ppt ], [.. pdf ], etc.. Cela permet aussi de distinguer des liens internes (on reste à l'intérieur du site) et les liens externes (la page visée appartient à un autre site).. Concevoir des URL de qualité permet d'optimiser ces stratégies: plus l'URL est explicite et donne des informations précises sur la page, plus il est facile de prendre une décision de navigation:.. Ergonomie et Flash.. , Ergolab.. Le survol du lien permet l'analyse de l'URL de la page visée dans la barre de chargement.. Dans cet exemple, l'utilisateur obtient les informations suivantes:.. - Le lien est un lien externe.. - Ce lien externe pointe vers un site référence, celui de Macromedia (il peut donc s'aventurer à le visiter, il trouvera sans doute des contenus de qualité).. - Le document visé est un document pdf.. - Il appartient à des rubriques concernant le flash et l'utilisabilité (d'après la hiérarchie de répertoires), et c'est un livre blanc.. Pour supporter ce comportement, on doit donc concevoir les fichiers et sous-fichiers de manière thématique, avec des mots qui veulent dire quelque chose et ne consistent pas en des codes incompréhensibles.. Les informations contenues dans l'URL peuvent aussi uniquement servir de vérification.. La durée nécessaire au choix de navigation ("je clique ou je clique pas?") sera alors réduite.. En effet, si le site source indique directement dans la page le nom du site externe, le type de document et les thèmes qu'il aborde, l'analyse de l'URL consistera en une simple et rapide vérification de ces informations.. » Remontée dans les niveaux de fichiers.. Lorsque "ça ne marche pas" et que l'utilisateur tente d'atteindre une page à tout prix, il en arrive souvent à analyser le contenu de cette adresse web, afin de trouver une stratégie pour trouver la page qu'il cherche ou un contenu approchant.. Une des stratégies consiste à corriger manuellement l'URL, en modifiant certains paramètres (par exemple un numéro d'identifiant d'un produit, un chiffre, un caractère spécial) ou en remontant la hiérarchie de fichiers.. Dans ce dernier cas, l'utilisateur supprime un à un les niveaux de l'architecture de l'information, jusqu'à trouver une page pertinente.. Cette stratégie est ce que Nielsen appelle le.. URL-butchering.. :.. Cette stratégie est plus fréquemment mise en oeuvre lorsque l'utilisateur arrive sur une page introuvable à partir d'un lien dans un autre site ou dans les résultats d'un moteur de recherche.. Remonter les niveaux de fichiers est alors un moyen d'atteindre les autres contenus du site.. A un niveau encore supérieur, le URL-butchering devient aussi un moyen de navigation rapide lorsque la navigation du site est mal conçue et difficilement accessible (Exemple: on préfère supprimer toute la hiérarchie de fichiers plutôt que de peiner à trouver le lien "accueil").. Ces stratégies de contournement d'une mauvaise conception de site sont une nouvelle illustration de l'importance que la hiérarchie de fichiers soit bien dessinée et explicite, afin de guider l'utilisateur et de lui permettre d'arriver au plus près de la page qu'il recherchait.. Intervient ici aussi l'importance de la longueur de l'URL: il est plus facile de sélectionner et de supprimer un "morceau" d'URL lorsque ce dernier est petit et ne dépasse pas la longueur de la barre d'adresses.. » Deviner une URL.. Une URL que l'on peut deviner commence d'abord par un nom de domaine "intuitif".. De plus en plus d'utilisateurs du web tapent directement une URL dans la barre d'adresses lorsque le site qu'ils veulent visiter est une institution, une enseigne commerciale très connue, une société renommée, etc.. Pour deviner ces URL, ils se basent sur leurs expériences antérieures et les "conventions" dans le choix d'un nom de domaine.. De plus, lorsque l'on conçoit l'architecture d'un site et les URL associées, on doit veiller à adopter des règles strictes, valables pour tout le site, et simples à mémoriser pour les utilisateurs.. Concevoir des URL prédictibles, c'est donc en partie adopter des règles précises dans la conception des URL, l'achat des noms de domaines, les hiérarchies de fichiers des sites, etc.. Ces règles permettront d'atteindre une cohérence dans les actions de communication.. Cette cohérence aidera les utilisateurs à pouvoir deviner les adresses web sur la base des adresses qu'ils connaissent déjà.. Par exemple, si le site d'une école permet à chaque élève d'avoir sa propre page, et que l'utilisateur sait que la sienne s'appelle [ http://ecole.. com/david ], il peut en déduire que la page de sa copine Léa se trouve sur [ http://ecole.. com/lea ].. Il est donc important que le responsable informatique ne l'ait pas placée sur.. [ http://lea.. ecole.. com ].. Lorsque l'architecture du site est plus complexe à deviner ou à écrire, on doit aussi prévoir que les utilisateurs puissent entrer des URL simples et intuitives pour accéder à des pages-clés.. On parle souvent d'URL "human-guessable" en citant les exemples classiques des sites de Microsoft ou d'Adobe, qui opèrent des redirections de haut-niveau sur la base des adresses potentiellement entrables par les utilisateurs:.. Par exemple, [ microsoft.. com/visio ] mène à la page de détail du logiciel Visio, même si l'adresse "réelle" de la page est.. microsoft.. com/office/visio/default.. asp ].. Validité des URL.. Une fois qu'une adresse web a été diffusée, il est nécessaire qu'elle soit toujours accessible.. Si pour des raisons de refonte ou de changement de stratégie technique l'adresse d'une page change, on devra configurer le serveur de façon à ce que cette page redirige vers la nouvelle version.. Lors de la refonte du site Asmodée, la règle de conception des URL a changé pour des raisons techniques et éditoriales.. Cependant, une procédure de redirection a été mise en place pour que les anciennes adresses pointent bien vers les nouvelles pages (ici, l'exemple de la page produit Jungle Speed).. Sites web, moteurs de recherche et utilisateurs (à travers leurs favoris, leurs notes, documents, e-mails, leur mémoire.. ) gardent la trace de vos anciennes URL.. Lors de la reconception d'un site, on doit donc penser à ces aspects et mettre en place des procédures techniques pour permettre aux utilisateurs d'accéder aux contenus via les anciennes adresses.. Conclusion.. Les adresses web sont à la fois un moyen d'accès, de navigation et de communication pour le web.. En tant que telles, elles induisent des problématiques d'ergonomie.. En réfléchissant à l'utilisabilité de ces URL, on peut optimiser l'interaction des utilisateurs avec un site web, du premier accès à une visite "experte".. » Ressources en ligne :.. Server side usability.. , guuui.. com, 2004.. Serving citizens' needs: minimising online hurdles to accessing government information.. (Fichier pdf, 1.. 05 Mo), Eszter Hargittai, IT Society, Volume 1, Issue 3, pp.. 27-41, 2003.. User-Centered URL Design.. , Jesse James Garrett, Adaptive Path, 2002.. Towards Next Generation URLs.. , Thomas Powell Joe Lima, port80software.. URL Design.. , rubrique du Chapitre 4 de Designing Web Usability, New Riders Publishing, 2001.. Source: WDVL (Web Developer's Virtual Library).. How to make URLs user-friendly.. , Adam Baker, 2001.. The Cranky User: Making URLs accessible.. , IBM, Peter Seebach, 2001.. Making URLs predictable.. , Kristoffer Bohmann, 2000.. Usable file and directory names make usable URLs.. , Dey Alexander, 2000.. URL as UI.. , Jakob Nielsen's Alertbox, March 21, 1999.. Understanding URIs.. , in Common HTTP Implementation Problems.. W3C Note 28 January 2003.. » Ressources externes :.. Jakob Nielsen,.. Designing Web Usability.. , New Riders Publishing, 2001.. in Chapitre 4 (Site Design): URL Design, pp 246-256.. Disponible en ligne à partir de.. Web Developer's Virtual Library..

    Original link path: /articles/utilisabilite-des-adresses-web.php
    Open archive

  • Title: URL - Ergolab, ergonomie sites web
    Descriptive info: TAG : URL.. URL.. "URL".. Leur "vie ergonomique" commence dès l'instant où elles sont communiquées..

    Original link path: /tags/tag.php?id=2
    Open archive

  • Title: L'ergonomie dans la conception d'un formulaire - Ergolab
    Descriptive info: 24 Juillet 2004.. L'ergonomie dans la conception.. d'un formulaire.. Formulaires.. Gestion des erreurs.. L ergonomie dans la conception d un formulaire.. Le choix et la spécification des éléments de formulaire.. Organisation visuelle du formulaire.. Rapidité d'exécution.. Sûreté d'exécution : la gestion des erreurs.. Le formulaire est l'un des moyens pour l'utilisateur d'envoyer des données, alors que son comportement classique sur le web consiste plutôt à recevoir des informations.. Cette notion entraîne des problématiques d'ergonomie autres que celles liées à la simple consultation de contenus.. Cet article présente les standards d'ergonomie web pour la conception de formulaires et quelques recommandations à adapter à la spécificité de chaque situation.. Les thématiques concernant les formulaires couvrent un large champ d'application, dans les domaines du logiciel et du web, pour le grand public ou les applications métiers, pour les novices ou les utilisateurs expérimentés.. Qu'ils servent à envoyer un message, acheter un produit, remplir un questionnaire ou accomplir une tâche professionnelle plus précise, les formulaires doivent respecter certaines règles.. On peut distinguer des recommandations génériques et des recommandations spécifiques, qui seront déduites du contexte d'utilisation du formulaire et de ses caractéristiques.. Il existe une grande différence entre un formulaire destiné à un site grand public ou à une application professionnelle.. Cette différence est d'ailleurs à étudier quelque soit la thématique (mode d'interaction avec le formulaire, organisation des champs, gestion des erreurs, etc.. Les formulaires sont quelque chose d'assez bien défini au niveau des règles à appliquer pour les formulaires web classiques (formulaire de contact, de commande d'un document, de gestion d'un processus d'e-commerce.. C'est beaucoup plus complexe pour les formulaires spécifiques, destinés à être utilisés dans un cadre professionnel, et pour lesquels on ne dispose pas de référent existant.. Pour ce type de formulaires, l'analyse de l'activité doit prendre une place beaucoup plus importante, c'est elle qui doit guider les choix d'interfaçage plutôt que l'application de règles standards.. Le choix et la spécification des éléments de formulaire.. La première étape dans la conception d'un formulaire consiste à déterminer son utilité, ce à quoi il doit servir, et les informations qu'il doit permettre de recueillir.. Les méthodes d'analyse de l'activité et des supports existants ainsi que les méthodes d'interview permettent de compléter cette première étape.. Après avoir décidé des informations à recueillir via le formulaire, il faut trouver la manière optimale de les demander à l'utilisateur.. Un formulaire se décompose en différents éléments de formulaire.. Les caractéristiques de chaque élément permettent de récupérer des types d'informations particuliers.. » La ligne.. L'élément "Ligne" permet d'obtenir un champ de formulaire d'une seule ligne.. Les paramètres qui peuvent être spécifiés sont la longueur de la ligne et les données qui peuvent y être entrées.. Les valeurs de ces paramètres doivent être adaptées au type de données afin de faciliter le renseignement du formulaire par les utilisateurs :.. Exemple : les deux champs lignes "E-mail" et "ISBN" n'ont pas la même taille du fait de la différence des informations attendues.. » Le champ texte.. L'élément "Champ texte" permet d'obtenir un champ de formulaire d'une ou plusieurs lignes.. Les paramètres qui peuvent être spécifiés sont le nombre de lignes, la longueur de la ligne et les données qui peuvent y être entrées.. Les valeurs de ces paramètres doivent être adaptées au type de données.. » Le bouton radio.. L'élément "Bouton radio" correspond à un élément de formulaire permettant une sélection unique.. Les boutons radio sont donc une série de boutons exclusifs, fonctionnant sur le mode "On - Off".. Ils permettent de présenter des réponses alternatives à une question:.. Exemple d'utilisation de boutons radio : choix entre l'option "Oui" et l'option "Non".. L'utilisation des libellés "Oui" et "Non" permet d'insister sur le caractère binaire de cet élément de formulaire.. Il est plus indiqué pour une utilisation de formulaire par les novices, mais nécessite plus d'espace à l'écran qu'une simple case à cocher.. Les avantages des boutons radio (ainsi que des cases à cocher) tiennent essentiellement au fait que toutes les options sont visibles sans nécessiter d'action de la part de l'utilisateur (contrairement à une liste déroulante par exemple).. Le pendant de cet avantage est que ce type d'élément de formulaire prend beaucoup de place à l'écran et peut compliquer la lecture du formulaire.. Les boutons radio sont des éléments qui ne peuvent fonctionner qu'en groupe (c'est à dire au moins deux boutons radio).. Il ne peut donc pas exister d'interface avec un seul bouton radio.. Le bouton radio doit être placé par défaut sur l'option la plus fréquemment choisie, ou que l'on suppose la plus appropriée en fonction d'une analyse de la tâche.. S'il n'existe aucune option préférentielle, les boutons radio peuvent être laissés décochés.. Cependant, cela oblige l'utilisateur à accomplir une action de sélection quelque soit la situation.. La présélection par défaut a un inconvénient lorsque la sélection d'un bouton radio est optionnelle.. En effet, une fois que l'utilisateur a sélectionné une option, il ne peut pas revenir en arrière sauf si le concepteur a prévu un bouton "pas de sélection".. » La case à cocher.. L'élément "Case à cocher" permet d'obtenir une liste d'options au sein de laquelle la multisélection est possible.. La case à cocher est aussi employée pour des choix binaires (le cochage / décochage de la case active ou désactive une fonction).. Les cases à cocher peuvent être présentées seules ou en groupe.. Lorsqu'elles fonctionnent en groupe, les choix qu'elles proposent sont non-exclusifs.. Les cases à cocher comme les boutons radio fonctionnent sur le mode "On - Off" (on coche ou on décoche la case).. Les avantages de la case à cocher sont identiques à ceux des boutons radio.. Exemple d'utilisation de cases à cocher.. La présence des 3 cases à cocher (Vendredi, Samedi et Dimanche) permet à l'utilisateur d'effectuer :.. - Une sélection unique (une option parmi les 3 proposées).. - Une multisélection (2 ou 3 options parmi les 3 proposées).. » Le menu déroulant.. L'élément "Menu déroulant" permet d'obtenir une liste d'options avec un libellé visible (soit l'intitulé du champ, soit la première option de la liste, soit une option sélectionnée par défaut).. Ce type d'élément d'interface permet de proposer un grand nombre d'options sans prendre beaucoup de place à l'écran.. L'utilisateur ne peut faire que des choix uniques.. Exemple d'utilisation d'un menu déroulant : le menu déroulant intitulé "Rubrique" permet de choisir à quelle rubrique appartient un article d'Ergolab.. Ce type d'interfaçage permet de proposer 4 options sur une seule ligne à l'écran (à l'inverse de cases à cocher où toute les options sont visibles à l'écran).. » La liste.. L'élément "Liste" permet d'obtenir une liste d'options avec la liste des premières options visible à l'écran (en fonction de la longueur visible de la liste à l'écran).. L'utilisateur peut en général effectuer des choix multiples, sauf si le concepteur a spécifié l'inverse.. » La double liste.. L'élément "Double liste" permet d'obtenir deux listes d'options avec possibilité de passage d'éléments d'une liste à une autre.. Organisation visuelle du formulaire.. Présentation générale du formulaire.. La conception d'un formulaire doit avoir pour objectif de permettre aux utilisateurs de le renseigner rapidement et efficacement (avec le moins d'erreurs possibles).. Le type de présentation que l'on choisit doit être adapté aux caractéristiques de l'utilisateur et de la tâche : est-ce que les utilisateurs connaissent bien l'outil informatique, est-ce qu'ils utilisent fréquemment le formulaire (et à quelle fréquence), est-ce que la rapidité d'exécution est capitale, etc.. Un formulaire peut être présenté sur une seule page, ou découpé en plusieurs pages.. Cette dernière configuration est appelée "wizard" en raison du caractère "assisté" du remplissage du formulaire : on guide l'utilisateur à travers plusieurs étapes successives, jusqu'à ce qu'il ait renseigné toutes les informations dont on a besoin.. Chacune des configurations a des avantages et des défauts, qui sont plus ou moins importants en fonction du type d'application, du niveau d'expertise de la cible utilisateur et de sa fréquence d'utilisation du formulaire.. Certains inconvénients peuvent être contournés en adoptant des solutions simples.. Wizard.. » Avantages.. - Simplicité de chacune des pages : puisque le formulaire est découpé en plusieurs parties, on ne présente à l'utilisateur qu'une partie des informations sur chaque page.. Ce procédé permet qu'il se concentre sur les renseignements qu'on lui demande de fournir, sans être distrait par d'autres groupes de champs du formulaire.. Le renseignement d'un formulaire par étapes successives permet de réduire la complexité perçue de la procédure.. - Gestion des erreurs simplifiée : lorsque l'utilisateur renseigne mal une des pages (oubli d'informations obligatoires ou mauvais format de réponse), on lui affiche un message et on l'aide à corriger ses erreurs.. Ce type d'informations est beaucoup plus "digestible" lorsque la page est de taille réduite que lorsque l'on a affaire à un long formulaire.. En effet, la détection du ou des champs mal renseigné(s) est beaucoup plus aisée.. Découper le formulaire en plusieurs pages permet donc d'optimiser  ...   au suivant lorsque l'on peut détecter que le premier est renseigné.. Ce procédé ne doit être utilisé que pour les données de longueur fixe.. En outre, il ne peut être appliqué que sur des interfaces utilisées très fréquemment et de façon répétée.. Les utilisateurs doivent être experts et connaître parfaitement toutes les entrées du formulaire, leur ordre et leurs caractéristiques.. Ce procédé peut poser problème sur les sites gand public: on ne connaît pas le niveau d'expertise des utilisateurs et ces utilisateurs ne viennent pas assez fréquemment pour "apprendre" le comportement de l'interface.. De plus, il pose le problème de l'hétérogénéité du comportement en fonction des champs.. » Faciliter la vérification des données entrées.. Exemple : La longueur d'un champ (ligne ou texte) est un moyen de faciliter l'interaction des utilisateurs avec le formulaire, en limitant les actions à accomplir avec le clavier et la souris pour vérifier la validité des données entrées.. En effet, lorsqu'un champ ligne est trop petit, les utilisateurs ne peuvent voir simultanément l'ensemble des données qu'ils ont renseignées.. Ils sont donc obligés de se déplacer à l'intérieur du champ afin de vérifier qu'ils n'ont pas fait de fautes de frappe:.. Exemple : la longueur de ce champ E-mail est trop réduite pour que les utilisateurs puissent vérifier d'un seul coup d'oeil qu'ils ont bien renseigné leur adresse.. Sûreté d'exécution : la gestion des erreurs.. Protection contre les erreurs.. La gestion des erreurs dans un formulaire commence d'abord par ce que l'on appelle la protection contre les erreurs.. Il s'agit de tout mettre en oeuvre pour ne pas induire l'utilisateur en erreur, et pour limiter les erreurs qu'il pourrait commettre.. La conception du formulaire est donc déjà un moyen de limiter en amont les erreurs potentielles.. Mieux le formulaire est conçu, moins les utilisateurs risquent de commettre des erreurs.. Plus on fournit d'éléments de sélection (liste, menu déroulant, case à cocher, bouton radio), plus on diminue le risque d'erreur.. En effet, les éléments de formulaire qui présentent le plus de risque sont ceux qui acceptent la saisie de la part de l'utilisateur (champs ligne ou texte).. On doit donc.. prévoir les erreurs classiques.. On peut par exemple, prévoir le fait que les utilisateurs attendant patiemment l'envoi du formulaire cliquent plusieurs fois sur le bouton de validation afin d'être certain que le formulaire soit envoyé.. Si l'envoi du formulaire est long, on doit afficher une barre de progression.. De plus, le système doit fournir un moyen informatique de corriger le double envoi.. On doit aussi limiter le risque de confusion entre un bouton "Annuler" et un bouton "Envoyer" en ne fournissant qu'un bouton à la fin du formulaire, celui de validation.. La.. légende des champs.. (par exemple indiquer que le mot de passe doit comprendre 6 caractères au minimum) permet d'indiquer à l'utilisateur les pièges potentiels du formulaire.. Dans l'exemple précédent, la légende évite à l'utilisateur d'être contraint à passer par une étape supplémentaire s'il avait en tête un mot de passe inférieur à 6 caractères.. Protéger l'utilisateur contre les erreurs, c'est aussi lui donner la.. possibilité de confirmer les actions importantes.. (par exemple la validation finale d'une commande en ligne).. Cela peut consister à récapituler les détails de ce que l'utilisateur va confirmer, et indiquer que le bouton de validation correspond à la validation finale, qu'il n'y a pas de possibilité de retour en arrière.. spécification des paramètres des éléments de formulaires.. peut aussi permettre d'optimiser la protection contre les erreurs.. Les valeurs des paramètres (exemple : taille visible du champ, nombre de caractères maximum) doivent être adaptées au type de données afin de faciliter le renseignement du formulaire par les utilisateurs.. La taille affichée d'un champ donne un indice aux utilisateurs sur quel type de donnée est attendu.. Elle peut donc leur permettre d'aller plus rapidement dans la détection que l'information qu'ils pensaient renseigner n'est pas celle attendue, ou n'a pas le format attendu.. Par exemple, une saisie de dates présentée sous forme de trois champs différents (adaptés au format de données attendu) peut faire comprendre rapidement à l'utilisateur que le format de l'année attendu est sous forme de 4 chiffres, et non de 2.. On évite ainsi qu'il commette une erreur et soit obligé de la corriger.. Enfin, la.. validation du type de données.. renseigné (caractère texte, chiffre, caractère spécial, etc.. ) peut permettre de détecter une erreur non remarquée par l'utilisateur, et évite que les données envoyées soient erronées.. Détection des erreurs.. Il faut aussi concevoir le formulaire de façon "intelligente" au niveau du développement, afin de faciliter la détection des erreurs : par exemple, on doit checker si un code postal ne contient bien que des chiffres (si le formulaire est uniquement destiné à la France).. Si l'utilisateur entre une donnée sous forme de caractères, on affiche un message d'erreur.. Il est important de ne pas "sur-valider" un formulaire, afin de rester flexible.. Par exemple, pour un formulaire à visée internationale, la validation d'un champ de téléphone devrait accepter les caractèrs autres que les chiffres, tels que (, ), +, etc.. La détection des champs doit se faire en une seule validation : on valide tous les champs en même temps et on affiche toutes les erreurs, au lieu de procéder de façon séquentielle (une erreur à la fois).. Cela permet à l'utilisateur d'aller plus rapidement dans la correction de ses erreurs.. Affichage des messages d'erreur et aide à la correction.. Deux problématiques différentes doivent être traitées dans l'affichage des messages d'erreurs :.. - Le fond : qu'affiche-t-on dans les messages d'erreur?.. - La forme : Comment affiche-t-on ces messages?.. » Contenu des messages d'erreur.. On ne doit jamais retourner un formulaire sans en expliquer la raison.. Un message général doit être fourni (qui explique "Vous avez fait une erreur"), mais aussi un / des messages spécifiques sous ou à côté des champs mal renseignés.. Ces messages doivent réellement expliquer l'erreur : il ne s'agit pas uniquement de dire "c'est faux", mais plutôt "un code postal doit être composé uniquement de chiffres", et fournir un exemple de renseignement correct si besoin.. Suite à la validation, on devra veiller à ne pas effacer les entrées valides.. De plus, pour faciliter la correction des erreurs, on n'effacera pas les entrées erronées.. » Apparence des messages d'erreur.. Afficher un message d'erreur dans la page et non dans une pop-up permet à l'utilisateur de ne pas avoir besoin de mémoriser la ou les erreurs : il peut revenir au message pour le relire plus attentivement si besoin.. Si le système technique vous contraint à afficher ce message dans une pop-up, vous pouvez fournir à l'utilisateur le moyen de corriger son ou ses erreurs directement dans cette pop-up.. Les messages d'erreur doivent être affichés de façon très distincte, dans une couleur de type "alerte" (rouge, orange).. L'utilisateur ne doit pas se demander pourquoi la page s'est rechargée après validation (sans voir qu'un message d'erreur s'est affiché).. Cette problématique semble peu importante, on pense que les utilisateurs verront forcément qu'un message d'erreur est apparu à l'écran.. Cependant, des tests rapides peuvent montrer de façon criante l'importance du format des messages d'erreur.. Vous pouvez à ce sujet consulter l'expérience de Viewit dans les.. Exemple d'affichage d'un message d'erreur : on affiche l'explication en rouge et en gras, sous le champ concerné.. On accompagne ce message d'une mise en valeur du contour du champ mal renseigné.. On accompagne ce message d'une mise en valeur du fond du champ mal renseigné pour attirer l'attention de l'utilisateur sur ce champ en particulier.. Les problématiques de lisibilité, d'organisation visuelle et de gestion des erreurs sont les points centraux dans la spécification ergonomique d'un formulaire.. La conception des formulaires est un domaine vaste et très contextuel.. On peut dégager certains standards mais les choix d'interface sont souvent dictés par la spécificité des tâches.. » Ressources en ligne.. Usability and HTML Forms.. Andrew Starling, 2001 (Web Developer's Virtual Library).. Enhancing form usability with instructions and validation.. Michael Meadhra, 2004 (Builder.. com).. Usable Form Design.. Your Usability Resource, 2004.. Forms, usability, and the W3C DOM.. Peter-Paul Koch, 2003 (Digital Web).. Why Users Don't Complain About Unusable Forms.. Caroline Jarrett, 2001 (STC Usability SIG Newsletter).. Forms - 508 Tutorial.. Usability.. gov.. Simple Tricks for More Usable Forms.. Simon Willison, 2004 (Sitepoint).. » Ressources externes.. Mayhew (1992).. Principles and Guidelines in Software User Interface Design.. , Prentice Hall.. Chapitre 5 : Dialog Styles : Fill-in Forms.. à voir aussi sur Ergolab.. [28.. Aide contextuelle onfocus chez Yahoo! Mail.. Lire la note n°3.. Best practices for form design.. Un formidable document préparé par Luke Wroblewski (auteur de.. Site-Seeing: A Visual.. Approach to Web Usability.. ), et pas moins de 112 pages entièrement consacrées à l'ergonomie des formulaires, et réparties en 4 grands chapitres : Why Does Form Design Matter, Information, Interaction, et Feedback.. Un must.. (Lien direct vers pdf)..

    Original link path: /articles/ergonomie-formulaire.php
    Open archive

  • Title: Comment concevoir un menu ? Partie 2 - Ergolab
    Descriptive info: 14 Décembre 2003.. Comment concevoir un menu ?.. Partie 2.. Chapitres de livres gratuits.. Menus.. Comment concevoir un menu ? Partie 2.. Adaptation du menu à l'utilisateur et à son activité.. Compatibilité avec la tâche.. Compatibilité avec les actions habituelles de l'utilisateur.. Compatibilité avec les caractéristiques de l'utilisateur : le menu doit pouvoir.. être contourné.. première partie de cet article.. a détaillé les principales caractéristiques d'un menu et les problématiques d'identification et de sélection des options.. Nous verrons ici dans quelle mesure un menu doit être adapté aux caractéristiques de l'utilisateur, et comment cette adaptation peut être mise en place.. Adaptation du menu à l'utilisateur et à son activité.. Compatibilité avec la tâche.. Les menus permettent de présenter les options disponibles à un moment donné de l'activité de l'utilisateur.. Les options non disponibles peuvent ainsi être présentées dans un format différent.. On peut aller encore plus loin dans l'adaptation des menus à l'activité de l'utilisateur.. En effet, on peut proposer des menus contextuels, différents en fonction de l'élément à partir duquel on sollicite le menu.. Il s'agit de partir de l'environnement dans lequel l'utilisateur se trouve pour lui proposer les options les plus pertinentes.. Ces options tiendront compte des actions de l'utilisateur (par exemple la sélection d'un mot entraîne l'apparition de l'option « copier » dans le menu contextuel).. Ce procédé est employé presque exclusivement dans le domaine logiciel.. Dans le domaine du web, la compatibilité avec la tâche s'exprime dans l'aide à la navigation.. Le menu est alors à la fois un outil de navigation et une aide à la navigation.. En effet, il doit montrer clairement à l'utilisateur la rubrique du site dans laquelle il se trouve.. Les jeux de couleur sont à cet effet très utiles pour signifier à l'utilisateur la rubrique active du site :.. Source :.. com/jeux-de-societe/contact/.. La page que consulte l'utilisateur se trouve dans la rubrique "contact".. On doit cependant veiller à ce que ces différences de couleurs soient aussi visibles en niveaux de gris.. Parallèlement, et ce aussi bien dans le domaine web que logiciel, le passage du pointeur sur une option de menu peut entraîner un changement de l'interface :.. La page que consulte l'utilisateur se trouve dans la rubrique "contact" et le pointeur de la souris est positionné sur le titre de rubrique "liens".. Bien que ce procédé ne soit pas utilisé dans toutes les interfaces, il permet de fournir un retour à l'utilisateur sur l'efficacité de ses actions.. De plus, il souligne les options disponibles.. Là encore, les possibilités offertes sur le web sont beaucoup plus diversifiées qu'en logiciel.. Compatibilité avec les actions habituelles de l'utilisateur.. Certains logiciels tentent d'adapter la présentation des options de menu en fonction de l'activité de l'utilisateur.. Par exemple, si j'utilise plusieurs fois l'option "options de correction automatique" dans  ...   plus adapté.. Si on part du principe que l'application doit satisfaire à la fois une cible novice et une plus à l'aise avec l'outil informatique, on devra faire attention à fournir des moyens pour contourner la rigidité d'un menu.. En effet, l'utilisateur expert a surtout besoin d'être efficient (et pas seulement efficace) : il doit réussir à accomplir l'action mais aussi le faire rapidement.. On essaiera ainsi de permettre la réalisation d'actions par des raccourcis claviers ou des macros personnalisées pour certaines applications.. Il est aussi recommandé dans les logiciels de doubler le menu de raccourcis iconiques.. Ce procédé peut servir deux types d'intérêts différents.. Il peut permettre à l'utilisateur d'aller plus rapidement et d'effectuer en un clic ce qu'il pourrait faire en plusieurs.. Il est important de fournir à l'utilisateur des moyens de personnaliser ces raccourcis.. Les icônes permettent aussi à certains utilisateurs novices de raisonner de façon plus imagée et directe.. Il est donc important de fournir par défaut les raccourcis des options les plus utilisées.. Enfin, les menus contextuels sont un moyen d'appuyer les menus principaux puisqu'ils peuvent fournir les mêmes options.. Cependant, les options accessibles par le menu contextuel sont adaptées à la séquence d'utilisation.. Ils sont souvent accessibles par un clic droit (ou ctrl + clic) dans la zone de travail de l'application.. La rapidité d'exécution est encore ce qui sous-tend l'utilité de ces menus contextuels et leur importance pour les utilisateurs confirmés.. De nombreuses problématiques sont liées à la conception des menus.. Il paraît primordial d'étudier ce qui se fait dans le domaine où l'on travaille.. En effet, le transfert des connaissances des utilisateurs est un paramètre qui permet d'optimiser la facilité d'apprentissage de l'interface.. Ceci est valable autant dans le domaine du web qu'en logiciel.. Ensuite, la conception d'un menu doit être adaptée à son utilisation et à la population cible.. Les points les plus importants sont liés à la structuration du menu (groupement et présentation des options), aux termes employés et aux mécanismes d'identification et de sélection.. Norman, K.. The Psychology of Menu Selection: Designing Cognitive Control at the Human/Computer Interface.. Published by Ablex Publishing.. Miller, G.. A.. (1956).. The Magical Number Seven, Plus or Minus Two: Some Limits on Our Capacity for Processing Information.. The Psychological Review.. , 63, 81-97.. Disponible en ligne à l'adresse suivante :.. http://www.. well.. com/user/smalin/miller.. html.. Helander, M.. (eds) (2000).. Handbook of HCI.. 2nd edition North-Holland: Amsterdam.. Mayhew, D.. J.. (1992).. Chapitre 4, Designing Menu Systems.. Prentice Hall.. [20.. 10.. 2003].. Comment concevoir un menu ? Partie 1.. Les menus sont un style d'interaction très fréquent dans le domaine de l'informatique grand public.. Ils sont utilisés à la fois dans le domaine du web et du logiciel, mais leur forme est différente.. Cet article.. Information Architecture.. Louis Rosenfeld Peter Morville..

    Original link path: /articles/ergonomie-menu-2.php
    Open archive

  • Title: Menus - Ergolab, ergonomie sites web
    Descriptive info: TAG : Menus.. Menus.. 2 ressource(s).. "Menus".. Comment concevoir un menu ? Partie 2.. La première partie de cet article a détaillé les principales caractéristiques d'un menu et les problématiques d'identification et de sélection des options.. Nous verrons ici dans quelle mesure un menu doit être adapté..

    Original link path: /tags/tag.php?id=9
    Open archive



  •  


    Archived pages: 258