Archives pour l'année 2009

Mes 3 sites coup de coeur en noir et blanc du moment (septembre 2009)

Je ne sais pas si c’est la saison mais en ce moment je croise de nombreux sites qui me font craquer, à tel point que je suis obligé de faire des catégories pour pouvoir tous vous les présenter. J’ouvre donc une série « coups de cœur minimalistes » ou « coups de cœur en noir et blanc ».

Commençons avec le site d’Alastaire Allday, un rédacteur pas peu fier de sa cigarette :

Le site d'Alastaire Allday
Le site d'Alastaire Allday

J’apprécie particulièrement le large visuel de même que le choix de la typographie. Beaucoup d’espaces blanc, un très bon contraste sur le bouton « Next Page » et un bandeau de navigation très sobre qui remonte en pages intérieures. Aucune faute de gout sur ce site, par contre le gilet et la coupe de cheveux sont à revoir !

Continuons avec le site de l’agence Rikcat Industries :

La page d'accueil de Rikcat
La page d'accueil de Rikcat

Une grille de lecture beaucoup plus formelle pour cette page d’accueil qui présente tout de même des très belles proportions. Comme toujours sur les sites minimalistes il y a un très beau travail sur la typographie. Vous apprécierez au passage des détails très élégants comme le contour des illustrations, les pictos retravaillés en bas de page (carrés et en N&B) ainsi que le rouge au survol des liens et du logo. Assurément un sans faute.

Terminons avec un autre site d’agence, celui de Chama Inc :

Le site de l'agence CHama Inc.
Le site de l'agence Chama Inc.

Un site très épuré et très simple (une seule page qui s’étire en hauteur). Une typographie très stylisée pour la baseline et de larges gouttières pour centrer l’attention sur le texte. Quel dommage que la bas de page soit si coloré !

Prochain Yulbiz Paris : mercredi 23 septembre

Les Yulbiz sont de retour à Paris avec une soirée dès la semaine prochaine : mercredi 23 septembre à partir de 20 H au Bon Pêcheur (9 rue des Prêcheurs, 75001 Paris – Mo Châtelet Les Halles).

L’inscription est gratuite, il vous suffit de déposer une commentaire sur le site officiel : Yulbiz Paris N°7 : 23 septembre 2009 au Bon Pêcheur. La question de la soirée portera sur la thématique Entreprise 2.0 : “Les outils de collaboration peuvent-ils générer du business ?“.

Pour celles et ceux qui découvrent le concept, les Yulbiz sont des soirées de blogueurs d’affaires qui vise a favoriser le réseautage et la pratique des blogs dans un contexte professionnel. On y parle donc beaucoup « boutique » et business mais le ton est très informel (cravates interdites et tutoiement de rigueur).

Je vous donne donc rendez-vous mercredi soir. Je suis très content de pouvoir renouveler ces rendez-vous et je remercie Émilie et Fadhila pour avoir orchestré cette prochaine rencontre.

Cette nouvelle édition des Yulbiz s’accompagne malheureusement d’une bien triste nouvelle : le décès récent de Renée Wathelet, co-fondatrice de ces rencontre (Le deuil d’une très grande dame) que j’avais croisé lors d’une soirée à Montréal. Je présente mes sincères condoléances à sa famille et ses proches.

Mauvais design = Facteur de propagation rapide ?

En ce début de semaine j’ai vraiment l’impression que c’est l’ébullition autour de la nouvelle version du site de Ségolène Royal (DesirsDavenir.org). Comme je me sens concerné par le design des sites web en général et que je trouve cette affaire très louche, je vous propose une analyse façon théorie du complot.

Récapitulatif des faits

La semaine dernière était annoncée la sortie d’un livre très critique envers le Parti Socialiste et Martine Aubry puisqu’y sont décrits les (soi-disant) fraudes lors des dernières élections au PS. Polémique à laquelle Ségolène R. se devait de répondre et dans les plus brefs délais.

Elle décide donc de se servir de son site DesirsDavenir.org comme relais de sa contre-attaque. Oui mais voilà, le timing n’est pas le bon car la blogosphère tout comme la Twittosphère sont saturées par les nombreux buzz du moment (décès de Patrick Swayze et Filip, dérapage de Kanye West aux MTV Video Awards…).

C’est donc un gros problème pour Ségolène R. qui doit s’assurer d’une couverture médiatique la plus large possible pour pouvoir regagner de la crédibilité et faire passer ses messages. Elle lance alors une nouvelle version de son site DesirsDavenir.org. Et là c’est la stupéfaction générale car ce site est un des plus moches que le web français ait connu depuis ces dix dernières années :

La première version de la nouvelle charte du site de Ségolène R.
La première version de la nouvelle charte du site de Ségolène R.

Je pense sincèrement qu’il n’est pas faux de dire que même au siècle dernier (à la grande époque de Multimania) ce site aurait été ridicule. En quelques heures cette infamie est repérée et la news se propage à une vitesse hallucinante sur Twitter où les commentaires les plus cinglants fusent (« C’est la nouvelle Cindy Sanders du web« , « 36 15 DesirsDavenir« …). L’info est également relayée par des médias plus sérieux comme L’Express ou Libération qui nous révèlent que cette refonte aurait coûté 45.000 €. Résumé des publications disponible ici : Désirs d’avenir… donne des idées.

Buzz² pour Kanye West et Ségolène
Buzz² pour Kanye West et Ségolène R.

