Arkiv för kategori ‘Webben’

Intressanta gränssnittsdetaljer

onsdag, 10 juni, 2009

Här följer ett utplock av mer eller mindre intressanta gränssnittsdetaljer jag har stött på den senaste tiden. Huruvida tjänsternas användare faktiskt förstår dessa designlösningar låter jag dock vara osagt…

Buzzword

Buzzword är Adobes flashbaserade ordbehandlare. Snyggare än Google Docs men å andra sidan segare att ladda in. Buzzword har valt att visa antalet sidor i scrollbaren:

Scrollbaren i Buzzword visar dokumentets antal sidor

Att det finns många användare på nätet som uppskattar gulliga bilder används på detta sätt:

En bild som visar när anslutningen till Buzzword har blivit avbruten

Boken Mental Models

Nedan följer ett exempel på hur boken Mental Models visualiserar hur långt varje kapital är. Det kan dock ifrågasättas om det är ett kapitels sidantal som motsvarar hur lång tid det tar att läsa något…

En visualisation i boken Mental Models som visar hur långt ett kapitel är

Classics

Classics, ett iPhone-bokprogram som innehåller många av de gamla bokklassikerna, indikerar på ett diskret sätt hur långt man har läst en bok.

En bild på bokprogrammet Classics

All Recipes

Ett annat snyggt och smidigt iPhone-program är All Recipes. Förutom en sökfunktion erbjuder också programmet en så kallad ”Dinner spinner” för den som vill ha ett förslag på ett recept. Roligt, snyggt och framförallt effektivt.

En "Dinner Spinner" används i receptprogrammet All Recipes när man ska leta efter recept.

Skim

Om du är en flitig PDF-läsare, macanvändare samt tycker att Förhandsvisning/Preview inte riktigt räcker till kan jag rekommendera PDF-läsarprogrammet Skim. Programmet visar ett spår av hur du som användare har klickat i innehållsförteckningen genom att ändra kapitlens bakgrundsfärg. Mörk bakgrundsfärg betyder att du nyligen har klickat på kapitlet, ljus att du klickade på kapitlet för ett tag sedan. Smidigt när man tex. har glömt bort vilket kapitel som redan har blivit skumläst.

Innehållsförteckningen i Skim visar ett spår över hur du tidigare har klickat.

Obegripliga URL:er hos Kanal5

onsdag, 19 september, 2007

Kanal5 lanserade enligt IDG.se en ny hemsida igår. Precis som en av kommentarförfattarna påpekar så har sidan gräsligt fula och långa URL:er. Ett exempel på en adress är:
http://kanal5.se/web/guest/hem?p_p_action=0&p_p_id=K5JOURNAL
_VIEWER_INSTANCE_1Mn6&_K5JOURNAL_VIEWER_INSTANCE_1Mn6_struts
_action=%2Fk5journal%2Fview&_K5JOURNAL_VIEWER_INSTANCE_1Mn6
_articleId=53248&_K5JOURNAL_VIEWER_INSTANCE_1Mn6_groupId=1701&
_K5JOURNAL_VIEWER_INSTANCE_1Mn6_version=1.0

Semantiska och korta webbadresser ger flera fördelar:

  • De är enklare att komma ihåg
  • Sökmotorer värderar ofta en semantisk URL högre än en osemantisk
  • Användaren kan se den hiearkiska strukturen på sidan
  • Du riskerar inte att mailprogram bryter upp en webbadress på flera rader

Även Vägledning 24-timmarswebben skriver om att långa och krångliga webbadresser ska undvikas.

Smidig bilduppladdning hos Flickr

onsdag, 29 augusti, 2007

Flickr har fått en relativt ny webbaserad bilduppladdningssida som är väldigt smart. Eftersom jag aldrig blivit vän med de bilduppladdnignsverktyg som finns har jag stört mig på att den webbaserade uppladdningen var så omständig och tidskrävande, till exempel så kunde man bara välja en fil i taget från sin dator och endast sex stycken filer kunde laddas upp i samma omgång.

I den nya versionen finns inte längre dessa begränsningar, du kan exempelvis på en gång markera flera filer du vill ladda upp och användaren får hela tiden en bra återkoppling på vad som sker och hur långt uppladdningen har nått (något som även det saknas i den förra versionen). Med andra ord känns det faktiskt som ett ”riktigt” program.

Här nedan följer en lite genomgång om hur det hela fungerar:

