Säkerställa tillgänglighet med utvecklarverktyg

Slutförd

Det är lika viktigt att testa webbsidan i olika klienter och vyer som att testa den i olika webbläsare. Den här testningen kanske inte är praktisk i alla scenarier och kan missa situationer där användare använder en webbläsare men kan ha en annan funktionsnedsättning. Som tur är finns det verktyg som du kan använda som utvecklare för att mäta sidans tillgänglighet.

Kontrastkontroller

Någon som är färgblind kanske inte kan skilja mellan färger, eller kanske har svårt att arbeta med färger som liknar varandra. World Wide Web Consortium (W3C), standardorganisationen för webben, etablerade ett klassificeringssystem för färgkontrast.

Att välja rätt färger för att säkerställa att sidan är tillgänglig för alla kan vara svårt att göra för hand. Du kan använda följande verktyg för att både generera lämpliga färger och testa webbplatsen för att säkerställa efterlevnad:

• Verktyg för palettgenerering:
  • Adobe Color, ett interaktivt verktyg för att testa färgkombinationer
  • Color Safe, ett verktyg för att generera textfärger baserat på en vald bakgrundsfärg
• Efterlevnadskontroll:
  • Webbläsartillägg för att testa en sida:
    • Edge: WCAG-färgkontrastkontroll
    • Firefox: WCAG-kontrastkontroll
    • Chrome: Färgkontrastkontroll
  • Program:
    • Färgkontrastanalysator (CCA)

Fyr

Lighthouse är ett verktyg som Google har skapat för att analysera webbplatser. Det har blivit så populärt att det ingår i många webbläsares utvecklarverktyg. Lighthouse kan undersöka en sidas sökmotoroptimering (SEO), belastningsprestanda och andra metodtips. Lighthouse kan också analysera en sida och ge en poäng för den aktuella tillgängligheten.

Kommentar

Precis som med alla automatiserade verktyg kan du inte förlita dig på poängen som Lighthouse tillhandahåller som den enda indikationen på en sidas tillgänglighet. Men det ger en bra utgångspunkt för att identifiera och åtgärda problem.

Övning: Generera en sidas Lighthouse-tillgänglighetspoäng

Testa Lighthouse i webbläsaren. Följande skärmbilder använder Edge, men du kan följa samma steg i Chrome och många andra webbläsare.

1. Öppna webbläsaren och gå till microsofts huvudsida.

2. Välj F12-nyckeln för att öppna utvecklarverktygen.

3. Längst upp väljer du sparrikonen (>>) för att öppna listan över dolda flikar.

   

4. Välj Lighthouse i listan.

5. Under Kategorier avmarkerar du alla objekt utom Tillgänglighet.

6. Under Enhet väljer du Skrivbord.

   

7. Välj Generera rapport.

8. Lägg märke till poängen och tillhörande information om sidan.

9. Du kan testa andra sidor genom att välja Rensa alla i Lighthouse, gå till en annan sida och sedan välja Generera rapport.

   

Nu har du sett hur du använder Lighthouse, tillsammans med hjälpmedelsinformationen som verktyget kan tillhandahålla.