Digitala ordboken - förstå UX & utvecklarspråk

Här samlar vi några av de vanligaste men också oklaraste termerna inom UX och webbutveckling.

Hoppa direkt till begreppet 👇

Above the fold

Above the fold syftar på ytan & innehållet som syns på en webbsida utan att du behöver rulla neråt. 
Det är det första du ser när du besöker en sida innan du börjar scrolla. 

Därför är det viktigt att placera rätt information och innehåll above fold, och det är ofta en pågående intern diskussion. Vi rekommenderar att lyssna på användarna – varför har de kommit till er sida? Låt deras viktigaste mål och syften guida er.

A/B-testning

A/B-testning är när du testar två olika versioner av något - som en webbsida, ett e-postmeddelande eller en formulär - för att se vilket som fungerar bäst. Till exempel kan du skicka två olika versioner av ett e-postmeddelande till människor och se vilken version som får flest att öppna det eller klicka på en länk.

Det hjälper dig att fatta beslut baserade på faktiska resultat och objektivt förbättra det du gör.

Användbarhetstestning (Usability testing)

Användbarhetstestning går ut på att låta användarna själva prova och utvärdera t.ex. hemsidan. Det är ett mycket bra sätt att ta reda på om er sida eller tjänst faktiskt fungerar och uppskattas, och även hur den kan förbättras. Det är viktigt när du användartestar att inte ställa ledande frågor och ge användarna realistiska förutsättningar, så datan blir så sann som möjligt.

API

API står för Application Programming Interface och är ett gränssnitt som tillåter olika program och system att kommunicera med varandra.
Det fungerar alltså som en mellanhand som tillåter en applikation att använda funktioner eller data från en annan.

Till exempel kan en väder-app använda ett väder-API för att hämta aktuell väderdata från en väderservice in i appen!

CMS

CMS står för Content Management System. Det är en typ av webbapplikation som används för att skapa, redigera och hantera innehåll på en webbplats via en webbläsare. 

Användare kan logga in på CMS:et och använda dess gränssnitt för att lägga till, redigera eller ta bort innehåll på webbplatsen utan att behöva ha djupa tekniska kunskaper.

Exempel på vanliga CMS är Wordpress, Umbraco, Optimizely (tidigare Episerver), Drupal, Joomla, Contentful och Shopify.

CRM

CRM står för Customer Relationship Management och innefattar både strategi och teknik för att hantera interaktioner och relationer med kunder.
Det handlar om mjukvara och processer för att organisera, automatisera och spåra försäljning och marknadsföring. 

En CRM-plattform kan användas för att samla in och analysera kunddata, hantera försäljningsprocessen och automatisera kommunikationen med kunder (som t.ex. nyhetsbrev).

CRO

CRO står för Conversion Rate Optimization, eller konverteringsoptimering på svenska. 

Det handlar om att optimera konverteringar, det vill säga förbättra hur många av besökarna på en webbplats som faktiskt utför önskade handlingar – som att göra ett köp eller registrera sig för en tjänst – genom att testa olika design- och innehållsförändringar för att se vad som fungerar bäst.

CSS

CSS står för Cascading Style Sheets och används för att definiera utseendet och layouten på webbsidor.
Den style:ar och styr hur HTML-koden visas för oss.

Utöver att definiera utseende och layout på webbsidor, spelar CSS en viktig roll i att skapa responsiv design.

Design debt

Design debt är som en ekonomisk skuld men inom design. Det uppstår ibland när man snabbar på designarbetet för mycket, eller väljer en lösning som kanske fungerar för tillfället men inte är optimal på lång sikt. 

Precis som med ekonomisk skuld måste du förr eller senare betala tillbaka design debt genom att göra om eller förbättra designen, vilket kan kosta mer tid och resurser än att göra det rätt från början.

Du undviker lättast design debt genom user research och användbarhetstestning.

Design thinking

Design Thinking är en populär metod för att lösa problem genom att verkligen förstå vad användarna behöver och sedan hitta nya och innovativa sätt att lösa det på, genom att prova och förbättra idéer igen och igen.

Metoden går till såhär:

  1. Empathize: Förstå utmaningen

  2. Define : Definiera problemet

  3. Ideate: Brainstorma fram potentiella lösningar

  4. Prototype: Bygga lösningar

  5. Test: Testa om lösningarna fungerar – annars repetera processen!

Eye tracking

Eye tracking är en intressant metod för att kunna se och följa var användare verkligen tittar på en webbsida.
Den kan ge värdefulla insikter i vilka områden och element av designen som fångar användarens uppmärksamhet och vilka som går obemärkt förbi, samt om produkten eller tjänsten fungerar som tänkt.

Flow chart