Mais ce n’est pas tout, car le jour de ses explications officielles Ségolène R. persiste et signe avec une nouvelle page d’accueil tout aussi moche et annonce en plus la volonté de laisser les utilisateurs choisir le fond d’écran de la semaine :

La nouvelle nouvelle charte du site de Ségolène R.
La nouvelle nouvelle charte du site de Ségolène R.

Nous avons même eu droit à des explications « officielles » (à vérifier) sur son blog : Réponses aux inquiétudes soulevées par le nouveau site internet, par Ségolène Royal.

Pourquoi je n’y crois pas

Suite à cette frénésie, un affreux doute a commencé à germer dans mon esprit : Et si tout avait été soigneusement orchestré pour maximiser le potentiel de viralité de son message ? En d’autres termes : Et si tout ce cirque était une honteuse mise en scène pour provoquer le plus gros buzz possible ?

Plusieurs éléments dans cette histoire étayent ma théorie du complot (médiatique) :

  • Pour arriver à ce niveau dans la pyramide politique Ségolène R. a depuis longtemps mis de côté toutes considérations morales ou éthiques (la fin justifie les moyens) ;
  • Les hommes (et femmes) politiques sont loin d’être des imbéciles, ils savent de plus s’entourer des meilleurs pour tout ce qui touche à leur look ou à leur communication ;
  • Elle a lancée récemment une plateforme collaborative tout à fait intéressante et surtout bien réalisée ;
  • Trouver une agence ou un indépendant pour faire correctement ce genre de travail n’est pas très compliqué (même un week-end) ;
  • Elle a dans son entourage de nombreux fans et supporters qui à défaut d’être des professionnels de la conception web sont largement capables de lui dire que cette nouvelle version de son site est grotesque ;
  • Elle était dos au mur et ne pouvait pas échouer dans ce sauvetage médiatique.

Voilà pourquoi je suis persuadé que, dans cette campagne, rien n’a été laissé au hasard et que ce design pourri a été choisi spécifiquement pour faire un maximum de buzz.

Est-ce une bonne opération ?

Bien évidemment que c’est une bonne opération car son site a bénéficié d’un buzz très dense sur les dernières 48 H. Encore une fois je ne suis pas en train d’affabuler car le ridicule a toujours été un puissant levier de buzz, en témoignent les tenues ridicules de Lady Gaga ou des incidents montés de toute pièce comme l’acrobatie de Brüno qui tombe sur la tête d’Eminem lors des derniers MTV Music Awards.

Dans la mesure où l’intérêt de Ségolène R. est d’être perçue comme une candidate crédible au niveau politique et non pour de la conception de site web, les moqueries dont son site est l’objet ne rentrent pas en contradiction avec l’objectif de cette campagne (faire le pus de bruit possible).

À partir de là, se pose la question de savoir si une telle tactique peut être utilisée dans un autre cas de figure. Ma réponse : Non, il ne faut surtout pas en abuser. Ça a bien fonctionné une fois, il n’y a que très peu de chances pour que la sauce prenne une nouvelle fois dans un autre contexte. D’une part car la blogosphère se lasse très vite des phénomènes à répétition (qui s’intéresse encore aux lipdubs ?) d’autre part car je ne vois pas comment il est techniquement possible de faire un site encore plus moche.

Conclusion

Difficile pour le moment de dire si ce coup de poker va réussir, toujours est-il que la buzzosphère (incluant des supports comme les blogs, Twitter, Facebook et les sites de news en ligne) nous démontre une nouvelle fois à quel point la règle d’or du buzz sur internet est la suivante : il n’y a pas de règle.

Mon conseil à Ségolène R. : Vous avez réussi votre coup médiatique, pas la peine d’en rajouter (il est largement le temps de choisir une charte graphique un peu plus professionnelle).

Mes 3 sites coup de coeur (septembre 2009)

Dans la série des sites que j’affectionne particulièrement je vous propose pour ce mois de rentrée trois sites très différents.

Commençons avec Healogix, une société de conseil :

La page d'accueil d'Healogix
La page d'accueil d'Healogix

Une grille de lecture bien mise en valeur, des couleurs harmonieuses mais avec un contraste dynamique, des appels à l’action simple et surdimensionnés, des cartouches et boutons tout en rondeur… Ce site met tout en œuvre pour ne pas vous fatiguer les neurones, et ça marche ! Quel dommage qu’ils utilisent encore des titres en majuscules…

Changement radical avec le site de Teo Skaffa, un designeur graphique :

La page d'accueil du site de Teo Skaffa
La page d'accueil du site de Teo Skaffa

Ambiance Mario pour ce site ultra-retro qui exploite sans vergogne la bibliothèque sonore du célèbre plombier de Nintendo. Mise en page minimaliste et pointeur de souris maximisé pour vous plonger dans une ambiance ludique très réussie. Vous apprécierez au passage les transitions et la navigation au clavier.

Dernier exemple avec le magnifique Fotopedia, une encyclopédie en images :

La page gallerie de Fotopedia
La page gallerie de Fotopedia

Fotopedia est à FlickR ce que Vimeo est à YouTube : Un authentique écrin dans lequel les plus beau diaporamas sont agrémentés d’articles de Wikipedia. La mise en page est d’une clarté exemplaire, les couleurs sobres mettent parfaitement en valeur les photos, beaucoup de zones de respiration, un header et un footer très élégants… Rien à redire, c’est un sans faute et la partie « sociale » du site est également une grande réussite.

