Il y a quelques jours, Lionel Damm a publié un billet concernant une « grille d’analyse de site web » sur Marketing On The Beach. Depuis plusieurs mois, je suis abonnée au flux RSS de ce blog et je vous invite vivement à vous y intéresser car de nombreux billets y sont publiés quotidiennement avec des sujets variés et de qualités.
Un questionnement à envisager
Le Search Engine Journal a publié la semaine dernière une grille d’analyse contenant 50 questions dans 8 domaines différents (Accessibilité, Navigation, Design, Contenu, Sécurité, Aspects Technique, autres aspects Marketing, Mentions légales). Ces questions ont été traduites par Blog Web Marketing puis complétées par 10 autres sur le référencement par Ramenos (lire ci-dessous).
Marketing On The Beach a réuni ces 50 questions dans un PDF téléchargeable. Sympa !
Cette « Check-List » n’est pas à prendre au pied de la lettre mais elle permet un premier pas si vous ne savez pas par o๠commencer pour améliorer votre site web ou envisager une refonte par exemple.
1. Votre site possède-t-il une page 404 personnalisée qui renvoie bien un code d’erreur 404 ?
2. La balise Meta title est-elle différente sur toutes les pages du site ?
3. Possédez-vous sur vos pages des balises Meta polluantes (keywords, revisit-after,dublin core, language…) ?
4. Les urls de votre site sont-elles réécrites ?
5. Les principales pages du sites (niveau 0 et 1) sont-elles correctement accessibles d’un point de vue moteur ? Avec un code http 200 et non 301 ou 302 ?
6. Possédez-vous un chemin de fer adéquat sur l’ensemble de vos pages ?
7. Votre site fait-il de l’échange de liens barbares avec d’autres sites web ?
8. Possédez-vous des pages réalisées à partir de frames ou d’iframes ?
9. Votre menu principal est-il codé proprement en css/html ou encapsulé dans du javascript ?
10. Toutes les pages de votre site sont-elles correctement reliées entre elles ?
Le weekend dernier, j’ai eu la chance d’avoir accès à un OLPC : One Laptop Per Child. Voici mes impressions face à ce petit bijoux à moins de 200$ destiné seulement aux enfants situés dans les pays en voie de développement.
A propos
Créé en 2005 aux états-Unis, l’association à but non lucratif, One Laptop Per Child, a pour but de créer un ordinateur portable peu cher pour permettre à chaque enfant dans le monde d’avoir accès à la connaissance et à une forme d’éducation moderne. Ce projet est financé avec le soutien de plusieurs entreprises (eBay, Google, Marvell…) qui participent à l’activité de l’association en lui fournissant des expertises et des moyens dans certains domaines comme la logistique, la chaîne de fabrication etc. Plus d’infos sur Wikipédia ou le site officiel OLPC.
A Savoir : préjugé à proscrire
Selon le wiki anglais de l’OLPC :
« Il doit être mentionné qu’une critique commune du projet est de dire : « Les gens pauvres ont besoin de nourriture et de logements, pas d’ordinateurs portables. » Ce commentaire, souvent, est ignorant des conditions dans lesquelles se trouvent les pays en voie de développement de par le monde. Bien qu’il soit vrai qu’il y ait beaucoup de personnes dans le monde qui ont manifestement besoin de nourriture et de logements, il y en a aussi des multitudes qui vivent à la campagne ou dans les banlieues urbaines et qui elles, ont à manger en abondance et peuvent s’abriter raisonnablement. Ce que ces gens n’ont pas, c’est un moyen décent d’accéder à une bonne éducation.»
(source wikipédia)
Prise en main intuitive mais…
En effet, ayant l’habitude d’utiliser un système Windows ou OS, j’étais assez hésitante sur cette navigation principalement constituée de pictogramme (sans intitulé) avec des localisations totalement différentes des systèmes habituels. Toutefois, après quelques secondes d’observations, la prise en main a été très facile et mes pré-acquis ont été vite oubliés.
Caractéristique : objet destiné aux enfants
Quelques détails qui confirment que ce produit est destiné à un enfant vivant dans des conditions environnementales rudes :
Plastique léger, robuste et épais afin de l’impact des chocs et une utilisation brutale.
Coins arrondis pour éviter des blessures.
Couleurs péchues, dynamiques et attrayantes.
Sécurité d’ouverture : l’enfant ne peut ouvrir le laptop sans avoir déplié les antennes wifi.
Un clavier Qwerty au touché doux et agréable grâce à sa matière en caoutchouc qui résiste au sable et à la pluie.
Poignée ergonomique pour le transport, pour se servir de cet ordinateur comme d’un livre grâce à son écran pivotable qui peut passer en mode noir/blanc pour une lecture en plein soleil.
L’OLPC n’a pas d’application mais des Activités : l’association préfère utiliser un langage davantage destiné à l’apprentissage et à la pédagogie au lieu d’utiliser des termes technique. Cela permet de familiariser l’enfant à son nouvel outil. Ce choix est soutenu par une représentation visuelle du système de navigation qui utilise principalement des pictogrammes « ultra-culturel » (universel) permettant une meilleure compréhension pour l’éducation de l’enfant.
Pour illustrer cette idée de l’icà´ne « ultra-culturel », le wiki de l’Olpc donne comme exemple le pictogramme de l’Å“il (ci-dessus) qui identifie la webcam de l’ordinateur. Cette Å“il est celui de l’ordinateur et non de l’utilisateur. Il représente ce que peut voir et saisir l’ordinateur. Dans notre culture occidentale, on aurait tendance à mettre une camera ou un objectif. Ici, l’association a préféré créer un pictogramme pouvant parler à tous en humanisant l’ordinateur.
La navigation sur le système de l’Olpc se fait principalement grâce aux pictogrammes et aux rollovers qui permettent d’afficher les actions ou options des activités qu’ils proposent.
Note : Le raccourcie pour retourner au bureau est situé seulement à la troisième position dans la barre d’environnement. La priorité est mise sur la communication, le réseau et le partage avec d’autres enfants qui auront eux aussi un Olpc.
Le centre d’activité est un repère visuel par sa position centrale sur le bureau mais aussi par la disposition des activités qui s’affichent chronologiquement autour du logo.
J’ai noté un raccourci fort utile qui permet de superposer le cadre de la barre d’environnement et des activités par dessus l’activité en cours.
Le touchpad manque parfois de précision, les activités sont longues au chargement et la barre de défilement verticale (scroll) est trop fine par rapport au curseur qui est de taille importante. Je ne m’avancerais pas plus car je ne correspond pas à la cible de cette ordinateur et j’ai de forte habitude sur PC ou Mac ce qui n’est pas le cas de ces enfants. Cette initiative est toutefois honorable et mérite qu’on s’y intéresse.
Conclusion en vidéo
Pour finir ce billet je vous invite à regarder 2 vidéos fortes intéressantes. La première est l’interview de Nicholas Negroponte, fondateur du Media Lab du MIT, qui a eu lieu le 2 février dernier sur France24. Ce reportage est très instructif car il confronte, entre autre, l’Olpc et l’arrivée des ordinateurs à moins de 300$. Nicholas Negroponte défend son association avec justesse et conviction. La deuxième vidéo est un reportage sur les designers de FuseProject. Ils expliquent comment ils ont conçu l’Olpc avec ses étapes d’évolutions, ses contraintes, les différentes maquettes…
Pour tester un site web avec la déficience visuelle que peux avoir un daltonien, je connaissais ColorBlind. Malheureusement, ce dernier ne fonctionne pas avec les sites en Flash. Aujourd’hui, je viens de découvrir Color Oracle qui peut être une alternative ou un complément à ColorBlind.
Le Daltonisme
« Le daltonisme est une anomalie dans laquelle un ou plusieurs des trois types de cà´nes de la rétine oculaire, responsables de la perception des couleurs sont déficients […] Il existe plusieurs formes de dyschromatopsie partielle, la plus fréquente étant la confusion du vert et du rouge. Les autres formes de daltonisme sont nettement plus rares, comme la confusion du bleu et du jaune, la plus rare de toutes étant la déficience totale de perception des couleurs (achromatopsie), o๠le sujet ne perçoit que des nuances de gris. » Suite sur Wikipédia.
Color Oracle (version béta)
Color Oracle applique un filtre de couleur sur votre écran afin de simuler la vision d’une personne atteinte de Daltonisme. Toutefois, dès que vous désirez naviguer ou faire une action sur votre ordinateur le filtre disparait. En revanche, ColorBlind permet de consulter un site HTML (et non en Flash) dans son intégralité avec les réglages visuels souhaités.
Si vous avez d’autres solutions, logiciels ou services, je suis preneuse, merci 😉
La semaine dernière Alexandre Huete, que vous avez découvert avec l’univers ErgoIHM, m’a envoyé un lien vers un nouveau « moteur de recherche » qui permet de soutenir gratuitement une à quatre ONG de son choix : Hooseek.com
MAJ : « Mardi 27 mai 2008, nouvelle version d’Hooseek »
« Aujourd’hui le 10 avril 2008 hooseek vient de dépasser les 2 000 000 de recherches effectuées par les internautes. Nous avons de plus en plus d’utilisateurs, et les sommes récoltées pour les associations de votre choix sont de plus en plus importantes. BRAVO & MERCI à Tous et à Toutes. L’équipe d’Hooseek »
A propos
Fondée en novembre 2006, Hooseek est un « moteur de recherche » offrant la possibilité aux internautes de soutenir plusieurs ONG de leur choix gratuitement. Grâce aux partenariats signés avec des moteurs de recherche, l’échange du trafic établie et l’affichage des annonces commerciales des moteurs, Hooseek reverse la moitié de leur chiffre d’affaire aux ONG. Plus d’infos…
L’Innovation par le confort
La qualité du service vient de la possibilité de consulter les résultats d’une requête sur Google, Yahoo, Live Search ou Ask sur une seule et même page avec le choix de chercher par différents thèmes (image, dico, web et emploi).
Cette page d’accueil, sobre et épurée, reprend le logo de Hooseek au centre de la page et installe au mieux le champ de saisie du moteur. Toutefois des petits défauts subsistent (surtout en accessibilité visuelle) :
Lorsque l’utilisateur sélectionne un des thèmes de recherche, la sélection reste perceptible pour l’utilisateur car le picto change de couleur mais malheureusement son intitulé disparait. Il manque une information omniprésente qui permet de guider l’utilisateur.
Le champ de saisie du moteur est de dimension trop importante par rapport au bouton de validation qui est de taille insuffisante.
Ce problème de taille se retrouve sur les pictos du bas qui font office de menu principale. Malheureusement, ils sont illisibles à cause de leur petite taille.
Le Seeker & le SeekEasy
Le Seeker : l’efficacité d’Hooseek vient entre autre de son « ascenseur universel » qui permet de dérouler à l’infini les résultats de sa recherche. Cette particularité, fortement pratique, permet de supprimer la pagination ou le fameux « pages suivante ».
Le SeekEasy : L’utilisateur a la possibilité de conserver des résultats qu’il trouve pertinent d’une de ses recherches. Il ajoute sa sélection au « pense-bête » grâce au picto situé à cà´té du lien. La sélection faite, elle sera affichée sur la colonne de droite. Ce pense-bête interactif se trouve sur chaque thème et permet de s’organiser selon la recherche par thème.
Le SeekCare
Le SeekCare est le service principale que propose Hooseek qui peut se résumer en 1 recherche = 1 don grâce à ce compileur de moteurs.
Ici, comme sur la page d’accueil, un problème de lisibilité peut freiner l’utilisateur dans sa navigation :
Les pictogrammes et logos des services sont trop petits
L’absence de légende ne permet pas de renseigner au mieux l’utilisateur. L’intitulé des thèmes, lors du rollover, s’affichent en dessous du champ texte du moteur à la différence de l’intitulé des logos qui s’affichent dans la colonne de droite. Un problème de visibilité et de perception s’annonce surtout pour un site élastique.
Pour la recherche d’emploi, un module complémentaire au moteur apparaît et permet de sélectionner la région o๠l’utilisateur veut effectuer sa demande. Toutefois, il ne peut pas rechercher dans plusieurs régions en même temps, ni par contrat, par date de parution…
Menu Principale & bouton retour
Juste une petite remarque sur le logo qui est à la fois un bouton retour vers la page d’accueil mais aussi le menu principal. Chaque picto est situé juste en dessous et affiche leur intitulé (lors du rollover) en-dessous du logo comme s’ils devenaient la signature du service. Sinon, toujours la même remarque : problème d’accessibilité visuelle.
Conclusion
Un petit clic pour l’homme, un petit geste pour l’humanitaire !
Magnifique conclusion je trouve. En tout cas, j’ai adopté Hooseek et je l’utilise en permanence.
Il y a déjà quelques jours Amélie Boucher a envoyé un email pour souhaiter ses meilleurs vÅ“ux 2008 à tous ses contacts.
Elle nous demande aussi de voter parmi 3 thèmes proposés pour décider du prochain article publié sur Ergolab.net.
Les 3 propositions :
Les personas
Le drag & drop
Les fiches produits
J’ai voté pour la méthodologie des personas car même si j’ai lu son livre, j’ai un peu de mal à comprendre, à apprivoiser cette méthode et surtout comment l’appliquer. Si ce thème est retenu j’espère qu’il y aura des exemples concrets.
Les personas sont des personnages virtuels qui représentent la cible utilisateur du projet web en cours de conception. Ils sont imaginés par l’équipe du projet et permettent une meilleur approche de la cible.
Et vous, avez-vous une préférence ?
Mise à jour du lexique d’Ergophile
La partie lexique d’Ergophile est en train d’être remis à jour grâce à l’aide d’un ami ergonome, Brice Kovacs, que j’ai rencontré lors d’un Pecha Kucha organisé par l’association des Designers Intéractifs. Brice m’a signalé des petites erreurs ou le manque de précision pour certains mots. GlOups !
Note : Le raccourcie pour retourner au bureau est situé seulement à la troisième position dans la barre d’environnement. La priorité est mise sur la communication, le réseau et le partage avec d’autres enfants qui auront eux aussi un Olpc.
