Ny hemsida – av barn, för barn
Vi har träffat och lyssnat på nästan hundra barn för att skapa en hemsida som verkligen är till för dem. Med en mobilanpassad design, tydligare navigation och ett lekfullt utseende har vi skapat en mer tillgänglig och användarvänlig hemsida för alla barn.
Projektöversikt
I maj 2023 inledde vi ett projekt för att utveckla en ny navigation och design för vår hemsida för barn. Målet var att göra hemsidan mer användarvänlig och tillgänglig för barn. Den gamla hemsidan var svårnavigerad och komplicerad, vilket ledde till att barn ofta hade svårt att hitta relevant innehåll och istället vände sig till chatten för tekniska och praktiska frågor som till exempel inloggning. Feedback från barn visade en tydlig önskan om förbättringar, vilket blev startskottet för projektet.
Involvering av barn
Totalt deltog 87 barn i åldern 10–18 år i projektet, varav 42 fysiskt och 45 digitalt. Workshops och enkäter genomfördes både digitalt och fysiskt i Stockholm (Farsta, Lidingö och Husby).
Under fas 1 av projektet samlade vi in barns åsikter om den nuvarande hemsidan. Detta gjordes genom en SUS-enkät (System Usability Scale), för att utvärdera användbarheten, publicerad på bris.se. Vi besökte även en grundskola och två fritidsgårdar i Stockholm för användartester. Barnen fick utföra uppgifter på hemsidan och uppmuntrades att prata högt om sina tankar och upplevelser.
Utmaningar och lösningar
- Små händer:
Yngre barn har mindre händer. På större mobilskärmar är det svårt för barn att nå till menyfunktioner som oftast placeras högst upp till höger/vänster.
Lösning: Vi har placerat viktiga funktioner som hamburgermeny, sökfunktion och en snabbåtkomst till stödfunktionerna längst ned på skärmen i stället. - Separerat barn- och vuxeninnehåll:
Barn hamnar ofta fel när barn- och vuxeninnehåll har delat på samma yta. Barn har berättat att de misstagit våra insamlingssidor för stödfunktioner och ibland hamnar barn på pressmeddelanden om de använder sökfunktionen.
Lösning: Vi har valt att dela upp barn- och vuxeninnehåll och gjort bris.se till enbart barnens startsida. Vuxeninnehållet går att hitta från olika sökvägar, via bland annat hamburgermeny och footern. Vi har tagit beslutet att barnen ska slippa leta sig till sitt innehåll och slippa hamna fel från början. - Tillgänglighet:
Användare idag har olika förutsättningar och alla ska kunna nyttja vår hemsida.
Lösning: Innehållet på vår hemsida är godkänt enligt Web Content Accessibility Guidelines (WCAG), som är en samling riktlinjer för att öka tillgängligheten på internet för användare med funktionsvariationer. Alla färgkombinationer (text mot bakgrund) har kontrastgranskats och godkänts, våra rörliga objekt har pausknappar och alla karusellfunktioner har paginering (numrering). På våra vuxensidor finns en funktion som heter "Talande webb" som kan läsa upp text på webben åt dig. Samma funktion kommer till barnsidorna efter sommaren. Den som vill ta del av vårt innehåll på ett annat språk kan enkelt installera en plug-in som översätter text till valfritt språk. Alternativt använda inbyggda översättningsverktyg i olika webbläsare. - Förenklad navigation:
På hemsidan finns det mycket innehåll som exempelvis självhjälpstexter och övningar skrivna av kuratorer, men dessa har stundtals varit svåra att hitta.
Lösning: Vi har förenklat navigationen och gjort om menyer som hamburgermenyer och footer. Vi har lagt mer innehåll på startsidan så att allt går att hitta även därifrån. - Annorlunda skrollbeteende:
Barn har ett annorlunda skrollbeteende än vuxna och förväntar sig att innehållet aldrig ska ta slut.
Lösning: Våra sidor innehåller fler element än tidigare vilket gör att sidorna blir längre och mer skrollvänliga. I slutet av varje sida finns länkar till relaterade sidor för att aldrig lämna användaren utan en tydlig väg vidare på webben. - Fler sätt att hitta till stödet:
Barn har svårt att hitta till både inloggningen och stödfunktionerna och vill ha fler länkar och enklare navigering.
Lösning: Vi har använt en så kallad ”sticky CTA” som ligger längst ner på skärmen för snabbåtkomst till stödfunktionerna. En sticky CTA är en knapp som alltid följer med oavsett vilken sida du besöker. Detta gör att barnen har snabb åtkomst till exempelvis chatten var de än befinner sig på webben. - Mobile first:
Över 70 procent av all trafik till vår hemsida kommer från en mobil enhet.
Lösning: I dag är det självklart att designa för mobile first och så även vår hemsida. De flesta funktioner fungerar bäst från mobilvy. - Lekfullt utseende:
Barn har uttryckt att vår hemsida är tråkig och önskat ett gladare och mer lekfullt utseende.
Lösning: Vi har färgkoordinerat innehållet och använder oss av färger i olika block på webben på ett helt nytt sätt. Vi har tagit fram en ny färgpalett av gradienter från våra ursprungsfärger, för att ha fler färger till godo. Flera illustrationer är nya och förbättrade. - Anonymt utseende:
Barn har berättat att de önskar ett mer anonymt utseende på vår hemsida och att vår logotyp skulle försvinna vid skrollning.
Lösning: I mobil så försvinner logotypen när du har skrollat nedanför heroytan.
Respons och återkoppling
Barnen har överlag gett positiv respons, särskilt de barn som deltog i våra två workshops och fick se både den gamla och den nya hemsidan.
Röster från barn som deltagit i våra användartester:
Samarbetspartners
Design och prototyp togs fram av UX- och UI-designers på HiQ, och den tekniska implementeringen utfördes av systemutvecklarna på Rutin.
Slutsats
Projektet har fokuserat på att förbättra användarupplevelsen för barn på bris.se genom att lyssna på deras feedback och involvera dem i utvecklingsprocessen. Med en mobilanpassad design, tydligare navigation och ett lekfullt utseende har vi skapat en mer tillgänglig och användarvänlig hemsida för alla barn.