La suite le mois prochain.

WebGL, le nouveau standard de la 3D sur le web

Souvenez-vous, en début d’année Google lançait 03D, un plug-in pour faire de la 3D dans le navigateur. À L’époque je m’interrogeais sur la pertinence d’un tel plug-in alors qu’il existe de nombreuses autres technologies pour faire de la 3D (avec Flash ou pas), et parce que cela risquait de rentrer en concurrence avec les travaux de Khronos, un consortium visant justement à standardiser la 3D dans le navigateur (en reposant sur OpenGL).

En août, l’actualité s’accélère avec l’annonce du lancement de WebGL, un langage permettant de standardiser la 3D dans les navigateurs : Khronos Details WebGL Initiative to Bring Hardware-Accelerated 3D Graphics to the Internet. Pas n’importe quelle 3D puisqu’il s’agit de 3D calculée par votre carte graphique et non votre processeur (de la 3D dites « accélérée ») et pas n’importe quelle standardisation puisque ces éléments 3D utiliseraient la balise <canvas> de HTML5 (cf. HTML 5 + CSS 3 = une révolution pour les interfaces web).

Donc si je reformule : de la vrai 3D qui exploite les capacités de votre carte graphique, dans une page web conforme aux spécifications du W3C. Tous les détails sont ici : New WebGL standard aims for 3D Web without browser plugins.

Pourquoi WebGL a toutes les chances de devenir un standard ?

La grande différence avec les autres standards graphiques comme SVG, c’est que WebGL est promu par un consortium qui regroupe à la fois des fabricants de puces (Nvidia, Intel, ARM, AMD) mais également des éditeurs de navigateurs (Mozilla, Opera et Google). C’est donc un standard qui est adopté de facto par le marché puisque c’est lui qui le propose.

Pour rentrer un peu plus dans les détails, WebGL propose donc au sein d’une page web de lier du contenu à votre carte graphique à l’aide de javascript et d’OpenGL ES. « ES » ? Oui, OpenGL « ES ». Pour faire simple il s’agit de la déclinaison multi-plateforme d’OpenGL. En d’autres termes, ils poussent un standard qui fonctionnera à la fois sur un ordinateur mais également sur des terminaux mobiles / alternatifs. Et là encore, tout le monde s’est mis d’accord puisqu’à ce standard sont associés Apple (avec son iPhone), Google (avec Andoid), Microsoft (avec Windows Mobile), Nokia (avec Symbian) et même un consortium représentant Linux.

Toute l’industrie est donc en ordre de marche pour faire de la 3D dans un navigateur à partir de la carte graphique quel que soit le terminal utilisé. Tout ceci étant standardisé grâce à l’HTML5 et sa fameuse balise <canvas>.

Il existe déjà des applications concrètes

Vous seriez tenté de ma dire : « OK mais c’est pour quand ?« , et je vous répondrais « pour tout de suite« . Les premières expérimentations sont ainsi déjà visibles sur Webkit (le moteur de rendu sur lequel repose Safari et Chrome) : Preview of WebKit’s WebGL / Canvas 3D.

La vidéo suivante montre ainsi les possibilités de WebGL :

Les premières expérimentations ne sont donc disponibles que pour Safari et Chrome mais les équipes de Mozilla prévoient une implémentation très prochaine dans Firefox (date à confirmer).

Et O3D dans tout ça ?

La question que l’on se pose maintenant est la suivante : que va devenir O3D maintenant que WebGL avance à grands pas ? La réponse est tout simple : dans la mesure où c’est la même équipe… les deux chantiers vont coexister : WebGL vs. O3D. La fameuse équipe de Google précise ainsi dans cette discussion que WebGL ne peut pas répondre à toutes les situations du fait de facteurs limitant comme javascript (entre autre). Ils vont donc visiblement revoir leurs ambitions à la hausse pour O3D et lui réservant des applications à usage plus intensif de la 3D.

Et je n’aborde même pas le cas de Native Client

Une révolution pour le secteur des jeux en ligne

La première réflexion qui me vient à l’esprit est de me dire que WebGL va ouvrir d’énormes possibilités pour les jeux 3D en ligne… et menacer ceux qui exploitent un plug-in propriétaire. C’est ainsi le cas d’éditeurs comme Cmune (et leur Paradise Paintball qui utilise Unity3D), QuakeLive ou encore InstantAction.

Fallen Empire Legions dans votre navigateur avec InstantAction
Fallen Empire Legions dans votre navigateur avec InstantAction

L’avenir des Rich Internet Games se révèle donc radieux avec une technologie aussi rapidement standardisée qui va changer la donne. Par contre va se poser le problème de la courbe d’apprentissage : En combien de temps les développeurs vont-ils s’approprier cette technologie pour en faire quelque chose d’intéressant ? Dans l’exemple précis dans jeux en ligne, un éditeur comme Unity garde tout de même une longueur d’avance car il propose avant tout une plateforme de développement de jeux avec toute la logique métier derrière.

Un premier pas vers le Web 3D

Avec la standardisation de contenus 3D, attendez-vous à une prolifération de contenus 3D, tout comme nous avons vu proliférer les contenus audios et vidéos ces dernières années. Bien évidement il ne sera pas question d’abandonner les pages web au profit d’environnements 3D immersifs, mais plutôt de pouvoir encapsuler à loisir des contenus 3D dans vos pages web : objets 3D, scènes 3D…

