Exotech.biz

Web, Technology & life by Bastien Labelle

Aller au contenu | Aller au menu | Aller à la recherche

Readability, améliorez votre expérience lecture sur le web

J'ai récemment lancé mon blog personnel en anglais, où j'ai fait un travail particulier en termes d'UI et d'expérience utilisateur (UX). En me basant sur le principe KISS (NDLR: keep it simple, stupid), j'ai essayé de concentrer mes efforts sur le contenu. En ressort une interface simple et minimaliste pour un blog centré sur son contenu.

Une chose est intéressante: il n'y a absolument pas de sidebar, de widget ou autre contenu qui peuvent géner la lecture du contenu principal. J'avais déjà évoqué le sujet de l'anxiété de l'information en prenant pour exemple notamment le site de 20 minutes qui est plus que surchargé. Je trouve que c'est aussi le cas sur exotech.biz, où l'on peut être facilement distrait par la sidebar.

Readability, avant et après

Arrivé dans mon Delicious via un contact bien intentionné, Readability vient pallier ce problème d'anxiété de l'information. Il s'agit en fait d'un bookmarklet qui permet de s'abstraire de tout ce qu'il y a autour du contenu d'une page web, et de ne donner en rendu que le contenu d'un article par exemple. Ainsi, cela permet de se concentrer sur le contenu, et la lecture devient bien plus aisée.

Le bookmarklet est customisable, et permet d'afficher plusieurs styles différents qui plairont j'en suis sûr à tous les gouts. Ce petit bout de script est magique, et offre un confort de lecture exceptionnel. Readability ne marche malheureusement pas partout, mais fournit d'assez bon affichages dans de nombreux cas. Cependant, cela me fait penser qu'il faudrait vraiment standardiser les blogs autour d'un micro-format.

Zenbe et Orgoo: le retour des usines à gaz? (et des invitations pour Orgoo)

La dernière tendance sur le web a montré que les services disponibles sur le web avaient tendance à se simplifier, Twitter en est d'ailleurs l'exemple parfait, et le crédo less is more est plus que d'actualité, et beaucoup l'ont compris dans de nombreux domaines, allant de la simple communication tels que Twitter, Pownce, Seesmic ou Gmail, jusqu'à des sujets plus sérieux comme le management de projet, je pense notamment à BaseCamp ou LightHouse.

Le métier de webdesigner a évolué, et comme dirait mon pote Daniel, il ne s'agit plus de construire de belles interfaces, high road architecture, mais des interfaces modulaires et surtout efficaces, ce qu'il appelle low road architecture.

Pourtant, je remarque que certaines applications semblent faire un certain buzz, sont dites comme révolutionnaires, et représentent l'avenir du web, ce sont selon les plus gros blogs les prochaines killer webapps que tout le monde attend tant. Je veux parler de ces webmails dont tout le monde semble faire l'éloge en ce moment: Zenbe et bientôt Orgoo.

