Aide:Insérer une image

Un article de Wikipédia, l'encyclopédie libre.

Cette page d'aide est ici pour aider à l'insertion d'une image dans une page de Wikipédia. Pour savoir comment les télécharger sur les serveurs de la fondation, voir comment importer un fichier, et pour toutes les questions, voir le Bistro multimédia.
D · M

Sommaire

Où trouver les images ?

Avant de placer une image sur une page de Wikipédia, il faut qu'elle ait été préalablement téléchargée sur l'un des serveurs de la fondation Wikimedia Foundation, en général sur Wikimedia Commons, un projet parallèle, spécialisé dans les images libres de droits..

J'ai trouvé une image que je désire insérer dans un article de Wikipédia

Vous pouvez télécharger votre fichier ou un fichier provenant d'une autre Wikipédia. Néanmoins, attention, votre image ou photographie doit impérativement appartenir au domaine public, ou être régie par une licence libre, sinon, elle risque d'être supprimée sans avertissement quelconque.

Icône de détail Pour plus de détails voir : Aide:Importer un fichier.

Je recherche une image pour illuster un article

Il existe un outil pratique : Mayflower : Le moteur de recherche sur Commons (vous aurez plus de résultats en rédigeant les requètes en anglais, ou bien en latin pour les espèces biologiques).

Insérer une image dans une page

Illustration standard

En général, une syntaxe simple suffit pour placer votre image :