J’anticipe alors un nouvel âge d’or pour les marques et médias qui verraient dans cette innovation la possibilité de communiquer autrement, de véhiculer autrement de l’émotion, d’interagir autrement… Par contre cela ne se fera pas sans mal car on ne rajoute pas comme ça une nouvelle dimension à son identité de marque ou aux contenus existants. Et c’est là où l’expérience acquise avec les univers virtuels va se révéler être particulièrement enrichissante. Finalement c’est la prophétie du Metaverse Roadmap qui est en passe de se réaliser : un futur proche où le web et les univers virtuels fusionnent pour donner naissance au web 3D.

Tout ceci vous semble complètement surréaliste ? Alors allez donc voir à quoi ressemble le site du dernier album d’Eminem : The Relapse (cf. Est-ce la mode du Point&Click ?). Un site d’ambiance sans texte où l’internaute est directement plongé dans un environnement 3D qui mélange storytelling et immersion. Le web 3D est là, juste devant nous, commencez à vous y préparer dès maintenant…

Ne ratez pas le salon E-commerce 2009

Comme chaque année fin septembre va se tenir à Paris la grande messe du commerce en ligne : le Salon E-commerce 2009. Non seulement c’est l’occasion de croiser la grosse majorité des acteurs du commerce en ligne, mais c’est également l’opportunité de venir découvrir et discuter de nouvelles tendances et de l’orientation du marché.

logo-SalonEcommerce

Et puisque l’on parle d’orientation du marché, en 2009 il est clairement orienté vers le haut comme en témoigne le dernier bilan publié par la FEVAD : Bilan e-commerce au 2ème trimestre 2009. Voici la preuve que le commerce en ligne est une industrie solide qui ne craint pas la crise. Impossible de faire l’impasse sur ce sujet.

Concernant les orientations du marché, il va également falloir suivre de très près les dernières évolutions des solutions open source. Je suis en ce moment en train de mener une mission d’étude sur le sujet et des solutions comme Magento, Prestashop, Zencart, Ubercart, VirtueMart ou encore OFBiz sont des alternatives plus que crédibles aux solutions proposées par les éditeurs. De plus, ces différentes solutions bénéficient de communautés dynamiques et surtout couvrent une large gamme de besoins (de la TPE aux grands comptes). A ce sujet je suis à la recherche de témoignages de sociétés ayant implémenté ces solutions…

Autre tendance : L’arrivée à maturation de solution hébergées en mode SaaS (Software as a Service). Là il n’est pas question de concurrencer les gros éditeurs mais plutôt de proposer une solution complète et cohérente à des entrepreneurs qui ne n’ont pas les moyens / compétences / ressources pour gérer une plateforme technique (gestion du catalogue en ligne, des campagnes, du trafic…). Il existe de nombreux acteurs sur le marché (lire à ce sujet le très bon comparatif de Wizishop : Les plateformes e-commerce – Résumé et comparatif) et le rachat récent de GoodBarry par Adobe (Adobe Buys Business Catalyst / GoodBarry) est à mon sens un signe révélateur du potentiel de ce créneau.

En plus de ces conditions de marché très favorables, je serais présent dans les couloirs de ce salon pour deux autres raisons :

  • Cette année je suis membre du Jury des E-commerce Awards (les gagnants seront annoncés lors de la cérémonie du 30 Septembre) ;
  • L’édition 2009 de la Journée Mondiale de l’Utilisabilité que j’organise à Paris le 12 novembre prochain sera sur le thème de commerce en ligne.

Voilà pourquoi je serai sur ce salon pour rencontrer et discuter les professionnels du milieu. Et avec un peu de chance je croiserais peut-être le Capitaine Commerce vêtu de son collant vert !

HTML 5 + CSS 3 = une révolution pour les interfaces web

Voilà 20 ans que le web existe et presque 10 ans que le HTML n’a pas évolué et propose toujours la même structure et les mêmes balises. 10 ans c’est beaucoup, c’est la moitié de la « vie » du web. 10 ans c’est beaucoup, surtout lorsque l’on constate les révolutions qui ont eu lieu dans les usages du web ces 5 dernières années (partage de vidéos, réseaux sociaux, infos en temps réel…). Pas étonnant que des technologies propriétaires (Flash) se soient imposées (notamment sur la vidéo et les RIA) et que d’autres s’installent tranquillement pour combler un manque (notamment Google Gears pour l’accès hors ligne).

Bref, il était temps que le marché se réveille et c’est (presque) chose faite avec l’arrivée à maturation de HTML 5 et CSS 3. Pour faire simple, disons que nous avons franchi le point de bascule et que la route qui mène à une adoption de ces nouveaux standards n’est plus si longue. Pourquoi est-ce important de se soucier de ça ? Tout simplement parce que ces nouvelles spécifications vont changer beaucoup de choses dans la façon de concevoir et d’exploiter les interfaces web, des changements qui vont fortement impacter les différents métiers de la profession.

Autant vous prévenir tout de suite : les explications qui vont suivre sont une tentative de l’auteur de résumer et vulgariser un foutoir pas possible (qui provoquent d’innombrables querelles d’experts depuis des années : HTML 5 is a mess. Now what?) sans pour autant prendre partie car de toute façon les choses semblent visiblement s’améliorer. Je ne donne que mon interprétation, vous êtes libre de proposer la votre.

