Come Aggiungere un Link a un'Immagine

Scarica PDF

Scarica PDF

In questo Articolo:

Scrivere il Codice HTML

Comprendere il Codice HTML

Articoli Correlati

Riferimenti

Con una sola riga di codice HTML, puoi aggiungere un'immagine su cui poter fare click a qualunque sito. Ti serviranno solo due informazioni per seguire questo metodo - l'URL dell'immagine e l'URL del sito web.

Passaggi

Metodo 1

Metodo 1 di 2:

Scrivere il Codice HTML

Scarica PDF

1. 
   1
   Crea un file HTML. Apri un editor di testo e crea un nuovo file. Salva il file come index.html.

   • Puoi usare l'editor di testo che preferisci, anche quelli predefiniti di Windows, Blocco Note, e Mac OS X, TextEdit.

   • Se vuoi usare un editor di testo specifico per l'uso con HTML, fai click qui per scaricare Atom, un programma disponibile per Windows, Mac OS X e Linux.

   • Se hai deciso di usare TextEdit, prima di iniziare a scrivere il file HTML, fai click sul menu Formato, e poi fai click su Solo Testo. Questa impostazione ti assicurerà che il file HTML sia caricato correttamente sui browser web.

   • I programmi di trattamento testi, come Microsoft Word, non sono adatti alla scrittura in HTML, perché aggiungono caratteri invisibili e formattazioni che possono creare problemi al momento della visualizzazione in un web browser.
2. 
   2
   Copia e incolla il codice HTML standard. Seleziona e copia il codice seguente, poi incollalo nel file index.html che hai aperto.
   

   <a href="URL DESTINAZIONE"><img src="URL IMMAGINE" /></a>
3. 
   3
   Trova l'URL di un'immagine. Trova un'immagine su Internet, fai click destro su di essa, poi, secondo il tuo browser, fai click su Copia URL immagine, Copia indirizzo immagine, o Copia posizione immagine.

   • Su Firefox e Internet Explorer troverai Copia posizione immagine. Su Chrome Copia URL immagine. Su Safari, Copia indirizzo immagine.
4. 
   4
   Aggiungi l'URL dell'immagine. Nel file index.html, fai click e trascina per selezionare URL IMMAGINE con il mouse, poi premi CTRL + V per incollare l'URL dell'immagine.
5. 
   5
   Aggiungi l'URL di destinazione. Nel file index.html, elimina URL DESTINAZIONE, poi digita http://www.google.com.

   • Puoi inserire l'URL che preferisci come URL di destinazione.
6. 
   6
   Salva il file HTML.
7. 
   7
   Apri il file HTML in un browser web. Fai click destro sul file index.html, poi aprilo con il browser web che preferisci.

   • Quando si apre il browser, se non vedi l'immagine, assicurati che il nome del file dell'immagine sia scritto correttamente nel file index.html.

   • Quando si apre il browser, se puoi leggere il codice HTML invece dell'immagine, hai salvato il tuo file index.html in formato rich text document. Prova a modificare il file HTML con un editor di testo diverso.
   Pubblicità

Metodo 2

Metodo 2 di 2:

Comprendere il Codice HTML

Scarica PDF

1. 
   1
   Impara a conoscere il tag ancora (anchor). Il codice HTML è composto da tag di apertura e di chiusura. Il tag <a href=""> è il tag di apertura, e </a> il tag di chiusura. Viene chiamato anchor tag e viene usato per aggiungere link alle pagine web.

   • Il tag <a indica al browser di creare un link. La parte href è l'abbreviazione di HTML reference (riferimento HTML), e l'= indica al browser di prendere tutto il testo contenuto tra " " e generare un link. Puoi inserire l'URL che preferisci tra le virgolette.
   • Il tag </a> indica al browser la chiusura dell'anchor tag.
   • Quando aggiungi del testo tra <a href=""> </a> quel testo comparirà come link su cui poter fare click su una pagina web. Ad esempio, <a href="http://www.google.com">Google</a> creerebbe un link alla pagina di Google.
2. 
   2
   Impara a usare il tag immagine. Il tag <img> è self closing, ovvero non ha bisogno di un corrispondente tag di chiusura. Puoi chiuderlo scrivendo <img src="" /> o <img src=""></img>.

   • Il tag <img indica al browser di creare un'immagine. La parte src è l'abbreviazione di source (sorgente), l'= indica al browser di prendere il contenuto tra " " e ottenere l'immagine da quella posizione.
   • La parte /> indica al browser di chiudere il tag immagine.
   • Ad esempio, il codice {{samp[|<img src="https://www.google.com/images/srpr/logo11w.png" />}} prende l'immagine all'URL specificato e la visualizza in un browser web.
3. 
   3
   Usa questo codice dove preferisci. Adesso che conosci il codice, puoi usare <a href="URL DESTINAZIONE"><img src="URL IMMAGINE" /></a> per aggiungere immagini su cui fare click in qualunque pagina web che può visualizzare codice HTML.
   Pubblicità