Hyperlinks


Wat doen Hyperlinks?

Hyperlinks | Webdesign KennisbankHyperlinks (of kortweg links) worden in het Nederlands; verbindingen of (snel)koppelingen genoemd. Het is een computer- en internetterm dat duidt op een verwijzing (referentie) in de hypertekst (broncode).

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 “hyper-documenten”. Het wereldwijde web bestaat tenslotte 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 of portal. Op deze index-pagina staat tevens de belangrijkste informatie van de website in de broncode vermeld.

Het Doel van Hyperlinks

Veel webmasters zijn zich niet bewust van het eigenlijke doel van hyperlinks in een web-tekst. 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.

Dat terwijl Hyperlinks in de eerste plaats bedoeld zijn om de lezer van een web-tekst houvast te bieden! Zo is een bezoeker benieuwd waar een tekst over gaat en waar een bepaalde link naartoe gaat, voordat hij de keuze maakt om op een 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 webpagina’s, maken informatie op het web simpelweg toegankelijk.

De hyperlink speelt ook een rol bij de werking van een zoekmachine. 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?

Hoe Codeer je een Hyperlink? | Webdesign KennisbankJe kunt ook het webadres, de weergave tekst en de tekenstijl of de kleur van een hyperlink bewerken. Datgene waarvan je een link wilt maken, zet je tussen twee link-tags, de openingstag (<a>) en de sluittag (</a>).

Dat wat er tussen deze twee tags staat, wordt daardoor vanzelfsprekend een link.

Een Hyperlink wordt in de Broncode als volgt aangeduid:

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

Zet je er een stukje tekst tussen, dan wordt het een tekst-link. Zet je er de HTML-code van een foto ertussen, 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.

Dit doe je met de code: href=””. Tussen de dubbele aanhalingstekens zet je de linkbestemming neer.

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.

De Vormgeving van Hyperlinks in CSS:

a {text-decoration: none;}
a:link {color: #0000ff; border-bottom: 1px solid #ff0000;}
a:visited {color: #0000ff; border-bottom: 1px solid #c0c0c0;}
a:hover {color: #000000; border-bottom: 2px dashed #dd0000;}
  • De eerste regel geeft aan, dat in de hyperlink verder geen stijl-decoratie is opgenomen.
  • De tweede regel geeft de kleur aan, dat de onderlijn gestreept doorloopt en de kleur van de lijn, die wordt weergegeven bij een onbezochte link.
  • De derde regel geeft de kleur van de tekst aan, de dikte van de onderlijn en dat deze gestreept doorloopt nadat de link is bezocht.
  • De vierde regel geeft de kleur aan, de dikte van de onderlijn en dat deze gestippeld is, samen met de kleur van de onderlijn, wanneer de muis zich over de hyperlink beweegt.

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 link-bestemming in een nieuw browservenster geopend moet worden, of dat het huidige venster wederom hergebruikt wordt. In dat laatste geval ‘verdwijnt’ dus de huidige pagina, en wordt in plaats daarvan de webpagina 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 aangeduid:

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

 

Back to Top