Collegamenti (link) tra le pagine.
- Un elemento semplice, con un solo attributo che ti permetterà di fare un link a qualsiasi cosa.
Qui c'è un esempio di come appare un link ad una pagina esterna al nostro sito:
Esempio 1:
<a href="http://www.istcompazzanox.it/">Questo è il link alla nostra scuola</a>
NOTA: La frase "Questo è il link a HTML.net" è il testo che viene mostrato sul browser come link.
Cosa significa "a href"?
L'elemento a è l'abbreviazione della parola inglese "anchor" (ancora), mentre l'attributo href sta per "hypertext reference" (cioè, riferimento ipertestuale), che specifica dove deve portare il link - tipicamente un indirizzo su Internet o un nome di un file.
L'indirizzo completo di un sito viene chiamato URL (Uniform Resource Locator).
Nota che "http://" deve essere sempre inclusa in una URL.
La frase "Questo è il link a HTML.net" è il testo che viene mostrato sul browser come link.
Ricordati di chiudere l'elemento con il tag di chiusura </a>.
Link alle pagine interne di un sito
- Bisogno di specificare in dettagli l'intero indirizzo (URL) del documento.
Per esempio, se hai fatto due pagine (chiamiamole pagina1.htm e pagina2.htm) e le hai salvate nella stessa cartella.
Esempio 2:
<a href="pagina2.htm">Fai click qui per andare alla pagina 2</a>
Invece, se la pagina 2 è posizionata in una sottocartella (chiamata "sottocartella"), allora il link dovrebbe apparire come questo:
Esempio 3:
<a href="sottocartella/pagina2.htm">Fai click qui per andare alla pagina 2</a>
Al contrario, se il link è diretto dalla pagina 2 (nella sottocartella) alla pagina 1, si vedrà come segue:
Esempio 4:
<a href="../pagina1.htm">Un link alla pagina 1</a>
-----------------------------------------------------------------------------------------------
Link interni alla pagina
Puoi creare anche dei link interni alla stessa pagina - per esempio un sommario in cima alla pagina che punta a ciascuno capitolo sotto. Tutto quello che ti serve è utilizzare un utilissimo attributo chiamato id (identification, identificativo) e il simbolo "#".
Usa l'attributo id per marcare l'elemento che vuoi linkare. Per esempio:
<h1 id="heading1">Titolo 1</h1>
Adesso puoi creare un collegamento a quell'elemento usando "#" nell'attributo del link. La gratella "#" deve essere seguita dall' id del tag che vuoi linkare. Per esempio:
<a href="#heading1">Link a titolo 1</a>
Tutto sarà più chiaro con una pagina HTML di esempio:
<html>
<head>
</head>
<body>
<p><a href="#heading1">Link a titolo 1</a></p>
<p><a href="#heading2">Link a titolo 2</a></p>
<h1 id="heading1">titolo 1</h1>
<p>Testo testo testo testo</p>
<h1 id="heading2">titolo 2</h1>
<p>Testo testo testo testo</p>
</body>
</html>
------------------------------------------------------------------------------------------------
Link ad indirizzo mail
Esempio 6:
<a href="mailto:nobody@html.net">Manda una e-mail a nobody a HTML.net</a>
sul browser apparirà così:Manda una e-mail a nobody a HTML.net
L'unica differenza tra un link ad una e-mail e un link ad un file è che invece di digitare l'indirizzo di un documento, scriverai mailto: seguito dall'indirizzo di e-mail.
Quando viene fatto click sul link si aprirà il programma di posta elettronica con un nuovo messaggio vuoto e l'indirizzo di e-mail specificato.
Nota che questo funziona solo se sul tuo computer è stato istallato un programma di posta. Fai una prova!
-----------------------------------------------------------------------------------------------
Altri Attributi dei Link
Puoi anche mettere un title al tuo link:
Esempio 7:
<a href="http://www.html.net/" title="Visita HTML.net e impara l'HTML">HTML.net</a>
L'attributo title viene usato per inserire una breve descrizione al link. Se posizioni il cursore del mouse sopra il link - senza cliccare - vedrai apparire il testo "Visita HTML.net e impara l'HTML".