Zenbe a déjà fait 36 fois le tour de la blogosphère (sauf sur ce blog), c'est un webmail techniquement très bien réalisé, mais aussi graphiquement très réussi, et vous savez quelle importance j'accorde aux interfaces utilisateur. Zenbe sait tout faire: e-mail, pages, calendrier, gestion de fichiers, et il se connecte même à Facebook. Tout faire? Non, en réalité, Zenbe oublie quelques petits détails, tels que le transfert et la redirection d'e-mails, ou encore la gestion des conversations, des petits riens qui s'avèrent être réellement indispensables et qui changent la vie, notamment lorsque les gens se croient sur une messagerie instantanée (petit clin d'oeil à mes collègues de boulot).

ZenBe

Orgoo est quant à lui sorti en beta privée hier, avec 500 invitations sur TechCrunch qui sont parties à la vitesse de l'éclair, il n'en restait plus au bout de 20 minutes. Orgoo sait lui aussi tout faire, du moins il saura bientôt tout faire: e-mail, contacts, calendriers, IM mais aussi des fonctionnalités inédites comme le chat vidéo ou l'envoi de SMS, qui ressemble un peu à Yahoo Live. Comme j'ai pu le lire dans un commentaire sur TechCrunch, Orgoo est assimilable au FriendFeed des emails. Ou plutôt au SocialThing, étant donné qu'il ne s'agit pas d'une simple agrégation. Mais il souffre des mêmes défauts que Zenbe.

Orgoo

Ces deux services sont donc très puissants, autant l'un que l'autre, et devraient ravir bien des gens fans d'interfaces riches. Pour ma part, j'ai l'impression d'avoir à faire à des usines à gaz. Peut-être sont-ils trop complexes pour moi. Ils me rappellent mon Outlook vieillissant, ou plutôt sa déclinaison web, le client online d'Exchange.

Alors, est-ce que le future of webapps c'est des applications toujours plus complexes, où l'on peut faire plus de choses? Ce serait peut-être le revers de la médaille, dû au fait d'avoir voulu créer des choses trop simples, trop limitées en termes de fonctionnalités. Mais je n'ose pas y croire...

Note: je dispose de 6 invitations pour Orgoo, si vous désirez tester, toujours la même procédure!

FOWD'08 Review

Comme vous le savez peut-être, j'étais la semaine dernière à Londres pour la conférence Future Of WebDesign - FOWD pour les intimes, prononcez FAOUW'D à la Daniel Burka. Même si j'ai pu admettre que parfois le contenu prime sur le webdesign, et ce n'est pas des sites comme Craigslist qui me contrediront, j'accorde une certaine importance au webdesign, et à toutes les notions qui l'entourent, que ce soit l'ergonomie, l'utilisabilité, et tous ces gros mots pour la simple et bonne raison qu'ils sont une des clés du succès d'un site web.

Un petit résumé s'impose donc, car cette conférence a été de bonne qualité dans l'ensemble.

FOWD

Finding Inspiration for Design, Patrick McNeil

Une présentation très intéressante qu'a donné Patrick McNeil, où il nous rappelle que l'inspiration web ne vient pas seulement du web, mais aussi de tout plein de choses que l'on trouve dans ce que j'appellerais le monde réel, comme les tableaux, notamment. Des explications sur les tendances actuelles au niveau du webdesign (large headers, polices extra-larges, patterns), mais aussi de l'avenir de ces tendances, car oui, il faut l'admettre, la période web 2.0 glossy shiny & flashy est bel et bien révolue, la mode est désormais aux couleurs plus claires, comme celles de l'administration de Wordpress 2.5 par exemple. Et ce n'est pas Polo qui me contredira! Il parait que la prochaine tendance à suivre sera la vidéo, mais je n'en suis pas vraiment convaincu en termes d'utilisabilité.

User Experience Vs Brand Experience, Steve Pearce & Andy Clarke

Un titre un peu aguicheur, qui présente une vraie confrontation qui finalement se traduira par une conclusion "User Experience IS Brand Experience". Un Steve Pearce un peu mou, qui parle tout doucement, mais qui se rattrape par la qualité de ses slides dessinés qui résument plutôt très bien la situation: l'expérience utilisateur est un iceberg, et il est préférable de travailler sa partie cachée (ce que les gens font) plutôt que sa partie visible (ce que les gens voient). Andy Clarke est quant à lui bien plus à l'aise, mais on est tellement captivé par la personne que l'on en oublie presque ce qu'il dit!

Designing the User Experience Curve, Andy Budd

Encore une présentation intéressante, où Andy Budd résume l'expérience utilisateur d'un site web en 7 points importants: La première impression, l'utilisabilité, la personnalisation, les détails, le feedback, le fun, et l'expérience. De très bonnes illustrations et exemples viennent illustrer parfaitement ces points clés, allant de la homepage de Yahoo aux Apple Stores en passant par Flickr et l'iPhone.

Microsoft Session, Benedict Ireland

Sans vouloir faire de polémique là-dessus, tout le monde s'est accordé à dire que la présentation de Silverlight était mauvaise. Dans une conférence où le maître mot est utilisabilité, il apparait évident que la présentation du site d'Aston Martin, qui est clairement inutilisable, n'avait pas sa place ici. Mais il faut bien laisser la parole aux sponsors...

Getting your designs approved, Larissa Meek

Une présentation intéressante, où l'on est forcément plus captivé par la belle Larissa Meek plutôt que par sa présentation, où elle évoque 12 points clés pour la réussite d'un projet de design: soyez ami avec votre client, posez-lui beaucoup de questions, posez-lui encore plus de questions, utilisez des gabarits, discutez avant de concevoir, concentrez-vous sur un seul design, montrez le design dans un navigateur, prototypez si nécessaire, obtenez du feedback constructif, soyez confiants, prenez du temps, tirez le meilleur parti des situations difficiles. Pas de grande nouveauté ni de révolution, donc, mais des rappels toujours bons à entendre!

Photoshop Battle, Jina Bolton & Hannah Donovan Vs Jon Hicks & Elliot Jay Stocks (modérateur: Andy Clarke)

Dur dur de suivre une battle photoshop où s'enchainent les deux duos de designers tour à tour sur Photoshop, en étant eux-mêmes interviewés. On se laisse aller à regarder la manipulation sous Photoshop (pas vraiment extraordinaire, mais le temps est compté, donc on leur pardonnera) qui donne un trucage assez comique, et on n'écoute pas ou peu les interviews des designers. Ou alors, c'est moi qui ne sais pas faire deux choses à la fois, ce qui est fort probable!

Print is the New Web, Elliot Jay Stocks

Elliot Jay Stocks nous a montré ce qui l'inspirait dans le domaine du print, des livres ou encore des business cards. Il pense que l'on devrait plus s'inspirer du monde du print, car il laisse une plus grande liberté. A noter que c'est le point de vue un peu à contre courant d'un designer Flash, alors que la majorité de la salle préfère les standards du web, à savoir XHTML et CSS. Ceci dit, il ne faut pas croire que son intervention est dénuée d'intérêt.

From Design to Deployment, Jon Hicks

N'aimant pas le fromage, j'ai pourtant apprécié cette présentation sur la création d'un site web sur le fromage en 24h. Un cas - très - pratique, où Jon Hicks nous délivre sa méthode: arborescence des dossiers de développement, priorité au contenu plutôt que sur la forme (les div), problématiques CSS, add-ons & plug-ins Firefox, etc. Nous avons été très surpris avec Polo de voir combien Fireworks était puissant en termes de compression d'image! Le site est d'ailleurs en ligne: Cheesophile.com

Adobe Session, Andrew Shorten

Encore un autre sponsor de la conférence, concurrent direct de Microsoft au niveau des interfaces riches avec AIR, Andrew Shorten n'a pas hésité à tirer dans les pattes de son concurrent. Une présentation très sponsorisée, certes, mais bien meilleure que celle de Microsoft.

Unconventional ways to promote your site, Paul Farnell

Des idées intéressantes sont dites par Paul Farnell: créer des satellites, se concentrer sur le contenu, s'impliquer dans des communautés, être humain. Intéressant, oui, mais je ne suis pas convaincu que ces moyens de promouvoir un site soient réellement efficace, il me semble que la valeur ajoutée par rapport au temps passé à appliquer ces points n'est que minime.

Iteration & You, Daniel Burka

Certainement la présentation la plus intéressante à mon sens, avec des parallèles très intéressants entre le webdesign et l'architecture, où l'on distingue la high road architecture (buildings, batiments) de la low road architecture (les caravanes par exemple), cette dernière étant plus modulaire. Il ne faut pas hésiter à réutiliser des choses qui marchent, il est préférable d'adapter plutôt que de tout recommencer. Un Daniel Burka très dynamique et impliqué dans ce qu'il dit, j'ai d'ailleurs pu le ressentir lorsqu'il m'a parlé de sa présentation la veille lors du déjeuner.

Quelques photos...

Pour ceux qui veulent voir quelques photos, il y en a quelques unes sur Flickr!. J'ai aussi mis des photos de la pre-party et de l'after party.

Flickr FOWD

L'anxiété de l'information, ça vous parle?

Petite définition de l'anxiété de l'information, via Ergologique.com

Stress causé par l'incapacité de l'utilisateur à trouver ou à comprendre l'information dont il a besoin à cause de la surcharge d'information, du manque de clarté de son organisation, de son insuffisance ou encore de sa présentation trop complexe.

J'ai tendance à penser depuis quelques temps que la philosophie less is more (il parait qu'on doit dire less is better) est une bonne chose, qu'il faut éviter de trop polluer tout ce qu'il y a autour de l'information cherchée, sous peine de perdre le lecteur, ou peut-être le rendre "anxieux". Comme dirait Fred, ne peut pas être Apple ou Google qui veut! Et ce n'est pas les webmasters de 20 Minutes qui vont le contredire.

