Utente:Una giornata uggiosa '94/Sandbox 18

Markup immagini

Questa pagina di aiuto spiega come aggiungere immagini, illustrazioni e grafici alle voci enciclopediche di Wikipedia o alle pagine degli altri namespace.

Inserimento di un'immagine in una voce

modifica

Dopo aver caricato o trovato un'immagine su Wikimedia Commons o sulla Wikipedia in italiano, per inserirla in una voce basta scrivere:

[[File:Esempio.png|thumb|allinamento|Didascalia]]
  • Esempio.png è il nome con cui l'immagine è stata caricata (ad es. il nome di questa immagine è Colosseum in Rome, Italy - April 2007.jpg);
  • allineamento è l'indicazione relativa all'allineamento dell'immagine: sostituirlo con right per allinearla a destra, left per allinearla a sinistra e center per allinearla al centro (in quest'ultimo caso il testo non comparirà accanto all'immagine);
  • Didascalia è il breve testo che appare immediatamente sotto l'immagine e serve a descriverne il contenuto (es. Il Colosseo nell'aprile del 2007). La didascalia può contenere qualsiasi tipo di sintassi wiki, come grassetti, corsivi, wikilink e anche inclusioni di template (uno pensato appositamente per le didascalie è {{Legenda}}, utile se l'immagine è una cartogramma). Se il testo della didascalia è costituito da una sola frase o da un semplice nome non inserire un punto finale; se, viceversa, il testo che accompagna e descrive l'immagine è composito e composto da più frasi, osservare la normale punteggiatura adottata abitualmente per i testi.

Ad esempio, il codice:

[[File:Colosseum in Rome, Italy - April 2007.jpg|thumb|center|Il [[Colosseo]] nell'aprile del 2007]]

produce come risultato:

 
Il Colosseo nell'aprile del 2007
Note
  • Se l'allineamento non viene specificato (es. [[File:Esempio.png|thumb|Didascalia]]), l'immagine viene allineata automaticamente a destra.
  • Quando sia Commons sia Wikipedia in italiano contengono un'immagine con lo stesso nome, la precedenza andrà all'immagine di Wikipedia in italiano, che sarà quindi quella mostrata nella pagina.
  • In tutti gli esempi di questa pagina è usato il prefisso File: davanti al nome dell'immagine: al suo posto possono essere usati anche Immagine: o Image:, in modo del tutto indifferente.

Dimensioni

modifica

Le dimensioni a cui verrà visualizzata l'immagine saranno quelle impostate da ciascun utente nelle proprie preferenze (l'impostazione predefinita è 220 pixel di larghezza). Nel 90% dei casi non c'è motivo per utilizzare soluzioni diverse, tuttavia in casi particolari le dimensioni generate automaticamente possono non essere ottimali.

Upright

modifica

Il fatto che venga applicata la stessa larghezza a tutte le immagini, indipendentemente dalla loro altezza, ha come conseguenza che le imagini verticali (alte e strette) appaiono complessivamente più grandi delle altre: ad esempio, il codice

[[File:Field Hamois Belgium Luc Viatour.jpg|thumb|center|Tipica veduta di un campo in estate]]

diventa:

 
Tipica veduta di un campo in estate

che è piuttosto grande in confronto ad una qualsiasi immagine orizzontale, bassa e larga (come quella del Colosseo, più sopra). Per appianare questa differenza, alle immagini verticali è necessario aggiungere |upright: in questo modo, il codice

[[File:Field Hamois Belgium Luc Viatour.jpg|thumb|upright|center|Tipica veduta di un campo in estate]]

diventa:

 
Tipica veduta di un campo in estate

Upright, ovviamente, funziona anche per tutti gli altri tipi di immagini; usato con moderazione e in casi motivati, può tornare utile anche nel caso in cui, per motivi di spazio e di impaginazione, si ritenga necessario visualizzare un'immagine più piccola del solito.

Forzatura delle dimensioni

modifica

Nel caso di immagini ancora più strette e alte, l'azione di upright potrebbe non essere sufficiente. Ad esempio in questo caso, anche ricorrendo ad upright, l'immagine continua ad essere decisamente troppo grande:

[[File:Britannica Cornet Cornetto Muto.png|thumb|upright|center|Disegno di un [[cornetto muto]], tratto dall'[[Encyclopædia Britannica]]]]
 
Disegno di un cornetto, tratto dall'Encyclopædia Britannica

Oppure, si potrebbe presentare il caso opposto: l'immagine viene generata a delle dimensioni troppo piccole per distinguerne i particolari. È il caso, ad esempio, di molti grafici e diagrammi. Questa immagine di astronomia, ad esempio, per le dimensioni a cui è visualizzata perde gran parte del suo significato, poiché appare quasi come un riquadro nero:

[[File:Ursa Major and Ursa Minor Constellations.jpg|thumb|center|Le costellazioni dell'[[Orsa maggiore]] e [[Orsa minore|minore]]]]
 
Le costellazioni dell'Orsa maggiore e minore

Esclusivamente in questi due casi, è possibile forzare la larghezza delle immagini a delle dimensioni precise e fisse: per farlo, basta aggiungere |123px (dove 123 è la larghezza in pixel a cui deve essere mostrata l'immagine).

Nei casi di prima, forzando la larghezza rispettivamente a 25 e 500 pixel, si ottiene:

[[File:Britannica Cornet Cornetto Muto.png|thumb|25px|center|Disegno di un [[cornetto muto]], tratto dall'[[Encyclopædia Britannica]]]]
 
Disegno di un cornetto, tratto dall'Encyclopædia Britannica

e

[[File:Ursa Major and Ursa Minor Constellations.jpg|thumb|500px|center|Le costellazioni dell'[[Orsa maggiore]] e [[Orsa minore|minore]]]]
 
Le costellazioni dell'Orsa maggiore e minore

In qualsiasi altro caso la forzatura delle dimensioni va evitata: questo metodo, infatti, impedisce di fatto agli utenti che hanno esigenze particolari (ad esempio monitor particolarmente piccoli o connessioni ad Internet lente) di utilizzare la personalizzazione della larghezza delle immagini attraverso le preferenze; infatti, quando le dimensioni di un'immagine sono forzate, tale immagine verrà visualizzata sempre a quelle dimensioni, a prescindere da quanto specificato nelle preferenze personali. Inoltre l'utilizzo della forzatura porta spesso ad abusare di questa possibilità, scegliendo dimensioni che non tengono conto della leggibilità della pagina a risoluzioni più basse della propria.

Quando si forzano le dimensioni a dei valori superiori ai 350 pixel, è opportuno impostare sempre l'allineamento dell'immagine al centro, per evitare che la larghezza dell'immagine renda difficoltosa la lettura del testo circostante.

Quando l'immagine in questione ha bisogno di larghezze superiori ai 600 pixel per mostrare adeguatamente i suoi dettagli, è più appropriato utilizzare il template:Immagine grande, che consente di scorrerla orizzontalmente (permettendo così di evitare problemi di impaginazione a chi utilizza risoluzioni basse).

Ad esempio, per visualizzare l'immagine Chicago.jpg alla larghezza di 1500 pixel:

{{Immagine grande|Chicago.jpg|1500px|Panorama di [[Chicago]]}}
Panorama di Chicago

Gallerie di immagini

modifica
  Lo stesso argomento in dettaglio: Aiuto:Manuale di stile § Gallerie.

Quando le immagini sono molte e/o non c'è abbastanza spazio per posizionarle normalmente a lato del testo, è possibile impaginarle sotto forma di galleria. La sintassi da usare è la seguente:

<gallery>
File:Esempio.png|Didascalia
File:Esempio.png|Didascalia
</gallery>

dove Esempio.png è il nome con cui l'immagine è stata caricata, mentre Didascalia è il testo che compare al di sotto di essa.

Esempio:

<gallery>
File:CygneVaires.jpg|Cigno reale (''Cygnus olor'')
File:Tyto alba 1 Luc Viatour.jpg|Barbagianni (''Tyto alba'')
File:Lion waiting in Namibia.jpg|Leone (''Panthera leo'')
File:Eichhörnchen Düsseldorf Hofgarten edit.jpg|Scoiattolo rosso (''Sciurus vulgaris'')
File:Oryctolagus cuniculus Tasmania 2.jpg|Coniglio europeo (''Oryctolagus cuniculus'')
File:Clown fish swimming.jpg|Pesce pagliaccio (''Amphiprioninae'')
</gallery>

Altri template utili

modifica
modifica

Nelle discussioni o in altri contesti può essere utile inserire un link alla pagina di descrizione dell'immagine. Per farlo, basta aggiungere i due punti (:) subito dopo le parentesi quadre di apertura. Se dopo il nome del file si inserisce una barra verticale (|), il testo del link conterrà solo il nome dell'immagine (senza il prefisso File:, Immagine: o Image:); se dopo la barra verticale si scrive qualcosa, tale testo sarà utilizzato come testo del link. Ad esempio:

[[:File:Fiat Grande Punto Dreitürer Carribeanorange.JPG|Questa immagine]] è migliore di [[:File:Fiat Punto 2006 silver vr.jpg|]], ma secondo me il migliore di tutti è il [[:file:Fiat Grande Punto 20090906 front.JPG]].
Questa immagine è migliore di Fiat Punto 2006 silver vr.jpg, ma secondo me il migliore di tutti è il file:Fiat Grande Punto 20090906 front.JPG.

Inserimento avanzato di un'immagine

modifica
 
Attenzione

Questa parte della pagina è per utenti esperti: le indicazioni da qui in poi riportate devono essere utilizzate solo per scopi particolari (ad esempio, scrittura di template o pagine di servizio). Se vuoi solo inserire immagini nelle voci, puoi fermarti a leggere qui.

In sostanza, per far apparire un'immagine è necessario inserire il suo nome preceduto e seguito dalle doppie parentesi quadre, come un collegamento interno (wikilink). A questa sintassi basilare si aggiungono alcuni parametri, utili per adattare la visualizzazione alle proprie esigenze.

Tipi di visualizzazioni//Bordi e cornici

modifica

Il thumb, che abbiamo utilizzato sopra, non è l'unico tipo di bordo applicabile a un'immagine. Gli altri sono:

  • nessuna indicazione: senza indicare nulla (es. [[File:Esempio.png|allineamento|Didascalia]]) l'immagine viene visualizzata senza alcun riquadro o bordo. Con questo tipo di visualizzazione, a differenza del thumb, l'immagine verrà visualizzata alla risoluzione originale con cui è stata caricata (senza essere ridimensionata), a meno che le dimensioni non vengano forzate; inoltre l'allineamento di default è in linea con il testo[non chiaro];
  • border: come nessuna indicazione, ma aggiunge un semplice bordo di 1 pixel. È particolarmente utile, ad esempio, per le bandiere;
  • frame, framed o enframed: come thumb, ma visualizza sempre l'immagine alla risoluzione originale con cui è stata caricata (senza ridimensionarla), e ignora qualsiasi indicazione relativa alla dimensione (compresa la forzatura).

Due esempi: la stessa immagine senza nessuna indicazione e con frame:

[[File:Citrus paradisi (Grapefruit, pink) white bg.jpg|center|200px|Due pompelmi rosa]] [[File:Citrus paradisi (Grapefruit, pink) white bg.jpg|border|center|200px|Due pompelmi rosa]]
 
Due pompelmi rosa
 
Due pompelmi rosa

Nessuna indicazione

modifica
  • La didascalia non c'è, solo testo alternativo

Per ottenere un piccolo bordo (o cornice), è necessario specificare il parametro opzionale border che fa sì che l'immagine venga visualizzata con un piccolo bordo grigio intorno a essa.

L'opzione frame permette di inserire un'immagine nelle sue dimensioni originali. Il frame è compatibile con le didascalie e l'allineamento. Ogni tipo di ridimensionamento verrà ignorato.

  • thumb=xyz

thumbnail o thumb

Allineamento

modifica
  • Allineamento none!!

Dimensioni

modifica

Autodimensionamento

modifica

Forzatura delle dimensioni

modifica

Specificazione delle dimensioni massime di larghezza e altezza

modifica

È possibile anche definire l'altezza dell'immagine usando il formato AAAxBBBpx, che permette di mostrare l'immagine con una dimensione massima di AAA pixel di larghezza o BBB di altezza, sempre mantenendo le proporzioni.

Qui sotto tre esempi di immagini di diverse forme e proporzioni impostate alle stesse dimensioni massime (150x100 pixel); nessuna delle tre supera i 150 pixel di larghezza o i 100 di altezza.

[[File:Glass is Liquide.jpg|center|150x100px]] [[File:Rubik's cube.svg|center|150x100px]] [[File:Hobo stove convection 2.jpg|center|150x100px]]
 
 
 

Didascalie e testo alternativo

modifica
  Lo stesso argomento in dettaglio: Aiuto:Testo alternativo per le immagini.

In tutte le immagini può essere specificato un breve testo descrittivo, che verrà utilizzato come testo alternativo (ossia verrà visualizzato al posto dell'immagine nel caso ci fossero problemi nel suo caricamento). Il testo alternativo dev'essere l'ultimo parametro prima delle parentesi quadre di chiusura.

È caldamente consigliato corredare ogni immagine con un testo descrittivo, per consentire a tutti una maggiore accessibilità.

In modalità thumb, tale testo sarà utilizzato automaticamente anche come didascalia. Volendo specificare un testo alternativo diverso dalla didascalia, è possibile usare il parametro |alt=; ad esempio:

[[File:Stromboli Eruption.jpg|thumb|center|alt=Alcuni lapilli escono dal cratere principale del vulcano|L'eruzione dello Stromboli del 1980]]

ha come didascalia "L'eruzione dello Stromboli del 1980", ma come testo alternativo "Alcuni lapilli escono dal cratere principale del vulcano".

Tutte le immagini linkano automaticamente alla propria pagina di descrizione. Per cambiare la destinazione di tale link, si può usare il parametro |link=xyz, dove xyz è il nome della pagina di Wikipedia o l'URL esterno a cui deve puntare il link; se al posto di xyz non viene inserito nulla, l'immagine non conterrà alcun link. Ecco alcuni esempi:

[[File:Flag of Italy.svg|border|center|80px|link=Italia]] [[File:Commons-logo.svg|center|40px|link=:commons:Commons:Immagini in vetrina]]
 
 


[[File:W3C valid.svg|center|50px|link=http://validator.w3.org]] [[File:Warning.svg|center|40px|link=]]
 
 

Attenzione a non abusare di questo parametro: il link alla pagina di descrizione, infatti, ha anche la funzione di accreditare l'immagine al suo creatore, condizione richiesta da alcune licenze: in mancanza di tale condizione si può cadere nella violazione di copyright.

modifica

Il tag gallery può essere personalizzato con 4 parametri:

  • caption=xyz: imposta il titolo della gallery.
  • widths=123px: imposta la larghezza delle immagini.
  • heights=123px: imposta l'altezza massima delle immagini.
  • perrow=123: imposta il numero di immagini per ogni riga (il default è quattro).
modifica

Per generare un link all'immagine nelle sue dimensioni originali, basta utilizzare il prefisso Media:: anche in questo caso il nome del file può essere seguito da una barra verticale, |, ed eventualmente da un testo. Se è presente solo la barra verticale, viene eliminato il prefisso 'Media:' e visualizzato solo il nome del file; se presente, il testo che segue la barra verticale viene visualizzato al posto del nome dell'immagine.

Esempio:

[[Media:Apollo 4 Saturn V, s67-50531.jpg|Razzo Saturn V]] – [[Media:Apollo 15 flag, rover, LM, Irwin.jpg|]] – [[Media:Space Shuttle Challenger (04-04-1983).JPEG]]
Razzo Saturn VSpace Shuttle Challenger (04-04-1983).JPEGMedia:Apollo 15 flag, rover, LM, Irwin.jpg

Pagine correlate

modifica