webbdesign

Jag har de senaste dagarna jobbat om några saker på denna hemsida. Skillnaden på undersidorna är inte så stor; det som har hänt är att menyn har flyttats längre till höger och att sökrutan ändrat färg och blivit lite större, i övrigt är det mesta intakt på undersidorna.

Den stora förändringen, som är ganska radikal, är den helt omgjorda startsidan. Jag har länge funderat på och studerat startsidor på olika webbplatser. Det som är klart är att startsidan ofta är den sidan som får sticka ut och vara lite annorlunda än de andra. Ofta innefattar detta en stor banner eller liknande som visar på att det är en startsida. Jag har dock kommit över några webbplatser där man tydligt har försökt hitta startsidans syfte och mål, och därefter gjort något helt radikalt - man vill att den ska sticka, vara speciell mer än bara en banner.

Min tanke med min nya startsida är att lyfta fram portfolion ett steg till men ändå ha ett ganska stort fokus på mig. Bloggen däremot ligger i botten på sidan och har inte alls en lika framträdande roll. Min tanke är att förstagångsbesökaren tydligt ska se vem sida de kommit till och vad den innehåller. Den andra radikala saken på sidan är att hela bakgrunden är blå istället för den ljusgrå som det är på de övriga sidorna. Tanken med det är att sidan ska vara unik och fokusera på innehållet mer i en hierarkisk ordning: mig, portfolion och sist bloggen.

Gamla utseendet på startsidan

Jakob Nielsen skulle säkert slita sitt hår med en sådan här manöver, men jag tror ändå att detta är trender vi kommer få se mer av: att låta vissa sidor sticka ut från den generella strukturen och designen på sidan.

Sist så har även portfolion uppdaterats med en webbplats till: Ingmarsspelen.se.

Man ser att allt fler som bygger nya webbplatser inte bryr sig om dem som använder Internet Explorer. Alla som jobbar med webbplatser vet vilken pina det är att hela tiden anpassa så att det funkar okej även i den webbläsaren. Förra året var det flera av de stora aktörerna som började ta avstånd från Internet Explorer 6 genom att lägga till varningar som visas för den som surfar på webbplatsen med just den webbläsaren.

I och med intåget av CSS3 och andra nya tekniker så har webbutvecklandet blivit markant enklare, dock så verkar Microsoft inte vilja vara med på det tåget och deras webbläsare stödjer inte detta. Det trevliga är, tycker jag, att allt fler struntar i Internet Explorer-användare och använder sig av CSS3 utan att göra någon anpassning till IE. Några exempel är Sverigesradio.se som har runda hörn på innehållsfältet, en mycket trevlig funktion i CCS3, som dock inte IE stödjer, och alla som inte använder en modern webbläsare får således kantiga hörn.

Ett annat exempel är YouTube som använder en snygg toning och skuggad bakgrund på knapparna man väljer sida med längst ned. IE-användare får en tråkig fyrkant till knapp i stället.

Det känns ändå bra att allt fler börjar gå ifrån att utgå från IE-användaren och i vissa fall inte göra någon speciallösning för denne. Naturligtvis kan man inte alltid strunta i IE-användaren då många trots allt använder sig av den, men förhoppningsvis kan detta göra att fler väljer bra och moderna webbläsare istället.

En trend som inte riktigt slagit igenom än inom webbdesignen är väldigt breda sidor. Det har tidigare diskuterats en del om att ha webbplatserna i flexibel bredd, utan att det slagit igenom riktig. Genom att enbart använda procent kan sidan lätt te sig konstigt i många upplösningar. Nu börjar det dock komma en del varianter där javascript används för att anpassa innehållet efter besökarens upplösning. Detta gör att allt mer av skärmens yta kan användas och att användarupplevelsen ofta blir bättre.

Schibstedt har på både SvD.se och Aftonbladet.se gått ifrån att bygga webben för upplösningar på 1024px och breddat sidorna till att vara anpassade för 1280px istället. De har dock valt att inte göra sidorna flexibla vilket gör att högerspalten försvinner för dem som har en upplösning på lägre än 1280px i bredden. Personligen tycker jag det är helt rätt då de allra flesta har högre varianter av upplösningar.

I A List Apart läste jag en väldigt intressant artikel om "responsive web design". I artikeln visar de hur man kan arbeta med bilder i en flexibel design på ett snyggt sätt. Detta är något som jag tycker fler webbyråer borde ta fasta på. Tänk en magasinwebb eller liknande där du får artiklar och artikelbilder mycket större än vad som ofta ges i dagens läge, vilket större intryck sidan skulle kunna ge.