Uppladdningsflödet är indelat i tre tydliga steg: välj bilder, ladda upp bilder och beskriv bilder.
Information om att bilduppladdningen sker i tre steg

Det går att välja flera bilder på en gång:
Det går att välja flera filer på en gång

En av nackdelarna med traditionell filuppladdning är att det är svårt att veta hur lång tid det är kvar innan en fil har blivit uppladdad till webbservern. Flickr löser det hela på ett smidigt sätt:
Användaren presenteras med information över hur långt filuppladdningen har fortskridit

I det sista steget så beskriver användaren sina bilder genom att lägga till taggar, titlar och beskrivningar:
I det sista steget så beskriver användaren sina bilder

Matfotografering på högsta nivå

söndag, 14 januari, 2007

Björn Lindberg är en av Sveriges (kanske världens?) bästa mafotografer.

I höstas fick jag äran att tillsammans med Björn arbeta fram hans nya webbplats. Resultatet ser du nedan:

Matfotografen Björn Lindbergs hemsida

En knapp mindre

torsdag, 4 januari, 2007

Alla borde sträva efter att göra saker enklare. Ett smart sätt att minska antalet knappar i en kundkorg är att göra som Acne Jeans (eller snarare deras e-handelsleveratör Panagora Room).

De flesta e-handlare har både ett fält för antal samt en ta bort-knapp:

NetonNet:s kundkorg

Amazons kundkorg

Acne Jeans slår två flugor i en smäll genom att kombinera antal och ta bort till en enda funktion. Klickar du på pluset ökas antalet, klickar du på minuset (förutsatt att antalet är 1) så tas varan bort:

Acne Jeans kundkorg

Nya GP.se glömde mellanrummen

onsdag, 8 november, 2006

GP.se är svårläst

Jag antar att de inte har läst Vad lite mellanrum kan göra på webben.

Hemmablinda

söndag, 29 oktober, 2006

Båda två sysslar (bland annat) med kartverksamhet. Båda två missar möjligheten att hänvisa till en karta på deras kontaktsidor.

På Googles kontaktsida finns ingen länk till Google Maps

På hitta.se:s kontaktsida finns ingen länk till deras karttjänst

Krishantering à la Tele2

måndag, 28 augusti, 2006

På dn.se (samma nyhet var publicerad på andra stora nyhetssidor också):
DN.se skriver om Tele2:s problem

Samtidigt hos Tele2:s förstasida:
Ingen information om problemet på Tele2:s hemsida

Vad är en banner?

tisdag, 15 augusti, 2006

För några dagar sedan kunde man i DN se denna annons från flygbolaget Sterling:

Vad är en

Jag undrar hur många som vet vad en banner är.

Vad betyder HTML?

måndag, 14 augusti, 2006

På Bredbandsbolagets administrationssida (som även har titeln ”temInvoiceList”) finns det en funktion för att se sina fakturor. Formaten som en räkning kan visas i är PDF och HTML. PDF börjar bli ett känt filformat, HTML däremot tror jag det är få som känner till.

Bredbandsbolagets fakturasida

Många företag erbjuder också sitt nyhetsbrev i två versioner: en textversion och en HTML-version.

HTML eller Text?

Även Google använder begreppet HTML när PDF-filer visas i deras sökresultat.

Se som HTML-version

Vad ska man då skriva istället? ”Visa” och ”Ladda ner som fil” tycker jag är en klart enklare beskrivning av vad man kan göra med sin räkning. De som inte har en susning av vad HTML är för något (med andra ord större delen av Sveriges befolkning) kan nu enkelt få fram sin räkning. Eventuellt skulle man kunna lägga till ”PDF” inom en parentes efter ”fil”, samtidigt tror jag att många som väljer att spara ner fakturan till sin hårddisk är vana datoranvändare och då i webbläsarens statusfält kan se vilken filändelse det är.

Skickar man ut ett nyhetsbrev både i en HTML-version och ett med ren text, kan man skriva ”med bilder” och ”utan bilder”. De som vet vad HTML är för något räknar snabbt ut att brevet med bilder troligtvis skickas i HTML och de som inte vet betydelsen av HTML kan ändå enkelt göra ett val.

Googles användande av begreppet HTML är svårare. Ett tag tänkte jag att ”Visa som ren text” skulle vara bättre, men det är det ju inte eftersom det är HTML. Ibland kan det dock vara bättre att gå ifrån teknisk korrekthet för att göra det mer enklare för majoriteten av användare att förstå vad det handlar om. Har du något bra förslag?