Styler un site à la mode Web 2.0

Web 2.0 how-to design style guide

6 mars 2007,
par Romy Têtue

Mots-clefs associés à cet article :

Voici un mémo de l’article anglophone « Web 2.0 how-to design style guide », qui liste en 15 points, les caractériques et tendances actuelles du design des sites dits « Web 2.0 » en nous expliquant leur intérêt.

En un mot : simplicité !

Voici un extrait de l’introduction de l’auteur, l’anglais Ben Hunt, designer talentueux qui travaille dans la création des sites Internet depuis 1994 :

« Je vais vous guider à travers les caractéristiques de la vague actuelle d’excellents sites Web, disséquer aspects les plus significatifs, expliquer pourquoi chacun d’entre eux peut être bon, et vous montrer comment les utiliser dans vos propres sites.
Si je devais expliquer le “Web 2.0” en un seul mot, ce serait “simplicité”. Nous allons donc commencer par là.
Je suis un fervent adepte de la simplicité. Je crois que c’est la voie à suivre pour la conception de sites Web. »

Je suis moi aussi fervente adepte de la simplicité et je pense que c’est la grosse amélioration apportée au webdesign, par cette nouvelle vague dite « Web 2.0 », ici abordée du point de vue stylistique.

Principales caractéristiques du design Web 2.0
Caractéristiques Exemples
Simplicité : plus un design est simple, meilleur il est !
Centrer la page dans la fenêtre : oubliez les maquettes extensibles ou les sites ferrés à gauche pour préférer centrer la page, en largeur fixe, dans la fenêtre.
Moins de colonnes : fini les portails au multicolonnage assommant ! Une ou deux colonnes suffisent. Trois maximum.
Une entête bien distincte du contenu, avec mise en avant de l’identité, du logo. Page mieux structurée, avec distinction claire des différentes zones de la page.
Navigation facilitée avec barre de navigation hyper-simplifiée (un seul mot par onglet), zones cliquables plus larges et hyperliens mieux distingués du texte.
Identité forte, affirmée par un logo gros et gras, franc et lisible, qui s’affiche sans complexe.
Textes plus gros qui facilitent considérablement la lecture. Osez grossir le corps des accroches, des appels à l’achat et autres informations importantes qui doivent être perçues rapidement.
Couleurs franches voire flashy : n’hésitez pas à faire mal au yeux avec des couleurs vives aux contrastes élevés (cyan, fushia, etc).
Effets de relief plus subtils : moins d’ombres portées, mais quelques effets 3D légers, un reflet par-ci ou un dégradé par-là...
Moins d’icônes : graphiquement bien travaillées, mais utilisées avec parcimonie, réservées aux actions bien particulières, bref maîtrisées.
Badges étoilés (star flashes) façon promo de supermarché

Que ce résumé ne vous épargne pas la lecture de l’article original : « Web 2.0 how-to design style guide » malheureusement anglophone, où vous trouverez chacun de ces points détaillés avec plein d’exemples. Très instructif !

