Digitala riktlinjer

Riktlinjer för AI

AI kan effektivisera vårt arbete, men kan också ge felaktig eller missvisande information. Därför ska AI alltid ses som ett stöd. Innehåll som har skapats eller ändrats med hjälp av AI ska alltid granskas av en människa innan det publiceras eller sprids.  

På kommunens intranät finns mer information och en handbok för hur vi arbetar med AI.

Våra regler – vad vi får och inte får göra

• Vi ska i första hand välja autentiska foton, filmer och röster före AI-genererat material.

• AI-genererade bilder, filmer och ljud ska följa kommunens grafiska profil och bildspråk.

• Vi ska inte skapa AI-bilder som kan misstas för verkliga bilder.

• Vi ska inte använda AI för att skapa text eller logotyper i bilder eftersom AI har en tendens att förvränga logotyper och använda felaktiga bokstäver.

• Vi ska märka material (foto, film eller ljud) som är tydligt modifierat med hjälp av AI.

Du har ansvar för:

• att alltid granska AI-genererat innehåll innan det publiceras eller sprids. AI-genererade texter ska ses som utkast.

• att ta ansvar för det material du sprider. Även det som är genererat av AI.

• att den information du matar in i AI-systemet (mata inte in personuppgifter, sekretessbelagd- eller annan känslig information).

• att kontrollera användarvillkoren så att du har rätt att använda och sprida det material som AI skapar.

Märkning av text

Eftersom vi aldrig publicerar eller sprider en text utan att själv granska den först, behöver vi inte ange att en text är skapad eller modifierad med hjälp av AI.

Texten behöver granskas noggrant av en person som har relevant kunskap inom ämnet och kan göra en professionell bedömning av att informationen är korrekt och källorna är tillförlitliga. Det räcker inte att läsa igenom texten snabbt.

Märkning av bild, film, foto och ljud

Om du använder bild, röst eller film som kan skapa förvirring eller misstas för verkligheten så ska du ange att den är helt eller delvis AI-genererad.

• Filen ska märkas med tillägget ai i filnamnet. Exempel: Vattendroppe_ai.jpg

• Bilder ska ha en vattenstämpel (markering) i text på bilden.

• Filmer ska märkas med text i filmen.

• Ljudklipp ska märkas med en hörbar upplysning.

Märkningarna ska synas direkt när mottagaren möter det AI-genererade eller manipulerade innehållet. Märkningen ska vara synlig så länge att den hinner uppfattas.

Du kan med fördel komplettera din märkning med en märkning i brödtext i direkt anslutning till materialet. Exempelvis när det publiceras på en webbsida, används i en Powerpoint eller sprids som ett inlägg i sociala medier.

Skrivningar du kan använda för att märka bild, film och ljud:

• Bilden är AI-genererad

• Bilden är manipulerad med hjälp av AI

• Berättarrösten är AI-genererad

• Videon innehåller AI-genererat material

Digitala gränssnitt

Det är genom digitala gränssnitt som människor kommunicerar med digital teknik, som till exempel på en webbplats eller i en e-tjänst. Gränssnitten ska utformas så att de efterliknar vår webbplats i så stor utsträckning som möjligt vad gäller färger, knappar, menyer, ikoner, textfält och andra funktioner.   

Användarvänlighet

• Gränssnittet ska vara enkelt och intuitivt, även för nya användare.

• Texten ska vägleda användaren och göra nästa steg tydligt.

• Ge relevant information – vad behöver användaren veta just nu?

Tillgänglighet

• Det ska fungera för alla användare, även personer med funktionsvariationer.

Konsekvens

• Använd samma termer och fraser genom hela gränssnittet.

• Använd enhetliga färger, ikoner och typsnitt.

Responsivitet

• Gränssnittet ska fungera på alla enheter och i alla storlekar, från mobil och läsplatta till dator.

Kort och tydligt språk

• Skriv kort, effektivt och enkelt.

• Använd aktiva verb som tydligt säger vad användaren ska göra (till exempel: skicka, spara).

Lätt att agera

• Knappar ska vara kortfattade och handlingsorienterade (till exempel: spara, bekräfta, avbryt).

• Ge tydliga instruktioner om vad som händer efter ett klick.

Felmeddelanden

• Förklara varför något gick fel och hur användaren kan lösa det.

• Undvik tekniska meddelanden som användaren inte förstår.

Testa med användare

• Testa texter och instruktioner med riktiga användare.

• Gör justeringar baserade på deras feedback.

Typsnitt

Fira Sans är vårt huvudtypsnitt för digitala system och används både på vår webbplats och på vårt intranät. Fira Sans är ett modernt, geometriskt typsnitt med hög läsbarhet på skärm. Det fungerar väl för rubriker och kortare textstycken. Crimson Text användas för längre textstycken, den så kallade brödtexten. Riktlinjer för typsnitt, färg, storlek och radavstånd:

H1: Fira Sans regular, färg, 39 px/1.32 em.
Ingress: Fira Sans regular, svart, 24 px/1.32 em
H2: Fira Sans bold, svart, 23 px/1.32 em
H3: Fira Sans bold, svart, 19 px/1.32 em
H4: Fira Sans bold, svart, 17 px/1.32 em
Body: Crimson Text regular, svart, 23 px/1.32 em

