Présentation du nouveau webdesign W3C

Vous l’avez peut-être remarqué mais le World Wide Web Consortium, aussi appelé consortium W3C, a officiellement lancé son nouveau site web. Plus moderne, mieux organisé, plus digeste, accessible aux terminaux mobile… Voyons un peu plus en détails le résultat de cette refonte…

Jusqu’à présent le site web du W3C était plus connu pour le fond que pour la forme. La densité des infos proposées, le manque de clarté et la technicité du contenu pouvaient faire un peu peur à première vue et il fallait vraiment avoir quelque chose à trouver pour naviguer dans ses nombreuses pages. Quand au design, n’en parlons même pas, nous étions sur quelque chose de plutôt…basique.

Aujourd’hui tout cela est terminé ! Le W3C a lancé son nouveau site web et la refonte est réussie. Nous allons voir ce qui a motivé ce changement, les nouvelles fonctionnalités proposées et enfin nous verrons comment est organisé le contenu dans le site.

Une refonte, pourquoi ?

Comme je le disais plus haut, une refonte générale du site web était nécessaire pour de plusieurs raisons :

  • Aller vers une modernisation du design
  • Faciliter la recherche de l’information
  • Agréger le contenu de la communauté entière en un seul endroit
  • Permettre la compatibilité du site sur les terminaux mobiles

Le design du nouveau site a été réalisé afin de respecter ces différentes contraintes et bien plus encore…

Les nouvelles fonctionnalités

W3C Redesign homepage

En arrivant sur la page d’accueil, on est agréablement surpris par la clarté qui s’en dégage. La structure est assez basique et présente une largeur fluide. Cela permet une adaptation aux écrans de toute les tailles, même les 800px passent sans problème… Le mien fait 1440px et la page s’affiche également parfaitement.

La zone de haut de page comprend un menu de navigation principal, un sélecteur d’apparence : Web / Mobile / Print, un moteur de recherche ainsi qu’un sélecteur de régions. Le Sélecteur d’apparence est très efficace et il est intéressant de voir comment le support (écran mobile, web ou papier) affecte la mise en page du contenu.

Pour mieux vous en rendre compte voici les screenshots des versions Mobile et Print :

W3C Mobile version

W3C Print version

La colonne de gauche nous propose un second niveau de navigation pour accéder aux 7 catégories composant les standards.

Juste en dessous on peut voir un autre menu qui s’intitule « Web for All ». Vous pourrez y retrouver le fameux : « W3C A To Z», des infos sur le web mobile, l’accessibilité etc..

W3C Standards

Toujours sur la homepage on peut voir un bloc central présentant les événements en cours et à venir ainsi que les dernières news en provenance d’articles divers, sites web, blogs etc… On se rend compte de la volonté de faire de ce site un endroit central autour duquel vont graviter les nombreuses communautés travaillant sur les standards du web.

W3C Redesign homepage

Pour finir avec la structure je ne pouvais pas mettre de côté la zone réservée au breadcrumb (Fil d’ariane en Français) qui a visiblement été très travaillée.

W3C Breadcrumb navigation

Cette zone est centrale dans le site. Elle vous permet de vous situer au niveau n, n-1 mais également n+1 puisqu’elle présente les titres de chaque sous-catégories de la rubrique en cours. Je ne me rappelle pas avoir déjà vu un tel niveau de précision quelque part sur le web. En gros, il est quasi impossible de se perdre sur ce site sauf pour un total néophyte en informatique ne connaissant pas un mot d’Anglais.

Après avoir présenté succinctement la structure, je vais maintenant m’attarder sur le contenu…

L’organisation du contenu

Les standards sont donc scindés en 7 catégories principales présentées sur la page Standards. Chaque catégorie (=standard) possède sa propre page d’accueil où l’on retrouve une liste de tous les domaines couverts.

W3C Category page

Lorsqu’on s’enfonce encore dans le site on trouve les sous-catégories. Par exemple : « HTML & CSS » est une sous-catégorie de « Web Design and Application ». Autrement dit, les langages « HTML & CSS » font partie du standard « Web Design and Application ». Sur ces pages on trouve (ou on trouvera bientôt puisque le site n’est pas encore entièrement terminé) des articles en relation avec le sujet, des tutoriaux, des outils etc…

W3C Redesign sub-category

La partie « Current Status of Specifications » en bas de page donne accès aux spécifications sur les domaines couverts par la rubrique (ex : spécification HTML).

Toutes les spécifications ont été englobées dans la rubrique « All Standards and Drafts ». Elles sont regroupées comme suit : Standards / Informatives Notes / Drafts / Ressources Developed Outside W3C.

Toujours dans le but d’apporter un maximum d’information à l’utilisateur, une petite note a été ajoutée sous chaque titre de spécification.

W3C Redesign homepage

Conclusion

Comme nous l’avons vu , ce travail de refonte a été particulièrement bien mené et apporte un réel intérêt au site du W3C. D’un point de vue structurel, ergonomique, esthétique ou concernant l’accessibilité, ce nouveau design remplit pleinement ses fonctions.

Cependant, comme l’explique le W3C, il reste encore du travail à accomplir. Certaines pages ne sont pas encore entièrement complétées, il y a encore quelques bugs à corriger, les feuilles de style nécessitent encore du travail (en particulier la version print) etc.

Chacun de nous peut contribuer à améliorer le site en proposant ses solutions. Pour cela il suffit d’envoyer vos retours à site-comments@w3.org avant le 23 Avril 2010. Votre commentaire apparaitra ensuite dans la liste des archives publiques.

Quelques liens pour finir :

7 réflexions au sujet de « Présentation du nouveau webdesign W3C »

  1. J’ai également vu cette nouvelle version et comme dis Max il était temps de mettre le design à jour, l’ancien étant vraiment austère.

    Super article de présentation, merci de l’avoir décortiqué pour nous :)

  2. Je n’était pas un adepte de la version précédente du site surement à cause du design et de sont organisation désastreuse. Cependant je trouve qu’ils ont fait du beau travail et je félicite le travail du graphiste.
    Le mode Print est sympa et bien pensé, je savais qu’ils proposaient cette possibilité.

    Tu ne te serais pas trompé sur la date limite des suggestions 2010 et non 2009 ?

  3. Ping : wordpress???????? - ??

  4. Sympa ce nouveau look, comme le dit Remus, la version précédente n’était pas au point, surtout son organisation et je trouve que la rubrique web agency and applications est très bien.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

CommentLuv badge