20 minutes - surcharge de l information

Cliquez-donc sur l'image, sinon vous ne comprendrez pas le pourquoi du comment de cette note. Et patientez, car elle pèse tout de même 7 Mo (les plus pressés se contenteront d'un aperçu). Tout ça pour une news. Je ne suis pas un expert en ergonomie, mais pour moi ça sera zéro pointé pour 20 minutes, et je pense très sincèrement que la note que mettrait un ergonome se rapprocherait de la mienne. Heureusement que des sites comme celui du Monde sont quand même plus centrés sur l'information, avec beaucoup moins de pollution tout autour.

Et bien sûr, pour couronner le tout, le flux RSS est tronqué aux dix premiers caractères de chaque news...

En vrac: Scoble, ergonomie, monétisation, etc.

Petites lecture de fin de weekend... ou de début de semaine... Peu de liens, désolé, mais les bugs de Ginger m'empêchent de veiller vraiment efficacement...

Non à la personnalisation des appplications!

Eric Schmidt disait il y a quelques jours que le web 3.0 passerait (entre autres) par des applications de plus en plus personnalisables... Or force est de constater que la personnalisation des applications ne m'inspire pas grand chose. Voilà quelques exemples sur lesquels s'appuyer, représentant quelques cas de figures...

MySpace, le pire du pire?