Commençons donc par nous intéresser à cette nouvelle version de HTML et pourquoi s’est-elle imposée face à XHTML (pour une explication plus détaillée c’est ici : XHTML 2 vs. HTML 5, et là : Misunderstanding Markup: XHTML 2/HTML 5 Comic Strip).

HTML vs. XHTML

Au commencement il y avait donc le HTML 4 dont les spécifications ont été publiées en 1997. Une légère évolution a été publiée en 1999 avec le HTML 4.01. Puis le W3C a décidé de miser sur le langage XML (plus sophistiqué et surtout extensible) en proposant une reformulation du HTML avec les balises du XML, à savoir le XHTML 1.0. Tout l’intérêt de cette reformulation est de pouvoir marier la simplicité du HTML avec la puissance du XML (et ses nombreuses possibilités d’évolution).

Sur cette lancée, le W3C a alors lancé le chantier XHTML 2 pour faire une réécriture complète des spécifications et poser de nouvelles bases pour un langage plus puissant, plus robuste, plus évolutif… bref, un langage qui propulserait le web dans une autre dimension sans toutefois assurer de rétro-compatibilité. Hé oui… car il faut bien faire table rase pour pouvoir redémarrer sur des bases saines. Et c’est bien là le problème : ne pas assurer la rétro-compatibilité était inacceptable pour l’industrie (et notamment les éditeurs de navigateurs) qui ont alors décidé de lancer des travaux indépendant sous l’aile du WHATWG (Web Hypertext Application Technology Working Group). Ce groupe de travail a commencé à travailler sur les spécifications des Web Applications.

Après un bras de fer de plusieurs années (et un constat d’échec pour l’équipe de travail sur les spécifications XHTML 2), le W3C a fini par réintroduire les spécifications du WHATWG et de créer un groupe de travail officiel sur le HTML 5 tout en abandonnant l’autre chantier (RIP XHTML 2).

Par élimination il ne reste donc plus qu’un seul prétendant au titre de remplaçant du HTML 4, d’autant plus qu’il a reçu le soutien de qui vous savez (Google Bets Big on HTML 5). Nous sommes donc semble-t-il arriver à un consensus de l’industrie sur des spécifications qui ne sont pas aussi ambitieuses que celles d’XHTML 2 mais qui ont l’énorme mérite de faire avancer les choses (souvenez vous qu’il n’y a pas eu d’évolution en 12 ans).

Qu’est-ce qui va changer avec HTML 5 ?

Pour faire simple disons qu’avec HTML 5 nous allons quitter l’ère du web des documents pour enter dans celle du web des applications. L’ambition de cette nouvelle itération est donc de supprimer les balises obsolètes, d’en remplacer certaines et d’en introduire de nouvelles afin de donner une structure sémantique plus cohérente aux pages web.

De nouvelles API vont ainsi standardiser un certain nombre d’interactions :

  • L’accès hors ligne et le stockage sur le disque dur (pour une exploitation en mode déconnecté) ;
  • L’édition en ligne, le drag&drop ;
  • L’accès à l’historique de navigation…

Bref, tout ce qui nécessitait le recours à javascript ou à des technologies propriétaires sera désormais « livré d’origine ».

La grosse nouveauté est donc de proposer un nouveau schéma de structuration des données qui va venir remplacer les éléments en bloc et en ligne (cf. HTML5 se dévoile) :

Le "content model" de HTML 5
Le "content model" de HTML 5

Les spécifications manquent de précisions pour se faire une idée de ce nouveau schéma, d’autant plus que de nouvelles balises structurantes comme <template> et <datatemplate> ont été introduites.

Gros changement également avec un jeu de nouvelles balises permettant de mieux définir le contenu : <header>, <nav>, <article>, <aside> et <footer> :

Les nouvelles balises de structuration du contenu de HTML5
Les nouvelles balises de structuration du contenu de HTML5

C’est donc une petite révolution puisque ces nouvelles balises vont permettre une structuration beaucoup plus propre des pages, surtout pour les sites avec beaucoup de contenus (blogs, portails…). Plus d’infos ici : HTML5 and The Future of the Web.

Notons enfin l’apparition de balises très intéressantes comme <audio> et <video> pour les éléments multimédias, <canvas> pour les dessins vectoriels ou encore <datagrid> pour les tableaux de données. Ces nouvelles balises permettront de réduire la dépendance à des technologies propriétaires comme Flash. Juste un dernier mot sur les formulaires qui vont avoir de nouveau types de champs <input> comme date, time, number, range, email, url, search, color

Je pense qu’il n’est pas faux de dire qu’avec HTML 5 la séparation entre contenu, structure et présentation sera encore plus facilement gérable.

Quelles nouvelles possibilités pour CSS 3 ?

Précisions que du côté des feuilles de styles, les travaux autour des nouvelles spécifications CSS 3 sont beaucoup moins perturbés. Cela permet donc d’avancer plus vite. Quoi que… j’ai dans mes archives des articles sur le sujet datant de 2004 et 2005 : Des formulaires standardisés, CSS 3 : des templates pour structurer vos pages web et Formulaires : quand les CSS 3 vous changent la vie.

L’essentiel des travaux autour des CSS 3 a été de standardiser des propriétés pour réaliser des traitements graphiques qui nécessitaient auparavant des astuces :

  • Border-radius pour les coins arrondis ;
  • Text-shadow pour les ombres portées ;
  • Transparency et Opacity pour la transparance ;
  • Animation et Transition pour les animations (cf. Nicer Navigation with CSS Transitions, à regarder avec les dernières versions de Safari ou Chrome)…

