15
Relatieve hyperlinks: linken binnen je site
3 reacties | Geschreven door Bas in Website planning
Recentelijk verscheen op Webbish een artikel over hyperlinks. In dit artikel kwam ook kort het onderwerp relatieve links aan bod. Dit zijn hyperlinks die naar een andere pagina binnen hetzelfde domein of site staan. Heel handig, want zo kan je de site niet alleen op het internet testen, maar ook op andere domeinen of op je eigen computer. Relatieve links zijn erg eenvoudig te maken, je moet alleen even de truc doorhebben. En die krijg je in dit korte maar handige artikel!
Voor internetadressen wordt, in tegenstelling tot Windows, gebruikt gemaakt van zogenaamde forward slashes (/). Zo ook bij het maken van relatieve hyperlinks. Wanneer je dus van Windows gebruikt maakt, moet je bij het maken van relatieve adressen dus opletten dat je de slashes net andersom dan in de adresbalk van Windows Verkenner opschrijft. Websites maken net zoals het computersysteem gebruik van een mappensysteem. Voor een bestand wat dan een map dieper ligt is het maken van een verwijzing dus niet erg moeilijk:
<a href="mapnaam/bestandsnaam.html">Link</a>
Je kan zoveel mappen in elkaar maken als je wilt:
<a href="adres/met/heel/veel/mappen.html">Link</a>
Maar op de pagina's die met deze hyperlinks worden gelinkt is het handig als je ook weer terug kan linken. Deze links komen er dan zo uit te zien:
<a href="../index.html">Link</a> <a href="../../../../index.html">Link</a>
Zoals je in deze voorbeelden kan zien betekenen twee puntjes gevolgd door een slash forward (../) dus dat je een map omhoog gaat. Mensen die wel eens met een commandoregel hebben gewerkt zal dit vertrouwd overkomen. Je kan ook alles combineren. Als je bijvoorbeeld van het eerste voorbeeld naar het tweede voorbeeld wil, krijg je dit:
<a href="../adres/met/heel/veel/mappen.html">Link</a>
Je moet dus eerst omhoog naar de eerste gemeenschappelijke map, en vanaf daar weer de mappenstructuur vervolgen. In dit voorbeeld is dat toevallig ook de map waar de homepage in staat, maar het kan ook anders zijn. Er is ook nog een trucje om veel gedoe met deze lange adressen te vermijden. Daarover zal binnenkort meer verschijnen op Webbish.
Related posts:
3 Comments for Relatieve hyperlinks: linken binnen je site
Ger | 17 November 2009 at 09:11
Bas | 17 November 2009 at 22:02
Bedoel je de manier met het <base>-element? Die wil ik namelijk nog op een later tijdstip in een artikel uitwerken.
Ger | 24 November 2009 at 08:24
Nee, dat bedoel ik niet. Ik bedoel het volgende:
Stel, je site heeft een map root/misc, een map root/2008/jan, een map root/2009/feb en een map root/2010/mrt voor bestanden voor volgend jaar. In die jaartal- en maandmappen staat veel gelijkende informatie, met alleen details voor dat jaar. De map misc bevat scripts, stylesheets en weet ik wat allemaal. Ongeacht in welke jaartal-/maandmap je zit, zul je informatie uit die map misc moeten halen. Volgens jouw beschrijving is de enige oplossing om de ene keer met links te verwijzen via '../misc/' en de andere keer via '../../misc/'. Je kunt er ook voor kiezen om voor zowel maand als jaarmappen te linken naar '/misc/'. Doordat het pad begint met een slash, zal in de rootmap gezocht worden. Het is dus geen relatief, maar een absoluut pad op dezelfde server.
Ik mis hier een stuk over een absoluut pad binnen je site, wat soms ook erg handig kan zijn. Bijvoorbeeld linken naar "/map/bestand.html". Als je zeker weet dat hetgeen waar je naar linkt die locatie blijft houden en je weet dat niet zeker van het bestand waarvandaan je linkt, is dit de manier om een goede link te maken.
Gr. Ger