Prima di creare un collegamento in HTML, è necessarioper capire cos'è e quali tipi sono. Qualsiasi collegamento inizia con il tag <a> e termina con il tag </a>. All'utente viene mostrato solo ciò che si trova tra questi tag. Il browser non mostra il collegamento stesso. Può essere visualizzato al passaggio del mouse nella barra di stato.
Tutti i collegamenti possono essere suddivisi secondo diversi criteri e tipologie. Ad esempio, i collegamenti possono essere suddivisi per scopo:
- all'interno del documento;
- a un'altra pagina web;
- a vari file;
- a indirizzi postali.
Inoltre, il 2 ° e il 3 ° elemento possono essere suddivisi in indirizzi assoluti e relativi. Ne parleremo più avanti. Consideriamo ora il caso più semplice.
Come creare un collegamento in HTML? Per fare ciò, puoi aprire il blocco note o qualsiasi altro editor e riscrivere il codice sopra.
Il risultato sarà il seguente.
In cosa consiste il collegamento?
Ricorda che ogni link deve avere:
- tag di apertura e chiusura;
- testo del collegamento;
- l'attributo href, che specifica l'URL a cui verrà indirizzato l'utente.
Come puoi vedere, nella prima immagine, il link è pages / about.html. Questo è un collegamento relativo. Nell'immagine sopra, il collegamento inizia con http: //. In questo caso, viene utilizzato un riferimento assoluto.
Se non specifichi un tag di chiusura, allora tuttoquanto segue sarà anche una continuazione di questo collegamento. Stai attento. Quando scrivi il codice, includi immediatamente i tag di apertura e chiusura. È più sicuro in questo modo.
Come trasformare un'immagine in un collegamento in HTML?
Invece del testo nei tag <a> ... </a>, puoi specificare le immagini. Cioè, se l'utente fa clic sull'immagine, seguirà il tuo collegamento.
Questo metodo viene utilizzato molto spesso. Soprattutto nei menu di siti bellissimi. I progettisti di layout pensano sempre a come creare un collegamento a una pagina in HTML prima di creare un progetto wireframe. Più precisamente, in quale forma fare tutto. Vengono utilizzati tutti i metodi di proprietà del webmaster. Consideriamo il design un po 'oltre.
Come collegarsi a un file in HTML?
I collegamenti ai file possono essere specificati nell'attributo href. Questo di solito accade quando viene indicato un collegamento per scaricare un file (archivio, film, musica, libro, file di testo e così via).
In altre parole, puoi specificare qualsiasi cosa nell'indirizzo. Se non è una pagina web, il browser proverà a scaricarla.
Collegamenti all'interno della pagina
Sicuramente l'hai visitato almeno una volta"Wikipedia". C'è il contenuto dell'articolo. E quando fai clic su un elemento, vieni indirizzato al sottotitolo corrispondente. Tali collegamenti sono chiamati collegamenti all'interno di un documento o segnalibri.
Come collegare all'interno di una pagina in HTML?
È tutto molto semplice. Indichiamo i link nel testo con l'attributo <a>, ma non specifichiamo href. È necessario scrivere l'attributo name e impostare un nome univoco all'interno del documento. E nel punto in cui indichi i collegamenti a queste note all'interno del documento, nell'attributo href scriviamo prima un hash e poi quel nome univoco.
Non appena il browser vede il simbolo # nell'indirizzo, capisce che è necessario fare riferimento a qualche elemento all'interno dello stesso documento.
Collegamenti email
A volte è necessario fornire un collegamento alla tua email. Si può fare così.
Dopo aver fatto clic su questo collegamento, l'utentesi aprirà l'applicazione di gestione della posta. Di solito è Outlook standard. Ma questo programma di solito non è configurato da nessuno. Pertanto, di solito l'indirizzo e-mail viene semplicemente indicato nel testo.
attributi
Se hai capito come creare un collegamento in HTML, si consiglia di studiare gli attributi rimanenti del tag <a>. Questa è un'informazione molto importante. Consideriamo quelli più basilari:
- L'attributo del titolo: crea una descrizione comando quando si passa con il mouse su un collegamento. È abbastanza conveniente. Ciò consente di fornire ulteriori informazioni all'utente.
- L'attributo target è dove verrà caricato il nuovo documento (pagina web). Può avere i seguenti valori:
- _blank: si aprirà una nuova finestra del browser;
- _self - si apre nella finestra corrente, questo è il valore predefinito, è opzionale;
- _parent - caricamento nel frame genitore, se non ce ne sono, l'attributo assume valore_self;
- _top: annulla tutti i frame e carica la pagina alle dimensioni del browser. Se non ci sono frame, allora c'è un'analogia con _self.
- Scarica attributo. Grazie ad esso, puoi forzare il download del file specificato nell'attributo href. Questo parametro non ha valore. Specifichiamo solo <a download href="img/photo.jpg"> Link al file </a>. Se non specifichi scarica, quindi il browser aprirà semplicemente la foto. In questo caso, inizierà il download sul tuo computer.
Link design
Se hai capito come creare un collegamento in un'immagineHTML, è consigliabile anche assicurarsi che appaia normale. Per impostazione predefinita, intorno all'immagine viene visualizzato un bordo, che è un collegamento. Sembra scortese e brutta. Poiché il suo spessore è di 3 pixel.
Per evitare ciò, è necessario specificare border = "0". Cioè, il bordo sarà uguale a zero. Questo collegamento dall'immagine sembrerà carino e accettabile. Altrimenti, spaventerai tutti i visitatori del sito.
conclusione
I link sono, a prima vista, un tag molto semplice. Ma se vai più in profondità e consideri tutti i tipi di collegamenti e attributi, si scopre che non tutto è così facile e senza nuvole.
Ricorda, i collegamenti sono la spina dorsale del World Wide Web. Senza di loro, non esisterebbe.