{#TITRE,#URL_ARTICLE,#INTRODUCTION}

Vos commentaires

  • Le 29 avril 2008 à 10:25, par ? En réponse à : Réussir un design Web 2.0

    C’est nul le design web 2.0, c’est le même design pour tout le monde (yoghourt, lingerie ou voiture, etc.)... c’est de l’uniformisation et plus du design.

  • Le 29 avril 2008 à 10:57, par Romy Têtue En réponse à : Réussir un design Web 2.0

    C’est nul les messages anonymes, c’est de l’avis à l’emporte-pièce, non argumenté, de la soupe de préjugé.

     ;-)

    Sérieusement : qui a dit que c’était bien le « design web 2.0 » ? Et qui a dit qu’il fallait tout relooker à cette mode ??

  • Le 22 avril 2009 à 14:02, par Aurélien En réponse à : Réussir un design Web 2.0

    Bonjour.
    je ne suis pas d’accord avec tous les points :

    • les Badges étoilés : sont très peu utilisés
    • Moins d’icônes : ah bon ?!? avec tous les packs d’icônes « 2.0 » qui fleurissent sur Internet !!
    • Moins de colonnes : il n’y a jamais une seule colonne sur les sites 2.0

    Pour le reste, je suis d’accord :)

  • Le 22 avril 2009 à 14:04, par Aurélien En réponse à : Réussir un design Web 2.0

    Bonjour.
    Une idée bizarre avec à mon avis un rapprochement trop rapide. Le web 2.0 défini en général l’esprit communautaire, l’agrégation de flux, la personnalisation, ... bien avant le design.
    Cordialement

  • Le 1er juillet 2009 à 15:24, par GezuS En réponse à : Styler un site à la mode Web 2.0

    Un joli « cheval de troie » que cette appellation « Web 2.0 » :

    • Un jour quelqu’un a jeté ce terme sur le tapis sans véritable définition, alors qu’en plus le terme inclus un versionnage (2.0), qui fait référence à une manière très rigoureuse de programmer.
    • Quelques temps après on voit émerger de ci de là des opinions et définitions diverses qui participent à semer le trouble chez tous ceux qui chercheraient un semblant de rationnalité dans la définition de ce terme.
    • Et maintenant voilà les informaticiens, au coeur de la véritable problèmatique Web, qui essayent tant bien que mal de donner corps et raison à ce « Web 2.0 »,
      ou à l’inverse qui tentent de démistifier le Web 2.0 en expliquant que ce n’est pas une grande charte (graphique, fonctionnelle ou autre) universelle mais un terme bien mal employer pour définir ... Rien du tout (à mon sens).
    • Et nous voilà (informaticiens et clients) prisonniers d’un terme avec lequel on se bat, essayant chaque jour de tomber d’accord avec le voisin, ou de peaufiner au mieux sa définition.

    Je pense qu’avec un temps soit peu de rigueur nous devrions ouvrir les yeux, se rendre compte de cette mascarade qui dure depuis déjà quelques temps,
    et anéantir purement et simplement cette erreur qui a été comise autour de ce terme sans définition.

    Oublions le Web 2.0, effaçons ce terme de nos pages web, de notre jargon, de nos mémoires !

    Le langage est primordial car il définit les idées que nous échangeons et transmetons, tant que ce langage reste commun et bien compris de tous.
    Ne nous éloignons pas de son usage.

    Là sera notre salut à tous !

    PS : Cette vision n’engage que moi, mais si vous partagez mes idées, n’hésitez pas à le faire savoir.

    Linuxiennement,

    GezuS

  • Le 2 juillet 2009 à 15:34, par Romy Têtue En réponse à : Styler un site à la mode Web 2.0

    Est-ce vraiment l’endroit approprié pour ce type d’argumentaire ? Si le terme « Web 2.0 » a toujours été mal défini, qu’importe ! Cet article évoque, d’un point de vue graphique, stylistique, une mode dont on ne peut nier l’existence...

  • Le 5 juillet 2009 à 04:26, par GezuS En réponse à : Styler un site à la mode Web 2.0

    Si un forum portant comme titre « Styler un site à la mode web 2.0 » n’est pas l’endroit pour parler de ça... je ne comprend pas l’utilité du forum.
    Et si on ne peut nier son existence, alors ... le débat est clos.

    Comme cela me semble important, je souhaitais en discuter c’est tout.
    Désolé si j’ai dérangé.

  • Le 5 juillet 2009 à 11:16, par Romy Têtue En réponse à : Styler un site à la mode Web 2.0

    Il n’y a pas de mal, mais c’est juste un peu hors-sujet : vous répondez à un article qui traite de l’aspect formel de la chose mais sans se préoccuper de son bien-fondé ;-)

  • Le 2 août 2009 à 15:32, par GezuS En réponse à : Styler un site à la mode Web 2.0

    Salut Romy je reviens régulièrement sur ton site pour y lire certains articles bien intéressant et je tombe sur celui-ci : Méfiez-vous des « webdesigners » !

    Après une petite lecture, je tombe le cul parterre :
    Comment peut on avoir un sens aigu de la précision à propos de certains termes faisant partis du jargon Web, et en même temps pondre des articles de fond sur le « Web 2.0 », je ne comprend plus...

    Je respecte beaucoup ton travail, aussi bien éditorial que purement technique, mais je n’arrive pas à saisir à quel courant tu appartiens ?

    Est tu du bon coté de la force :) ou du coté sombre de ceux qui participe à noyer l’informatique dans un marasme de termes insignifiants ?

    Cordialement,

    PS : Ce post sert à alimenter la discussion, ce sont des questions personnelles, à ne pas prendre comme offense.

  • Le 8 août 2009 à 20:59, par Gezus En réponse à : Styler un site à la mode Web 2.0

    YES !!! Exactement ça : la différence est purement conceptuelle, finalement on tombe d’accord...bon allé cette discussion ne mènera pas plus loin.

    A plus merci.

  • Le 8 août 2009 à 21:01, par Gezus En réponse à : Styler un site à la mode Web 2.0

    test : web 3.0 VS web 2.0 ...

Répondre à cet article

modération à priori

Attention, votre message n'apparaîtra qu'après avoir été relu et approuvé.

Qui êtes-vous ?

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici
  • Raccourcis : {{gras}} {italique} -liste [bla->url] <q> <quote> <code>.

Suivre les commentaires : RSS 2.0 | Atom