Tilgængelighedsreference

denne side er en omfattende reference til tilgængelighedsfunktioner i Chrome DevTools.It er beregnet til internetudviklere, der:

• har en grundlæggende forståelse af DevTools, såsom hvordan man åbner den.
• er bekendt med tilgængelighedsprincipper og bedste praksis.

formålet med denne reference er at hjælpe dig med at finde alle de tilgængelige værktøjer inDevTools, der kan hjælpe dig med at undersøge en sides tilgængelighed.

se Navigering i Chrome DevTools med Hjælpeteknologihvis du leder efter hjælp til at navigere i DevTools med en hjælpeteknologi som en skærmlæser.

oversigt over tilgængelighedsfunktioner i Chrome DevTools

dette afsnit forklarer, hvordan DevTools passer ind i dit overordnede tilgængelighedsværktøjssæt.

når du bestemmer, om en side er tilgængelig, skal du have 2 Generelle spørgsmål i tankerne:

1. kan jeg navigere på siden med et tastatur eller en skærmlæser?
2. er sidens elementer korrekt markeret for skærmlæsere?

generelt kan DevTools hjælpe dig med at rette fejl relateret til spørgsmål #2, fordi disse fejl er nemme at opdage på en automatiseret måde. Spørgsmål # 1 er lige så vigtigt, men desværre Devtoolskan ikke hjælpe dig der. 1 er at prøve at bruge en sidemed et tastatur eller en skærmlæser selv. Se, hvordan du foretager en Tilgængelighedsanmeldelsefor at lære mere.

kontroller en sides tilgængelighed

brug generelt Revisionspanelet til at afgøre, om:

• en side er korrekt markeret for skærmlæsere.
• tekstelementerne på en side har tilstrækkelige kontrastforhold. Se også Viskontrastforholdet mellem et tekstelement i farvevælgeren.

at revidere en side:

1. gå til den URL, du vil revidere.

2. Klik på fanen revisioner i DevTools. DevTools viser dig forskellige konfigurationsmuligheder.

   

3. for enhed skal du vælge mobil, hvis du vil simulere en mobilenhed. Denne indstilling ændresforskelligt din brugeragentstreng og ændrer størrelsen på visningen. Hvis den mobile version af sidenvises anderledes end desktopversionen, kan denne mulighed have en betydelig effekt påresultaterne af din revision.

4. i afsnittet revisioner skal du sørge for, at Tilgængelighed er aktiveret. Deaktiver de andre kategorier, hvis du vil ekskludere dem fra din rapport. Lad dem være aktiveret, hvis du vilopdage andre måder at forbedre kvaliteten af din side på.

5. Throttling sektionen giver dig mulighed for at throttle netværket og CPU ‘ en, hvilket er nyttigt, når du analysererbelastning ydeevne. Denne mulighed skal være irrelevant for din tilgængelighedsscore, så du kan brugeuanset hvad du foretrækker.

6. afkrydsningsfeltet Ryd opbevaring giver dig mulighed for at rydde al lagerplads, før du indlæser siden, eller bevare lagring mellem sidebelastninger. Denne mulighed er sandsynligvis også irrelevant for din tilgængelighedsscore,så du kan bruge det, du foretrækker.

7. Klik På Kør Revisioner. Efter 10 til 30 sekunder giver DevTools en rapport.Din rapport giver dig forskellige tip til, hvordan du forbedrer sidens tilgængelighed.

   

8. Klik på en revision for at lære mere om det.

   

9. Klik på få flere oplysninger for at se denne revisions dokumentation.

   

Se også: øks-udvidelse

du foretrækker måske at bruge øks-udvidelsen i stedet for Revisionspanelet.De giver generelt de samme oplysninger, da økse er den underliggende motor, der driver revisionspanelet. Øksudvidelsen har en anden brugergrænseflade og beskriver revisioner lidt anderledes.En fordel, som øksudvidelsen har over Revisionspanelet, er, at det giver dig mulighed for at inspicere og fremhæve svigtende noder.

Tilgængelighedsruden

tilgængelighedsruden er det sted, hvor du kan se tilgængelighedstræet, ARIA-attributterne og de beregnede tilgængelighedsegenskaber for DOM-noder.

for at åbne Tilgængelighedsruden:

1. Klik på fanen Elementer.
2. i DOM-træet skal du vælge det element, du vil inspicere.
3. Klik på fanen tilgængelighed. Denne fane kan være skjult bag knappen Flere faner.

se et elements position i tilgængelighedstræet

tilgængelighedstræet er en delmængde af DOM-træet. Den indeholder kun elementer fradom-træet, der er relevante og nyttige til visning af sidens indhold i en skærmlæser.

Undersøg et elements position i tilgængelighedstræet fra ruden tilgængelighed.

Vis et elements ARIA-attributter

ARIA-attributter sørg for, at skærmlæsere har alle de oplysninger, de har brug for i ordenfor korrekt at repræsentere en sides indhold.

få vist et elements ARIA-attributter i ruden tilgængelighed.

Vis et elements beregnede tilgængelighedsegenskaber

nogle tilgængelighedsegenskaber beregnes dynamisk af bro.sereren. Disse egenskaberkan ses i afsnittet beregnede egenskaber i ruden tilgængelighed.

få vist et elements beregnede tilgængelighedsegenskaber i ruden tilgængelighed.

se kontrastforholdet for et tekstelement i farvevælgeren

nogle personer med nedsat syn ser ikke områder som meget lyse eller meget mørke. Alt har tendens til atvises ved omtrent samme lysstyrke, hvilket gør det svært at skelne konturer og kanter.Kontrastforhold måler forskellen i lysstyrke mellem forgrund og baggrundaf tekst. Hvis din tekst har et lavt kontrastforhold, kan disse brugere med lavt syn bogstaveligt talt opleve din side som en tom skærm.

farvevælgeren kan hjælpe dig med at sikre, at din tekst opfylder anbefalede kontrastforhold:

1. Klik på fanen Elementer.

2. i DOM-træet skal du vælge det tekstelement, du vil inspicere.

   

3. klik på farvefeltet ud for elementets color værdi i ruden typografier.

   

4. kontroller afsnittet kontrastforhold i farvevælgeren. Et afkrydsningsfelt betyder detelementet opfylder minimumsanbefalingen.To markeringer betyder, at det opfylder den forbedrede anbefaling.

   

5. Klik på afsnittet kontrastforhold for at se flere oplysninger. En linje vises i visualpicker øverst i farvevælgeren. Hvis den nuværende farve opfylder anbefalinger, såalt på samme side af linjen opfylder også anbefalinger. Hvis den nuværende farve ikke opfylder anbefalinger, så opfylder noget på samme side heller ikke anbefalinger.

   

Feedback