Informationsarkitektur

Din webbplats struktur.

Tekniken bakom Twitter: MySQL och memcached (typ)

Peter Dahlgren 2 Comments

Twitter behöver förmodligen ingen presentation. Men en sak jag däremot alltid undrat över är hur i allsin dar de lyckats skicka och ta emot så många textmeddelanden – i realtid dessutom.

Presentationen nedan visar, om än väldigt tekniskt, hur de lyckats skala upp Twitter och MySQL/memcached för att hantera det enorma antalet textmeddelanden som skrivs varje sekund. Det korta svaret är att de lagrar så mycket som möjligt i minnet.

Såvitt jag förstår har de bytt (eller ska byta) plattform. Men presentationen kan ändå ge några fingervisningar för hur all data ska struktureras för att göras snabbt åtkomlig.

(Via Jonas Lejon)

Dålig struktur och inkonsekvent navigation några vanliga fel

Peter Dahlgren Leave a comment

Jakob Nielsen har skrivit om de tio vanligaste misstagen inom informationsarkitektur på webbplatser.

Top 10 Information Architecture Mistakes

Structure and navigation must support each other and integrate with search and across subsites. Complexity, inconsistency, hidden options, and clumsy UI mechanics prevent users from finding what they need.

Fortfarande är det så att avsaknad av en konsekvent struktur är det vanligaste felet liksom dålig integration mellan sök och struktur. Dessutom används för många olika navigeringstekniker samtidigt som de används inkonsekvent.

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

Peter Dahlgren 3 Comments

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.

Har du rensat din webbplats från skräp på sistone?

Peter Dahlgren 5 Comments

Jag har ägnat stor del den närmsta tiden att rensa upp bland en av mina större webbplatser. Jag menar inte att ta bort spam, utan snarare se över innehållet och ta bort överflödigt material. Som exempelvis att:

  • Ta bort sidor som inte fyller någon funktion, som tveksamt uppfyller målet med webbplatsen. Fråga dig själv: Tar den här sidan mig ett steg längre mot mitt mål?
  • Ta bort sidor med väldigt låg besöksfrekvens. Jag hade en del ”arkivsidor” med gamla nyheter som kunde tas bort. Dessa växer ganska snabbt och blir svåra att överblicka för en besökare. Den interna sökmotorn får ta dess funktion i stället.
  • Byta ut mängder med webbadresser från långa och hierarkiska, /omoss/redaktion/profile.aspx?userid=1, mot enklare och plattare diton, /profile.aspx?userid=1. Av någon anledning känner jag större kontroll över att ha få kataloger på webbplatsen, där jag kan överblicka dess innehåll lättare.
  • Försöka uppmärksamma de delar som är av betydelse och promota desto mer. I mitt fall är registrering för ett nyhetsbrev samt fakta kring annonseringsmöjligheter viktiga saker jag ville framhäva. Det ger både fler besökare och klirr i kassan. Kom ihåg att ju fler valmöjligheter desto mindre får man gjort. Försök begränsa dig till några få. Du känner din webbplats bäst och borde veta vad som är bäst för besökaren.

Kvar finns ett par kärnfulla huvudavdelningar som jag nu ska lägga all kraft på, och som besökaren faktiskt tittar på. Skriva mycket om lite, i stället för lite om mycket. Nisch är bra.

Dessutom minskar min ångest. Jag har få sidor att göra riktigt bra, i stället för hundratals att göra halvhjärtat. Produktiviteten ökar och kvaliteten likaså.

Jag har tittat i statistiken för att se hur mycket besök varje sida har. Är den låg kan sidan tas bort. Kom också ihåg att låg besöksfrekvens inte nödvändigtvis innebär en dålig sida. Det kan mycket väl vara så att informationen är svår att hitta. Ta reda på om så är fallet innan du kapar webbplatsen längs fotvalven. Du kan också testa att slå ihop två sidor till en, om de har snarlik information.

Huvudtanken är att du ska börja fundera på om allt verkligen behövs, och om det uppfyller din målsättning med webbplatsen. Har du inget mål är det på tiden att du skaffar dig ett. Ta och gör en Moscow-analys.

Specialare om användbarhet

Peter Dahlgren Leave a comment

Under min frånvaro har jag samlat på mig diverse länkar om användbarhet på nätet:

  • Designa utifrån doften av information

    Att designa utifrån doften av information bygger på en teori om att användare inte har något emot att klicka sig långt ner i en struktur, så länge doften av rätt information blir starkare och starkare.

  • Faceted Metadata

    Hur kan man underlätta för användare då de söker? Skall man lägga allt krut på en sökfunktion eller skall man låta användaren navigera sig till det?

  • Command Links

    Application commands can be presented as buttons or as links, which offer more room for explanation. For primary commands, however, buttons are still best.

  • An Interface to Support Color Blind Computer Users (PDF)

    A new method for adapting digital images so that they are
    suitable for color blind viewers is presented.

  • Hemligheten bakom en användarvänlig sajt

    Förr i tiden satt ägaren till tryckpressen på makten och var dåtidens mediastjärna. Med tiden axlade publicisterna rollen. Och nu är det besökarnas tur. Möt Gerry McGovern – webbgurun som lär dig hur du bygger sajten efter besökarnas behov.

  • Steve Krug – gurun som kan dina användare

    Användbarhetsexperten och författaren till kultboken ”Don’t Make Me Think”, Steve Krug, säger att den som inte gör video lika lättillgängligt som You Tube lika gärna kan låta bli. Internetworld har pratat med gurun om nya trender, metoder och misstag inom webbdesign.

  • Resultat från användningstest av Kronofogden.se

    Teamet bakom Skatteverket.se och Kronofogden.se visar hur de tänkt när de byggt respektive webbplatser.

  • ViewFinder Heatmap

    Find out how people view your website or image and which areas are getting most of the attention. An artificial intelligence service which simulates human visual attention and creates an attention heatmap.

