Aprendre a escriure dissenys CSS pot ser complicat, especialment si esteu familiaritzat amb l'ús de taules per crear dissenys de pàgines web de luxe. Però mentre HTML5 permet taules per al disseny, no és una bona idea.
Les taules no són accessibles
Igual que els motors de cerca, la majoria de lectors de pantalla llegeixen pàgines web en l'ordre que es mostren a l'HTML, i les taules poden ser molt difícils per als lectors de pantalla analitzar. Això és degut a que el contingut en un disseny de la taula, mentre que lineal, no sempre té sentit quan es llegeix d'esquerra a dreta i de dalt a baix. A més, amb taules niuades i diversos espais sobre les cel·les de la taula poden fer que la pàgina sigui molt difícil d'esbrinar.
Aquesta és la raó per la qual l'especificació HTML5 recomana contra taules per a la disposició i per què l'HTML 4.01 no ho permet. Les pàgines web accessibles permeten que més persones les utilitzin i que siguin la marca d'un dissenyador professional.
Amb CSS, podeu definir una secció com a pertanyent al costat esquerre de la pàgina però col·loqueu la darrera a l'HTML. A continuació, els lectors de pantalla i els motors de cerca llegiran les parts importants (el contingut) primer i les parts menys importants (navegació).
Les taules són complicades
Fins i tot si creeu una taula amb un editor web, les vostres pàgines web seran molt complicades i difícils de mantenir. A excepció dels dissenys de pàgines web més simples, la majoria de les taules de disseny requereixen l'ús de molts atributs i taules anidades.
Construir la taula pot semblar fàcil mentre ho feu, però una vegada que heu acabat, heu de mantenir-lo. Sis mesos per sota de la línia pot ser que no sigui tan fàcil de recordar per què aniuu les taules o quantes cel·les estaven seguides i així successivament. Per no esmentar, si manteniu pàgines web com a membres de l'equip, heu d'explicar a tothom que hi participa com funcionen les taules o si esperen que us portin més temps quan hagin de fer canvis.
CSS també pot ser complicat, però manté la presentació separada de l'HTML i fa que sigui molt més fàcil de mantenir a la llarga. A més, amb el disseny CSS, podeu escriure un fitxer CSS i dissenyar totes les vostres pàgines. A continuació, quan vulgueu canviar el disseny del vostre lloc, simplement canvieu un fitxer CSS i tot el lloc canvia, ja no hi passa cap pàgina per actualitzar les taules per actualitzar el disseny.
Les taules són inflexibles
Tot i que és possible crear dissenys de taules amb amplades de percentatge, sovint són més lentes de càrrega i poden canviar dramàticament la forma en què es visualitza el disseny. Però si utilitzeu amplades especificades per a les vostres taules, acabeu tenint un disseny molt rígid que no es veurà bé en els monitors que tinguin un tamany diferent al vostre.
La creació de dissenys flexibles que es veuen bé en molts monitors, navegadors i resolucions és relativament fàcil. De fet, amb consultes de mitjans CSS, podeu crear dissenys independents per a diferents pantalles de mida.
Les taules anades carreguen més lentament que CSS per al mateix disseny
La forma més comú de crear dissenys fantàstics amb taules és "tabular" les taules. Això significa que una (o més) taula es col·loca dins d'una altra. Com més taules estiguin niades, més temps prendrà que el navegador web representi la pàgina.
En la majoria dels casos, un disseny de la taula utilitza més caràcters per crear que un disseny CSS. I menys caràcters significa menys per descarregar.
Les taules poden fer malbé l'optimització del motor de cerca
El disseny de la taula més comú té una barra de navegació a la part esquerra de la pàgina i el contingut principal de la dreta. Quan s'utilitzen taules, aquest (en general) requereix que el primer contingut que es mostri en HTML sigui la barra de navegació de l'esquerra. Els motors de cerca classifiquen pàgines basades en el contingut i molts motors determinen que el contingut que es mostra a la part superior de la pàgina és més important que un altre contingut. Així doncs, una pàgina amb navegació de l'esquerra apareixerà per primera vegada amb contingut que és menys important que la navegació.
Mitjançant CSS, podeu col·locar el contingut important primer en el vostre codi HTML i, a continuació, fer servir CSS per determinar on s'ha de col·locar en el disseny. Això significa que els motors de cerca veuran primer el contingut important, fins i tot si el disseny el situa més avall a la pàgina.
Les taules no sempre imprimeixen bé
Molts dissenys de taules no s'imprimeixen bé perquè són massa grans per a la impressora. Perquè, perquè siguin aptes, els navegadors retallaran les taules i imprimiran les seccions a continuació, resultant en pàgines molt desxiblades. De vegades, acabes amb pàgines que es veuen bé, però falta tot el costat dret. Altres pàgines imprimiran seccions en diversos fulls.
Amb CSS podeu crear un full d'estil separat només per imprimir la pàgina.
Les taules de disseny no són vàlides en HTML 4.01
L'especificació de l'HTML 4 estableix: "Les taules no s'han de fer servir purament com a mitjà per a distribuir el contingut del document, ja que això pot presentar problemes quan es fa als mitjans no visuals".
Per tant, si voleu escriure HTML 4.01 vàlid, no podeu utilitzar taules per al disseny. Només haureu d'utilitzar taules per a dades tabulars i, en general, les dades tabulars semblen quelcom que podeu mostrar en un full de càlcul o, possiblement, una base de dades.
Tanmateix, HTML5 ha canviat les regles i ara les taules per al disseny, encara que no es recomana, ara es consideren HTML vàlid. L'especificació HTML5 estableix: "Les taules no s'han d'utilitzar com a ajudes de disseny". Això és degut a que les taules de disseny són difícils de diferenciar per als lectors de pantalla, tal com s'ha esmentat anteriorment.
L'ús de CSS per posicionar i dissenyar les vostres pàgines és l'única forma de validació HTML 4.01 per obtenir els dissenys que heu utilitzat per crear taules, i HTML5 també recomana aquest mètode.
Les taules de disseny poden impactar les vostres perspectives laborals
A mesura que més i més nous dissenyadors aprenen HTML i CSS, les vostres habilitats per crear dissenys de taules seran cada vegada amb menys demanda. Sí, és cert que els clients no solen dir-vos la tecnologia exacta que hauria d'utilitzar per construir les seves pàgines web, però sí que demanen coses com ara:
- Pàgines web accessibles: els dissenys que poden veure els lectors de pantalla estan sent obligats per molts països i les empreses troben l'accessibilitat cada dia més important.
- Pàgines web mantingudes: dissenys que poden portar amb ells fins i tot si no els mantindreu en el futur.
- Dissenys flexibles: dissenys que funcionen en molts navegadors, resolucions i dispositius.
- Pàgines de descàrrega ràpida: la velocitat és cada vegada més important, fins i tot a SEO.
- Dissenys imprimibles: pàgines que s'imprimeixen sense scripts especials o pàgines addicionals.
Si no podeu lliurar el que demanen els clients, deixaran d'arribar a vostè per dissenys. Període. Realment es pot permetre que deixeu que la vostra empresa pateixi perquè no esteu disposat a aprendre i incorporar una tècnica que s'ha utilitzat des de finals de la dècada de 1990?
The Moral: Apreneu a utilitzar CSS
El CSS pot ser difícil d'aprendre, però val la pena l'esforç. No mantingueu les vostres habilitats d'estancament. Conegueu CSS i compileu les vostres pàgines web de la forma en què van ser creades, amb CSS per al disseny.
