Alt text

Vad är alt text?

Alt text (alternativ text) är beskrivningen du anger i attributet alt för en <img>-tagg, till exempel <img src="boot.jpg" alt="Brown leather boot seen from the side">. Skärmläsare läser texten högt för användare med synnedsättning, och det visas som en reserv om bilden inte laddas. Samtidigt använder Google alt-texten som en signal om vad bilden föreställer.

Varför spelar alt-text någon roll?

För en onlinebutik löser alt-text två saker samtidigt: tillgänglighet och SEO. Beskrivande alt-text gör produktbilder begripliga för kunder som navigerar med en skärmläsare, och god bildtillgänglighet är ett krav enligt den europeiska tillgänglighetslagen för många butiker. Det hjälper också Google att förstå och indexera dina bilder, vilket kan ge extra trafik från Google Bilder. Rent dekorativa bilder bör använda ett tomt alt-attribut (alt="") så att skärmläsare hoppar över dem istället för att tillkännage ett filnamn.

Vanliga användningsfall

• Produktbilder: Beskriv produkten specifikt (“röd ulltröja med rullhals”) snarare än bara “tröja” eller produktens SKU.
• Dekorativa bilder: Använd alt="" för bakgrunder och ornament så att hjälpmedel ignorerar dem.
• Bilder som används som länkar eller knappar: Alt-texten fungerar som länktext och ska beskriva vart länken leder.
• Infografik och text i bilder: Återskapa den viktiga texten så att poängen inte går förlorad för skärmläsare och Google.

Shopify perspektiv

I Shopify redigerar du alt-text under varje produkts media (klicka på bilden och välj “Redigera alt-text”), och temat återger den vanligtvis med {{ image.alt }} i Liquid. Shopify fyller inte automatiskt i meningsfull alt-text; många teman faller tillbaka på produkttiteln, som sällan är en korrekt beskrivning. Håll texten kortfattad (helst under ~125 tecken), beskriv bilden naturligt och undvik att stoppa in nyckelord. Överväg att spara bilder som WebP för snabbhet – alt-texten överförs oavsett filformat.