www.matthieu-tranvan.fr fait peau neuve, le retour…


 
Kézako?
0
shares
Partager sur Twitter
Partager sur Google+
Partager sur LinkedIn
Partager sur Pinterest
+
www.matthieu-tranvan.fr fait peau neuve, le retour

www.matthieu-tranvan.fr fait peau neuve, le retour

Nouvelle naissance pour www.matthieu-tranvan.fr… En termes d’ergonomie, de look & feel!

Vous êtes déjà des milliers à croiser régulièrement cette URL, jusque là sans réelle identité. C’est maintenant chose faite, avec une nouvelle mouture du blog qui -je l’espère- satisfera les fidèles lecteurs que vous êtes.

Alors, quel est le nouveau « mode d’emploi » du blog? Je vous invite à une visite guidée dans ce nouveau site qui a été pensé pour plus de confort…

Petite revue ergonomique de la refonte d’un blog… Celui-ci!

> Premier écran

1er ecran blog

1 – Menu de navigation secondaire

Les catégories du blog sont présentées en haut de site pour vous permettre d’atteindre plus facilement et en profondeur l’ensemble des articles liés à la thématique qui vous intéresse.

2 – Logo

Grande nouveauté du blog, avoir une identité… Un logo pensé à l’image du concept du blog: celui de la boite à outil. Un grand merci à Audrey, webdesigneuse de talent pour sa créativité.

3 – Nom du blog & baseline

Pour accompagner sa nouvelle identité, ce blog se devait de faire une offre plus précise, au delà de son nom et son URL. La baseline permet de clarifier l’offre de contenu du site, et de le positionner immédiatement dans l’esprit du visiteur.

4 – Menu de navigation primaire

Les pages de www.matthieu-tranvan.fr sont plus facilement accessibles qu’avant, et mieux mises en évidence. Comme l’ancien thème, le menu marque une limite forte entre la zone de navigation et la zone de contenu.

5 – Moteur de recherche

Lorsque son blog contient 154 430 mots, c’est toujours très appréciable! Pour ma part, je considère le moteur de recherche comme un réel atout pour les « bases sémantiques » que sont les blogs. Bref, un incontournable mis en avant grâce à l’utilisation d’une couleur complémentaire.

6 – Mises en avant « à la une »

Une fonctionnalité gadget? Pas vraiment… Au-delà de l’aspect « merchandising » des articles, le slider permet également de remettre au devant de la scène des articles précédents, ou les plus populaires, ou les plus techniques… Bref, c’est « la vitrine » du site, entièrement administrable et qui a aussi son utilité.

7 – Bloc « web social »

Blogguer, c’est aussi s’insérer dans un écosystème. Se connecter aux autres est important. C’est pourquoi il est mis en avant avec un aplat de couleur, et placé au-dessus de la ligne de flottaison. On remarquera également une interactivité des icônes qui favorisent l’engagement du visiteur, et incitent à l’action.

> Le corps du blog

Corps du blog

8 – Le display des post

Aéré, bien délimité… Globalement, la nouvelle mouture apporte plus de clarté que l’ancien thème. La « scannabilité » est améliorée par une meilleure mise en avant visuelle. Alors que l’ancienne version du blog était sobre et académique, ce  nouveaux design apporte un confort supplémentaire.

9 – Bloc post + commentaires + Derniers billets

Un élément de la sidebar très intéressant. En effet, il permet de répondre, dans un espace de 300×540 pixels, à 3 intentions de visite:

  • l’exploration dans les catégories,
  • la veille d’une réponse dans les commentaires,
  • la consultation des nouveautés du blog, au travers des derniers articles

10 – Nuage de mots clé

Une manière toujours sympathique de naviguer, et puis surtout de bons bénéfices SEO ;-)

> Footer du blog

Footer du blog

11 – Colonne 1 du footer: les billets les plus populaires

Là encore, l’objectif est de faire ressortir au maximum la profondeur du contenu. C’est également un vecteur d’image pour le bloggeur, car il permet au visiteur de consulter les articles « stars » du site.

12 – Colonne 2 du footer: Bloc social avancé

Si vous êtes en pied de page, c’est que vous avez fait preuve d’un certain « engagement »… Alors pourquoi ne pas examiner toutes les manières de se connecter?

13 – Mentions

Enfin, le pied de site fait apparaître les mentions légales traditionnelles, comme le veut les us et coutumes de l’ergonomie web…

Epilogue: l’aperçu global

Partager sur Twitter
Partager sur Google+
Partager sur LinkedIn
Partager sur Pinterest
+

2 thoughts on “www.matthieu-tranvan.fr fait peau neuve, le retour…

  • 14 mars 2011 at 18 h 19 min
    Permalink

    Toujours sympa le mockup Balsamiq ! Joli refonte et l’argumentaire est justifié, une petite remarque cependant, j’aurai mis un peu de style pour hiérarchiser ton bloc 9, mettre le nombre de posts (bloc post)en plus petit et d’un certain style pour la lisibilité…

  • 14 mars 2011 at 20 h 00 min
    Permalink

    @Seb: Merci pour ton commentaire et tes conseils sur cette nouvelle mouture du blog. Il est vrai que le « bloc 9″ pourrait très certainement être encore amélioré…

Laisser un commentaire

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

Vous pouvez utiliser ces balises et attributs HTML : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>