Så är en riktigt bra webbplats – enligt våra utvecklare

1. Responsivitet

“Den är anpassad till alla storlekar och enheter”

Det första som avslöjar att en webbplats är utdaterad är att den inte är anpassad till olika skärmar. Det är 2023 och webbplatser är inte reserverade för datorer längre! Idag är det en självklarhet att din webbplats ska fungera lika bra i olika skärmar och i olika webbläsare och det var därför en av de första sakerna våra utvecklare listade bland kriterierna för vad en bra webbplats är. Den kan omöjligt anses vara bra om inte detta grundläggande krav uppfylls.

2. Tillgänglighet

“Alla ska kunna använda en webbplats”

För att en digital produkt ska kunna användas av alla människor, oavsett eventuella funktionsvariationer, finns det vissa riktlinjer man bör följa. Det gör att webbplatsen blir tillgänglig för så många som möjligt och det bör vara intentionen för alla webbplatser som byggs idag.

2025 börjar Tillgänglighetsdirektivet tillämpas som lag i Sverige. Det är ett direktiv från EU som säkerställer att fler produkter och tjänster blir mer lättillgängliga, däribland e-handel och mobilapplikationer. Därför är det en bra idé att redan nu se över dina digitala produkter. Direktivet grundar sig i de internationella riktlinjerna WCAG som du kan lusläsa här.

3. Tydliga feedback-signaler

“Det är tydligt att det händer något när man t.ex. klickar på en knapp”

Tänk dig t.ex. att du fyller i ett formulär och klickar på “Skicka” men sen händer ingenting. Då undrar du nog om meddelandet verkligen har skickats. Det ska aldrig behöva hända. Därför ska din webbplats informera användaren om vad som händer med hjälp av feedback på användarens interaktioner.

Genom att ge feedback om att meddelandet håller på att skickas (en loading spinner), att det har skickats (Tack för ditt meddelande!) eller att något gick fel (felmeddelande) blir det tydligt för användaren vad som händer.

Med hjälp av väl uttänkta feedback-signaler kan man förstärka användarens upplevelse och minimera friktion. Exempel på tillfällen när man förväntar sig feedback:

• Hover-effekter. Alla klickbara element behöver ge någon form av feedback när man för muspekaren över dem, för annars vet man inte att det är klickbart. De kan t.ex. ändra storlek, färg eller form.
• Laddning. Berätta för användaren att något laddar, så den vet att det är värt att vänta.
• Framsteg. Visa med hjälp av en progress bar när man tagit sig längre fram i en process.
• Fel- och bekräftelsemeddelanden. Berätta för användaren när den gjort fel eller lyckats med en uppgift.

4. Tydligt budskap

“Det är tydligt vad företaget gör”

Du har bara några sekunder på dig att få fram ditt budskap, så det gäller att vara oerhört tydlig med vad du vill få sagt. Tro inte att din besökare kommer att läsa igenom tunga textblock. Den kommer istället snabbt scanna igenom sidans rubriker och bilder för att bilda sig en uppfattning.

Gör det här testet på din egen site för att se om den förmedlar ett tydligt budskap:

• Vad är det här? (En förskola? En onlineshop?)
• Vad erbjuder de?
• Vad kan jag göra här? (Läsa mer, boka möte, köpa något?)
• Varför ska jag vara här och inte någon annanstans?

Hjälp dina besökare att hitta informationen de letar efter. Har du en restaurang? Då letar besökarna nog efter att boka bord eller se menyn. Har du en butik? Lyft fram adress och öppettider.

5. Aktuellt och korrekt innehåll

“Uppdaterat content skapar en levande webbplats”

När din webbplats är lanserad är det lätt att luta sig tillbaka och tänka att jobbet är klart. Så kan det vara, men den som vill göra ett bra intryck behöver fortsätta jobba med den. Se till att informationen som står är korrekt, och lägg gärna in tillfälliga budskap om någon nyhet eller något säsongsanpassat. Det visar att webbplatsen är uppdaterad och därmed går att lita på.

Det är lättare hänt än man tror att ha gammal information på sin webbplats. Det kan vara en adress som ändrats, kontaktuppgifter till en medarbetare som slutat eller en sida om en tjänst man inte längre erbjuder.

