Tabeller - Kunnskapsbasen
Tabeller
For innholdsprodusenter ved NTNU.
Hurtiglenker
Når skal du bruke tabeller?
Ubevisst bruk av tabeller kan svært ofte resultere i sider som er mindre tilgjengelige, og mindre mobilvennlig.
Hvis det er design og layout som ligger til grunn for din bruk av en tabell bør du ikke bruke tabell. Spør om råd før du går videre. En tabell egner seg hvis det er naturlig å sammenligne informasjon mellom rader eller kolonner, og tabellens innhold blir like forståelig sortert på innholdet i kolonne 2 som når det er sortert på kolonne 1.
Sjekkliste
- Første rad er overskriftsrad:
<thead><tr><th>heller enn<tr><td> -
<caption>er brukt eller det er en overskrift rett over tabellen. - Tabellen er hverken stor eller komplisert.
- Det er kun en verdi i hvert celle ikke flere avsnitter og linjeskifter.
- Det er ingen blanke celler i første spalte for å lage kunstig innrykk av informasjon.
- Bredden er definert med bruk av % heller en piksler (px).
- Tabellstiler (under) er brukt til stiling, heller enn egen formattering.
Tabellstiler
Stil opsjon: Table dark
class="tbl-headrow-dark2"
Stil = Table dark bordered
class="tbl-simple-dark2"
Stil opsjon: Table light
class="tbl-headrow-light2"
Stil = Table simple
class ="tbl-headrow-line2"
Stil opsjon: Table sortable
class="tablesorter" (*)
Hvordan legge til ønsket stil
Tabellstilene gjelder på ntnu.no, ntnu.edu, meldinger, temasider, og Innsidas wikisider av type HTML, men ikke for wikisider i Innsida av type Creole, som får automatisk stiling.
1. For å opprette en ny tabell klikk på 
tabell-ikonet i WYSIWYG-en.
2. For en eksisterende tabell legg markøren i tabellen, trykk på høyre museknappen, velg Egenskaper for tabell.
3. Under Overskrifter velg Første rad
4. Kontrollere følgende innstillinger:
- Under Bredde , bruk % (ikke piksler). Alternativt la feltet stå tom.
- Høyde bør være tom/udefinert.
- Endre Rammestørrelse, Cellemarg og Cellepolstring la feltet stå tom, eller sett til 0
- Under Tittel beskriv hva tabellen viser. Vær presis. (Dette er tabellens caption)
5. Gå til fanen Avansert
6. Under Stilarkklasser, skriv navnet til tabellstilen du ønsker (f.eks. tbl-headrow-light2 )
Krav til tabelltittel (caption)
Tabelltittel (caption) hjelper brukere som benytter skjermleser (blinde og svaksynte) til å finne tabellen og vurdere om tabellen skal leses.
- Tabelltittelen er viktigere enn en vanlig overskrift over tabellen.
- Tabelltittelen bør være presist formulert
- Tabelltittelen bør være unik slik at en bruker som ikke ser tabellens innhold kan skille mellom flere tabeller på en side
- Tabelltittelen bør aldri være lik den som står i tabellens sammendrag-felt (summary)
Liker du ikke hvordan det ser ut?
I Liferay er tabellens <caption> midtstilt på tvers av tabellen når du er i redigeringsmodus, men ser annerledes ut når du publiserer artikkelen (se bildet under).
Løs tabellproblemer (troubleshooting)
Hvor kan stilene benyttes?
- På ntnu.no, ntnu.edu, meldinger, temasider, og Innsidas wikisider av type HTML
- Men ikke for wikisider i Innsida av type Creole, som får automatisk stiling
- Tablesorter fungerer ikke optimalt i toggler- portlets
Dersom tabellen din mangler formatering i første rad:
- Sjekk at wikisiden er av type HTML, og ikke Creole
- Tabellens første rad må være en "overskriftsrad". Du bør se <thead> <tr><th> heller enn <tr><td> i kildekode
- Tabellsorter krever også at <thead> er i bruk rundt overskriftsrad
<table class="tbl-headrow-light2 tablesorter">
<caption>Teknisk eksempel på enkel tabell</caption>
<thead>
<tr> <th> Tabelloverskrift 1 </th><th> Tabelloverskrift 2 </th></tr>
</thead>
<tbody>
<tr><td> Innhold - celle 1 </td><td> Innhold - celle 2 </td></tr>
</table>
