Online HTML handleiding deel 4: Hyperlinks

Een van de dingen die het web zo handig maken zijn de hyperlinks. Hyperlinks zorgen ervoor dat je met één muisklik naar een andere locatie kunt ‘surfen’. Die andere pagina kan zich op dezelfde server bevinden, maar ook aan de andere kant van de wereld. Je kunt zowel linken naar html-bestanden als mp3-bestanden, software, afbeeldingen enzovoorts.

Hoe maak ik zo’n hyperlink? We gebruiken hiervoor de tag < a >, van anchor. Deze tag op zich zegt niet veel. Een belangrijk attribuut in deze tag is “href”. Deze tag vertelt de browser welk document er geopend moet worden. Neem je bijvoorbeeld een link op naar pagina.htm, dan ziet de broncode er zo uit:

<a href="pagina.htm">Een link naar het bestand pagina.htm</a>

Zet het bovenstaande in de body van je pagina. Sla de pagina op en open hem in je browser. Wat gebeurt er nu als je op de hyperlink klikt? Je krijgt een foutmelding! Logisch natuurlijk, want het bestand pagina.htm bestaat nog niet. Maak daarom eerst een pagina die je pagina.htm noemt:

Dit is mijneerste website. Met <a href="index.htm">deze link </a> ga je weer terug naar de vorige pagina

Je kunt nu dus heen en weer surfen tussen de twee pagina's. Je begrijpt dat we hier heel veel mee kunnen doen.
Zoals je al gezien hebt, is datgene wat tussen &lt; a href="pagina.htm" &gt; en &lt; /a &gt; staat, de tekst die uiteindelijk als link op je site verschijnt. Vaak komt er dan een streepje onder en verandert die tekst van kleur.
<strong>Relatief en absoluut</strong>
Wat je hierboven ziet is een relatieve link. Nog een voorbeeld van een relatieve link is
[html]
<a href="mijnpagina.htm">Naar mijn pagina</a>

Relatieve links gebruik je om te linken naar pagina’s binnen jouw eigen website.

Verder zijn er ook nog absolute links. Daarmee geef je een link aan die niet per se binnen jouw web valt. Link je bijvoorbeeld naar deze pagina, dan doe je dat zo:

<a href="http://www.tijlvos.nl">Naar Tijl Vos zijn blog</a>

Verder kun je links opnemen naar bijvoorbeeld een e-mailadres. Klik je op zo’n hyperlink, dan opent de browser een nieuw e-mailbericht. In het veld waar het adres moet komen staat dan al het adres dat jij hebt opgegeven:

<a href=" mailto:mijnadres@mijnprovider.nl">Stuur mij een e-mail!</a>

Tenslotte kun je ook het onderwerp wat in de subject-regel moet komen te staan al aangeven in je link. Dat doe je met ‘subject’:

<a href="mailto:mijnadres@mijnprovider.nl ?subject=Website">Stuur mij een e-mail!</a>

About the Author

Ik ben Tijl Vos, een 22 jarige allround ondernemer, Internet-en hostingexpert met een passie voor online. In mijn werk als Freelance it’er en online marketing bij meerdere organisaties leef ik me uit op het vlak van (online) marketing en social media. E-mailmarketing, webcare, community management en (zoekmachinevriendelijk) schrijven voor het web.