Ressources et Formations

Etude de cas : eptiSoft (2/3)

La suite de l’étude de cas du site eptiSoft

Navigation, ergonomie et accessibilité

Avant de parler de la navigation, je souhaite m’arrêter sur un détail très énervant : la vidéo de présentation. Je ne suis pas fan des vidéos qui se chargent toute seule et qui débute sans rien leur avoir demandé comme c’est le cas sur eptiSoft. Mais le fait qu’en plus le son soit activé (au bureau ou si on utilise son ordinateur comme lecteur multimédia, c’est une horreur d’avoir un son que l’on avait pas prévu !) et, pire encore, que la vidéo se relance à chaque fois que je tombe sur la page d’accueil, c’est carrément insupportable. En tout cas, c’est le genre de détail qui me fait quitter un site. Et je ne dois pas être le seul. Donc un conseil, ne jamais démarrer le son sans l’autorisation du visiteur et, surtout, dans le cadre d’une vidéo de présentation, ne la lancer directement que lors de la première visite. Il est assez simple de savoir si l’internaute est déjà venu (cookies ou ShareObject dans Flash…).

L’un des points les plus importants pour un site de e-commerce c’est la navigation. Elle doit être compréhensible facilement par tous (et ce n’est pas une mince affaire !). Pour eptiSoft, le problème est un peu le même qu’au niveau design. La navigation est un peu complexe.
Ci-dessous, je vous ai mis en rouge tous les accès à des menus de navigation…

Navigation sur le site EptiSoft

Comme vous le voyez, il y a, sur cette page, plus de 9 accès à des outils de navigation. Ils sont tous un peu éparpillés sur la page ce qui rend certaines opérations peu intuitives. La difficulté ici c’est qu’il y a de nombreux menus et sous-menus car il y a beaucoup de catégories de produits. Je pense qu’il aurait été plus judicieux de rassembler les différentes options de navigation secondaire (moteur de recherche, tri, accès aux aides et contacts…) à un seul endroit pour simplifier le tout.

eptiSoft a opté pour des menus déroulants pour la navigation principale. C’est une bonne idée sur la papier car ça rend l’accès à un sous-menu plus rapide. Mais, dans la réalisation, cela pose un problème d’accessibilité. En effet, il est impossible de naviguer dans les menus par le clavier. Or, pour certains handicaps par exemple, cette navigation est primordiale. Il est donc dommage de se priver de certaines personnes (qui peuvent devenir des clients potentiels). Dans le même principe, l’activation de javascript est obligatoire sinon le visiteur est redirigé sur une page temporaire. Il serait intéressant de regarder dans les statistiques le nombre de personnes qui atterrissent sur cette page. On aurait ainsi une indication claire du nombre de visiteurs perdus. Toujours niveau accessibilité, il est dommage de ne pas pouvoir naviguer sur le site sans les images (cela peut arriver dans le cas d’une mauvaise connexion, ou dans le cas d’une visite avec certains navigateurs), le texte apparait alors en blanc sur fond blanc…
Après vérification sur différents navigateurs sur différentes plateformes, j’ai remarqué quelques bugs graphiques (sous linux et mac). Rien de dramatique. Par contre, il y a un gros soucis sous Safari (Mac) puisque l’on a carrément pas accès au panier !
Pour terminer avec l’accessibilité (car c’est un sujet qui me tient à coeur), il y a quelques soucis dans le respect des standards. Certaines balises sont utilisées à mauvais escient (des balises titres h4 alors qu’il n’y a pas de h3 ou h2, des tableaux qui servent pour la mise en forme et non pas des données tabulaires, etc.).
Enfin, on peut s’interroger sur les polices (un peu trop petites) et sur le fait que le site n’entre pas en 800×600.
Cela fait beaucoup de choses, certes, mais la très très grande majorité des sites font les mêmes erreurs. Le respect des normes (W3C) et les notions d’accessibilité ne sont pas encore entrées dans les moeurs malheureusement…

