Tillgänglighet

Alla ska komma åt det.

Validera din webbplats ända in i benmärgen

NetRelations Inspector granskar din html-kod och visar bristerna. Alla brister. Det handlar om hur länktexten ser ut, om du har en korrekt rubrikstruktur, om du använder style sheets i koden snarare än i externa filer och så vidare.

Räkna inte med att få ett bra resultat. Däremot en tydlig hänvisning till vad du bör åtgärda och förbättra för att nå en optimal tillgänglighet.

NetRelations Inspector

(Via användbart)

24 Hour Business Camp

24 timmar för att bygga en webbtjänst. I dag börjar det med lite presentationer och i morgon, torsdag 22 januari, går startskottet klockan 12.00 för ett dygns webbutveckling av smarta nättjänster.

Du kan följa Ted Valentins initiativ på livebloggen och se vilka de anmälda deltagarna är.

Jag läste precis att Tomas Wennström på whatsnext.se ska bygga tjänsten vackertvader.se som visar lokala bilder som illustrerar vädret.

Evenemanget är ett smart sätt att utveckla nya webbtjänster. Tidsfristen på ett dygn bör mana till kreativitet och kiss-principen: Keep it simple, stupid.

Förbättra tillgängligheten för din blogg med ljudversion

OdiogoFörbättra tillgängligheten för din blogg genom att göra en ljudversion av ditt blogginlägg.

Företaget Odiogo sätter tänderna i ditt rss-flöde, idisslar fram en ljudfil åt dig och spottar sedan ut en play-knapp som du kan klistra in i ditt bloggtema. Ljudkanalen kan också publiceras till iTunes. Helt gratis!

Men det finns naturligtvis en hake. Tanken är att inkludera reklam i ljudklippen framöver, men det kan till och med leda till att bloggare får dela på lite av vinsten. Sedan är det förstås en amerikansk tjänst. Bloggar du på svenska kan det därför bli lite lätt humoristiskt uttal.

Men det är ändå en grym tjänst. Du kan se och lyssna på ett exempel för att se hur det fungerar på DoingMedia.net.

Givetvis kan andra webbplatser än bloggar vara med i leken.

(Via Content Here)

Vervas vägledningar återuppstår på eutveckling.se

Vägledningen för 24-timmarsmyndigheten – guiden för användbara och tillgängliga webbplatser – har uppstått i privat regi. Verket för förvaltningssutveckling, Verva, lades ned för ett tag sedan men deras vägledning för webben återuppstår nu som eutveckling.se.

Här hittar du riktlinjer som ger dig praktiskt stöd att använda webben som en effektiv kanal för service. En webbplats som följer riktlinjerna når fler och blir enklare och mer effektiv att använda.

Riktlinjerna utgår från Vervas publikation Vägledningen för 24-timmarswebben. Denna webbplats är dock ett privat initiativ och de tillägg som gjorts är tydligt markerade.

Ett bra initativ för att försäkra en standardisering för vägledning och riktlinjer för användbarhet och tillgänglighet.

(Via 24timmarsbloggen)

Så ska ett inloggningsformulär se ut

Trots att inloggningsformulär har funnits i över tio år verkar det fortfarande finnas företag som har problem att utforma dem. Eller så tycker de att de gör smarta lösningar med egna påhitt. Oavsett vilket ställer det till problem, och jag ska belysa några av de problem som kan uppstå genom tre exempel.

Binero vecklar in det enkla

Det första gäller webbhotellet Binero som har ett tämligen invecklat inloggningsformulär.

Förutom de sedvanliga fälten för användarnamn (i det här fallet kundnummer) och lösenord, så får man även välja om man vill spara användarnamnet, både användarnamnet och lösenordet eller inget av dem.

Dessa tre val är ett typiskt resultat av att överarbeta och lösa ett simpelt problem genom att ge användaren en massa alternativ. Det räcker med en enda knapp. ”Kom ihåg mig”. Vi är vana vid att se den och den fyller en mycket viktig funktion, på ett enkelt sätt.

Om man sparar användarnamn och lösenord i formulärfältet, i klartext, är det ju värre än om de ligger i en cookie där de kan ligga krypterat. Således finns det en mängd brister med detta tillvägagångssätt. I Bineros fall lyckas heller inte cookien fastna på min dator, så man tvingas ändå skriva in uppgifterna gång efter annan.