Bref, il y a beaucoup de nouveautés à découvrir ici : 7 New Essential CSS 3 Techniques Revealed. Tout l’intérêt étant de pouvoir se passer d’images ou d’astuces pour pouvoir réaliser ce que l’on souhaite. Illustration avec ces jolis boutons :

De jolis boutons sans image avec CSS 3
De jolis boutons sans image avec CSS 3

Encore plus intéressant, toutes les propriétés concernant la mise en page et le positionnement : Presentation Levels, Template Layout, Multi-column Layout, Grid Positioning et Flexible Box Layout.

Le changement va être aussi spectaculaire que radical : là où il fallait tout un tas de <div> imbriqués, d’images, de tableaux… pour arriver à la mise en page et au traitement graphique souhaité (donc en alourdissant le code source), nous aurons bientôt une syntaxe bien plus lisible grâce à ces nouvelles propriétés.

Quels bénéfices et pour quand ?

Je vous propose de récapituler ce que nous venons de voir : un contenu mieux structuré et défini, une syntaxe allégée, des traitements graphiques standardisés… tout ceci va permettre d’avoir un code source beaucoup plus propre. Ceci est particulièrement important dans la mesure où les pages ne sont plus faites à la main pour des utilisateurs humains, mais générées par des systèmes de gestion de contenu et exploitées à la fois par des humains et des agents intelligents (via les balises descriptives ou microformats).

C’est donc une authentique révolution à laquelle nous allons assister… dans quelques années ! Hé oui, car même si les spécifications sont là, leur implémentation est fonction du bon vouloir des éditeurs de navigateurs et du taux de renouvellement par les utilisateurs.

Aujourd’hui le marché est encore dominé par un IE qui risque d’aggraver encore son retard avec ces nouvelles spécifications. Vient ensuite Firefox qui évolue vite (grâce à une communauté très active) mais qui est tout de même fortement ralenti par l’inertie des utilisateurs (surtout lorsque les parts de marché dépassent les 30 %).

Il est certain que les choses sont beaucoup plus simples pour Safari, Opera ou encore Chrome qui peuvent avancer à leur rythme (lire à ce sujet : Opera 10, Chrome 4, Firefox 4 : Vers des plateformes sociales et applicatives).

Donc au final, l’impact ne se fera pas ressentir avant quelques années. Sauf si un éditeur trouve le moyen de faire avancer les choses au forcing (au hasard Google avec son futur Wave qui tournera bien mieux sur Chrome).

Google Wave, une application en ligne taillée pour HTML 5 et Chrome
Google Wave, une application en ligne taillée pour HTML 5 et Chrome

Par contre, une fois que le parc de navigateurs aura été renouvelé, j’anticipe un gros changement au niveau de l’industrie du web avec une montée en puissance de profils comme les architectes front office (l’équivalent des DBA ou des architectes systèmes) chargés de concevoir des interfaces web cohérentes et surtout performantes (notamment dans la gestion des styles).

De même, j’anticipe une véritable révolution pour les outils de prototypage rapide dont l’intérêt était limité du fait du format de sortie (du HTML de base que ne pouvaient pas exploiter les équipes de production) et qui vont fortement bénéficier de cette épuration du code source et de la séparation structure / contenu /présentation.

Bref, j’ai l’impression de me répéter, le web a de très beaux jours devant lui avec ces nouvelles spécifications qui vont tranquillement nous amener vers des contenus mieux structurés (sémantisés) et des applications en ligne plus performantes et simples à créer / maintenir.

Quels scénarios d’évolution pour Twitter

Avec la rentrée viennent les bonnes résolutions de la rentrée. Une de mes premières résolutions est donc d’arrêter de publier des article sur Twitter, ou du moins d’en publier moins car j’ai comme l’impression que nous approchons de la saturation. Mais il faut dire que malgré son apparente simplicité, Twitter a l’incroyable faculté d’hypnotiser la blogosphère au point d’en devenir un des sujets de prédilection depuis près de 2 ans. À tel point que l’on se demande quel sujet va venir éclipser la Twittmania : Il y a une vie après Twitter (heu… laquelle déjà ?).

Plutôt que de revenir sur les clés du succès de Twitter, je préfère essayer de me projeter et de lister différents scénarios d’évolution possibles. Vos remarques et propositions sont bien évidemment les bienvenues dans les commentaires.

Scénario 1 : La ligne de commande du web

Dans un précédent article j’avais comparé Twitter à la CB du web. Mais lorsque je regarde les différents services gravitant dans l’écosystème de Twitter, je me dis qu’une évolution possible serait de « standardiser » de fait les tweets pour en faire des instructions façon lignes de commande. Mais si enfin, des lignes de commande comme il est possible d’en saisir quand vous êtes en mode « console ». Twitter deviendrait donc une gigantesque console à l’échelle du web, une interface textuelle qui permet aux utilisateurs et aux services de communiquer entre eux.

L’intérêt des interfaces à lignes de commande est leur souplesse et leur évolutivité. De nombreuses fonctions et informations sont ainsi publiées sur Twitter avec une syntaxe bien particulière pour pouvoir être utilisées ultérieurement par des services extérieurs. Concrètement il s’agit de services en ligne qui vont parcourir la Twittosphère et récupérer les tweets qui utilisent la bonne syntaxe pour proposer une lecture plus simple.

