Overskrifter

Websider har ofte sektioner af information adskilt af visuelle overskrifter. Overskriftsteksten kan for eksempel være større og fed.

Hvis overskrifter skal fungere for alle, skal de opmærkes. På den måde kan man også navigere til overskrifterne, hvis man ikke kan bruge en mus og kun bruger tastaturet samt skærmlæser.

Overskriftsniveauer skal have et meningsfuldt hierarki som for eksempel:

  • Overskriftsniveau 1 <h1>
    • Overskrift Niveau 2 <h2>
      • Overskriftsniveau 3 <h3>
      • Overskriftsniveau 3 <h3>
    • Overskrift Niveau 2 <h2>
      • Overskriftsniveau 3 <h3>
        • Overskriftsniveau 4 <h4>
        • Overskriftsniveau 4 <h4>

Hvad skal man tjekke?

  • Siden har en overskrift. På næsten alle sider skal der være mindst én overskrift.
  • Al tekst, der ligner en overskrift, er markeret som en overskrift.
  • Al tekst, der er markeret som en overskrift, udgør i realiteten også en overskrift.
  • Overskriftshierarkiet er meningsfuldt. Ideelt set begynder siden med et "h1", som normalt svarer til sidetitlen, og springer ikke niveauer over. Dette er dog ikke absolutte krav.

Tjek af overskrifter

Nedenstående tjek instruerer dig i, hvordan du med forskellige browsere får vist en oversigt over overskrifter eller opmærkning af overskrifter på en side.

En oversigt over de overskrifter, der er opmærket på siden, fx:Oversigt over overskrifter.

En visning af websiden hvor opmærkning af overskrifter er vist, fx:Opmærkning af overskrifter på en webside som Lette Tjek.

Oversigt over overskrifter:

  1. Åbn den webside, du tjekker.
  2. I værktøjslinjen skal du vælge "Information" og derefter "View documentoutline". Eller med tastaturet: Alt + T, W (til webudvikler-udvidelse), I, M
    • En ny side åbnes med oversigten.
  3. Ikke-visuelle tjek:
    • Er overskrifterne anført. Hvis der ikke er markeret nogen overskrifter, står der "0 overskrifter".
    • Begynder oversigten med [H1] og følger den et meningsfuldt hierarki? Det kræves ikke, men er stærkt anbefalet.
  4. Visuelle tjek: Sammenlign dokumentoversigten med den visuelle gengivelse af siden.
    • Er de ting, der ligner overskrifter på den side, anført i dokumentoversigten?
    • Er der ting i dokumentoversigten, der i virkeligheden ikke er overskrifter?

Opmærkning af overskrifter på siden:

  1. Åbn den webside, du tjekker.
  2. I værktøjslinjen skal du vælge "Outline" og derefter "Show Element Tag Names". Eller med tastaturet: Alt + T, W (til webudvikler-udvidelse), O, S
  3. På værktøjslinjen skal du vælge "Outline" og derefter "Outline Headings". Eller med tastaturet: Alt + T, W (til webudvikler-udvidelse), O, H
    • Overskrifterne skitseres, og <h1>, <h2> osv. bliver vist foran overskrifterne.
  4. Alt, der er en funktionel overskrift, skal have et overskriftsikon foran det.
  5. Alt, der ikke er en funktionel overskrift, skal ikke have et overskriftsikon foran det.

Overskrifter:

  1. I enhver browser skal du åbne W3C HTML Validator (W3C Markup Validation Service).
  2. Skriv URL i adressefeltet, fx www.w3.org.
  3. Klik på linket ”More options”.
  4. Marker afkrydsningsfeltet ”Show outline”.
  5. Klik på knappen ”Check”.
    Resultatsiden vises med titel, der begynder med enten [Valid] eller [Invalid].
  6. På resultatsiden nær toppen i slutningen af linjen "Jump to:" skal du klikke på outline text-linket
  7. Ikke-visuelt tjek:
    • Er der anført noget? Hvis der ikke er nogen tekst mellem "Below is an outline for this document, automatically generated from the heading tags (<h1> through <h6>.)" og "If this does not look like a real outline..." betyder det, at der ikke er opmærket nogen overskrifter på siden.
    • Begynder oversigten med [H1] og følger et meningsfuldt hierarki? Det kræves ikke, men er stærkt anbefalet.
  8. Visuelt tjek: Sammenlign dokumentoversigten med den visuelle gengivelse af siden.
    1. Er de ting, der ligner overskrifter på websiden også anført i oversigten?

Opmærkning af overskrifter på siden:

  1. Åbn WAVE-værktøjet til evaluering af webtilgængelighed.
  2. Indtast webadressen i feltet og tryk enter
    Din webside vises i browseren med mange små ikoner på den.
  3. Alt indhold, som er en funktionel overskrift, skal have et overskriftsikon foran sig.
  4. Alt indhold, der ikke er en funktionel overskrift, skal ikke have et overskriftsikon foran det.

Overskrifter:

  • Følg en af ​​instruktionerne under "Overskrifter" ovenfor og se den tilgængelige nyhedsside. Bemærk, at der er en god hierarkisk oversigt.
    Se den tilgængelige nyhedsside her.
  • Se derefter den ikke-tilgængelige nyhedsside (I HTML Validator er "Check"-knappen muligvis ændret til "Revalidate" nu). Bemærk, at der kun er én overskrift.
    Se den ikke-tilgængelige nyhedsside her.

Opmærkning af overskrifter på siden:

  • Start med at se visuelt på den utilgængelige FED-nyhedsside: Hvad ligner overskrifter? (Citylights News, Heat wave linked to temperatures, Man Gets Nine Months in Violin Case, ...) 
    Se den ikke-tilgængelige nyhedsside her. 
  • Se derefter, hvordan det skal se ud. Følg en af ​​instruktionerne til "Opmærkning af overskrifter på siden", som du finder ovenfor på den tilgængelige nyhedsside i FED. Bemærk, at overskrifterne har ikoner ud for dem.
    Se den tilgængelige nyhedsside her.
  • Se derefter, hvordan det ser ud, når overskrifter ikke er markeret. Brug den ikke-tilgængelige nyhedsside i FED. Bemærk, at der er tekst, der visuelt ligner overskrifter, men ikke har overskriftsikoner ved siden af. Med WAVE er der gule ikoner med "h?", fordi den tror, at det kan være overskrifter. 
    Se den ikke-tilgængelige nyhedsside i FED her.