Ajouter des images à vos articles

Ce tutoriel va vous expliquer comment insérer des images dans vos articles, et notamment comment en mettre à la Une. Mettre des photos dans vos billets est indispensable : cela permet de mettre votre texte en valeur, et de faire comprendre visuellement à votre lecteur de quoi vous lui parlez. Dans le corps d’un article, une photo peut également illustrer visuellement ce que vous êtes en train d’expliquer.

Attention : vous ne pouvez pas ajouter n’importe quelle photo à votre article, il faut que celle-ci soit libre de droit. Sur cette question, n’hésitez pas à vous référer à notre tutoriel dédié.

Marre de chercher des images pour illustrer vos articles ? Suivez le gif. / via giphy.com

Il est important d’avoir une taille d’image suffisante pour qu’elle s’affiche correctement ! Une taille moyenne que nous pourrions vous conseiller serait du 600 x 400 px, mais vous pouvez très bien mettre en ligne des images de 1200 x 800 px si vous en avez de cette taille.

  • Pensez aussi à nommer vos images avec des mots-clés descriptifs. Le nom des images est en effet comptabilisé pour le référencement des articles qu’elles servent à illustrer : une bonne nomenclature pourrait donc vous apporter des visiteurs en plus ! La photo qui illustre ce tutoriel s’appelle par exemple : ibm_image_ordinateur_dessin.jpeg.
  • Surtout, rappelez-vous choix d’une photo n’est pas anodin : elle doit correspondre précisément à ce que je suis en train de raconter. Par exemple, si mon article parle de pollution, je peux certes ajouter une photo d’une voiture, mais une photo d’embouteillages ou de nuages de pollution illustrera encore mieux mon papier.

Ces précisions faites, voyons maintenant comment insérer une image !

D’abord, parlons de l’image mise en avant !

Vous devez insérer au moins  une image dans votre article, et c’est en avant qu’il faut la mettre 😉
L’image mise en avant est très importante, puisqu’elle permettra d’illustrer votre article, non seulement aux côtés de votre texte, mais aussi sur votre page d’accueil. C’est également elle qui s’affiche lorsque vous partagez un lien et sur la page d’accueil de Mondoblog. Choisissez la avec précaution !

Pour mettre une image en avant, vous disposez d’un onglet dédié dans votre interface d’édition de billet. Cliquez sur « Définir une image mise en avant » puis sur « Sélectionner des fichiers » cela va vous permettre d’accéder à toutes les images de votre ordinateur et de choisir votre illustration.

Dans mon cas, j’ai choisi une photo libre de droit sur laquelle on voit un homme dessiner sur un écran IBM. Je la sélectionne donc. Une fois que vous avez choisi votre image, vous avez plusieurs informations à renseigner.

  • renseigner un texte alternatif : ce champ sert dans le cas où les images ne chargent pas, afin de décrire ce qu’elles étaient censées afficher!
  • écrire une description : nous utilisons ce champ pour attribuer l’image à son auteur, et ainsi savoir d’où elle provient. Ici, l’image choisie a été trouvé sur Wikimedia Commons et ce seul crédit suffit, mais souvent il vaut mieux indiquer le nom du photographe (ou de la personne l’ayant mise en ligne) et son crédit. Il vaut mieux mentionner la plateforme sur laquelle on a trouvé l’image : CC Flickr, Wikimedia Commons, Pixabay, etc. Si la photo est de moi, je mets : « Crédit Photo : Mon prénom ET mon nom »
  • inutile en revanche d’ajouter une légende pour les images mises en avant, car elle ne sera visible nulle part.

Une fois que vous avez rempli toutes ces informations, cliquez sur « sélectionner » pour mettre l’image en avant. Et voilà le travail ! Votre image en avant apparaît dans la barre à la droite de votre écran.

Et les images dans le corps du texte, alors ?

Pour insérer une image dans le corps de votre article, il vous faut ajouter un bloc (en cliquant sur le petit + en haut à gauche de l’image) et sélectionner « Image ».

Le bloc « image » s’affiche alors. Cliquez sur « Téléverser » : cela va me permettre d’accéder aux photos qui sont enregistrées sur mon ordinateur, et d’en choisir une à importer sur votre blog. En cliquant sur « Bibliothèque de médias », vous aurez accès à toutes les images que vous avez déjà importées précédemment.

Pour cet exemple, nous allons reprendre notre image libre de droit sur laquelle on voit un homme dessiner sur un écran IBM. Une fois que vous avez choisi votre image, elle apparaît à la suite de votre texte. Vous pouvez alors ajouter votre légende où vous ajoutez, si vous le jugez utile, des précisions sur l’image, ainsi que les crédits de la photo.

Vous pouvez aussi choisir de déplacer l’image pour qu’elle s’insère bien dans le texte, en fonction du sens que vous souhaitez lui donner. En cliquant sur la photo, vous avez une barre qui s’affiche et qui vous permet de placer la photo à gauche, au centre ou à droite. De manière générale, préférez toujours mettre votre photo au centre, cela évitera ainsi d’écraser votre texte. Il vous est également possible de changer les dimensions de l’image en « tirant » sur les petits ronds bleus sur les côtés de l’image.

En cliquant sur votre image, vous remarquerez que la zone située à droite de votre écran change, vous pouvez y ajouter un texte alternatif, comme pour une image mise en avant, et jouer aussi sur les dimensions de l’image.

Voilà, vous savez tout !

Pour plus d’aides et de conseils, n’hésitez pas à vous référer à nos autres tutoriels :

Mis à jour le 15 octobre 2019. 

Licence Creative Commons

Ce(tte) œuvre est mise à disposition selon les termes de la Licence Creative Commons Attribution – Pas d’Utilisation Commerciale 3.0 non transposé.

Partagez

Auteur

Commentaires

alteregofatim
Répondre

Merci Léo.