Premier exemple avec Boarding qui permet de recenser les voyageurs en transit et faire des rencontres informelles dans les aéroports. Exemple de syntaxe : « #boarding in cdg for yyz » = « J’embarque à Paris pour Toronto« .

L'interface de Boarding pour les voyageurs en transit
L'interface de Boarding pour les voyageurs en transit

Il y a également StockTwits qui analyse les tweets relatifs aux sociétés cotées et permet d’en faire une synthèse, il suffit pour cela d’insérer le ticket Nasdaq de la société dont vous parlez précédé du symbole $ :

StockTwits pour les boursicoteurs-tweeteurs
StockTwits pour les boursicoteurs-tweeteurs

Dans le même style il y a aussi PollyTrade, un service qui vous permet de passer des ordres du type « @pollytrade buy 100 shares AAP« . Plus d’infos ici : Boursicoter avec Twitter.

Pour les fans de ciné il y a aussi FlixPulse qui agrège les avis de la Twittosphère :

Les critiques de film avec FlixPulse
Les critiques de film avec FlixPulse

Il existe également un service de rating plus ouvert (Out of 5) qui utilise un principe équivalent mais sans possibilité de faire des moyennes.

On retrouve enfin un service de rencontre (Radaroo) qui utilise une syntaxe assez complexe :

Radaroo
La syntaxe du service de rencontre Radaroo

Notons également le très particulier Ideas Culture qui permet de faire des demandes de recherche d’informations qui sont traitées dans la nuit par des équipes travaillant en Australie : Services uses Twitter to crowdsource ideas overnight.

Bref, tous ces exemples me font dire que la simplicité de Twitter et surtout les nombreuses possibilités offertes par les API permettent de développer tout un tas d’usages autour de cette fonction de ligne de commande.

Scénario 2 : le nouveau flux RSS

Quoi que l’on puisse en dire, et même si je suis un fan de la première heure, les flux RSS ne sont pas réellement entrés dans les habitudes du grand public, ni même des collaborateurs en entreprise. Pourtant il existe un réel besoin d’un flux d’informations brutes (de type flux AFP) que Twitter pourrait bien combler. C’est en tout cas le point de vue de certains : Rest in Peace RSS et Twitter humanise la technologie RSS. Les arguments avancés sont qu’avec Twitter la masse d’utilisateurs permet de faire du filtrage collaboratif sur les infos et que l’on trouve plus facilement son ou ses « fournisseurs » en fonction des affinités que vous avez avec lui (ou elle).

Je ne rentrerais pas dans le débat de savoir si les abonnés RSS ont plus de valeur que les followers (cf. RSS Subscribers or Twitter Followers: Which Are Worth More?) mais je pense qu’il serait juste de dire que Twitter est un très bon canal d’informations en temps réel pour celles et ceux qui veulent surveiller de loin, mais que pour une activité de veille plus intensive et systématique, les flux RSS sont tout de même recommandés.

Tout ça pour dire que dans certains domaines, Twitter est utilisé comme un canal de diffusion en temps réel :

Bref, il existe autant de domaines d’application que de types d’information. En ce qui concerne l’immobilier, il existe même des robots capable de répondre à des requêtes : RealEstate.com Launches Useful Twitter Bot. (ha non mince, c’est plus de la ligne de commande ça).

Scénario 3 : Une plateforme de jeux en temps réel

Les jeux ont toujours été un vecteur très performant de sociabilisation, et Twitter peut faire entrer cette sociabilisation dans l’ère du temps réel en permettant aux joueurs de rester en contact ou de se rencontrer avec des services comme TweetMyGaming (TweetMyGaming Compiles Video Game Conversations from Twitter in Real-Time) ou Twoof (qui permet de lier vos deux comptes Doof et Twitter) ou de partager les réactions des joueurs au cours d’une partie (How Twitter is Changing the World of Professional Poker).

Mais les applications les plus intéressantes sont celles qui concernent les jeux en ligne directement intégrés à Twitter, ou du moins qui se servent de Twitter comme canal d’interaction (MSPOG + microblog = Micro social RPG) et qui représentent un marché juteux (Virtual Mafia Game Making Actual Money on Twitter).

Même s’il existe déjà de nombreuses plateformes sociales dédiées aux joueurs (RaptR, GamerDNA…), c’est encore une fois Twitter vers lequel les regards se tournent : Can Twitter Become the New Casual Gaming Hub? Pourquoi ? Toujours pour les mêmes raison : simplicité, ouverture, modularité…

Conclusion

J’arrête là ma liste de scénarios d’évolution possibles car il faut que je vous en laisse aussi ! Plus sérieusement, je constate que la stratégie de Twitter qui consiste à complètement ouvrir sa base de donnée au travers de nombreuses API a été payante pour gagner très rapidement en popularité et surtout en ferveur. Dans un avenir proche il pourrait être tout à fait envisageable d’exploiter un service reposant sur Twitter sans que vous ayez à passer par Twitter.com (inscription, autorisation, manipulation…), tout serait délégué à des services tiers et Twitter serait alors une sorte de couche de communication.

Une évolution intéressante qui, de plus, pourrait devenir un modèle économique pour Twitter qui ne facturerait pas les utilisateurs mais les services qui exploitent sa base de données.

Alors selon vous Twitter peut-il réussir cette forme de reconversion ?

Netbook + TabletPC = Touchbook (et le web devient tactile)

