Aide:Comment insérer une image

Une nouvelle de Wikinews, la source d'informations que vous pouvez écrire.

Disponibilité d'une image[modifier | modifier le wikicode]

Où charger l'image ?[modifier | modifier le wikicode]

Sur fr.wikimedia.org, il n'est pas permis d'insérer une image se trouvant :

  • à une URL quelconque autre que sur Wikinews (ce qui pourrait, en effet, être imprudent...);
  • sur un autre wiki, par exemple sur fr.wikipedia.org. En revanche, il est toujours possible de placer des liens vers de telles images (voir plus bas). Notez que certains wiki's (nl.wikimedia.org ?) autorisent cette insertion; il s'agit dans ce cas d'une insertion rudimentaire sans possibilité de mise en page ou redimensionnement.

Wikinews francophone n'autorise les images que si elles proviennent d'une de ces deux sources :

  • de préférence sur Wikimedia Commons, si la licence le permet car les images placées sur Commons peuvent être réutilisées sur tous les projets wikimédia dans toutes les langues. Pour placer une image sur commons, vous devrez devenir un contributeur en créant un login. Votre login sur fr.wikinews.org n'y sera en effet pas reconnu mais il est en général possible d'enregistrer un login identique, à moins que votre nom d'utilisateur habituel ne soit déjà utilisé. Essayez d'utiliser le même sur les divers wikis où vous êtes actif;
  • la base de Wikinews francophone (fr.wikinews.org) depuis le lien Importer une image ou un son de la boîte à outils pour les cas particuliers de licence (voir l'article Wikinews:Fair use).

Vous pouvez également consulter Aide:Comment_importer_une_image pour la mise en pratique.

L'image envisagée est-elle déjà disponible?[modifier | modifier le wikicode]

Assurez vous qu'une image qui vous convient n'est pas déjà disponible. Voyez Aide:Galerie.

Pour consulter les images disponibles sur commons, vous pouvez aussi visiter Wikimedia Commons

L'image envisagée est-elle publiable?[modifier | modifier le wikicode]

Assurez vous que son chargement et sa diffusion ne présente pas de problème de droits d'auteur. Dans le doute, consultez Wikinews:Règles d'utilisation des images

Quelle différence entre les deux endroits?[modifier | modifier le wikicode]

Une fois disponible sur fr.wikinews.org ou sur commons, l'image se traite exactement de la même façon.

C'est pourquoi d'autres articles de l'aide évoquent simplement que l'image doit être disponible sur le serveur.

Catégories[modifier | modifier le wikicode]

N'oubliez pas de classifier généreusement vos images, elles seront plus facilement utilisables par les contributeurs des nombreux projets.

Voir Aide:Catégorie.

Faites des recherches (bouton rechercher) sur wikipédia ou sur commons concernant tous les éléments de l'image: le contexte, le thème, les objets visibles, l'auteur, tout ce qui vous parait judicieux.

N'hésitez pas à en mettre trop si vous êtes novice, d'autres wikipédiens allègeront derrière vous.

Syntaxe générale pour l'insertion d'une image[modifier | modifier le wikicode]

Image entière[modifier | modifier le wikicode]

[[Image:nom de l'image|options éventuelles|légende éventuelle]]

L'ordre des options n'a pas d'importance. En revanche, la légende (s'il y en a une) doit être placée en dernier.

Exemples avec une syntaxe correcte[modifier | modifier le wikicode]

La syntaxe suivante est correcte :

[[Image:image:Wikinews-logo.png|200px|left|Mon bel exemple]]

et l'effet est identique à celui obtenu par :

[[Image:image:Wikinews-logo.png|left|200px|Mon bel exemple]]

Exemples avec une syntaxe incorrecte[modifier | modifier le wikicode]

Les syntaxes suivantes sont incorrectes et citées ici car parfois essayées par les contributeurs débutants :

[[commons:Image:nom de l'image|options]]

En effet, une image sur commons se traite comme une image sur fr.wikinews.org et on ne doit, ni ne peut, préciser commons.

[[pt:Image:nom de l'image|options]]

En effet, une image sur pt.wikipedia.org n'est pas accessible directement. Le cas échéant, téléchargez-la depuis l'autre wiki, et rechargez-la sur fr.wikinews.org, ou, mieux encore, sur commons si la licence le permet.

[[Image:image:Wikinews-logo.png|Mon mauvais exemple|200px]]

En effet, si il y a, à la fois, une ou plusieurs options ainsi qu'une légende, celle-ci doit figurer après les options.

Solutions alternatives à l'insertion[modifier | modifier le wikicode]

L'insertion d'une image dans un article est normalement l'insertion d'une image se trouvant sur le serveur afin qu'elle soit immédiatement visible, et ce avec une mise en page contrôlée.

Il existe plusieurs alternatives. Toutefois, si vous contribuez à plusieurs wiki's différents, ou que vous recopiez des éléments d'un autre wiki, sachez, tout d'abord, que le comportement peut être différent d'un wiki à l'autre et même d'un projet wikimédia à l'autre.

le paramètre de configuration wgAllowExternalImages[modifier | modifier le wikicode]

wgAllowExternalImages=0 wgAllowExternalImages=1

Ce paramètre affecte exclusivement le comportement lorsqu'une URL est placée dans un article, sans être entourée de crochets.

Sur fr.wikipedia.org, la valeur est actuellement false. Elle est (actuellement ?) true sur nl.wikipedia.org. Si la configuration est modifiée sur un wiki, inutile de préciser que l'allure des pages se fiant à ce paramètre sera affectée...


Usage de [[Image:...[modifier | modifier le wikicode]

Ne s'utilise que pour une image qui est sur fr.wikimedia.org ou sur commons. Cette syntaxe est recommandée lorsque vous voulez faire apparaitre l'image. Elle fait l'objet de cet article.

[[Image:UbuntuCircle.jpg|right|75px|Ubuntu]] (l'image réduite apparaît à droite)

Usage de [[:Image:...[modifier | modifier le wikicode]

Ne s'utilise que pour décrire une image qui est sur fr.wikimedia.org ou sur commons ou sur un autre wikipedia. L'effet est un lien qui apparaît comme un lien interne.

Dans ce cas, il n'y a pas d'options (mais il peut y avoir une légende). En fait, il ne s'agit plus d'insérer une image mais, simplement de créer un lien (comme le suggère le caractère : initial dans :Image:). Cette alternative à l'insertion proprement dite évite le chargement d'images parfois lourdes (assurez l'accessibilité aux visiteurs qui ne disposent pas de connexion à haut débit; épargnez la bande passante) ou la construction de pages encombrées d'images qui ne sont pertinentes que pour une partie seulement des lecteurs.

Ne pas confondre avec [[Media:..., plus bas, qui s'utilise plutôt pour les téléchargements.

Exemples :

[[:Image:UbuntuCircle.jpg|image de la Chaîne Ubuntu (avec sa description)]]
[[:pl:Grafika:Ubuntu_Linux_Login.png|screenshot Ubuntu (avec sa description, pl)]]

Remarques :

Notez, dans l'exemple, l'usage du terme polonais Grafika en place de Image.

Usage de [[Media:...[modifier | modifier le wikicode]

Ne s'utilise que pour télécharger une image qui est sur fr.wikimedia.org ou sur commons. Ne pas confondre avec [[:Image:... plus haut.

Exemples :

[[Media:UbuntuCircle.jpg|télécharger l'image de la Chaîne Ubuntu (11ko, 300x300, jpg)]]

Options pour l'insertion[modifier | modifier le wikicode]

left[modifier | modifier le wikicode]

placer l'image à gauche

right[modifier | modifier le wikicode]

placer l'image à droite

center[modifier | modifier le wikicode]

placer l'image au centre

frame[modifier | modifier le wikicode]

placer l'image dans un cadre

caption[modifier | modifier le wikicode]

Ajouter une bordure et une légende à l'image.

image alignée sur le texte[modifier | modifier le wikicode]

Aligner l'image sur le texte, ainsi elle ne flottera pas à côté du texte.

changement de taille[modifier | modifier le wikicode]

exprimer la largeur d'affichage de l'image, en pixels.

Usage des options et de la légende[modifier | modifier le wikicode]

Alignement[modifier | modifier le wikicode]

Pour placer une image à gauche (ou à droite, ou au milieu), il faut ajouter l'option left (ou right ou center). Ainsi, pour placer l'image dont le nom est wiki-exemple.png à droite du texte la syntaxe sera :

[[Image:wiki-exemple.png|right]]


Cadre et légende[modifier | modifier le wikicode]

Comment insérer une légende
Comment insérer une légende

Il existe plusieurs façons d'insérer une légende : si l'on souhaite juste une info-bulle, il s'agit tout simplement d'ajouter la légende en tant que dernière option. Ainsi, l'image de gauche a été insérée avec

[[Image:wiki-exemple.png|left|Comment insérer une légende]]


Comment insérer une légende

Rajouter l'option frame permet d'obtenir, en sus, un joli cadre autour de l'image, et la légende sera toujours visible. Ainsi, l'image de droite a été insérée avec

[[Image:wiki-exemple.png|right|frame|Comment insérer une légende]]

Remarque : Cette dernière option est utile pour spécifier la source de votre image.

Changement de taille[modifier | modifier le wikicode]

La même jolie image qu'avant
La même jolie image qu'avant
Abou Simbel
Abou Simbel

Il s'agit simplement d'ajouter l'option nombre de pixelspx. (Les pixels sont comptés en largeur). Ainsi, les deux images suivantes ont été réduites à une largeur de 100 pixels par :

[[Image:wiki-exemple.png|right|100px|La même jolie image  qu'avant]]
[[Image:Abou Simbel.jpg|right|100px|Abou  Simbel]]

Attention : l'utilisation d'un cadre (option frame) force l'image à sa taille d'origine. La taille en pixels indiquée n'est alors plus prise en compte.


Thumbnail[modifier | modifier le wikicode]

Un thumbnail rajoute une bordure grise autour d'une image. L'image est affichée en plus petit ; elle est donc plus rapide à charger. Cela permet également de montrer aux utilisateurs qu'il existe une version plus grande de l'image. Vous pouvez aussi ajouter une légende à l'image.

[[Image:wiki-exemple.png|thumb|Cliquez ici pour avoir l'image en grand.]]
Cliquez ici pour avoir l'image en grand.


Caption[modifier | modifier le wikicode]

Il est intéressant de pouvoir ajouter une légende à l'image pour la décrire, par exemple. Cela implique que l'image aura besoin d'une bordure (frame en anglais).


Cependant, utilisez "thumb" au lieu de "frame" si vous voulez avoir une légende et redimensionner l'image. (Voir la section "Combiner différentes options" ci-dessous pour avoir un exemple)

Gallery[modifier | modifier le wikicode]

Consultez l'article francophone à ce propos.
Vous trouverez des renseignements complémentaires dans le tutorial anglophone.

Faire correspondre texte et image[modifier | modifier le wikicode]

Il peut arriver que, le texte qui est censé être proche de l'image étant trop court, l'image ne corresponde pas avec le texte. Pour y remédier, utilisez (en principe !) la commande HTML suivante :

  <br style=" clear : both ; " />

ou un des deux modèles ci-dessous

{{Clr}} {{Clear}} 

dont l'usage est détaillé à l'article Discussion_Modèle:Clr

Attention!!! à la suite d'un bug dans la version 1.5beta4 de mediawiki, 
et tant que ce bug ne sera pas corrigé, veillez à utiliser la syntaxe :
<br style="clear:both;" />
plutôt que :
<br style=" clear : both ; " />
car les espaces intermédaires sont actuellement (dans 1.5beta4) traités erronément.
--Marc M., Bruxelles (be) 20 août 2005 à 19:20 (CEST)


Remarque : ce n'est pas parce que la mise en page est agréable sur votre navigateur que ce sera le cas pour tout le monde... Il est donc recommandé d'ajouter une des commandes ci-dessus, par exemple à la fin de chaque section contenant une image. C'est le cas sur cette page.

Besoins particuliers[modifier | modifier le wikicode]

En attendant que l'article francophone ne soit terminé, le tutorial anglophone vous fournira divers cas pratiques.

Accessibilité[modifier | modifier le wikicode]

Pour faciliter l'accessibilité des mal-voyants, il est recommandé d'ajouter toujours une légende, ceci permet au lecteur vocal ou à la tablette braille de fournir un descriptif parlant, partout où il y a une image.

Avancé : configuration pour autoriser l'accès aux images externes[modifier | modifier le wikicode]

L'instruction de configuration correspondante (nécessite en général un accès root au serveur) est

# Whether to allow inline image pointing to other websites
$wgAllowExternalImages = true;

À lire impérativement avant de télécharger une image[modifier | modifier le wikicode]