Hyperlinks

Hyperlinks | Webdesign Kennisbank

Hyperlinks (of kortweg links), in het Nederlands; verbindingen of koppelingen genoemd, is een computer- en internetterm, die duidt op een verwijzing (referentie) in de hypertekst van een website.

Deze kan de gebruiker dan volgen om naar een ander webadres te surfen. Een hyperlink is vaak een stukje tekst, maar kan ook een afbeelding of enig ander HTML-element zijn.

Veel hypertekst, is te verdelen in onafhankelijk onderhouden verzamelingen “hyper-documenten”, want het wereldwijde web bestaat nu éénmaal voor een groot deel uit websites. Hyperlinks zijn als het ware de ‘lijm’ van het internet, waarmee alle webpagina’s aan elkaar verbonden zijn.

Deze documenten hebben meestal een algemene voorpagina (de hoofdpagina van een website). Een bekende term voor zo’n hoofdpagina is; index. Op deze index-pagina staat tevens de belangrijkste informatie van de website in de broncode vermeld.

Wat is het Doel van een Hyperlink?

Veel webmasters zijn zich niet bewust van het eigenlijke doel van hyperlinks in een webtekst. Ze plaatsen de links vaak te pas en te onpas in een tekst, waardoor de bezoeker op de website, in de war raakt en niet meer weet op welke links hij nou moet klikken of niet. En dat terwijl hyperlinks in de eerste plaats bedoeld zijn om de lezer van een webtekst houvast te bieden!

De websitebezoeker wil vaak eerst weten waar een tekst over gaat en waar een bepaalde link naartoe gaat, voordat hij de keuze maakt om op de link te klikken. Daarom is het handig om eerst de belangrijkste boodschap te vertellen, en de bezoeker daarna pas uit te nodigen om verder te klikken.

Hyperlinks tussen websites en tussen pagina’s binnen een website, maken informatie op het web simpelweg toegankelijk. De hyperlink speelt ook een rol bij de werking van zoekmachines. Hoe meer er naar een site wordt gelinkt, hoe hoger deze vindbaar is bij gerelateerde zoektermen in Google.

Het werven van meer links om de positie in zoekmachines te verbeteren heet linkbuilding. Naast koppelingen naar webpagina’s kun je koppelingen maken naar bestaande of nieuwe bestanden op de computer, e-mailadressen en specifieke locaties in een document.

Hoe Codeer je een Hyperlink?

Hyperlinks | Webdesign KennisbankJe kunt ook het webadres, de weergavetekst en de tekenstijl of de kleur van een hyperlink bewerken. Datgene waarvan je een link wilt maken, zet je tussen 2 link-tags, de openingstag (<a>) en de sluittag (</a>). Dat wat er tussen deze 2 tags staat, wordt daardoor een link.

Een hyperlink wordt in de broncode als volgt aangegeven;

<a href=”http://webdesignkennisbank.nl/”>Webdesign Kennisbank</a>

Zet je er een stukje tekst tussen, dan wordt het een tekstlink, zet je er de HTML-code voor een foto tussen, dan wordt die foto een link waar je op kunt klikken. In de openingstag van de link zet je neer wat de linkbestemming is, dus waar je bezoeker naartoe geleid moet worden als hij op de link klikt. Dat doe je met de code: href=””. Tussen de dubbele aanhalingstekens zet je de linkbestemming neer.

Zo link je van je homepage naar een contact.php-pagina;

<a href=”contact.php”>Contact</a>

Hoe Bewerk je een Hyperlink?

In de openingstag van de link kun je ook nog neerzetten of de linkbestemming in een nieuw browservenster geopend moet worden, of dat het huidige venster wederom gebruikt kan worden.

In dat laatste geval ‘verdwijnt’ dus de huidige pagina, en wordt in plaats daarvan de pagina van de link-bestemming vertoond als je op de link klikt. Vind je dat prima, dan hoef je verder niets te doen.

Maar als je wilt dat er een nieuw browservenster geopend moet worden, dan moet je in de openingstag ook nog de volgende code neerzetten: target=”_blank”.

Een externe hyperlink wordt in de broncode als volgt aangegeven;

<a href=”http://webdesignkennisbank.nl/” target=”_blank” >Webdesign Kennisbank</a>

Diverse Stijleigenschappen;

De weergave van hyperlinks kun je het makkelijkst aangeven met behulp van een stylesheet (CSS). Behalve de kleur zijn er dan ook andere mogelijkheden, zoals het lettertype, de lettergrootte, wel of niet onderstreept en een achtergrondkleur.

Dit met de stijleigenschappen color, font-family, font-size, text-decoration en background-color.


Graag verwijs ik je naar de volgende webadressen over Hyperlinks;

Hyperlink Code 3Schools | HTML Links Wikipedia | Hyperlink