Nationalencyklopedin får brottas med Firefox

Omgjorda Nationalencyklopedin har även de gjort om sin webbplats. Inloggningsformuläret är inget undantag.

Här har vi ett annat problem, de har valt att göra rutorna till inloggningsformuläret i svart, och lägga etiketten för respektive ruta (det vill säga användarnamn och lösenord) innuti rutan med grå text. Kontrasten blir alldeles för liten och gör det svårt att läsa.

Dessutom är det alltid ett problem med att skriva etiketter i själva rutorna. Dels eftersom texten ibland inte tas bort när man sätter markören i rutan, och dels ibland för att texten faktiskt tas bort, men också tar bort användarnamnet man just skrivit in när man flyttar textmarkören genom att klicka i rutan.

En till sak är värt att nämna, som däremot endast framkommer när man använder webbplatsen, och det är att inloggningsrutan lägger sig som ett eget lager över sidan. Då döljs bakgrunden med lägre opacitet så att man lägger all fokus på inloggningen. Det är bra och smidigt, men introducerar ett nytt problem. Webbläsaren Firefox, som jag använder, frågar inte om jag vill spara lösenordet när jag trycker på Logga in. På grund av det överliggande lagret så tappar jag denna funktion, vilket är väldigt retligt. Speciellt eftersom inte heller Nationalencyklopedin vill hålla mig inloggad mer än ett par timmar, innan jag tvingas logga in igen. När man använder lexikon och uppslagsverk flera gånger dagligen höjer det irritationen.

Enkel och välfungerande inloggning på komplett.se

Sist, men inte minst, har vi nätbutiken Komplett. De lyckas göra en inloggningsruta som fungerar utomordentligt.

Det som gör den här rutan bra är dess enkelhet. Användarnamn och lösenord skrivs in, tryck på logga in och lösenordet sparas av Firefox utan problem.

Här har vi däremot ingen Kom ihåg mig-ruta, men jag bedömer det inte nödvändigt på en nätbutik av detta slag. Det är endast när man behöver lägga en order som inloggningen är oundviklig. Däremot skulle det inte skada, utan skulle höja användarvänligheten ytterligare. Speciellt om det är så att frakten måste räknas ut beroende på var du bor – då skulle ”Kom ihåg mig” sannerligen behövas.

Nackdelen med Kompletts lösning är däremot att man måste klicka på en länk för att komma till inloggningssidan. Den borde vara synlig direkt på startsidan. Binero har samma problem, men har en egen lösning som ligger i ett eget lager precis som Nationalencyklopedin, och den fungerar lika illa.

Fyra tips för dina inloggningsformulär

  • Gör det enkelt, det räcker med användarnamn och lösenord plus en logga in-knapp.
  • ”Kom ihåg mig” är det enklaste sättet att låta en cookie spara sessionen. Om du inte vill äventyra användarens säkerhet (på grund av att datorn står på ett bibliotek) eller liknande, bör du inte erbjuda denna funktion alls.
  • ”Glömt lösenordet?” är en bra funktion och du behöver inte beskriva den mer än så. Vi har vant oss vid den.
  • Kontrollera att webbläsarna kan spara användarnamnet och lösenordet utan problem.
  • Lägg inloggningsformuläret på en plats som är väl synlig.

Glöm inte bort navigeringen med hjälp av webbadressen

En meny ska vara tillgänglig och pedagogisk. Men själva webbadressen glöms lätt bort. Det är trots allt den mest vitala delen av navigationen och som är svårast att ändra när den väl är etablerad.

Av någon anledning skulle jag titta på näringsdeklarationen på den müsli jag äter. Efter att nyss ha inspekterat paketet hamnade jag på tillverkaren Axas hemsida för müslimärket ”Guld” som jag äter.

Adressen dit är axa.se/prc/prc.nsf/DisplayFolders?Open
&webpage=F7F112AA80D6A733C12570A500438715&
Folder=musli&SubFolder=musli&acronym=axamain
&level=3&back=2

Föga upphetsande adress. Dessutom omöjlig att komma ihåg. Här är mitt förslag:

axa.se/musli/guld/

