Hopp til innholdet

cjohansen.no

Semantiske lenker

Årets julekalender åpnet med tips om språk i HTML, og spesifikt for lenker var hreflang. <a>-taggen har enda flere triks opp i ermet og to av dem (rev og rel) har tilogmed fått flere mikroformater basert på seg. Velkommen til dagens elementære og noe forsinkede luke!

Aktuelle elementer

Idag fokuserer vi helt og holdent på hjørnesteinen i webben; <a>. Og litt på <link>.

rel-attributtet

Rel-attributtet spesifiserer ifølge HTML 4.01-spesifikasjonen "et forhold fra dette dokumentet til dokumentet i href-attributtet". Tilsvarende har vi rev-attributtet som beskriver det motsatte forholdet, altså forholdet fra det lenkede dokumentet til dette. Begge disse attributtene er også gyldige for <link>-elementet, og kan (som class) ta en liste med verdier adskilt med mellomrom. Med definisjonen friskt i minne kan vi undre oss over dette snodige eksempelet:

<link rel="stylesheet" media="print" type="text/css" href="/design/css/print.css" />

Denne bruker de fleste av oss alltid når vi lager websider, men utifra definisjonen får rel-attributtet i dette tilfellet en misvisende verdi: dette dokumentet er stylesheet for print.css. Et bedre alternativ ville være å ha rev fremfor rel i dette tilfellet, siden det vi ønsker er å beskrive et forhold fra stilsettet til dokumentet.

type-attributtet

type kan brukes for å angi Content-Type for lenkens mål, noe som er helt nødvendig når vi bruker <link>, men som vi stort sett hopper over med <a>. Det er med andre ord mange måter vi kan berike lenkene våre. For å vise spennvidden og hva vi potensielt kan uttrykke med lenker, se følgende eksempler (rev og rel i første omgang utelatt med vilje):

<a href="http://www.simpsonsmovie.com/">The Simpsons Movie</a>

<a href="http://www.simpsonsmovie.com/"
   lang="en" xml:lang="en" hreflang="en"
   type="text/html" charset="utf-8">The Simpsons Movie</a>

I tillegg kan vi bruke id, class, accesskey, tabindex og andre mindre nyttige attributter.

Google og lenker

Når bloggene virkelig tok av for noen år siden fikk vi et nytt problem i kommentarspam. Google og andre søkemotorer baserer mye av relevans-rankingen sin på antall inngående lenker fra andre nettsteder. Med økende antall blogger som tok imot kommentarer ble kommentarspam et økende problem - det vil si kommentarer for all mulig dritt som lenket tilbake til nettsteder for å øke rank. I januar 2005 lanserte Google sitt svar på denne trusselen med rel="nofollow". Med denne verdien for rel-attributtet vil ikke Google gi noen vekting til siden du lenker til basert på lenken.

Den opprinnelige bruken var for lenker på ditt nettsted som du ikke selv har kontroll over, altså gjennom kommentarer og lignende. Et vel så bra bruksområde er lenker til sider du ikke ønsker å gi noen ytterligere støtte.

RelNoFollow er nå offisielt et mikroformat selvom ikke alle er like begeistret for det. Noen problemer som har vært oppe:

Vote-links

Vote-links er et annet format som lar deg si noe om siden du lenker til. Tanken er å kunne si noe om hvorvidt man er enig (vote-for), imot (vote-against) eller nøytral (vote-abstain) i forhold til siden man lenker til. I dette formatet har man tatt notis av den inkonsekvente bruken av rel notert over, og bruker istedet rev-attributtet til å gi forholdet fra dette dokumentet til dokumentet det er lenket til.

<a href="http://www.simpsonsmovie.com" rev="vote-for">Simpsons-filmen</a> (Ja, jeg er gira på den om dagen)

Andre rel-baserte mikroformater

rel-license

Ved å sette rel="license" angir du at siden du lenker til fungerer som en lisens for siden. Dette er nyttig for innhold som er opphavsrettslig beskyttet. Et spennende scenario for dette mikroformatet er søk som lar brukeren velge å få resultater kun på enkelte former for lisens, noe Google Usage Rights gjør. Prøv avansert søk på Google, og lek deg med Brukerrettigheter.

<a href="http://www.apache.org/licenses/LICENSE-2.0" rel="license">Apache 2.0</a>

...og mange flere

I mikroformat-wikien finner du flere elementære mikroformater som benytter seg av enkle lenker. Et viktig poeng som ikke er nevnt over at disse formatene også kan benyttes med <link>-taggen i de tilfellene hvor synlige lenker ikke er det du er ute etter.Hvilke lenke-baserte mikroformater har du implementert?

Muligens relatert

2006 - 2012 Christian Johansen Creative Commons Lisens