Taules

Una taula és un mitjà per organitzar dades en files i columnes.

En documents HTML una taula pot ser considerada, resumidament, com un grup de files on cadascuna conté a un grup de cel·les. Això és conceptualment diferent a un grup de columnes que conté a un grup de files, i aquesta diferència tindrà un impacte en la composició i comportament de la taula.

Una taula bàsica pot ser declarada usant tres elements: table (el contenidor principal), tr (representant a les files) i td (representant a les cel·les).

Es pot veure en l’exemple anterior, el concepte de files contenint columnes. Es fa evident com les cel·les, que han estat numerades d’acord a la seva aparició en el codi, segueixen una seqüència en la representació que va d’esquerra a dreta, una fila per vegada.

Cel·les de capçalera

Una cel·la de capçalera és un tipus especial de cel·la utilizada per organitzar i categoritzar altres cel·les de la taula. Es representen amb l’element th.

Exemple. Taula que mostra informació sobre el clima dels pròxims dies. Aquí les cel·les de capçalera, representades per l’element th, són ubicades a la primera fila de la taula sobre les cel·les comunes.

Podem observar com cada cel·la de capçalera de la taula, ha adoptat un estil diferent per a identificar-la com a tal.

L’atribut scope

L’atribut scope aporta un mecanisme per indicar explícitament a quines cel·les afecta una cel·la de capçalera. Aquest atribut només pot ser declarat en una cel·la d’encapçalament i prendre els valors “col”, “row”, “colgroup” i “rowgroup”. Els valors “col” i “row” indiquen que la cel·la de capçalera proveeix informació per a la resta de les cel·les a la columna o fila (respectivament) en què està present.

La cel·la de la cantonada superior esquerra de la taula, proveiria informació ambigua si l’atribut scope no estigués present. En altres paraules, afectaria les cel·les en la seva columna, així com a les cel·les a la seva fila. La presència de l’atribut scope ha deixat en clar que les cel·les afectades per aquest encapçalat són aquelles en la mateixa fila.

El títol

El títol d’una taula és un altre component que aporta a la llegibilitat.

En HTML, els títols de les taules són inserits mitjançant l’element caption, just després de l’etiqueta d’obertura de la mateixa taula i abans que tots els altres elements de la seva estructura.

Unificació de cel·les

La unificació de cel·les és un mecanisme mitjançant el qual un autor pot combinar o fusionar dos o més cel·les adjacents (td i th) en una taula. Aquest efecte es pot aconseguir utilitzant els atributs colspan, per unificació horitzontal, i rowspan, per unificació vertical. Aquests atributs poden prendre un valor enter major a zero, que representa el nombre de cel·les que participaran en la unificació.

La idea darrere d’aquest mecanisme s’explica per si mateixa: quan l’atribut colspan és establert en una cel·la, indica als intèrprets que la mateixa ha d’abastar, no només el seu propi espai, sinó també l’espai d’un nombre de cel·les contigües cap a la seva dreta. El mateix succeeix per a l’atribut rowspan però cap avall. A causa de l’estructura de les taules en HTML, La unificació només pot fer-se cap a la dreta o cap avall. Fer-ho cap amunt o cap a l’esquerra consistiria un intent d’abastar espai ja utilitzat.

Organització de la informació

HTML proveeix tres elements que poden ajudar els autors a organitzar la informació presentada en una taula. Aquests són: <thead>, per a agrupar les files que presenten infromació de capçalera; <tfoot> per contenir a les files que representen un peu o resum; i <tbody>, per representar un bloc de files que consisteix en un cos de dades.

El cos de les taules tenen dues particularitats: primer, que pot haver-hi més d’un cos en una mateixa taula; i segon, que l’element tbody pot ser omès quan la taula té només un cos. De les taules que encaixen en el segon cas es diu que tenen un cos implícit.

Quan una taula té múltiples cossos, cada cos ha d’agrupar files que estan temàticament relacionades.