lillbra.se

Target-attributet och öppna länkar i nytt fönster

Ett av de mest omdiskuterade html-attributen är target. Attributet är inte tillåtet i strict doctype för xhtml 1.0 och html 4.01, vilket fått många utvecklare fundera på hur man ska få länkar att öppnas i ett nytt fönster. Här presenterar jag några förhållningssätt till target och att öppna länkar i nytt fönster.

Använd det inte alls

En vanlig ståndpunkt är att target inte behövs alls, för att man aldrig bör låta länkar öppnas i nytt fönster. Det är dåligt för användbarheten eftersom det bryter det normala beteendet hos webbsidor, och kan till och med vara förvirrande. Användare kan öppna länkar i nytt fönster själva om de vill, det är inte något man kodmässigt ska tvinga på dom. Dessutom klarar inte alla webbläsare av att öppna nya fönster, främst webbläsare i mobiler och handdatorer.
Andra menar dock att det finns tillfällen man bör låta en länk öppnas i nytt fönster, framför allt länkar som går till dokument i andra format än (x)html, till exempel pdf.

Låt javascript ersätta funktionaliteten

Man kan låta javascript sköta öppnandet av en länk i nytt fönster. Många tycker att det passar extra bra eftersom det är ett beteende, och beteenden ska skötas genom just script.
Funktionaliteten bör implementeras som ”unobtrusive javascript” (vad heter det på svenska egentligen!?) genom att lägga till ett onclick-event för länken som kör window.open när länken klickas på. Jesse Skinner har ett fullständigt kodexempel på detta.
För användare som har javascript avstängt kommer länken fungera som en vanlig länk och öppnas i samma fönster.

Bryt mot reglerna

Ett annat alternativ är att medvetet bryta mot standard och använda target fastän DTD:n inte tillåter det. Man får då ett valideringsfel i sin kod. Robert Nyman tar upp detta alternativ i artikeln How evil is the target attribute?.
Av kommentarerna och annan respons att döma är det inget som bör göras.

Modifiera DTD:n

Martin Kliehm presenterar ett sista alternativt sätt att öppna länkar i nytt fönster, och det är att använda sig av xhtml 1.1 och modifiera DTD:n. Genom att importera target-modulen gör man target-attributet möjligt att använda.
Detta verkar krångligt och är väl inte heller så aktuellt, eftersom xhtml 1.1 ändå inte kan tolkas av Internet Explorer.

Summering

För tillfället verkar alltså följande regel bäst: Öppna inte länkar i nytt fönster, och om du måste göra det; använd unobtrusive javascript.

I framtiden kan dock andra tillvägagångssätt gälla. Det kan komma att bli i css:et man sätter hur en länk ska öppnas eftersom target finns med css3-specifikationen. Attributet kommer även finnas med i nästa version av xhtml 1.1 (via Learning the world ).

Till sist: Om man nu väljer att låta en länk öppnas i nytt fönster, bör man alltid tala om när en länk öppnas i nytt fönster, t.e.x. genom att skriva ”nytt fönster” eller liknande i själva länken.

[tags]html, target-attributet, länkar, länkar i nytt fönster, användbarhet[/tags]

Html in i minsta element

Bland webbutvecklare uppstår ofta diskussioner om hur semantiskt riktig kod bör skrivas. Här tipsar jag om några intressanta artiklar som handlar om enskilda html-element och hur dessa element bör/kan användas.

br-taggens vara eller icke vara

I Robert Nymana artikel Should the br tag be used? ställs frågan om och hur br-taggen bör användas, och han förklarar olika synsätt på vad som är rätt och fel. Man kan t.ex. använda två p-taggar istället, där den ena inte har någon margin-top, vilket ger samma effekt utseendemässigt.
Av kommentarerna att döma är br-taggens roll inte alls oviktig, och kring reglerna runt hur elementet ska användas hänvisar Arjan Eising till den kommande Web Applications 1.0-specifikationen:

br elements must only be used for line breaks that are actually part of the content, as in poems or addresses.[...] br elements must not be used for separating thematic groups in a paragraph.

WHATWG – Web Applications 1.0

En naken a-tagg

I artikeln Using the a tag without attributes upplyser Jesse Skinner om att det är tillåtet att använda a-taggen helt utan attribut! Resultatet blir då en länk som inte går någonstans efter som href inte anges. Och vad är nyttan med det?
Skinner förklarar i ett exempel att det kan vara semantiskt riktigt att använda detta i sajtens meny, då den aktuella sidan användaren är på kan märkas upp som en icke klickbar länk. Framför allt bör detta alternativ användas istället för <a href=”#”>.

Rätt adress

I artikeln Use of ADDRESS Element skriver Jonathan Snook att många har missuppfattat hur address-taggen ska användas. Den är inte menad att användas för när en postadress ska skrivas ut på sidan, utan till kontaktinfo för ett dokument eller del av ett dokument (t.e.x. formulär).
I kommentarerna förtydligar Roger Johansson regeln genom hänvisning till Web Applications 1.0-specifikationen:

The address element must not be used to represent arbitrary addresses (e.g. postal addresses), unless those addresses are contact information for the section. (The p element is the appropriate element for marking up such addresses.)

WHATWG – Web Applications 1.0

link-taggens olika användningsområden

Jon Christopher har skrivit The Many Faces of the link Tag där han går igenom möjligheterna med link-taggen. Det vanligaste användningsområdena är förmodligen att hänvisa till stylesheet, faviconer och rss. Men det finns många andra sorts relationer att specifiera med link, och med dessa inlänkningar kan moderna webbläsare hjälpa till att förenkla surfandet för användaren. Exempel på användning är att länka till alternativa språkversioner av sidan, eller till ”nästa sida” eller ”föregående sida” i en serie av sidor.
Bland kommentarerna hittar jag Emmas artikel WCAG: Metadata for Semantic Information som innehåller fler kodexempel för link-taggen.

Naturligtvis finns det duktiga bloggare som gått ännu mer detaljerat och skrivit artiklar om specifika attribut. Men det tar vi en annan gång!

[tags]html, webbutvekling, br-taggen, a-taggen, address-taggen, link-taggen[/tags]

Konferenser – ses vi där?

Jag har bokat in mig på två konferenser framöver, som jag ser fram emot. Den första är EPiServer-dagen, som hålls redan nu på fredag 9:e februari i Stockholm, och handlar om EPiServers CMS och webben.
Gästtalare är bland annat de flitiga bloggarna Fredrik Wackå och Karolina Lassbo. Jag kommer dock gå på de lite mer tekniska föredragen.

Den andra konferensen är connection07 som hålls 27 mars i Göteborg. Det finns platser kvar till denna dag, då den nya webben och trenderna på nätet ska fokuseras. Talare är bland annat storbloggarna Roger Johansson och Henrik Torstensson. Jag är extra nyfiken på Anna Grandts föredrag som ska handla om mobila tjänster.

Är det några av er som ska på någon av konferenserna? Kommentera!

[tags]konferenser, webbutveckling, episerver, episerverdagen, connection07[/tags]