Ett väldigt bra exempel på en sida som utnyttjar sidans bredd är den nyligen lanserade Sjoraddning.se som Forsman & Bodefors skapat på ett föredömligt sätt (som så ofta när de gör saker). Sidans högerspalter lägger sig olika beroende på hur hög upplösning du har och de ger ett väldigt mäktigt intryck. Ericsson, som också lanserade sin nya webb nyligen, har gjort någon mitt emellan och breddar sidan någon när man har en högre upplösning, vilket är ett steg i rätt riktning.

Jag tror och hoppas att detta är något som vi kommer få se allt mer av framöver.

Ingmarsspelen är ett av tre dalaspel av Rune Lindström. Handlingen är baserad på Selma Lagerlöfs mycket läsvärda bok Jerusalem I Dalarne från 1901, som i sin tur bygger på en sann händelse där 37 Nåsbor lämnade landet för att söka lyckan i det heliga landet.

Den nya webben är tänkt att visa en bild av det drama som spelet är och besökaren ska kunna se spelets stämning redan här.

Stort på startsidan ser man även Selma Lagerlöfs introduktion till boken:

“Det var en lång, ganska bred dal, som var rutad av en massa gula och gulgröna sädesfält och dessutom av slagna klövervallar, av blommande potatisland och av små, blåblommiga linåkrar, som översållades av en ofantlig mängd vita fjärilar.”

Webbplatsen bygger på publiceringsverktyget Drupal som i det här fallet är implementerad av duktige Mikael Wiberg.

Sidan finner du på www.ingmasspelen.se

Internetworld har idag en genomgång av några olika stadsteatrars webbplatser. Med bestört förvåning ser jag att Östgötateatern får hela 7 av 10 i betyg. Jag dissade deras webb i ett inlägg för cirka ett år sedan.

Så här ser Östgötateaterns webb ut idag - liksom för ett år sedan.

Östgötateaterns webbplats är som en skymf mot besökaren. En enormt spretig webbplats med en design som knapp hade varit godkänd 1999. Östgötateatern har kanske en av Sveriges finaste teaterbyggnader och salongen är magnifik. Av denna känsla visas inget på webbsidan. Grått och konstiga toningar är nästan det enda man ser; de snygga detaljerna som en sådan här sida är förtjänt av lyser med sin frånvaro.

Det enda. lilla, pluset jag kan ge till denna texterna på sidan är helt ok - dock inte så säljande och bra som Internetworld menar (har de verkligen läst?).

Ett obligatoriskt moment för dem som skapar webbplatser av detta slag är att se hur GöteborgsOperan gjort. Mer genomtänkt och välgjort är det nog få som ens kommer i närheten av.

Internetworld ger Uppsalas stadsteater - mycket välförtjänt - bäst betyg.

För att man ska få en effektiv webbplats krävs det idag många olika sorter roller som bidrar till detta. Min erfarenhet är att när man bygger en ny webbplats fokuserar man ofta på tekniken - det måste bli enklare att lägga upp saker på webben - och  i viss mån även på utseendet (även om detta allt för sällan verkar vara viktigt). Något som ofta får styrka på foten eller ses som sekundärt är information, innehållet på sidan.  "...texter kan väl alla skriva." är en inte helt ovanlig inställning till detta. Det är också därför allt för många webbplatser, allt från offentliga till stora webbshoppar, som är oerhört svåra att förstå och som inte lyckas framföra budskapet.

Fredrik Wackå skriver om vikten att "skriva för effekt". Jag kan inte hålla med honom mer. En webbplats behöver en webbredaktör med förståelse om sidan syfte. Det gäller inte att lägga ut information utan det gäller att lösa ett problem för besökaren.

För att detta ska lyckas så krävs det en strategi för webbplatsen. Har man inte en strategi med målfokus blir det snabbt spretigt och sidan kommer säkerligen att ge ett ogenomtänkt intryck. Frågan varför? ska alltid finnas med på allt man gör och allt man lägger till på sidan och detta ska vara utmynnat från den strategiska plan man har med webbplatsen.

Idag räcker det inte med att bara låta en webbyrå skapa en ny webbplats utan det krävs ett helhetstänk med en tydlig och långsiktig strategi där flera roller samarbetar mot samma mål.