Passons aux bons points maintenant ! Et il y en a également un certain nombre.
Tout d’abord, tout est fait pour faciliter la première visite d’un internaute. On trouve un bouton en haut à gauche qui permet d’accéder à des explications plus détaillées du concept. Parfait !
Ensuite on retrouve une aide et une FAQ (Foire Aux Questions). Pratique pour rassurer le visiteur et l’accompagner.
Il y a également un plan du site, indispensable pour le référencement et pour faciliter la navigation des visiteurs.

Pour se repérer dans le site, il y a un fil d’ariane (Ex : > Logiciels Windows / Création numérique / Composition musicale). Le visiteur ne peut pas se perdre. Pour améliorer le tout, il serait intéressant de rendre les rubriques cliquables. Cela faciliterait encore plus la navigation et ce serait utile pour le référencement du site dans les moteurs de recherche. Toujours pour se repérer, un code couleur a été attribué par plateforme (Vert pour Windows, Bleu pour Mac…). C’est pratique et ça fonctionne très bien avec le design du site.

Je publierais le dernier volet de cette étude de cas dès demain matin…

Ahmed FEKHAR le 15 août 2007 à 12:51

Belle analyse ! je suis d’accord avec toi concernant les standard du W3C (elles ne sont pas encore entrées dans les moeurs, mais je pense que ça ne s’aurait tarder car très vite les designers et webmestres se rendront compte qu’ils ont énormément à gagner en les appliquant). Concernant la navigation et l’ergonomie d’un site e-commerce, je me demandais s’il y’avait des standards ou du moins des ‘best practices’ qui existent.


Gregory le 15 août 2007 à 13:36

Merci pour tes commentaires Ahmed. Il n’y a pas de standards officiels pour la navigation sur un site e-commerce mais tu peux trouver un certain nombre d’articles très intéressants sur le net. Je compte publier des dossiers sur ce sujet mais en attendant, je te conseille de lire les billets de , le blog référence pour ce genre de question. Il est en anglais mais un certain nombre de ces articles ont été traduits et complétés par . J’espère que tu trouveras ton bonheur sur ces 2 sites…


Steven le 16 août 2007 à 09:22

Bonjour à tous,

Il existe les bonnes pratiques Opquast classées par type de service en ligne dont les services de ecommerce.


Gregory le 16 août 2007 à 14:48

Je viens de découvrir un autre bug sur Firefox sur Linux. Sur la page d’accueil, la vidéo est toujours au premier plan. Le menu déroulant ne passe pas par dessus ce qui le rend inutilisable…

Attention de bien vérifier le site sur chaque plateforme :s


Ahmed FEKHAR le 21 août 2007 à 10:39

Merci Gregory. En fait ton blog m’a inspiré pour en créer un moi même (sans grande prétention bien sûr) en me focalisant surtout sur les ‘best-practices’ du e-commerce (dont on parlait justement). Tu peux aller sur ce lien pour trouver la rubrique que j’ai prévu à cet effet :



Et merci de nous enrichir ainsi chaque jour avec du contenu de grande qualité, continues comme ça et ton blog deviendra très bientôt incontournable.


Gregory le 21 août 2007 à 11:00

Bonne chance pour ton blog Ahmed et merci pour tes messages très sympas


Merci de remplir tous les champs et de valider le captcha pour envoyer un commentaire.
Votre commentaire a été enregistré avec succés. Merci !
Chargement

Les articles populaires

Ressources et Formations

E-commerce : Les 20 avantages et inconvénients du commerce en ligne en 2021

Ressources et Formations

10 Objets faits main & DIY à fabriquer soi-même pour vendre en ligne : bois, verre...

Ressources et Formations

Formation e-commerce : Plus de 95 vidéos en ligne pour vous former gratuitement !

Ressources et Formations

Pourquoi les plateformes e-commerce Open Source ne sont pas faites pour vous ⛔️

Créons ensemble votre boutique en ligne WiziShop

Quel est votre prénom ?

Vous allez bénéficier de 15 jours de test gratuit

Enchanté ...

Quel est votre nom ?

Retour

Comment souhaitez-vous
nommer votre boutique ?

Retour

..., merci de définir
votre mot de passe

Le mot de passe doit contenir 6 caractères minimum.

Retour

..., dîtes-moi tout.
Quelle est votre couleur préférée ?

Retour

, quels types de produits allez-vous vendre ?

Retour