Ett flow chart (flödesschema) är ett diagram som beskriver en process och dess steg. Det kan användas för att dokumentera, förbättra och kommunicera komplexa processer så de blir lättare att förstå.
T.ex. används ofta flow charts för att kartlägga kundresor, webbsidans struktur eller databasinteraktioner.

    Framework

    Ett ramverk (framework) är som en byggsats eller verktygslåda för webbutveckling. Det innehåller färdiga bitar av kod och regler som hjälper utvecklare att bygga webbplatser snabbare och mer effektivt. Istället för att skriva all kod från grunden, kan utvecklare använda ett existerande ramverk för att spara tid och göra utvecklingsprocessen smidigare.

    Headless

    Headless kallas en systemlösning som har en frikoppling mellan CMS och presentationslager (det gränssnitt besökaren ser).
    Det gör att innehållet ni skapar för sidan inte är bundet till ett visst CMS eller produkt.
    Behöver ni någon gång byta lösning krävs ingen total migrering eller omtag, utan det går att byta ut och uppdatera de tekniska delarna av er webb separat!

    Med headless har inte längre CMS:et direktansvar för utseende, design och servering av HTML, istället är ansvaret fördelat = vi har inte ett enda allsmäktigt "huvud" utan flera självständiga delar.

    Lär dig mer om headless

    Heuristik

    Heuristik är en term lånad från psykologin som betyder ungefär betyder "att upptäcka" eller "att hitta".
    Inom webbutveckling syftar det ofta på en genväg för experter att lösa problem och ta snabba beslut, baserat på vad de lärt sig från tidigare erfarenheter. 

    Detta kan innebära t.ex. en expertutvärdering av en webbsida eller lösning, vilket är ett tidseffektivt sätt att ta reda på om en webbsida eller tjänst är bra uppbyggd utan att behöva användbarhetstesta (direkt).

    Användbarhetstestning och user research är dock de säkraste och mest definitiva metoderna, då varje målgrupp och tjänst kommer ha unika behov en heuristisk utvärdering oftast inte kan förutse till fullo.

    HTML

    HTML står för HyperText Markup Language och är ett grundläggande kodspråk för att skapa och strukturera webbsidor.
    Man kan säga att HTML bygger sidans kodskelett, och CSS står för utseendet & stylingen av koden.

    Informationsarkitektur

    Informationsarkitektur handlar om att bygga en sidstruktur och arrangera innehållet på en hemsida/app på ett sätt som gör det begripligt och lättnavigerat för besökaren. 
    Navigationen på hemsidan är ofta central för informationsarkitektur, då den är verktyget som hjälper användaren att kunna upptäcka och ta del av hela sidans information och dess olika innehållsnivåer.

    Interaktionsdesign

    Interaktionsdesign eller interaction design handlar om att designa de interaktiva delarna av digitala produkter eller tjänster, t.ex. ett flöde där användaren ska fylla i eller göra något på webbsidan.

    Interaktionsdesign är en del av det bredare UX-begreppet, men fokuserar på momenten då en användare interagerar med en produkt, med målet att förbättra interaktionen och göra den så smidig och tydlig som möjligt.

    JavaScript

    JavaScript är ett kraftfullt programmeringsspråk som används för att göra webbsidor interaktiva och dynamiska.
    Det kan användas för att lägga till olika funktioner och effekter på webbsidor, t.ex. interaktiv formulärhantering, animationer, dynamisk innehållsladdning och mycket mer.

    Om JavaScript-kod är ineffektivt skriven, eller om den överanvänds till en mängd funktioner på webbsidan, kan det leda till längre laddningstider och minskad responsivitet.
    Det är därför viktigt att utvecklare optimerar och använder JavaScript på ett effektivt sätt för att undvika prestandaproblem.

    Responsiv design

    Responsiv design är en designstrategi som gör att webbsidor anpassar sig och ser bra ut på olika enheter och skärmstorlekar, på alltifrån stora kontorsskärmar till de minsta mobilerna. Detta bör vara en självklar prioritering för dagens webbdesign.

    SEO 

    SEO står för Search Engine Optimization. Det är den idag rätt välkända processen att optimera webbsidor och dess innehåll för bättre synlighet och ranking i sökmotorernas, t.ex. Googles, resultat.

    Det som är mindre känt är att SEO är mer än bara ord och texter, det är även mycket viktigt med den tekniska SEO:n, som är inbyggd i koden och hjälper sökmotorerna att ännu bättre förstå och uppfatta vad som finns på webbsidan.

    Server

    En server är en dator eller ett system som lagrar och "serverar" webbplatsens filer och data till användare via internet. Även digitalt innehåll tar upp plats någonstans!

    Technical debt

    Den tekniska motsvarigheten till design debt kallas logiskt nog technical debt, eller teknisk skuld.
    Det beskriver konsekvenserna av att välja en snabb men mindre robust & genomtänkt lösning vid utvecklingen av en mjukvara, vilket då likt en finansiell skuld behöver betalas tillbaka vid senare tillfälle.

    Teknisk skuld kan resultera i att koden blir svårare att underhålla, buggar uppstår oftare och att det tar längre tid att implementera nya funktioner i framtiden. 
    Det kräver vanligtvis mer tid och större resurser att åtgärda och förbättra koden i framtiden än att göra det rätt från början.

    Tillgänglighet

    Tillgänglighet på webben handlar om att se till att alla människor kan använda och ta del av webbplatser och appar på ett likvärdigt sätt. 

    Det innebär att utforma och utveckla webbinnehåll så att det är lättåtkomligt och användbart för alla, oavsett om de har funktionsnedsättningar som syn-, hörsel-, rörelse- eller kognitiva svårigheter. Det innebär t.ex. att se till att det finns texter som förklarar bilder om du inte kan se dem, ha god kontrast för hög visuell tydlighet eller att ha en logisk och enkel navigering som går att navigera med bara tangentbordet. 

    Många av dessa tekniker och riktlinjer finns specificerade i WCAG.

    Tillgänglighet på webben är viktigt för att säkerställa lika möjligheter och rättvisa för alla användare.

    UI

    UI står för User Interface, vilket är den del av en produkt eller tjänst som användaren ser och interagerar med.
    Det inkluderar allt visuellt och interaktivt på skärmen, såsom knappar, ikoner, textfält och andra grafiska element.
    Man kan säga att det är den visuella grenen av det bredare greppet UX eller UX-design, som ofta får omfatta både UX och UI.

    Bra UI strävar efter att vara snyggt, tydligt, intuitivt och användarvänligt för att underlätta för användare att interagera med produkten eller tjänsten.

    User research

    User research, "användarstudier", handlar om att prata med och observera människor för att förstå deras behov, beteenden och preferenser när de använder en produkt eller tjänst. Det kan göras både innan, under och efter du tar fram en produkt eller tjänst och är viktigt för att försäkra ett lyckat resultat.

    Det handlar om att samla in information och insikter från verkliga användare för att kunna skapa eller förbättra något som verkligen passar deras behov och gör dem nöjda.

    UX

    UX står för User Experience, alltså användarupplevelse, vilket handlar om hur användare interagerar med och upplever en produkt eller tjänst.
    Det går ut på att skapa en positiv och användarvänlig upplevelse genom att ta hänsyn till användarens behov, beteenden och förväntningar.

    UX är en bred term som samlar flera kunskapsområden och metoder som t.ex. user research, interaktionsdesign, informationsarkitektur, UI (visuell design), användbarhetstestning och tillgänglighet.

    Bra UX innebär att det är enkelt och behagligt för användare att använda en produkt eller tjänst, och det inkluderar allt från design och användbarhet till prestanda och tillgänglighet.

    UX Writing

    UX-writing är att skriva så det blir en så bra User Experience, UX, som möjligt. 
    Att skriva ux-copy handlar om att använda ord strategiskt, så att det blir lättare för besökaren på en app/hemsida. Med ux-copy kan användarupplevelsen kännas smidigare och mer lättnavigerad för besökaren.
    UX-copy kan vara allt ifrån instruktioner, bekräftelser, inställningar eller felmeddelanden.

    WCAG

    WCAG står för Web Content Accessibility Guidelines, vilket är en uppsättning internationella riktlinjer och standarder som hjälper till att göra webben mer tillgänglig för alla, oavsett förmåga och behov, t.ex. nedsatt syn eller kognitiv förmåga.

    I Sverige har vi en lag om Tillgänglighet till Digital offentlig Service, TDS.
    Enligt TDS måste offentliga myndigheter, statliga, regionala och kommunala, samt vissa andra organisationer som tillhandahåller digital offentlig service, se till att deras webbplatser och mobila appar följer WCAG 2.1 på nivå AA.

    Man kan säga att WCAG är tillgänglighet i sin mest konkreta form.

    Webbapplikation

    En webbapplikation eller en webbapp är en typ av programvara som körs i en webbläsare och tillhandahåller olika funktioner eller tjänster över internet – ett interaktivt verktyg eller program som används via webben.

    Exempel på webbapplikationer är e-postklienter, sociala medie-plattformar och onlinespel.

    Hör gärna av dig med frågor

    Går ni i tankar på att uppdatera er webb, bygga app eller se hur ni kan stärka er digitala närvaro?
    Vi har lång erfarenhet av det mesta.

    Både små och stora frågor är välkomna, hoppas vi hörs! :)