Fördelen med den här typen av adresser är att det dessutom går att förutse hur navigationen är uppyggd. Du har förmodligen redan gissat att under axa.se/musli hittar vi en överordnad lista över olika müslisorter. Och du kan byta ut guld mot ett annat varumärke.

I grund och botten handlar webbadressnavigationen om domän.se/kategori/produkt. Om du har produkter som av olika skäl är svåra att kategorisera, eller kan hamna i fler än en kategori, är det en god idé att ta bort kategorin. Alltså domän.se/produkt.

Hierarkin ska avslöja sig i adressen

Webbadressen är ett bra sätt att avslöja hur långt ned i hierarkin man befinner sig, liksom att ge besökaren information om hur man tar sig vidare.

I exemplet ovan med Axa så är Guld namnet på produkten och müsli kategorin. Följdaktligen är hierarkin följande:

  1. Axa (startsida)
  2. Müsli (kategori)
  3. Guld (produkt)

Genom att plocka bort bit efter bit i webbadressen ska vi hamna högre och högre upp i hierarkin. Det blir som en brödsmulenavigering, Axa > Müsli > Guld, som återspeglas i webbadressen.

Förslag på utformning av vanliga webbadresser

Nedan finner du ett par förslag på utformningen av webbadressen för vanliga typer av webbplatser.

E-handel

domän.se/kategori
domän.se/kategori/eventuell-underkategori
domän.se/kategori/produkt

Exempel: mobiltelefoner.se/sonyericsson/w810i

Nyheter

domän.se/kategori
domän.se/kategori/årtal/månad/dag/nyhetens-namn

Exempel: nyheter.se/inrikes/2008/05/20/moderaterna-arga

Självklart ska man kunna navigera uppåt i hierarkin. Tar man bort nyhetens namn (så att det blir /inrikes/2008/05/20) ska man se nyheter för den specifika dagen. Och fortsättningsvis för den specifika månaden, året och slutligen (när bara /inrikes/ återstår) de senaste nyheterna under den kategorin. Detta gör att en användare kan nå allt innehåll enkelt, utan att använda webbplatsens konventionella navigering.

Bloggar

domän.se/kategori
domän.se/inläggets-namn
domän.se/årtal/månad/år

Exempel: blogg.se/navigering-med-webbadressen

Här undviker jag att ha med kategorinamnet i adressen för ett enskilt inlägg eftersom ett inlägg vanligen placeras i flera kategorier. Alternativt kan man välja en huvudkategori där inlägget publiceras, varfter inlägget även kan hittas i de andra kategorierna.

Inläggets namn bör inte spegla rubriken. Det blir för långt och innehåller för mycket småord. I denna artikel du läser just nu ser den ut som följande: glom-inte-bort-navigeringen-med-hjalp-av-webbadressen. I stället bör den vara likt följande: blogg.se/navigering-med-webbadressen eller på annat sätt lika kort, koncis och unik. Undvik om möjligt vanliga ord som och, med, eller och liknande. Satsa på unika nyckelord.

Nyckelorden i adressen är också en viktig del av sökmotoroptimering. Men i vårt fall koncentrerar vi oss i första hand på användarvänlighet för läsaren. Den automatiska sökmotoroptimeringen som uppstår är en positiv bieffekt.

Som du säkert noterar så har bloggen inte datumet i webbadressen heller (förutom när man ska bläddra). Bloggar är i regel inte knutna till datumet som nyheter är. Men om du av någon anledning satsar på dagsaktuella nyheter på din blogg är det nyhetsadresserna du ska använda.

Katalogtjänster

(annonser, telefonnummer, företag etc)
domän.se/kategori-eller-bransch
domän.se/geografisk-placering
domän.se/kategori-eller-bransch/geografisk-placering
domän.se/foretagsnamn

Exempel: register.se/snickare/stockholm

Om vi tar en telefonkatalog som exempel är det en bra idé att ha två olika kategorier i den andra nivån av hierarkin (nedanför förstasidan). Först letar man efter en typ av bransch: register.se/snickare (hitta snickare i Sverige) och sedan var de finns: register.se/snickare/stockholm (snickare i Stockholm).

Ibland är det också nödvändigt att bläddra efter företag i orten. Då går man direkt in på register.se/stockholm (alla företag i Stockholm). Väljer man sedan snickare bör man däremot skickas till register.se/snickare/stockholm. Adressen register.se/stockholm/snickare bör också finnas, för konsekvensens skull, men ska däremot skicka användaren vidare till den förra.