Galleri med med designmönster för interationsdesign

Peter Dahlgren 1 Comment

Hur designar andra när de gör en kundvagn, 404-sidor och kommentarformulär?

Kolla in Interface design patterns. Även Yahoo har en samling av designmönster som man kan hämta inspiration ifrån. Det är ju ofta så att man vet vad som är bra när man använder det, men kan ha svårt att sätta fingret på detaljerna när man själv ska leva upp till bevis.

Läs också Vad kännetecknar god interaktionsdesign?

(Via Baekdal)

Sökmotorer är inte smartare än den data som petas in i den

Peter Dahlgren 1 Comment

Funderar du på att använda en egen sökmotor till din webbplats? Tänk på att en sökmotor aldrig kan bli smartare än den data som den indexerar.

Ett vanligt exempel jag ofta sett är sökmotorer på e-butiker som säljer vissa typer av produkter. Ofta kan man söka efter produktnamn, beskrivning och artikelnummer. Men om man söker efter ”kameror” eller ”cyklar” så hittar sökmotorn ingenting. Den är konstruerad att leta efter produkter, inte typer av produkter.

Att tro att man kan installera en sökmotor och låta den sedan sköta sig självt är naivt. Den behöver matas med nyttig information hela tiden. En sökmotor är mycket mer komplicerad än att matcha ord med varandra.

Jag testade dessa exempel:

Sök efter ”köksmöbler” på Ikea.se. ”Inga träffar” blir svaret. Naturligtvis finns det massor av köksmöbler hos Ikea, men man måste använda navigationen för att se dem. Sökmotorn klarar bara specifika produkter, vilket jag sällan lägger på minnet (undantaget bokhyllan Billy som jag av någon anledning alltid kommer ihåg).

Sedan har vi ett annat problem. Variationer av ord. Vanligtvis när jag söker använder jag pluralis, ”kameror” i stället för ”kamera”. Problemet med produkter är att produkten i sig är en ”kamera” och därför genererar inga träffar när man söker efter ”kameror”.

För att komma runt det här problemet (bland många andra) brukar man använda en kontrollerad vokabulär. Det är en sorts ordlista som beskriver vilka ord som ska användas, variationer av ordet, synonymer och besläktade ord. Det ger också en hjälp när man skriver texter, eftersom föreslagen stavning och böjning av ord kan ge texterna ett mer enhetligt intryck.

Vanligtvis brukar man ta varje produkt och koppla den till en post i vokabulären. Men en sådan koppling är inte nödvändig. Det går också att låta sökmotorn leta efter besläktade ord automatiskt. När användaren skriver ”kameror” i sökrutan utvidgar sökmotorn resultat till ”kamera, kompaktkameror, digitalkameror, filmkamera, videokamera, systemkamera och fotoapparat”. Även om ordet ”kameror” aldrig förekommer i någon text, kan sökmotorn hitta det användaren letar efter ändå. Magiskt.

Nya problem uppstår givetvis då. ”Fil” är ett ord som kan betyda många saker (en så kallad homonym). Vad sägs om datafil, vägfil, filmjölk, bågfil med flera. En sökmotor kan inte veta vilken betydelse du letar efter.

Mer om kontrollerade vokabulärer i framtida artiklar.

6 sätt att fixa en förvirrad informationsarkitektur

Peter Dahlgren Leave a comment

Jakob Nielsen har kommit ut med en ny artikel: 6 Ways to Fix a Confused Information Architecture.

When your website’s users consistently go to the wrong sections, you have many options for getting users back on track, from better labels to clearer structure.

Problemet består i huvudsak av två eller fler avdelningar som förväxlas med varandra. Här är sex snabba lösningar på problemet, saxat från artikeln:

  1. Slå ihop liknande avdelningar.
  2. Byt namn på avdelningarna.
  3. Förklara de olika valen.
  4. Strukturera om webbplatsen.
  5. Flytta runt informationen.
  6. Lägg till länkar mellan innehållet.

Vi läser webbsidor i ett F-format mönster

Peter Dahlgren Leave a comment

När vi läser webbsidor går våra ögon runt på sidan som bokstaven F. Vi skannar först två horisontella linjer och sedan en vertikal.

Heatmap

Det skriver Jakob Nielsen i sin senaste Alertbox F-Shaped Pattern For Reading Web Content.

Jakob har testat 232 användare i hur de läser på några utvalda webbplatser på nätet. Så här gör de:

  1. Först läser de i en horisontell rörelse, vanligtvis i den övre delen av innehållet. Det är detta som formar F:ets översta linje.
  2. Därefter går användarna ned en bit och läser nästa horisontella rörelse. Men denna är inte lika omfångsrik som den första.
  3. Nästa steg är att skanna igenom innehållets vänstra del genom en vertikal ögonrörelse. Ibland går det långsamt och systematiskt, ibland snabbt. Denna vertikala rörelse formar stommen på bokstaven F.

Ibland är mönstret inte lika uppenbart, utan kan vara mer mot ett E eller upp-och-nedvänt L. Men generellt menar Jakob att F dominerar.