Vi på qte har en stående påminnelse i kalendern var tredje månad om att göra en genomgång där vi läser igenom alla texter och testar att klicka på alla länkar för att se att de leder till sidor som fortfarande finns.

För att enkelt hålla koll på om du har trasiga länkar kan du följa vilka sidor som har tagit besökare till 404 (Sidan kan inte hittas). Det kan du göra i verktyget Google Search Console.

6. Lättnavigerat

“Uppfinn inte hjulet på nytt”

Vad innebär det att en webbplats är lättnavigerad? Jo, att användaren kan klicka sig runt på ren intuition. Den som besöker din webbplats har troligtvis besökt hundratals andra webbplatser innan, och har jobbat in en förväntan på hur de fungerar. För en friktionsfri upplevelse bör du dra nytta av de mönster och invanda beteenden som redan finns, eftersom din användare då kan använda din webbplats på ren intuition. Det kan vara lockande att tänka utanför boxen, men oftast är det en dum idé att uppfinna hjulet på nytt.

Se till att besökaren både kan gå djupare ner i hierarkin, men även ta sig tillbaka upp en nivå utan att behöva börja om från början. Det kan man göra med så kallade brödsmulor, som visar hur den aktuella sidan ligger i förhållande till sina överordnade sidor.

7. Fängslande design

“Den överraskar mig, på ett roligt och oväntat sätt”

Något som gör en webbplats riktigt bra är wow-faktorn. Den ska inte bara vara funktionell utan måste också fånga ens intresse och gärna överraska lite. Fängslande, inbjudande och intresseväckande design var punkter som våra utvecklare tog upp, men också att webbplatsen är enhetlig och har återkommande designelement. Med återkommande färger, fonter och komponenter får webbplatsen en tydlig branding där det inte råder några tvivel om vem som är avsändaren.

8. Välskriven kod

“Den är enkel att underhålla”

Vi kan inte gå igenom listan utan att nämna något om kodbasen! Något våra utvecklare uppskattar med en riktigt bra webbplats är att den är byggd på ett sätt som gör den lätt att underhålla och skala upp. Så när man vill lägga till nya layouter och funktioner finns det en stabil grund som gör vidareutvecklingen både enkel och säker.

Att underhålla en webbplats innebär också att hålla tillägg, plugins och externa tjänster uppdaterade. Det säkerställer både att webbplatsen fungerar som den ska men ser också till att täppa igen eventuella säkerhetshål.

9. Snabbhet

“Sidan laddar in snabbt, helst under en sekund”

Om du klickar på en länk och webbplatsen inte laddas in på någon sekund är chansen stor att du ger upp och går in på konkurrentens sida istället. Webbplatsens snabbhet var en sak som våra utvecklare tryckte hårt på när de satte ihop denna lista. Det är superviktigt för att ge en bra användarupplevelse, och inte minst för att ge dig själv en chans att förmedla det du vill till dina besökare. Ditt innehåll kan vara hur bra som helst, men om besökarna inte orkar vänta på att det laddas in är det ingen som kommer se det ändå.

Dessutom är laddningstiden något som Google tittar på när de rankar din site i sina sökresultat.

Så vad kan man göra för att förbättra laddningstiden?

• Förminska bilder och videos. Det är en riktig hastighetstjuv, och ofta kan du komprimera dina mediefiler väldigt mycket utan att tappa kvalitet.
• Var din webbplats är hostad har stor betydelse för hur snabbt den laddas in. På ett webbhotell som lockar med superlåga priser kan du inte förvänta dig en fantastisk hastighet. Vi levererade en site åt en kund som insisterade på att behålla sin hosting och oavsett hur bra siten var byggd gick den hemskt långsamt, tills vi hjälpte dem att byta hosting till slut. Nu laddar den in på ett kick!
• För dig som vill göra en större förändring och är redo att göra om din site rekommenderar vi att du väljer Gatsby JS som gör att innehållet på din webb renderas på servern istället för i besökarens webbläsare. Det gör stor skillnad för hastigheten. Vi berättar gärna mer om Gatsby JS för dig som är nyfiken.