Exemple de MySpace

Force est de constater qu'il existe de très beaux MySpace, (comme celui de DJ M. Ice) mais la tendance la plus courante est celle d'avoir un MySpace totalement déstructuré, comme celui de Virginie, par exemple (désolé, je n'ai rien contre toi, mais ton MySpace m'horripile) ou celui de Dirty B (qui reste, malgré un MySpace moche, un très bon DJ). Ceci est dû à une chose essentielle: MySpace est très permissif, on oublie très vite que c'est un fleuron du Web 2.0 tant il ressemble à du Web 1.0 voir 0.5 (au passage, on notera que MySpace ne fait plus trop l'actualité sur les réseaux de blogs concernant le Web 2.0)!

Au final on a donc des pages web souvent surchargée (vous n'avez qu'à visiter les deux liens pour vous en convaincre) et déstructurées (donc moches)! De plus, l'ergonomie laisse vraiment à désirer. J'en déduis deux conclusions possibles: soit les gens n'ont pas de goût, soit les gens ne savent pas faire (je pencherais plutôt pour la seconde d'ailleurs). Le problème étant... qu'ils essaient quand même coûte que coûte de faire (et dieu sait que faire du CSS c'est pas évident)!

Tumblr, le changement des couleurs...

J'aime bien Tumblr, les thèmes par défaut sont jolis (un exemple avec le mien). Je ne connais ce service que depuis quelques jours, je n'en ai donc pas visité beaucoup, mais force est de constater qu'il doit bien exister un Tumbleblog avec des couleurs horribles, j'en suis plus que persuadé. En revanche (et c'est une bonne chose), Tumblr se rattrape, car laisser le choix des couleurs ne vient pas déstructurer le contenu comme le fait MySpace, les pages sont donc toujours structurées (encore que il y a une option pour modifier le template en entier, mais j'avais surtout envie de pointer du doigt le choix des couleurs).

