Stikkord: 1.3.1, caption, role="presentation", scope, skjermleser, tabell, th, VoiceOver
Hva som er «enkle» tabeller kan diskuteres. Denne artikkelen beskriver tabeller der alle rader har like mange kolonner.
Vis Skjermlesere og tabeller
Radoverskrifter, kolonneoverskrifter og tabelltittel kan ofte velges i publiseringssystemer. Desverre har ikke alle slike systemer disse mulighetene. Nedenfor vises HTML-kode, så sjekk gjerne at det du lager ser relativt likt ut.
Enkle datatabeller skal merkes med tabelloverskrifter (th
-tag’er) for å leses på riktig måte med skjermlesere og andre hjelpemidler (SK 1.3.1). Tabeller som brukes til layout skal vanligvis merkes med role=»presentation».
Attributtet scope
kan brukes for å angi om tabelloverskriften hører til en kolonne eller rad.
<th scope="col">Kolonneoverskrift</th>
<th scope="row">Radoverskrift</th>
Bruk gjerne caption for å fortelle hva tabellen inneholder:
<caption>De 10 høyeste fjellene i Norge</caption>
Dataene i tabellen nedenfor er hentet fra: http://no.wikipedia.org/wiki/Liste_over_Norges_h%c3%b8yeste_fjell
Test gjerne tabellene nedenfor med forskjellige skjermlesere for å sjekke hvordan de leses opp. Lenken om skjermlesere og tabeller over inneholder en video med VoiceOver for iOS.
Tabell uten th-merking
Vis HTML-kode for tabell uten th-merking
<table><
<tr>
<td>Nr.</td>
<td>Navn</td>
<td>Høyde</td>
<td>Primærfaktor</td>
<td>Kommune</td>
<td>Fylke</td>
</tr>
<tr>
<td>1</td>
<td>Galdhøpiggen</td>
<td>2 469</td>
<td>2 370</td>
<td>Lom</td>
<td>Oppland</td>
</tr>
<tr>
<td>2</td>
<td>Glittertinden</td>
<td>2 465</td>
<td>995</td>
<td>Lom</td>
<td>Oppland</td>
</tr>
<tr>
<td>3</td>
<td>Store Skagastølstind</td>
<td>2 405</td>
<td>1 010</td>
<td>Luster Årdal</td>
<td>Sogn og Fjordane</td>
</tr>
<tr>
<td>4</td>
<td>Store Styggedalstind</td>
<td>2 387</td>
<td>160</td>
<td>Luster</td>
<td>Sogn og Fjordane</td>
</tr>
<tr>
<td>5</td>
<td>Skardstinden, Store</td>
<td>2 373</td>
<td>280</td>
<td>Lom</td>
<td>Oppland</td>
</tr>
<tr>
<td>6</td>
<td>Veslpiggen</td>
<td>2 369</td>
<td>150</td>
<td>Lom</td>
<td>Oppland</td>
</tr>
<tr>
<td>7</td>
<td>Surtningssui, Store</td>
<td>2 368</td>
<td>710</td>
<td>Lom, Vågå</td>
<td>Oppland</td>
</tr>
<tr>
<td>8</td>
<td>Memurutind, Store, østtoppen</td>
<td>2 366</td>
<td>336</td>
<td>Lom</td>
<td>Oppland</td>
</tr>
<tr>
<td>9</td>
<td>Gjertvasstind</td>
<td>2 351</td>
<td>120</td>
<td>Luster</td>
<td>Sogn og Fjordane</td>
</tr>
<tr>
<td>10</td>
<td>Sentraltind</td>
<td>2 348</td>
<td>80</td>
<td>Luster</td>
<td>Sogn og Fjordane</td>
</tr>
</table>
Nr. |
Navn |
Høyde |
Primærfaktor |
Kommune |
Fylke |
1 |
Galdhøpiggen |
2 469 |
2 370 |
Lom |
Oppland |
2 |
Glittertinden |
2 465 |
995 |
Lom |
Oppland |
3 |
Store Skagastølstind |
2 405 |
1 010 |
Luster Årdal |
Sogn og Fjordane |
4 |
Store Styggedalstind |
2 387 |
160 |
Luster |
Sogn og Fjordane |
5 |
Skardstinden, Store |
2 373 |
280 |
Lom |
Oppland |
6 |
Veslpiggen |
2 369 |
150 |
Lom |
Oppland |
7 |
Surtningssui, Store |
2 368 |
710 |
Lom, Vågå |
Oppland |
8 |
Memurutind, Store, østtoppen |
2 366 |
336 |
Lom |
Oppland |
9 |
Gjertvasstind |
2 351 |
120 |
Luster |
Sogn og Fjordane |
10 |
Sentraltind |
2 348 |
80 |
Luster |
Sogn og Fjordane |
Riktig merket tabell
Vis HTML-kode for riktig merket tabell
<table>
<caption>De 10 høyeste fjellene i Norge</caption>
<tr>
<th scope="col">Nr.</th>
<th scope="col">Navn</th>
<th scope="col">Høyde</th>
<th scope="col">Primærfaktor</th>
<th scope="col">Kommune</th>
<th scope="col">Fylke</th>
</tr>
<tr>
<th scope="row">1</th>
<td>Galdhøpiggen</td>
<td>2 469</td>
<td>2 370</td>
<td>Lom</td>
<td>Oppland</td>
</tr>
<tr>
<th scope="row">2</th>
<td>Glittertinden</td>
<td>2 465</td>
<td>995</td>
<td>Lom</td>
<td>Oppland</td>
</tr>
<tr>
<th scope="row">3</th>
<td>Store Skagastølstind</td>
<td>2 405</td>
<td>1 010</td>
<td>Luster Årdal</td>
<td>Sogn og Fjordane</td>
</tr>
<tr>
<th scope="row">4</th>
<td>Store Styggedalstind</td>
<td>2 387</td>
<td>160</td>
<td>Luster</td>
<td>Sogn og Fjordane</td>
</tr>
<tr>
<th scope="row">5</th>
<td>Skardstinden, Store</td>
<td>2 373</td>
<td>280</td>
<td>Lom</td>
<td>Oppland</td>
</tr>
<tr>
<th scope="row">6</th>
<td>Veslpiggen</td>
<td>2 369</td>
<td>150</td>
<td>Lom</td>
<td>Oppland</td>
</tr>
<tr>
<th scope="row">7</th>
<td>Surtningssui, Store</td>
<td>2 368</td>
<td>710</td>
<td>Lom, Vågå</td>
<td>Oppland</td>
</tr>
<tr>
<th scope="row">8</th>
<td>Memurutind, Store, østtoppen</td>
<td>2 366</td>
<td>336</td>
<td>Lom</td>
<td>Oppland</td>
</tr>
<tr>
<th scope="row">9</th>
<td>Gjertvasstind</td>
<td>2 351</td>
<td>120</td>
<td>Luster</td>
<td>Sogn og Fjordane</td>
</tr>
<tr>
<th scope="row">10</th>
<td>Sentraltind</td>
<td>2 348</td>
<td>80</td>
<td>Luster</td>
<td>Sogn og Fjordane</td>
</tr>
</table>
De 10 høyeste fjellene i Norge
Nr. |
Navn |
Høyde |
Primærfaktor |
Kommune |
Fylke |
1 |
Galdhøpiggen |
2 469 |
2 370 |
Lom |
Oppland |
2 |
Glittertinden |
2 465 |
995 |
Lom |
Oppland |
3 |
Store Skagastølstind |
2 405 |
1 010 |
Luster Årdal |
Sogn og Fjordane |
4 |
Store Styggedalstind |
2 387 |
160 |
Luster |
Sogn og Fjordane |
5 |
Skardstinden, Store |
2 373 |
280 |
Lom |
Oppland |
6 |
Veslpiggen |
2 369 |
150 |
Lom |
Oppland |
7 |
Surtningssui, Store |
2 368 |
710 |
Lom, Vågå |
Oppland |
8 |
Memurutind, Store, østtoppen |
2 366 |
336 |
Lom |
Oppland |
9 |
Gjertvasstind |
2 351 |
120 |
Luster |
Sogn og Fjordane |
10 |
Sentraltind |
2 348 |
80 |
Luster |
Sogn og Fjordane |