[[Image:Nom de l'image|thumb|légende à compléter]]

Ainsi, l'image apparaîtra avec une taille standard (180px par défaut) et se placera sur le côté droit de l'article, accompagnée en dessous de votre légende et d'une petite icône ( Image:Magnify-clip.png ) à droite servant à donner un lien vers l'image dans son format original. Pour mieux comprendre, voici un exemple simple :

[[Image:Pellicule.jpg|thumb|Une pellicule]]
Une pellicule
Une pellicule

Qui donne cette image (cf à droite) →

Et où

  • Image:Pellicule.jpg est le nom du fichier image.
  • thumb (attention ne pas mettre un T majuscule) permet de ne voir automatiquement qu'un aperçu réduit de l'image, entouré d'un cadre blanc. Par défaut thumb affiche une image de 180px mais chaque wikipédien inscrit est libre de modifier cette taille paramétrable dans les préférences. Sur les articles, l'utilisation du thumb est obligatoire.
  • Le texte de la légende est au libre choix du contributeur mais doit répondre à certains critères précis : n'être pas trop long et situer le contexte de l'image en une petite phrase pour le visiteur n'ayant pas accès aux images. Il est possible d'insérer des liens internes dans la légende.

Dans cet exemple il est souhaitable d'écrire en légende une phrase comme « Ruban de pellicule photographique ». Pensez notamment aux logiciels de synthèse vocale pour mal-voyants et à la consultation sur du matériel n'affichant que le texte.


L'illustration insérée ainsi convient parfaitement dans la plupart des articles mais on peut avoir, dans certains cas particuliers, besoin de modifier ou d'ajouter des paramètres :

Options de positionnement et de taille

Il est aussi possible de paramétrer son image en lui donnant une option de positionnement, et de taille.

  • Voici la syntaxe :
[[Image:Nom de l'image|thumb|positionnement|taille|légende]]
Syntaxe Rendu
thumb
Positionnement

right
left
center

Placer l'image à droite
Placer l'image à gauche
Placer l'image au centre
Taille

300px
200x200px
50

Différentes manières de paramètrer la taille de l'image,
la plus utilisée étant la première.
  • Voici un exemple :
[[Image:Pellicule.jpg|thumb|center|300px|Image plus grande et centrée.]]
Image plus grande et centrée.
Image plus grande et centrée.
Icône de détail Pour évaluer la taille d'une image : Aide:Taille des images.

Image dans une infobox

L'image de droite est insérée au code d'une infobox , appelée « taxobox », gérée par le Projet:Biologie.
L'image de droite est insérée au code d'une infobox , appelée « taxobox », gérée par le Projet:Biologie.

Les illustrations des articles sont placées souvent dans des fiches informatives, appelées « infobox » dans le langage wikipédien. Selon les modèles, le code Image: est parfois inutile, il suffit d'indiquer uniquement le nom de l'image. Par exemple Image:Pellicule.jpg. La taille n'est pas toujours paramètrable.

Vous pouver voir la liste des infobox et accéder au code utilisé par chaque modèle sur cette page : Wikipédia:Modèles/Infobox.

Problèmes d'image flottante

Parfois l'image ne se place pas à l'endroit où on le désire : elle est repoussée plus bas dans la page ou bien elle se chevauche avec un texte encadré ou un tableau. Si elle est placée à gauche dans un article, le texte qui l'entoure peut aussi devenir inesthétique, ou un titre de section se retrouver décalé à droite de l'image (exemple).

Pour empêcher ce flottement, juste après le placement de l'image, il est possible d'ajouter :

  • Pour que le texte soit repoussé sous l'image, il convient de placer le modèle {{Clr|left}} en dessous du code de l'image, si l'image est alignée à gauche de la page, ou {{Clr|right}} si l'image est alignée à droite de la page.
    • De manière plus générale, en plaçant {{Clr}}, tout ce qui se trouve au-dessous (texte, modèle, etc.) ne sera pas gêné par un problème de flottement.
  • Pour descendre le texte d'une distance déterminée, en pixels, il faut ajouter le modèle {{saut|...px}}
    • Note : ce dernier modèle est à éviter car le nombre de pixels choisi est fixe alors que le rendu final de la page varie selon la taille de l'écran.


Avant : le titre de section et le texte sont coincés entre l'image et la fiche descriptive.

Ajout de {{Clr|left}} : le titre de section et le texte se reportent sous l'image située à gauche. Mais pas sous la fiche descriptive qui est à droite.

Ajout de {{Clr}} : le titre de section et le texte se reportent plus bas que l'image de gauche et la fiche descriptive de droite.

Ajout de {{Saut|200px}} : le titre de section et le texte se décalent seulement plus bas de 200 pixels (exemple), sur le côté de l'image.
Information Cliquez sur une vignette pour l’agrandir.

Faire un lien vers une image

Il est possible de faire un lien vers une image au fil du texte. Il suffit de placer : après les [[.

  cette technique est interdite dans les articles, elle est réservée aux lieux de discussions et pages méta.

[[:Image:Nom de l'image]]
ou
[[Media:Nom de l'image]]

On a par exemple avec [[:Image:Pellicule.jpg]] ceci : Image:Pellicule.jpg
On a par exemple avec [[Media:Pellicule.jpg]] ceci : Media:Pellicule.jpg

Créer une galerie

Galerie à vignettes multiples : <gallery> </gallery>

Icône de détail Aide détaillée : Aide:Galerie.

Le logiciel MediaWiki permet la création d'une galerie pour illustrer un article. Elles sont souvent utilisées si beaucoup d'images sont disponibles. Par défaut, la galerie renverra les images à la ligne au delà de quatre images. Voir un exemple sur cet article.

  • Création assistée :

Une manière simple de créer une galerie est de cliquer sur le bouton Image:Btn_toolbar_gallery.png lors de l'édition d'une page, qui insère directement dans la zone de modification une galerie pré-faîte. Le modèle {{message galerie}} est automatiquement ajouté en même temps, pour indiquer au lecteur que le clic sur une image permet son agrandissement. Il ne vous reste alors plus qu'à la modifier en y substituant vos images et leur légende.


  • Voici la syntaxe :


<gallery>
Image:Image 1 | Sa légende
Image:Image 2 | Sa légende
Image:Image 3 | Sa légende
</gallery>

{{message galerie}}


Syntaxe Rendu


<gallery>
Image:Pellicule effet.jpg | N° 1
Image:Pellicule effet2.jpg | N° 2
Image:Pellicule effet3.jpg | N°3
</gallery>

{{message galerie}}

N° 1

N° 2

N°3

 Information  Cliquez sur une vignette pour l'agrandir.

Galerie à vignettes successives : {{Images}}

Icône de détail Aide détaillée : Modèle:Images.

Une manière plus esthétique d'insérer plusieurs images est l'emploi du modèle {{Images}}.

Exemples d'utilisation de ce type de galerie sur la page de description du modèle.

  • Voici sa syntaxe :


{{Images
| largeur = taille (300 par exemple)
| titre = Titre (Série d'images par exemple)
| align = position (center / right / left)
| Image:Nom de l'image 1 | Sa légende
| Image:Nom de l'image 2 | Sa légende
| ...
| Image:Nom de l'image 20| Sa légende
}}

Lien sur une image

Dans les articles : <imagemap>

Icône de détail aide détaillée en anglais : ImageMap.

Depuis 2007, grâce à l'extension ImageMap, il est possible de créer des liens sur une image, sur toute sa surface ou bien à des endroits précis et sur des zones de formes diverses. Ceci s'avère particulièrement utile, par exemple, pour cliquer sur différentes zones d'une carte.

Un lien général

Il est possible de ne faire qu'un lien sur l'intégralité de l'image.

  • Voici la syntaxe simplifiée :


<imagemap>
Image:Nom de l'image|..?..px|texte de remplacement
default [[ici lien vers un article]]
desc none
</imagemap>
Syntaxe Rendu


<imagemap>
Image:Cognac france map-fr.svg|150px|Carte des cognacs
default [[Cognac (eau-de-vie)]]
desc none
</imagemap>
Carte des cognacs
Ici, un clic sur n'importe quel endroit de la carte mène à Cognac (eau-de-vie)

Plusieurs liens

La surface de l'image peut comporter plusieurs zones cliquables (de formes diverses et paramétrables) qui renvoient chacune vers un article différent et le lien vers la page descriptive de l'image est placé au choix dans l'un des angles ou n'apparait pas.

NB : cette extension est complexe, et demande une certaine connaissance de la syntaxe

  • Voici la syntaxe générale :


<imagemap>
Image:Nom de l'image|taille de l'image|texte de remplacement
poly position-du-lien-1 [[lien-1]]
rect position-du-lien-2 [[lien-2]]
circle position-du-lien-3 [[lien-3]]
desc position-de-la-description
</imagemap>

Image: La première ligne d'une <imagemap> consiste à spécifier l'image qui sera utilisée, ainsi que sa taille. Elle utilise la même syntaxe que toutes les autres images, sans les [[]], et autre option de positionnement. Il n'y a pas de légende, mais un texte de remplacement au cas où l'image ne serait pas visible.

Le paramètre default utilisé pour une image n'ayant qu'un seul lien sur toute sa surface ne doit pas être utilisé dans ce cas.

Puis suit la liste des zones cliquables:
Attention, l'ordre des formes utilisées doit être conservé : d'abord tous les polygônes (poly) puis les rectangles (rect) et enfin les cercles (circle). Si deux zones se superposent, c'est la première dans l'ordre de la liste qui sera à l'avant-plan. Les coordonnées spécifiées sont données à partir de l'image en taille réelle, non avec la taille en pixels choisie sur la page encyclopédique.

Icône de détail Voir comment trouver les coordonnées des zones cliquables : Aide:Taille des images#Trouver les coordonnées pour imagemap.
poly 
Pour former un polygone. "Position-du-lien-?" est à remplacer par plusieurs nombres successifs séparés par un espace : Les coordonées des sommets sont données, suivies par un lien entre crochets
rect 
Pour former un rectangle. "Position-du-lien-?" est à remplacer par quatre nombres successifs séparés par un espace : Les paramètres sont les coordonnées de l'angle haut-gauche, vers l'angle du bas à droite, suivies par un lien entre crochets
circle 
Pour former un cercle. "Position-du-lien-?" est à remplacer par trois nombres successifs séparés par un espace : Les deux premiers paramètres définissent le centre, le troisième concerne le rayon du cercle, suivis par un lien entre crochets
desc 
Spécifie la location de l'icône bleu, avec un « i » qui assure le lien vers la page de description de l'image. Peut prendre les valeurs de top-right (haut à droite), bottom-right (bas à droite), bottom-left (bas à gauche), top-left (haut à gauche) ou none (aucune description).
  • Voici un exemple :
Syntaxe Rendu


<imagemap>
Image:Cognac france map-fr.svg|300px|Carte des cognacs
rect 500 30 30 300 [[La Rochelle]]
circle 700 550 100 [[Angoulême]]
circle 499 425 50 [[Cognac (Charente)]]
desc bottom-right
</imagemap>

 La Rochelle Angoulême Cognac (Charente)
Carte des cognacsÀ propos de cette image

Hors des articles : {{Lien sur icône}}

Il est aussi possible via le modèle {{Lien sur icône}} de faire un lien à partir d'une image.

  Ce modèle est interdit dans les articles, car il rend la page de l'image inaccessible, de même que sa licence et son auteur.

Pour se faire, voici la syntaxe générale, suivie d'un exemple :

{{Lien sur icône|image=Nom de l'image|largeur=taille en px|hauteur=taille en px|lien=nom de la page}}
Syntaxe Rendu

{{Lien sur icône|image=Pellicule.jpg|largeur=100px|hauteur=100px|lien=Projet:cinéma}}
Projet:cinéma



Voir aussi

Bienvenue

Contribuer

Demandes

Discuter

Pages à suivre

Règles

Donnez votre avis

Wikipédiens

Pages méta

Syntaxe • Catégories • Modèles • Tableaux • Formules TeX • Images

Lien interne • Note de bas de page • Lien externe • Lien interlangue
Lien ancré • Mise en page • Ressources libres de droit • Caractères spéciaux • Accents • Couleur