Note: J'avais envie de parler d'une autre application personnalisable un peu comme Tumblr, qui ne permettait pas de modifier le template, mais malheureusement, je suis obligé de laisser l'exclusivité à Jennifer, qui soit dit en passant, lui revient de droit!

Twitter, ou le changement du fond d'écran

Personnalisation Twitter

Regardez la vignette. Jusque là, rien de choquant (si ce n'est qu'un fond comme ça ne permet pas une lisibilité optimale, et que les Champs Elysées c'est plus joli quand il fait beau). Visitez-donc maintenant le Twitter de Mary Hodder (je l'ai pris au pif). Vous voyez la belle photo de fond? Si comme moi, vous travaillez dans une grande résolution (1680*1050 pour ma part), le fond se répète, et même si il ne se répétait pas, ça serait moche, voir pire. Et quand saimoche, saimal©!

Facebook... Trop fermé??? Encore que...

Facebook Apps

C'est un des points que j'aime chez Facebook, son côté structuré, simple (comme on peut le lire chez Fabien), centré sur l'information. Facebook n'était donc à priori pas un joyeux bordel comme pourrait l'être MySpace. Tout ça, c'était avant que je découvre les merveilleuses Facebook apps, qui peuvent vite faire dégénérer une page, tant certaines sont moches. Et c'est vraiment dommage ça! Bon, je sais, je suis très exigeant, et je vous autorise à me traiter de pinailleur...

Pownce... Un must?

Pownce

4 thèmes pour Pownce, les couleurs sont toujours bien choisies. Pownce est sexy. On ne peut pas réellement le personnaliser, mais tous les Pownce sont clean. C'est ce que j'aime, quand tous les utilisateurs d'un site sont en harmonie. Et si l'on compare le Widget AIR de Pownce, il est terriblement sexy aussi. Rien à voir avec (pour ceux qui ont testé) TwitterAIR, qui se veut futuriste, mais qui n'a rien de très joli.

Il est à noter que Pownce s'appuie sur un set d'icônes qui a fait ses preuves: Silk, publié par FamFamFam. Mais l'ergonomie est vraiment bien pensée (Tumblr aussi, mais il a encore quelques incohérences)!

Alors la personnalisation?

Je dois vous avouer un truc. Ce billet est parti d'un petit problème que j'ai rencontré en utilisant l'application dont je n'ai pas le droit de parler. Je n'arrivais pas à trouver les bonnes couleurs (et surtout c'était assez mal foutu avec les liens qui sont forcément de la même couleur que la couleur de fond, mais je vous en reparlerai certainement dans un autre billet). Tout ceci pour dire que comme vous l'aurez compris, je ne suis pas un grand fan des applications ultra-personnalisable. Du moins, il faut savoir faire la part des choses, trouver un juste milieu. Pour moi ça passe pas les thèmes. J'aime les choses propres, harmonieuses et je n'aime pas le bordel (cette dernière phrase pouvant surprendre ceux qui ont déjà vu mon apart, j'en conviens). Parfois, j'ai l'impression que la plupart de ces applications personnalisables signent l'arrêt de mort du métier de webdesigner, et que c'est bien dommage...!!!

Note: Un peu de teasing: L'application dont je n'ai pas le droit de parler c'est... Jennifer elle-même qui vous en parlera!