Ikoner

Ikoner är viktiga komponenter på en webbplats, som i exemplet nedan. De hjälper människor att navigera genom att fungera som tydliga, igenkännbara symboler som representerar en funktion, ett verktyg eller en fil. 

Strängnäs kommun använder Font Awesome Pro som bibliotek för ikoner. Enkelt beskrivet fungerar Font Awesome som ett typsnitt där bokstäverna är ersatta med ikoner. Det är skapat med open source, är fritt att använda och bäddas enkelt in i html-koden. Mer information finns på Font Awesomes webbplats.

Digital tillgänglighet

Digital tillgänglighet betyder att alla människor ska kunna använda digitala tjänster, oavsett om man ser, hör eller använder tangentbord istället för mus. Strängnäs kommun ska utforma webbplatser, appar och digitala system så att de fungerar för alla enligt DOS-lagen. Det betyder bland annat:

Navigering

• Allt ska gå att använda med tangentbordet.

• Det ska synas var på en webbsida var tangentbordets fokus är när man tabbar mellan element.

• Tab-ordningen ska vara logisk och enkel.

Knappar och funktioner

• Knappar ska heta samma sak överallt. Till exempel ska en skicka-knapp alltid heta "skicka", aldrig "sänd" på vissa sidor.

• Texten på knappar ska stämma med kodens namn för skärmläsare och röststyrning.

Struktur och kod

• Innehåll ska ha logisk ordning.

• Använd rätt kod för rubriker, listor och länkar.

• Hjälpmedel ska kunna läsa upp allt korrekt.

Responsivitet

• Sidan ska fungera likadant oavsett om man surfar via dator, surfplatta, smartphone eller förstorar innehållet med zoom.

Innehåll

• Texter ska ha bra kontrast för läsning.

• Film ska ha textning med valbar storlek.

• Sidor ska kunna läsas upp av skärmläsare.

• Funktioner för tillgänglighet ska vara lätta att hitta.

På vår sida Tillgänglighetsredogörelser finns en översikt över de webbplatser och tjänster som ingår i Strängnäs kommuns digitala service och som omfattas av lagen om tillgänglighet till digital offentlig service.

Digitala formulär

Ett digitalt formulär låter användaren fylla i information, till exempel för en ansökan, en beställning eller för att ge feedback. Vi följer de webbriktlinjer som Digg (Myndigheten för digital förvaltning) har specificerat.

Logisk fokusordning

Innehållet ska följa en meningsfull ordning, oavsett om användaren läser, använder skärmläsare eller tabbar mellan länkar och knappar.

Konsekvent benämning

Samma funktion ska alltid ha samma namn. Till exempel ska en skicka-knapp alltid heta "skicka", aldrig "sänd" på vissa sidor.

Text på knappar och länkar

Synlig text på knappar och länkar ska stämma med kodens namn, så att skärmläsare och röststyrning fungerar på samma sätt som visuella användare.

Möjlighet att ångra och korrigera

Användaren ska kunna ändra, ångra eller bekräfta information innan den skickas, särskilt om det handlar om känslig eller viktig data.

Tydliga felmeddelanden

Fel ska visas tydligt och vara enkelt att förstå, så att användaren lätt kan rätta till det och fortsätta.

Ange syfte för formulärfält i koden

Text i formulärfält ska vara maskinläsbara, så att hjälpmedel kan förmedla syftet och användaren kan fylla i korrekt.

Komponenter som fungerar med hjälpmedel

Allt innehåll som finns på en webbplats ska kunna tolkas och läsas upp av en skärmläsare. Som till exempel att bilder har alt-texter.

Skapa PDF:er

En PDF (Portable Document Format) är ett digitalt dokument som bevarar dokumentets layout och innehåll oavsett vilken dator, surfplatta eller mobil som används. PDF:er behöver vara tillgänglighetsanpassade så att alla kan ta del av innehållet, även om man använder skärmläsare eller andra hjälpmedel. Så här skapar man tillgängliga PDF:er:

Använd korrekta mallar i grunden

För att kunna spara en tillgänglig PDF måste grunddokumentet ha rätt formatering av rubriker och brödtext (H1, H2, H3 och så vidare), för att strukturen ska bli maskinläsbar och hjälpmedel som skärmläsare kan tolka dokumentet korrekt. 

Tydliga rubriker och ordnade listor

Strukturen i dokumentet ska vara lätt att förstå så att användaren hittar rätt information och enkelt kan navigera i innehållet.

Alternativtext 

Alternativtext (alt-text) är en beskrivning av en bild och är nödvändig för att den som inte ser ska kunna ta till sig innehållet i en bild.

Maskinläsbar text

Använd inte text i form av bilder.

Formulärfält

Använd tydliga tabeller och etiketter för formulärfält.

Kontrast och läsbarhet

Kontrollera att kontrasten mellan text eller bild är tillräckligt stor mot bakgrunden. Tänk också på att storleken på texten inte får vara för liten och små detaljer kan försvinna på beroende på användarens skärms upplösning.