Definitionen af henvisninger i HTML udføres via a-elementet. Før jeg viser jer dets brug, er der nogle generelle tips til hyperlink. Overvej absolut gode henvisningstekster. Med et kedeligt tilbage er normalt ikke til hjælp for nogen. (Hvis en besøgende kommer fra en ekstern side, ved han normalt ikke, hvad der menes med tilbage). Forsøg at vælge beskrivende henvisningstekster.
Hyperlinks følger altid samme princip i HTML.
<a href="videos.html">Aktuelle videoer</a>
Til a-elementet tildeles attributtet href. Dette href forventer i sin tur henvisningsdestinationen som værdi. I det foregående eksempel blev der henvist til filen videos.html. Denne fil befinder sig i samme mappe som HTML-filen, hvor hyperlinket blev defineret.
Ved definitionen af hyperlinks gælder ellers de regler, der også blev præsenteret i forbindelse med indlejring af grafikker.
I kan i øvrigt ikke kun definere projektinterne henvisninger. Der kan også oprettes hyperlinks til eksterne filer og domæner.
<a href="http://www.psd-tutorials.de">PSD-Tutorials.de</a>
Den tekst, der står mellem åbnings-<a> og luknings-</a>-tags, er i sidste ende henvisningsteksten. Som standard vises denne tekst understreget af browsere.
Angiv målvindue
Når man klikker på et hyperlink, åbnes henvisningsdestinationen i det aktuelle browservindue. Det er normalt helt i orden. Det kan dog godt ske, at man f.eks. har oprettet en henvisning til et eksternt domæne. Hvis en besøgende klikker på dette link, er det ønskeligt, at henvisningsdestinationen åbnes i et nyt browservindue eller faneblad. Fordelen ved denne metode er, at jeres hjemmeside forbliver åben i baggrunden.
I bør dog ikke åbne hvert hyperlink på jeres side i et eksternt vindue, da besøgende hurtigt bliver irriteret af det.
Via attributtet target på a-elementet kan I bestemme målvinduet, hvor den relevante henvisningsdestination skal åbnes. HTML tilbyder oprindeligt tre standardværdier for target.
• _blank – Henvisningsdestinationen vises i et nyt browservindue.
• _self – Åbner henvisningsdestinationen i det aktuelle browservindue.
• _parent – Her kan man bryde ud af rammen. (Bemærk venligst, at rammer ikke understøttes i HTML5. Generelt bør man ikke længere bruge denne teknik, da der i dag er bedre alternativer. Hvis I ønsker mere information om rammer, kan I f.eks. finde det på siden http://de.wikipedia.org/wiki/Frame_(HTML)).
• _top – Bruges også i forbindelse med rammer. I kan åbne henvisningsdestinationen uden for rammerne.
Her er et eksempel på, hvordan man anvender target-attributtet:
<a href="http://www.psd-tutorials.de" target="_blank">PSD-Tutorials.de</a>
I dette tilfælde ville henvisningsdestinationen http://www.psd-tutorials.de blive åbnet i et nyt vindue/faneblad. Samme effekt ville man for øvrigt opnå, hvis man i stedet for det reserverede navn _blank anvendte et fantasinavn som halligalli. Men hvis I bruger target, vil jeg faktisk anbefale at bruge et af de reserverede navne.
Definer henvisningsbasis
I head-delen af HTML-filen kan I definere en såkaldt henvisningsbasis. En sådan henvisningsbasis sikrer, at alle henvisningsdestinationer vises i et bestemt browservindue. Det er naturligvis igen primært interessant i forbindelse med rammer.
Det er dog også praktisk, hvis I f.eks. altid vil have alle links til at åbne i et nyt browservindue ved hjælp af _blank. Forestil jer f.eks. en liste med links. Hvis henvisningsdestinationerne altid skal åbnes i et nyt vindue, ville det se sådan ud:
<a href="http://www.facebook.com/psdtutorials" target="_blank">http://www.facebook.com/psdtutorials</a> <br /> <a href="http://www.facebook.com/psdDarkArt" target="_blank">http://www.facebook.com/psdDarkArt</a> <br /> <a href="http://www.facebook.com/HowToNetzwerk" target="_blank">http://www.facebook.com/HowToNetzwerk</a>
I skal så tildele et target-attribut til hver a-definition.
Dette er ikke særlig effektivt, som I kan se. Det bliver endnu mindre effektivt, hvis I om et par måneder beslutter, at henvisningsdestinationerne ikke længere skal åbnes i et nyt vindue. Så skal I tilpasse target-attributterne for alle links. Det kan forhindres via den tidligere nævnte henvisningsbasis. Den defineres via base-elementet inde i head. Man tildeler target-attributtet det ønskede værdi. Her er et eksempel på, hvordan det kunne se ud:
<!DOCTYPE html> <html lang="de"> <head> <title>PSD-Tutorials.de</title> <meta charset="UTF-8" /> <base target="_blank"> </head> <body> <a href="http://www.facebook.com/psdtutorials">http://www.facebook.com/psdtutorials</a> <br /> <a href="http://www.facebook.com/psdDarkArt">http://www.facebook.com/psdDarkArt</a> <br /> <a href="http://www.facebook.com/HowToNetzwerk">http://www.facebook.com/HowToNetzwerk</a> </body> </html>
Det sparer dig en masse tastearbejde.
Definer anker
Du har allerede set, hvordan du kan oprette hyperlinks til andre filer. Men det er også muligt at definere såkaldte ankre inden for en HTML-fil. Derefter kan du oprette henvisninger til disse ankre. Det er praktisk på omfattende sider. På den måde kan du definere et indholdsfortegnelse i begyndelsen af dokumentet, hvor besøgende kan springe til de relevante sektioner uden at skulle rulle gennem browservinduet.
Ankre oprettes ved hjælp af a-elementet. Dog tildeles ankerdefinitionerne ikke en href-attribut, men i stedet tildeles de en name-attribut.
<a name="seitenanfang">Indhold</a> <a name="kapitel1">Indhold Kapitel 1</a> <p>Her følger en masse tekst.</p> <a name="kapitel2">Indhold Kapitel 2</a> <p>Her følger en masse tekst.</p>
Du kan frit vælge ankerets navne. Jeg anbefaler dog at vælge dem så korte som muligt, kun bruge små bogstaver og undgå specialtegn.
For at linke til et anker defineres et normalt hyperlink, som vist i begyndelsen af denne vejledning.
<a href="#seitenanfang">Til toppen af siden</a>
I href-attributet tildeles ankerets navn som værdi. Det er dog afgørende, at ankerens navn forudgås af et hegnstegn.
Du kan også linke til anker på tværs af filer. I det følgende eksempel antages det, at der findes en fil med navnet news.htm, som ligger i samme mappe som den faktiske HTML-fil. Inden for news.htm er ankeret seitenanfang defineret. For at linke til dette, angives der et hegnstegn efter navnet på målfilen (news.htm). Derefter følger ankerets navn.
<a href="news.htm#seitenanfang">Til toppen af siden</a>
Så nemt kan du oprette links til anker i enhver vilkårlig fil.