Alors que le marché des netbooks n’en finit plus de grossir (ils représentent maintenant 1/5 des ventes : Netbooks Now A Fifth Of All Portable Computer Shipments), j’ai comme l’impression que nous sommes en train de voir émerger un nouveau segment : les touchbooks (des netbooks à écran tactile). Certains pourraient dire que les Tablet-PC existent depuis de nombreuses années, certes, mais je pense que ce type de terminaux va connaitre une seconde jeunesse en bénéficiant de l’expérience acquise par les constructeurs sur les netbooks (des machines « low-cost« ). Entendons-nous bien : « low-cost » ne rime pas forcément avec mauvaise qualité, il s’agit plus d’un positionnement différent où l’on ne recherche pas les meilleures performances mais plutôt le meilleur rapport valeur/prix (cf. The Good Enough Revolution: When Cheap and Simple Is Just Fine).

En tête de liste des prétendants à ce nouveau segment nous avons le Tabbee d’Orange :

tabbee

À peine sortie, cette machine fait déjà des émules avec le JournE Touch de Toshiba :

Journe_Touch

Nous retrouvons ensuite le fameux CrunchPad qui devrait sortir d’ici peu :

crunchpad

Moins sexy mais bien meilleur marché il y a le TouchBook de Always Innovating qui est proposé en open source pour le software ET le hardware (merci à Piffeur pour le lien) :

touchbook_AI

Mais on trouve également des formats alternatifs comme les Internet Tablet d’Archos :

archos-a5h-android

Ou encore les netbooks à écran tactiles comme le T91 d’Asus :

EeePCT91

Le point commun de toutes ces machines est de proposer un écran tactile, mais pas forcément l’interface qui va avec ! Et c’est là où il y a comme un problème, alors que le segment des netbooks est encore en train de chercher le bon système d’exploitation (cf. Intel et Jolicloud à la recherche de l’interface parfaite pour les netbooks).

Apple a révolutionné la téléphonie mobile avec son iPhone, les constructeurs précités sauront-ils en faire de même avec ces nouvelles machines ? Difficile à dire pour le moment, surtout avec le lobbying de Microsoft et de son futur Windows 7 qui devrait proposer des choses très intéressantes en terme d’interfaces tactiles. Intéressantes pour une utilisation intensive voire exclusive ? J’en doute, mais je peux me tromper. Archos montre l’exemple en proposant des Internet Tablet propulsée par Android mais est-ce suffisant pour convaincre le grand public… pas certain non plus car cela limite les domaines d’applications.

Dans l’idéal il faudrait attendre l’annonce d’un Macbook Touch pour avoir une machine cohérente (avec une interface parfaitement adaptée) mais ça ne sera visiblement pas pour cette année.

Le Macbook Touch d'Apple existera-t-il un jour ?

Pour le moment le produit qui me semble le plus intéressant est le Qooq, un terminal dédié à la cuisine :

Qooq, un touchbook dédié à la cuisine
Qooq, un touchbook dédié à la cuisine

Pour faire simple, il s’agit d’un touchbook entièrement dédié à la cuisine (un « coach culinaire ») avec tout un tas de recettes à suivre pas à pas, des vidéos de préparation, des astuces et interviews de grands chefs et même une application de gestion des courses. Bref, c’est un terminal « intégré ».

Vous noterez qu’un effort a été fait pour adapter le terminal à son contexte d’utilisation (écran protégé contre les projections, pied pour le maintenir en position verticale…) de même que l’interface particulièrement réussie. Cette machine est proposée avec un abonnement (13 €/mois) qui donne accès aux recettes, aux fiches ingrédients ainsi qu’à un magazine vidéo sur l’art culinaire. Un modèle économique particulièrement intéressant pour un terminal proposé à 350 € (il fait aussi station météo et cadre numérique).

Peut-être que le Qooq ouvre la voix à toute une série de touchbooks de niche avec une ergonomie, une interface et des services verticalisés pour le grand public (pour les personnes âgées, pour les 5-7 ans…) ou les professionnels. En tous cas je me réjouis d’avance car ce type de machine va permettre de remettre en question les interfaces jusqu’alors proposées et apporter de l’innovation dans un marché stagnant (à quand remonte la dernière grosse innovation en matière d’informatique grand public ?).

Si vous connaissez d’autres exemples, les commentaires sont là pour ça…

Mes 3 sites coup de coeur (août 2009)

Pour cette édition estivale des mes trois sites coup de cœur du moment je vous propose une sélection tout en couleurs et en rondeurs.

Commençons avec le site de MetaLab :

La page d'accueil de MetaLab

Bon OK pas trop de couleurs vives mais avec un très bon contraste, des coins joliment arrondis et de belles transitions latérales et horizontales pour parcourir les différentes réalisations.

Nous avons ensuite Trent River Cruise :

La page d'accueil de Trent Cruising

Beaucoup de zones de respiration dans cette page d’accueil et des éléments parfaitement alignés sur grille de lecture, pas trop de texte et des illustrations qui se font rares pour une ambiance très apaisante (à l’image des croisières qu’ils proposent j’imagine).

Nous avons enfin Guifx :

La page d'accueil de GuiFX

Ambiance beaucoup plus colorée pour cette page d’accueil avec encore moins de texte mais plus d’illustrations. Vous noterez au passage la sophistication du traitement des boutons qui réchauffent l’ambiance et donne un aspect plus qualitatif (plus riche ?).

La suite le mois prochain.