Visuella riktlinjer för responsivt innehåll

Här har vi samlat riktlinjer, tekniska och visuella, för er som skickar responsivt innehåll. Ni som avsändare ansvarar själva för utformning och budskap – såväl upphovsrättsliga, som juridiska. De finns också tillgänglighetskrav som ni behöver följa. Vi har sammanfattat de mest betydande här.

Accessibility

When designing for accessibility, there are four key areas of disability to consider: visual, hearing, mobility and cognition. Read more in Web Content Accessibility Guidelines 2.1.

Ikon föreställande två tomma bildrutor som är placerade omlott.
  • Se till att det finns ett lägsta kontrastförhållande för textinnehåll och att det går att ändra storlek på text.
  • Gör alla UI-komponenter kompatibla med tillgänglighetsteknologier som skärmläsare, förstoringsglas och punktskriftsskärmar. UI-komponenter är märkta så att tillgänglighets-API:er kan bestämma roll, tillstånd, värde och titel för alla element.
Ikon föreställande en faktura.
  • Undvik visuell framställning som är repetitiv eller blinkande eftersom detta kan orsaka problem för vissa användare.
  • Användare kan behöva tillgänglighetsteknik för att hjälpa dem läsa text, så det är viktigt att se till att textalternativ finns.
icon-screen-reader 1
  • Gör innehåll förståeligt genom att använda textalternativ för allt innehåll som inte strikt är text.
  • Testa att UI-komponenter fortfarande fungerar utan ljud.
icon-responsive 1
  • Gör innehållet i UI-komponenter funktionellt tillgängligt vid användning av tangentbord för alla åtgärder som en mus vanligtvis skulle användas för.
  • Markera UI-komponenter för tillgänglighetsteknologier; användare kan använda tekniker som röststyrningsprogram och fysiska växlingskontroller, som tenderar att använda samma API:er som andra hjälptekniker som skärmläsare.

Samlade insikter: Skapa relevant och bra kommunikation

visuella riktlinjer bild 1

Det viktigaste är redan förifyllt

I Kivra presenteras alltid metadata högst upp i försändelsen. Det är den viktigaste, praktiska informationen för vad användaren ska göra, med interaktioner.

Vi rekommenderar att ni har det i åtanke när ni utformar er försändelse. Det är lätt hänt att man upplevs som onödigt upprepande om man glömmer bort den information som redan finns i metadatan och som alltid återfinns högst upp.

bild responsivt om kärnfullt

Kärnfullt är bäst

Kivra-användaren söker det viktigaste först så håll innehållet enkelt och lättöverskådligt. När innehållet presenteras på det sättet, är användaren mer benägen att läsa vidare och få en närmare förståelse av innehållet.

image anpassa skärmbredd

Anpassat efter skärmbredd

Det är viktigt att layouten anpassas efter skärmens bredd för att säkerställa att det ser bra ut och är lätt att använda på olika enheter. När layouten anpassas efter skärmens bredd blir innehållet mer lättillgängligt och användaren kan navigera på innehållet på ett enkelt och smidigt sätt.

Visuella riktlinjer bild3

Utvalda interaktiva komponenter

Tabeller och grafer kan tydliggöra det som vill säga, och på ett sätt som är trevligt för ögat. Vi rekommenderar att välja interaktiva komponenter med omsorg. Likväl, att inte presentera för mycket information i dem. Ett bättre alternativ är presentera kort, kärnfull information och leda intresserade läsare vidare.

visuella riktlinjer bild4

Visa er kontaktinformation

En del läsare kommer vilja kontakta er. Vi föreslår att ni tydligt visar era kontaktuppgifter i er försändelse. Eftersom läsaren har tagit emot er försändelse i Kivra kan det hända att läsaren felaktigt kontaktar Kivra för att få mer information. En tydlig hänvisning med era kontaktuppgifter hjälper läsaren rätt.