Veerle’s blog 2.0

7 août 2006,
par Romy Têtue

Mots-clefs associés à cet article :

Je n’arrête pas de craquer, ces derniers temps, pour le design du Veerle’s blog 2.0 : une mise en page plutôt audacieuse, sur fond gris anthracite, quelques couleurs acidulées, des arrondis douillets... Un design à cheval entre deux genres, entre high tech et girly, qui correspond au profil de la webmistress. Quant au contenu ? y’en a partout, et pourtant ça reste clean. Un petit miracle de mise en page tirée à quatre épingles !

La page d’accueil est remarquable. En trois colonnes, à plusieurs étages, elle se pose là comme une homepage de magazine. Celle-ci réussit le tour de force de caser un maximum d’informations différentes sur une seule page, tout en préservant des espaces vierges qui laissent respirer. Rien ne manque : nouveautés, rubriquage, barre de navigation, formulaire de recherche, liste de liens, etc. mais aussi, relégués en colonne latérale : extraits du portfolio, mini album photo, sélections illustrées de livres et CD...
Car c’est un blog.

Veerle Pieters est une graphiste belge de talent, néerlandophone, douée et partageuse. Son blog qui mêle XHTML/CSS, graphisme et notes personnelles, explique comment créer des icônes pour Mac OS X, réaliser une navigation en CSS avec images, choisir des couleurs qui se marient bien, etc.
Comme de nombreux internautes, Veerle utilise des services externes tels que Flickr pour publier ses photos en ligne et Amazon pour gérer une liste de livres & CD à recommander. Notons son adaptation du badge Flickr pour présenter ses photos sur ce blog : Flickr badge W3C valid.
Parmi les nombreuses choses à retenir de ce blog réalisé avec le CMS ExpressionEngine, notons aussi la façon dont sont gérés les effets de survol sur les liens en liste, notamment dans la partie « approved » qui présente une sélection de liens issus de la syndication et par elle approuvée : comme l’expose Christian Watson, c’est toute la surface de l’item, dont la luminosité du fond change au survol, qui est cliquable.
Pour le reste... allez donc patauger dans le CSS de Veerle, plongez dans son exemplaire feuille de style !

CSS World AwardLe « Veerle’s blog 2.0 » vient de remporter le second prix du CSS World Awards, concours mondial (malheureusement ignoré du monde francophone [1]) destiné à récompenser des sites utilisant les CSS en respect des Standards, offrant ainsi une reconnaissance au travail des intégrateurs qui travaillent selon cette démarche, tout en permettant aux entreprises de prendre conscience des avantages des Standards.

Veerle PietersVeerle Pieters a débuté comme graphiste freelance en 1992 sous le nom de Duoh !. Elle quitte le print dès 1995 pour le design d’interfaces utilisateurs web & intranet, et les jeux & CD-rom multimédia. Elle découvre les Standards du Web en 2003, après avoir vu le CSS Zen Garden et le travail de Douglas Bowman, et n’a eu de cesse de les promouvoir par le biais de son blog, où vous trouverez sa liste, régulièrement mise à jour, de ressources CSS incontournables.

Voir en ligne : http://veerle.duoh.com

Vos commentaires

  • Le 5 octobre 2006 à 15:16, par Jean-Luc Grellier En réponse à : Veerle’s blog 2.0

    Ben en ce qui me concerne j’ai repris son design que j’ai retravaillé pour l’adapter à spip... le travail n’est pas encore fini il n’y a que la page d’accueil et les rubriques qui sont ok pour le moment... le reste va venir petit à petit. En tout cas, merci Romy...

  • Le 7 novembre 2006 à 17:20, par Romy Têtue En réponse à : Veerle’s blog 2.0

    Voici un autre site avec le même habillage graphique un peu simplifié, et sur fond maron chocolat : le blog et portfolio de Rob Goodlatte, designer lui aussi spécialisé dans les standards et l’accessibilité.

  • Le 14 novembre 2006 à 13:49, par Romy Têtue En réponse à : Veerle’s blog 2.0

    Toujours dans le même genre, voici le site de Larissa Meek, artiste et web designer : mêmes tonalités, même organisation de la page d’accueil (catégories, lectures recommandées et itunes en bas de page, semblablement lookés), le tout un peu « old school » surchargé.

Répondre à cet article

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
  • Ce formulaire accepte les raccourcis SPIP [->url] {{gras}} {italique} <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Suivre les commentaires : RSS 2.0 | Atom