En grundläggande idé med webben är idén om hypertext, det vill säga att en text leder vidare till en annan med hjälp av URL:ar. Länkar helt enkelt. En sida utan länkar skulle vara högst ovanlig. I och med hypertext har man ju möjlighet att direkt länka till information som finns någon annanstans, informationen behöver bara finnas på ett ställe och kan nås direkt från din sida. Inte bara text, utan även bilder eller andra objekt kan länkas och leda vidare någon annanstans.
En länk skapas med hjälp av taggen
<a>- Anchor, ankare. Förmodligen Webbens viktigaste tagg.
Nu är ju <a> ensamt ingenting att ha, taggen behöver utrustas med några attribut för att bli meningsfull. Först det viktigaste, som gör länken till en länk.
href- Hypertext reference, det viktigaste attributet till
<a>. Värdet till detta attribut är URL:en som länken leder till.
Det finns en hel del andra attribut som gör länken mer avancerad. Några av dem kommer att tas upp senare i andra sammanhang. Kolla gärna hos W3C för en mer komplett referens, ta gärna en extra titt på rel-attributet.
Orden "Danderyds gymnasium", länkade till Danderyds gymnasiums hemsida skrivs alltså:
<a href="http://www.dagy.danderyd.se">Danderyds gymnasium</a>.
Ibland räcker det inte med att bara länka till en viss sida, man kan av olika skäl vilja länka till ett bestämt ställe på sidan. Det gör du genom att använda dig av namngivna ankare ("named anchors" på engelska).
Namngivna ankare kan göras på lite olika sätt, i dag är det vanligaste att man använder sig av attributet id, tidigare användes oftast attributet name.
Namngivna ankare med attributet id
Attributet id är förkortning för identity, identitet. Som du förstår använd det för att ge en egen unik identitet till en tagg. Det kan användas till nästan alla element i HTML, men du kan inte använda samma värde (namn) till mer än ett id per sida (det ska ju ge en unik identitet). id kan användas för lite olika saker i arbete med webb, men här ska vi använda det som namngivet ankare.
för att använda dig av id-attributet som namngivet ankare räcker det att du lägger till det till den tagg du vill hitta till, värdet till id är ett godtyckligt namn du väljer själv (gärna ett logiskt namn så att du begriper vad du skrivit). Om jag till exempel skulle vilja göra ett namngivet ankare av h2-rubriken "Korvar", lägger jag till ett id med det godtyckliga, men rimliga, värdet "korvar".
<h2 id="korvar">Korvar</h2>
För att göra en länk som går till just det id:t, lägger du till #korvar i slutet av länkadressen. om du länkar från ett annat ställe på samma sida räcker det med det.
<a href="#korvar">Länk till korvar</a>
om du länkar från en annan sida kan länken till exempel bli:
<a href=http://www.minsida/matsidan.html#korvar>Länk till korvar på matsidan</a>
Exemplet ovan kan se ut på många olika sätt, det viktiga är #korvar i slutet.
Namngivna ankare med attributet name
Ett äldre, men fortfarande fungerade, sätt är att använda sig av a-elementet, men utan href. I stället använder du attributet name, detta förvandlar länken (ankaret) från att länka till någonting till att bli det man kan länka till. Liksom id är name ett godtyckligt namn. för enkelhets skull tänker jag i första exemplet göra precis samma sak som i det förra exemplet:
<a name="korvar"><h2>korvar</h2></a>
för att länke till denna typ av namngivna ankare gör du på exakt samma sätt som du skulle gjort om du använt id.
URL - Uniform Resource Locator
En URL
är ett standardiserat sätt att beskriva sökvägen till en fil på
en dator eller ett nätverk, till exempel Internet.
En URL är alltså en internetadress, till exempel
http://www.dagy.danderyd.se.
URL:en innehåller både själva sökvägen till filen och
metoden som ska användas för att hämta den (protokollet).
Det finns två typer av URL:ar. Absoluta, som
beskriver hela sökvägen och relativa, som beskriver
resursens plats i förhållande till sig själv.
Absoluta adresser
En absolut URL inleds med namnet på kommunikationsprotokollet
(”schemat”), på Webben oftast HTTP,
följt av ett kolon och ett antal snedstreck
(”slashar”) som bestäms av protokollet, oftast två stycken.
Efter detta följer namnet på resursen du vill till följt av
mappar, kataloger på den resursen i en hierarkisk ordning,
skiljt av snedstreck.
Notera att det alltid är frågan om vanliga framåtlutade
snedstreck till skillnad från adresser i Microsoft Windows, där
mappar skiljs år med bakåtlutade snedstreck
(”backslashar”). Sista nivån i hierarkin är namnet på filen som
skall öppnas, eller rent av en viss plats (som ett namngivet
ankare) i denna fil, vilket markeras med nummertecken
(#).
http://www.minsajt.se/lektioner/html/lektion2.html#adresser
Leder alltså till det namngivna ankaret adresser, i
mappen html, i mappen lektioner, på
webbservern med namnet www.minsajt.se.
Om mappen innehåller ett HTML-dokument som heter index.html,
index.htm eller ett fåtal andra namn, så kommer webbläsaren
öppna detta automatiskt utan att du behöver ha med
dokumentnamnet i URL:en. http://www.minsajt.se kommer alltså
öppna dokumentet http://www.minsajt.se/index.html
Motsvarande adress på min hårddisk skulle kunna se ut som
följer: file:///C:/webbsajten/lektioner/html/lektion2.html#adresser.
Detta innebär att du går till ankaret adresser i
dokumentet lektion2.html i mappen html i
mappen lektioner i mappen webbsajten på
hårddisken /C:.
Relativa adresser
Adresserna är hierarkiskt
uppbyggda, uppifrån och ned. Detta medför att det inte alltid
är nödvändigt att skriva in hela den absoluta sökvägen när du
vill komma åt en viss resurs, det kan räcka med att du skriver
in det som skiljer det dokumentet du länkar från från resursen
du länkar till. Det är detta man menar med relativa URL:ar. Om
du vill länka till dokumentet, och det ligger i samma mapp som
dokumentet du länkar från, behöver du inte skriva mer än
dokumentnamnet.<a href=”lektion2.html”>
Webbläsaren letar i mappen du redan befinner dig i, om du
inte talar om något annat.
Om dokumentet du länkar ifrån har den absoluta URL:en
file:///C:/webbsajten/lektioner/html/Index.html
kommer <a href=”lektion2.html”> kunna
översättas till <a
href=”file:///C:/webbsajten/lektioner/html/lektion2.html>.
Lite mindre att skriva.
Ett vanligt scenario är att man har sorterat upp sitt
material, till exempel att man har en mapp för html-dokument
och en mapp för bilder. Om du skall visa en bild, som ligger i
”bilder”-mappen i ett HTML-dokument, som ligger i
”html”-mappen, behöver du först kliva upp ur mappen du befinner
dig i, för att sedan ta dig ned i ”bilder”-mappen. För detta
ändamål använder du två punkter: <img
src=”../bilder/bild.jpg”>. Om du skulle glömma
de två punkterna kommer webbläsaren att leta efter mappen
”bilder” i den mapp du befinner dig i. Du kan stega upp fler
nivåer genom att lägga till fler ../.
Sidan senast uppdaterad 2013-10-04