Montrer Cacher le sommaire
- Premier écran
- 1 – Menu de navigation secondaire
- 2 – Logo
- 3 – Nom du blog & baseline
- 4 – Menu de navigation primaire
- 5 – Moteur de recherche
- 6 – Mises en avant « à la une »
- 7 – Bloc « web social »
- Le corps du blog
- 8 – Le display des post
- 9 – Bloc post + commentaires + Derniers billets
- 10 – Nuage de mots clé
- Footer du blog
- 11 – Colonne 1 du footer: les billets les plus populaires
- 12 – Colonne 2 du footer: Bloc social avancé
- 13 – Mentions
- Epilogue: l’aperçu global
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
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
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
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
@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é…