I dagarna lanserade Sydsvenskan syn nya webbplats, en webbtidning som modigt väljer att inte följa gängse standard som så många andra webbtidningar följer. Kritiken har varit ganska stor och många gillar inte det nya upplägget, något som troligtvis är någon form av rädsla för det man inte direkt känner igen.

Sydsvenskan nya layout

Medietidningarna har varit snabba på att ta upp Svenskans nya upplägg (Dagens Media, Resumé 1, Resumé 2, CA&Design och Medievärlden) och på Twitter har kommentarerna varit många.

Själv tycker jag det är ganska bra och intressant att de vågar gå sin egen väg och utifrån den analys de gjort av besöksstatistiken så har det skapat ett upplägg som inte har prövats bland de större webbtidningarna. Upplägget med en snurra i toppen har dock funnits länge, Nyheter 24 är nog något de tittat på när de skapade den. De ändrade också snabbt den avlånga snurran de först testade till en med puffarna under. Det måste ses som en ganska stor miss att man bara efter en dag måste göra omstruktureringar i layouten.  Den nya varianten är dock betydligt bättre och mer överskådlig.

Så här såg gamla snurran ut. Bilden lånad från Resumé

Annars så tycker jag faktiskt att det finns en rad frågetecken kring deras nya sida. Den känns lite plottrig och den stora snurran högst upp innehåller faktiskt en del "gamla" nyheter, men det är kanske en tanke bakom det att lyfta fram de större nyheterna. Ska man göra det måste man också tydligt visa på de aktuella sakerna på sidan.

Sektionen Senaste nytt som är det allra senaste innehåller enbart rubrik, kategori samt en pytteliten artikelbild. Jag tror just utseendet på detta är det som gör att sidan känns svårnavigerad och ger ett rörigt intryck. Att ha så små artikelbilder känns bara dumt, speciellt om man ser att klockslaget när nyheten publicerades är nästan lika stort. Jag skulle personligen vilja se större tumnagelsbilder och en kort ingress till artikeln. Detta skulle lyfta hela denna sektion och rörigheten skulle försvinna.

Scrollar man ner på sidan tills precis under senaste videoinslagen blir det genast luftigt och fräscht. Lagom stora tumnaglar, tydlig rubrik och allmänt trevligt. Varför är inte detta högre upp?  Så här rent och snyggt kunde senaste nytt se ut!

Jag tror också att man skulle kunna slippa stor del av kritiken om att sidan känns rörig om de hade varit mer noggranna med detaljerna. Senaste nytt ovan är ett exempel. Läsarreaktionerna man kan ge - som är en exakt kopia av Newmills idé - känns rörig och svår att direkt förstå. Man kräver nästan att besökaren måste läsa och leta för att ge uttryck för sin känsla. Det tar två sekunder, men skapar ändå en liten onödig irritation hos läsaren. Newsmill har gjort detta riktigt bra och det är också något som gjort att Newsmill känns mer modern i detta sammanhang.

Så här ser Sydsvenskans variant ut, Inte jätteestetisk.

Newsmills känslomätare är desto snyggare.

Den sista saken jag tänkte på är att man under varje artikel kommer direkt till sidfoten. Flera tidningar väljer att låta förstasidan  vara kvar under artikeln så att man bara kan scrolla vidare ner istället för att klicka sig bakåt och börja om. De flesta studier inom detta område visar ju att människor är beredda på att scrolla.

Överlag är det ändå en spännande och lite banbrytande satsning som Sydsvenskan gjort. Jag tror dock att mottagandet hade blivit bättre om de satsat mer på detaljer och på så sätt fått bort den röriga känslan man nu lätt får. 

Nyligen fick Linköpings fotbolldomareklubb en ny webbplats. Designen är gjord av mig medans Freddy Engström stått för det tekniska. Fokuset på webbplatsen har varit de interna sidorna för klubbens medlemmar, som är en del av webbplatsen som fått ett riktigt bra lyft.

Råkade av en slum se Lärarnas Riksförbunds nya webbplats och blev riktigt positivt överraskad. Jag gillar skarpt deras A-Ö i botten på sidan. Det är lite av en trend att ha så, men i bland tar det för mycket plats eller på annat sätt gör det krångligt. Här passar den alldeles utmärkt.

Igår lanserade Alingås sin nya webbplats. Det innebär att de är den andra kommunen efter Vansbro som använder Drupal som publiceringsverktyg.

Sidan då? Inga krusiduller, men ändå en stilren sida. Det måste kännas befriande för alla redaktörer som nu slipper knacka html.