wat tutorial
WAT eller webtilgængelighed Toolbar Tutorial til tilgængelighedstest:
Værktøjer til testning af tilgængelighed blev forklaret detaljeret i vores tidligere tutorial i Tilgængelighedstestserier .
WAT (værktøjslinje til webtilgængelighed) - er en værktøjslinje til Internet Explorer-browser og andre browsere - Det kan hjælpe med at evaluere en webside for overholdelse af retningslinjerne for tilgængelighed af webindhold version 2 (WCAG 2.0).
Hvordan bruges WAT-værktøj?
Vær venlig download og installer det herfra .
Efter vellykket installation vil du se yderligere værktøj til webtilgængelighed lige under adresselinjen.
Vi vil lære dette ved hjælp af EAsports websted - http://www.easports.com.
# 1) Sidetitel - Vi kan verificere sidetitelbjælken i browserens vinduetitelbjælke eller fanebladets titellinje. På musen, der holder markøren på fanen, får du oplysninger om sidetitel.
Indtast URL'en http://www.easports.com, og bekræft sidetitlen i fanebladets titellinje ved at holde musen svævende.
# 2) Farve - Websitens farve skal overføres i Color Contrast Analyzer.
Der er 3 forskellige konformitetsniveauer til bestemmelse af farveforholdet, dvs. niveau A, AA og AAA.
Det skal få et pas på AA eller AAA .
'A' repræsenterer lavt tilgængelighedsniveau, 'AA' repræsenterer medium tilgængelighedsniveau og 'AAA' repræsenterer det højeste tilgængelighedsniveau.
Indtast URL'en http://www.easports.com i n på værktøjslinjen skal du klikke på fanen Farve og vælge Kontrastanalysator og kontrollere.
# 3) Overskrifter - Overskrifterne giver et effektivt overblik over sidens indhold. Alle sider skal starte med H1- eller H2-overskrifter. Overskriftsteksten skal være større, fed og være markeret på websiderne. Og siden skal starte med 'h1', og på hver side skal der være mindst en overskrift.
Klik på http://www.easports.com for at kontrollere overskriftsstrukturen og vælg fanen Struktur, og klik derefter på overskriftsstruktur og bekræft. Det giver dig alle detaljerne i overskriftens titel. Det vil også undersøge, om overskrifterne er indlejret korrekt eller ej.
# 4) Alt-tekst til billeder - Alt-attributten understøttes i alle større browsere. Alle billeder skal have tilknyttet Alt-tekst. Det viser værdien af alt-attributten som et værktøjstip, når vi holder markøren over billedet. Dette giver alternativ information om et billede, hvis billedet ikke kan vises.
Indtast url http://www.easports.com, Klik på vis billeder og kontroller, om alt-tekst er tilgængelig for billeder.
Du kommer under pop op-vinduet:
Du får detaljerne som nævnt ovenfor.
# 5) Fanerækkefølge - Tabsekvensrækkefølgen skal vises logisk og korrekt. Du kan navigere til de forskellige links ved at klikke på tabulatortasten. Når du har valgt fanebladets rækkefølgeindikator, kan du se antallet af tal i nærheden af linkene, der viser, hvor mange gange der skal klikkes på tabulatortasten for at nå det pågældende link.
Klik på url http://www.easports.com for at bekræfte fanebestilling og klik på Struktur, og vælg indikator for faneordre.
# 6) Lister - Liste skal vises i korrekt struktur. Lister skal altid kontrolleres for at sikre, at listeelementerne virkelig er indeholdt i en liste. Listen kan have to former: beordrede liste og uordnet liste . Uordnede lister bruger element og ordnede lister bruger
element.
Indtast url'en http://www.easports.com i n på værktøjslinjen skal du klikke på strukturen og vælge Listeelementer og kontrollere rækkefølgen af listen.
Eksempel på uordnet liste:
Eksempel på bestilt liste:
# 7) Kontrast forhold - Det skal have en minimal kontrast som standard. Webbrowsere skal give folk mulighed for at ændre farven på tekst og baggrund, hvis det kræves.
Indtast google url https://www.google.co.in/ og klik på billederne, og vælg Juicy Studio Luminosity Analyzer.
Et nyt vindue åbnes med titlen Color Contrast Analyzer med resultattabellen. Den sidste kolonne er Luminosity Contrast Ratio.
tilfældig talgenerator 0-1
# 8) Etiketter - Etiketter skal vises korrekt.
Indtast url https://www.google.co.in/ og klik i værktøjslinjen på Struktur, og vælg fieldset / labels som mulighed. Du vil se feltsættet og etiketoplysningerne.
# 9) Grundlæggende Struktur Kontrollere - I denne kontrol verificerer vi websider uden billeder, stilarter og layout.
Klik på Billeder på værktøjslinjen og derefter Fjern billeder.
Vælg nu CSS, og klik derefter på Deaktiver CSS.
Klik til sidst på tabeller, og vælg derefter Linearize.
Tid til øvelse:
Lad os nu give os en prøveopgave med tilgængelighedstest, selvfølgelig er løsningen leveret. Men vi anbefaler, at du selv prøver dette, inden du går over til svaret.
Bekræft overskrifter, billeder med alt-tekst, Tabordensindikator og farvekontrast i http://www.cbssports.com
Opløsning: Klik på url http://www.cbssports.com på Internet Explorer.
For at kontrollere overskrifter skal du klikke på Struktur og vælge Overskriftsstruktur for at verificere overskriften.
Overskrifter er ikke i H1. Alle overskrifter er i H2.
For at bekræfte alt-tekst skal du klikke på Billeder og vælge Vis billeder for at kontrollere, om alt-tekst er til stede i billederne eller ej.
Du finder, at få af billederne er med alt-tekst, og få af dem er uden alt-attribut. Billeddetaljerne uden alt-tekst vises i pop op, og detaljerne i billeder med alt-tekst vises i nærheden af billederne.
For eksempelalt = 'Søg på CBS Sports.com' -tekst, der vises i nærheden af søgeikonet, og alt = 'CBSSports.com' -tekst, der vises i nærheden af Fantasy-logoet.
For at kontrollere tabulatorbestillingsindikatoren skal du klikke på Struktur og vælge Tabordereindikator .
Optællingen vises i nærheden af linkene, der viser, hvilket forsøg du vil være i stand til at klikke på det pågældende link. For eksempel for at klikke på det øverste NFL-link skal du trykke på tabulatortasten fra tastaturet 13 gange.
Nu er den sidste til at kontrollere farvekontrast, klik på farve og vælg Contrast Analyzer.
Teksten passerer med dobbelt A dvs. AA.
Der er dette måden at evaluere tilgængeligheden af hjemmesiden på.
PREV-vejledning | NÆSTE vejledning
Anbefalet læsning
- Vejledning til WAVE-tilgængelighedstestværktøj
- Dybdegående formørkelsesvejledninger til begyndere
- Vejledning til testning af tilgængelighed (En komplet trinvis vejledning)
- Top 20 Testværktøjer til tilgængelighed til webapplikationer
- Bedste softwaretestværktøjer 2021 (QA Test Automation Tools)
- Destruktiv test og ikke-destruktiv testvejledning
- Funktionel testning mod ikke-funktionel testning
- SOA Testing Tutorial: Test Methodology For a SOA Architecture Model