XHTML: hypertext

3. Hypertextlänkar

Hypertextlänkar är det som gör Internet till den navigerbara informationskälla den är. Genom att i ett stycke text ange en kod till vilket dokument eller del i dokument vi vill förflytta oss till, kan vi enkelt förflytta oss mellan olika, eller inom samma, dokument.

Anchor: <a></a>

A-taggen är den tagg som innehåller informationen om till vilket dokument användaren kommer om han/hon väljer att klicka på en länk. Den text som befinner sig mellan taggarna är den text som kommer att markeras som länktext. Dock räcker det inte med att sätta två a-taggar runt en text för att det ska leda till någon funktionalitet, det behövs också något attribut som talar om till vilket dokument förflyttningen ska ske. I normalfallet används href-attributet.

Ex.

<body>
   Detta är alltså en
      <a href="ett_dokument">
         länk
      </a>
   till någon sida
</body>

ger utskriften:

Det här är alltså en länk till någon sida

Relativa länkar

Ett sätt att länka till andra dokument är att tala om var de befinner sig i relation till det aktuella dokumentet. Säg att browsern just nu visar sidan minsida_1.html, och vi vill länka till en sida som heter minsida_2.html som ligger i samma mapp som minsida_1.html. Då behöver vi bara ange den sidan i vårt href-attribut.

Ex.

<body>
   Detta är en
      <a href="minsida_2.html">
         länk
      </a>
   till min andra sida
</body>

ger utskriften:

Det här är en länk till min andra sida

Om minsida_2.html skulle ha legat i en undermapp till den aktuella mappen som hetat "mapp2", då kunde vi ha angett dess sökväg på samma sätt, dvs. relativt det aktuella dokumentet.

Ex.

<body>
   Detta är en
      <a href="mapp2/minsida_2.html">
         länk
      </a>
   till min andra sida
</body>

ger utskriften:

Det här är en länk till min andra sida

Absoluta länkar

Det andra sättet att ange var måldokumentet befinner sig är att ange dess exakta sökväg. Ska vi ange ett dokument på vår egen dator kan det vara t.ex:

C://mina_dokument/min_webbfolder/min_hemsajt/studier/systemvetenskap/minsida_2.html

Absoluta länkar används dock främst för att referera till dokument som befinner sig på en server någonstans på Internet. Det är dessa vi brukar se i browserns länkfönster. T.ex.

http://www.hemsida.com/någons_hemsajt/studier/systemvetenskap/någonssida.html

Ankare: #

Naturligtvis finns det metoder för att länka sig inom det dokument man befinner sig också. Det kan ju vara så att man vill kunna hoppa till specifika ämnen på en sida. Speciellt på långa sidor med mycket text kan detta vara fördelaktigt.

För att a-taggen ska veta vart i dokumentet den ska skicka browsern måste något element på sidan utrustas med en unik identifierare. Detta gör man genom att i någon annan tagg lägga till ett unikt id. Ponera att vi skulle vilja repetera avsnittet med relativa länkar högre upp i det här dokumentet. Då placerar vi ett id-attribut i t.ex. th-taggen på följande sätt:

<th id="rel">Relativa länkar</th>

Då har vi ett mål för vår a-tagg. Därefter lägger vi in en referens dit från vår länk, och det gör vi genom att lägga till id:et efter ett #-tecken så här:

<body>
En länk till
<a href="#rel">relativa länkar</a>
</body>

Detta ger följande länk:

En länk till relativa länkar

Bildlänkar
Det är inte enbart text som kan tjäna som länkar i XHTML, även bildobjekt kan bli klickbara browserförflyttare. Det enda man behöver göra är att lägga in ett img-objekt mellan a-taggarna. Ex. <body> <a href="#rel"> <img src="../graphics/idiot_outside.gif"> </a> </body> Vilket ger oss den klickbara bildlänken: vilken också tar oss upp till relativa länkar.

Länkning till ftp-filer
Det finns andra protokoll för Internet än http. Det som är mest använt och användbart är ftp - file transfer protocol. Detta används för att ladda ner filer från en server till en dator. Om du vill länka till en nerladdningbar fil från din sida så behöver du bara byta ut filhuvudets "http" mot "ftp" så här: ftp://www.hemsida.com/någonsfiler/någonfil.exe

Mailto-funktionen

Många gånger vill man att den som läser en XHTML-sida ska kunna kontakta någon annan (oftast den som står bakom sidan) via epost. Istället för att bara skriva ut epostadressen i text så kan man hjälpa läsaren ytterligare lite på traven genom att använda a-taggens mailto-funktion. Denna innebär att när någon klickar på en mailto-länk så öppnar browsern ett mailprogram med epostadressen redan angiven. Om man vill att någon ska kunna skicka ett mail till jag@minsida.com så skriver man in detta i href-attributet:

<body>
   Maila
      <a href="mailto:jag@minsida.com">
          mig
      </a>
   gärna.
</body>

Detta ger följande resultat:

Maila mig gärna.

Testa gärna.