Présentation

Ce site a été crée pour la matière suivie à l'université de Franche-Comté "Interface Homme-Machine" par Vincent Benoit (Licence SLIC/CM). Ce document numérique va vous présenter vingt critères de l'Art de la Page d'Accueil illustré par une capture d'écran d'un site nommé "EMP". Il y a plus de 100 critères à retenir pour faire une "bonne" page d'accueil. Nous avons donc choisi d'en sélectionner quelques uns pour montrer leur efficacité et leur utilité sur un site.


Ci-dessous la capture d'écran qui contient des numéros, l'on peut cliquer sur ceux-ci pour voir quel est le critère alloué. Pour ajouter le numéro du critère est un lien qui vous ramènera sur la capture. Par la même, la flèche sur le côté gauche vous permet de remonter en haut de l'écran. Bonne visite

Le site d'EMP

1) Le message d'accueil

Il faut éviter de marquer le mot « Bienvenue » dès qu'un utilisateur arrive sur la page d'accueil, sauf lorsque celui-ci s'est enregistré et a été reconnu par le système.

2) L'affichage en grand et bien en vue du logo de l'entreprise

Le logotype doit être situé dans le coin supérieur gauche pour les visiteurs dont la langue se lit de gauche à droite et vice versa.

3) L'outil de recherche

La barre de recherche doit être suffisamment conséquente pour permettre à l’utilisateur de visualiser et d’éditer des requêtes standard (25 à 35 caractères avec une police générique).

4) Les images

Les images doivent illustrer les propos et non pour orner le site, celles­‐ci doivent attirer l’utilisateur vers l’essentiel.

5) Le titre d'accueil

Le titre doit être simple et concis, il doit être codé par les balises « <title> » dans le document HTML. C’est l’élément fondamental du site puisqu’il permet son ajout dans les favoris et son référencement dans les moteurs de recherches. Il faut par exemple nommer la page comme le nom d’une entreprise ici « EMP ».

6) Les typographies

Il faut utiliser les typographies avec parcimonie car en en ayant une pluralité l'on pourrait donner à l’utilisateur l'impression que les éléments du sites sont des publicités, tels qu'un logo ou un élément typographique. Cela gênera donc la compréhension de l'utilisateur par rapport au message que l'on veut lui faire passer.

7) Les liens de navigation

Ne pas inventer de mots pour en faire des intitulés de catégories de navigation. L’utilisateur doit comprendre les termes utilisés pour pouvoir définir dans quelle partie du site il désire se rendre.

8) Les liens

Il faut faire la différence entre les liens qui ont déjà été visités et ceux qui ne le sont pas encore.

9) Les liens (2)

Le terme « lien » ne doit pas apparaître pour aller sur une autre page, il vaut mieux utiliser le soulignement et la couleur bleu (styles par défaut des liens). cf le référencement ci-dessous (les couleurs bleue et violette)

10) Le référencement

Référencer son nom de domaine accompagné de ses principales variantes (graphies, abréviations et orthographes différentes). Ces informations sont importantes pour orienter le choix de l'utilisateur sur tel ou tel site, celles-ci lui permettent de voir quelles données sont contenues dans le site.

11) Les pop-up

Il faut éviter les pop­‐up car ils gênent le plus souvent l’accès au contenu du site. Ce site a très bien adapté l'effet de "pop-up" pour indiquer ce que contient le panier.

12) Les noms de rubriques

Il faut parler la langue des clients, il faut donc choisir des noms de sections et de rubriques qui ont une signification pour le visiteur. Nous verrons donc ici écrit les marques et les noms de groupes de musiques que les internautes recherchent (ex : Volbeat, D&G, AC/DC Metallica … etc).

13) Les exemples

Il faut illustrer le contenu du site par des exemples. Dès que l'on a cliqué sur la catégorie que l'on souhaite un panel de choix nous est offert et ainsi l'internaute pourra choisir ce qu'il voudra acheter (catégorie femme > T-shirts : tous les t-shirts sont affichés).

14) Les exemples (2)

Pour chaque exemple, proposer un lien menant directement vers lui et placer à proximité le lien menant à la catégorie qui le contient.

15) Les anciennes nouveautés

Faciliter l’accès aux informations qui ont récemment figurées sur la page d’accueil. On peut voir qu'ici les anciennes nouveauté sont remises à jour et qu'elles sont aussi en quantité limitée soit un coup marketing pour l'entreprise "EMP".

16) Les mises à jour

Lors des actualisations, ne mettre à jour que le contenu de la page qui a bien changé. Il faut donc éviter de changer sans cesse toutes les photographies afin de garder les repères des utilisateurs. Avoir un contenu fixe pour toujours est difficile dans le monde du web mais certaines choses doivent rester à leur place pour familiariser les internautes à un site et non à une pluralité.

17) Les erreurs

Il faut prévoir un message d’avertissement en cas de crise. Par exemple : "erreur 404" en "Cette page n’est plus accessible". L'utilisation qui est faite de la gestion des erreurs sur "EMP" concerne le contenu du panier, il indique donc que le caddie est vide mais que peut-être il faudrait le remplir.

18) Le titrage

Les titres doivent être succincts mais évocateurs, transmettre un maximum d’informations en un minimum de mots. "T-SHIRTS FUN Meilleures Ventes" indique très bien ce que contient la catégorie.

19) Le contact

Un site web doit apparaître comme étant un point de contact entre le visiteur et l'entreprise. Ne pas séparer les principes de communication web des principes de communication plus généraux d’une entreprise. Bien distinguer cependant les services qui ne sont disponibles que sur le site de ceux proposés en dehors de l’application web. Il y a deux points intéressants à remarquer sur cette page d'accueil, c'est qu'à plusieurs endroits l'on peut contacter le site tels qu'en haut nous pouvons lire : "Service rapide par E-mail, Vous demandez, nous répondons !" soit une implication de l'utilisateur dans la "vie" du site par le fait de poser des questions et d'avoir aussitôt une réponse par le site. Aussi par le fait d'avoir un service client qui est disponible par téléphone avec les horaires disponibles suivant le jour.

20) Les zones de saisies

Utiliser le minimum de zones de saisie que l'utilisateur confond souvent avec des zones de recherche. À l'intérieur de cette page seul deux champs sont proposés : le champ de recherches en haut du site et le champ à remplir si l'on veut obtenir la newsletter.