Detta gör att användaren kan använda endera sättet att hitta information och är inte begränsad till någon speciell struktur, även om det i realiteten är så. Dessutom får varje innehåll en unik adress, vilket underlättar länkning och indexering hos Google eftersom du slipper dubbelt innehåll.

När det finns flera sätt att hitta information (bransch och ort i vårt exempel) är det viktigt att bestämma vilket som ska vara det primära sättet. I vårt fall är det bransch och därefter ort. Det bör bestämmas efter det tillvägagångssätt som är vanligast bland användaren. Jag drar en slutsats från mitt eget sökande att jag först letar efter en viss bransch och sedan inriktar mig på en specifik ort.

På annonssajten Blocket är det däremot tvärtom. Där utgår man från att välja län först, och sedan kategori. Blocket har kritiserats för detta av informationsarkitekter som menar att man i första hand bör välja kategori, eller åtminstone bådadera redan på förstasidan. Men Blocket kanske lutar åt att i första hand vara en lokal annonsplats?

Hur du än gör bestäms av vad du har för tjänst och hur dina användare beter sig. Ta reda på det genom att göra en undersökning, fråga eller försök att observera hur de hittar information genom att göra kontrollerade användartester.

Lätt att läsa upp över telefon

Ibland läser jag upp webbadresser över telefon. Det fungerar oftast dåligt, men om man använder metoderna jag angivit ovan så kan man i stället berätta vad man bör skriva. ”Jo, först skriver du inrikes, snedstreck, årtalet, månad, dag och sedan ser du artikeln där”. Det är också underförstått att man enkelt kan byta ut inrikes mot utrikes.

Jag vill påstå att utformningen av webbadressen är den absolut viktigaste delen inom webbutveckling. Webbadressen är det som får spridning enklast, mest okontrollerat, och är svårast att påverka i efterhand. Innehållet på webbplatsen går att ändra på ett par sekunder. Men om du noga tänker igenom alla aspekter från början, blir det enklare för dina besökare och det resulterar i slutändan i mer trafik och intäkter.

Börja tillämpa bättre webbadresser

Om du har ett publiceringssystem som spottar ut långa webbadresser och som har varit indexerade i många år är det svårt, jobbigt och också tidskrävande att byta ut adresserna.

I en tidigare artikel beskrev jag hur du bygger om din webbplats men behåller plats på Google.

Filmer om tillgänglighet

Tänk om du, som seende, får umgås med blinda dagligen och den enda informationen från myndigheter är blindskrift. Varannan torsdag klockan 14.00 kan du dock få blindskriften uppläst.

Det låter horribelt, men den omvända situationen existerar faktiskt. Tillgängligheten är dålig och därför har också Handisam producerat ett antal filmer om tillgänglighet för att visa på dessa aspekter och hur absurt det är, att inte alla samhällets medborgare får tillgång till information och kan ta sig dit de vill.

Filmerna är dock i Windows Media-format. Det är inte tillgängligt.

Läs också Vilka funktionshinder finns det?

(Via inUseful)

Varför arbeta med användbarhet och tillgänglighet?

Den frågan besvarar Verva, verket för förvaltningsutveckling, i en bra presentation du kan låna.

Vi vill ge dig stöd att övertyga dina kollegor eller kunder varför ni bör arbeta med användbarhet och tillgänglighet när ni utvecklar er webbplats. Därför har vi tagit fram en presentation som du kan hitta inspiration och stöd i.

Stöd att argumentera för användbar och tillgänglig webb

SvD omdesignar men backar tillbaka efter tekniskt haveri

Svenska Dagbladet, SvD, har i veckan gjort om sin webbplats. Mycket påminner om Dagens Nyheter som några veckor tidigare gjorde om sin webbplats.

Men för SvD gick det inte fullt så bra. Efter ett tekniskt haveri så dök sajten och senast i natt fick jag ett kryptiskt felmeddelande från deras cacheserver. Nu är de tillbaka med den gamla webbplatsen.

Bo Hedin, chefredaktör för SvD, förklarar haveriet på sin blogg: Vad håller ni på med på SvD.se?

Mer om ombyggnader av webbplatser: