Semantisk HTML
Semantisk HTML bruger elementer efter deres betydning. En rigtig knap har egenskaber, som en formateret tekstblok ikke automatisk får.
Brug elementer til deres tilsigtede opgave
Semantisk HTML beskriver indhold og betjeningselementer med passende HTML-elementer. Overskrifter strukturerer indhold, et link fører til en destination, og en knap udfører en handling. Det giver browsere og hjælpemiddelteknologi oplysninger om grænsefladens betydning.
Til at gemme en adresse i et tænkt portaleksempel er en button egnet. En visuelt identisk div-blok har ikke automatisk samme betydning eller den sædvanlige tastaturadfærd. Et a-element med en passende href egner sig derimod til at gå til adresselisten.
CSS bestemmer udseendet; stor tekst bliver ikke af den grund en overskrift. Semantisk HTML er et vigtigt grundlag, men garanterer ikke alene en fuldt tilgængelig applikation. Etiketter, tilstande og faktisk adfærd skal også passe.
Kilder
Relaterede begreber
- ARIAARIA supplerer oplysninger om roller, tilstande og egenskaber til hjælpemiddelteknologi. Den beskrevne adfærd skal faktisk være implementeret.
- SkærmlæserEn skærmlæser gør digitalt indhold tilgængeligt via tale eller punktskrift. Meningsfuld struktur og etiketter gør betjeningen forståelig.
- TastaturbetjeningTastaturbetjening gør det muligt at udføre opgaver uden mus. Handlinger skal kunne nås i en forståelig rækkefølge.
- FokusrækkefølgeFokusrækkefølgen bestemmer vejen gennem elementer, der kan få fokus. Den skal bevare mening og betjeningsmuligheder også ved dynamiske ændringer.
- TastaturfældeI en tastaturfælde sidder betjeningen fast i et område. En bevidst afgrænsning af fokus i en dialog kræver en udgang, der kan betjenes med tastaturet.
- Skip linkEt skip link fører forbi gentagen navigation til hovedindholdet. Den efterfølgende tastaturbetjening skal også fortsætte det rigtige sted.
Artikler om emnet
Design & UX med ASES
Brugeroplevelse, brugerflader og brandets udtryk