Sans vouloir me vanter ou je ne sais quoi d’autre, je trouve que mes images de présentations (les 1° images juste après les titres) sont plutôt pas mal. J’entends par là, que l’on distingue bien les choses et que la qualité est presque convenable. En me promenant (pour ne pas dire surfer *que je viens de dire*) sur des sites je m’aperçois que peu font une bonne présentation « imagique ». Nous allons donc voir une/ma manière parmis tant d’autre pour faire de bonnes images pour vos articles.

.Introduction :

Alors oui, nous, français on est souvent à la ramasse sur le net par rapport aux américains mais bon c’est compréhensible. Enfin bon, c’est un autre débat, mais tout ça pour dire qu’ils ont été les premiers (du moins je crois) à faire une bonne présentation de leurs articles. Quand je dis « bonne présentation » j’entends par là, une introduction au sujet par une image de bonne qualité. Alors bon, on commence enfin à se réveiller et nous y mettre aussi…

Prenons un exemple interne, c’est-à-dire un exemple sur ce blog, constatez que les 20 à 30 derniers articles ont tous une image après le titre de 330*150 pixels centré alors que dans les débuts de celui-ci, c’était des images à l’arrache, il faut bien l’avouer. C’est quand même bien mieux avec de bonnes images non ?

Mais surtout un point important est le fait de trouver le format idéal et de ne pas le quitter ! En effet, encore une fois dans les entrailles du blog, vous constaterez des variations de tailles, et c’est pas très très bon, donc il faut vous trouvez un format spécial pour cette première image.

.La qualité :

.Screencast :

Un petit screencast pour vous montrez comment je réalise le type d’images dispos sur Joe découvre Internet mais surtout pour vous montrez comment améliorer la qualité de ces images de façon optimale. (rendu)

Plein écran conseillé, et encore désolé pour la qualité sonore, je ne maitrise pas encore bien, je l’ai fait au moins 10 fois ce screencasts… abusé !

Il dure 10 minutes mais avec l’habitude, on fait ce genre d’image en 1 à 5 minutes maxi.
J’ai utilisé exprès PixlR pour ne pas avoir de commentaire du genre : « Oui on a pas Photoshop alors on ne peut pas améliorer nos images. » – Et oui, pas d’bol mais il y a des sites assez performant.

.L’optimisation :

Maintenant on va s’intéressé aux poids des images qui est très important pour le web. Donc là, je ne vais pas faire long mais je vous conseille Smush-it pour gagner quelques Ko précieux. Ou sinon je vous conseille d’enregistrer en .png comme je l’ai mentionné dans le screencast, cependant je vous conseille ce post de SmashingMagazine très complet. En revanche, je connais que les astuces pour Photoshop (CTRL+MAJ+ALT+S) pour enregistrer pour le web…

Quelques exemples de bonnes images (images cliquables pour accéder à leurs sites respectif):

Problogdesign :

Fubiz :

Clashmachine :

.La taille :

Mon format (330*150), n’est peut-être pas l’idéal comparé à la taille du content (du contenu qui est de 670px) mais pour des raisons rapport image/produit c’est un format pas trop mal même si c’est pas le meilleur.

En fait, je me suis emporté, je vais vous montrez pourquoi, vous allez voir c’est simple mais pourtant on y pense que rarement:

On constate très bien que la lecture est déjà cassé par l’alignement inexacte. Comment faire pour y remédier ? C’est très simple, allez voir dans votre feuille de style et faites CTRL+F pour Rechercher le mot « content » et regardez la taille en pixels (width) et fixez vous la même largeur d’image.

.Conclusion :

Donc voici le résumé des astuces que je peux vous fournir grâce à mon expérience (constats + essais nombreux):
- Trouver le format idéal et ne plus le quitter, ce qui veut dire pleins d’essais en perspective.
- Trouver un style : ça va permettre de vous distinguer et surtout de garder un fil continu dans vos présentations.
- Mettre l’image avant le Lire la suite ou tout près du titre.
- Utiliser des couleurs se rapprochant du blog

Il faut garder à l’esprit deux choses :
- Facile à faire (en prenant l’habitude), effet garanti.
- Un article est plus lu quand il y a une image. Il y a des stats là dessus mais je dirais au minimum 3x plus lu qu’un article sans. L’oeil est attiré par le titre, ensuite l’image et si les deux colle bien souvent on lit la suite.

Vous n’avez donc plus d’excuses pour faire des articles de qualités, car les images compte beaucoup

• 
• 
• 
• 
• 
•