De ce ar trebui să evitați tabelele pentru aspectele paginilor web

Învățarea scrisului CSS aspectele pot fi dificile, mai ales dacă sunteți familiarizat cu utilizarea tabelelor pentru a crea machete fantastice de pagini web. Dar în timp ce HTML5 permite tabele pentru aspect, nu este o idee bună.

Tabelele nu sunt accesibile

Similar cu motoare de căutare, majoritatea cititoarelor de ecran citesc paginile web în ordinea în care sunt afișate în HTML, iar tabelele pot fi foarte greu de analizat pentru cititoarele de ecran. Conținutul dintr-un aspect de tabel, deși liniar, nu are întotdeauna sens atunci când este citit de la stânga la dreapta și de sus în jos. În plus, cu tabele imbricate și diverse întinderi pe celulele mesei pot face pagina să fie dificil de înțeles.

Acesta este motivul pentru care Specificație HTML5 recomandă împotriva tabele pentru aspect și de ce HTML 4.01 nu îl permite. Paginile web accesibile permit mai multor oameni să le folosească și sunt marca unui designer profesionist.

Cu CSS, puteți defini o secțiune ca aparținând în partea stângă a paginii, dar plasați-o ultima în HTML. Apoi, cititoarele de ecran și motoarele de căutare vor citi mai întâi părțile importante (conținutul) și părțile mai puțin importante (navigarea) în cele din urmă.

instagram viewer

Mesele sunt dificile

Chiar dacă creați un tabel cu un editor web, paginile dvs. web vor fi în continuare complicate și greu de întreținut. Cu excepția celor mai simple modele de pagini web, majoritatea tabelelor de aspect necesită utilizarea multor atribute și a tabelelor imbricate.

Construirea mesei poate părea ușoară în timp ce o faceți, dar odată ce ați terminat, trebuie să o întrețineți. Șase luni mai jos, este posibil să nu fie la fel de ușor să vă amintiți de ce ați cuibărit tabelele sau câte celule erau la rând și așa mai departe. Ca să nu mai vorbim, dacă mențineți paginile web ca membru al echipei, trebuie să explicați tuturor celor implicați modul în care funcționează tabelele sau să vă așteptați să ia timp suplimentar atunci când trebuie să facă modificări.

CSS poate fi, de asemenea, complicat, dar păstrează prezentarea separată de conținut și face mult mai ușor de întreținut pe termen lung. În plus, cu aspectul CSS puteți scrie un fișier CSS și puteți stiliza toate paginile pentru a arăta astfel. Apoi, atunci când doriți să modificați aspectul site-ului dvs., pur și simplu schimbați un fișier CSS și întregul modificări ale site-ului - nu mai treceți prin fiecare pagină pe rând pentru a actualiza tabelele pentru a actualiza aspect.

Mesele sunt inflexibile

Deși este posibil să creați planuri de tabel cu lățimi procentuale, acestea sunt adesea mai lente de încărcat și pot schimba dramatic aspectul aspectului dvs. Dar dacă utilizați lățimi specificate pentru mesele dvs., veți avea un aspect foarte rigid, care nu va arăta bine pe monitoarele care au dimensiuni diferite de ale dvs.

Crearea unor machete flexibile care arată bine pe multe monitoare, browsere și rezoluții este relativ ușoară. De fapt, cu interogările media CSS, puteți crea modele separate pentru ecrane de dimensiuni diferite.

Tabelele Hurt Optimizarea motorului de căutare

Cel mai comun aspect creat de tabel folosește o bară de navigare în partea stângă a paginii și conținutul principal în partea dreaptă. Când utilizați tabele, această abordare (în general) necesită ca primul conținut care se afișează în HTML să fie bara de navigare din partea stângă. Motoarele de căutare clasifică paginile pe baza conținutului, iar multe motoare determină că conținutul afișat în partea de sus a paginii este mai important decât alt conținut. Deci, o pagină cu navigare pe partea stângă mai întâi va părea să aibă conținut mai puțin important decât navigarea.

Folosind CSS, puteți pune conținutul important mai întâi în HTML și apoi utilizați CSS pentru a determina unde ar trebui să fie plasat în proiectare. Aceasta înseamnă că motoarele de căutare vor vedea mai întâi conținutul important, chiar dacă designul îl plasează mai jos pe pagină.

Tabelele nu se imprimă întotdeauna bine

Multe modele de masă nu se imprimă bine, deoarece sunt pur și simplu prea largi pentru imprimantă. Deci, pentru a le face potrivite, browserele taie tabelele și imprimă secțiunile de mai jos, rezultând pagini neunite. Uneori sfârșești cu pagini care arată bine, dar lipsește toată partea dreaptă. Alte pagini vor imprima secțiuni pe diferite foi.

Cu CSS puteți crea o foaie de stil separată doar pentru tipărirea paginii.

Tabelele pentru aspect sunt nevalide în HTML 4.01

Stări de specificare HTML 4: "Tabelele nu ar trebui să fie folosite doar ca mijloace de prezentare a conținutului documentului, deoarece acest lucru poate prezenta probleme la redarea pe suporturi non-vizuale."

Deci, dacă doriți să scrieți HTML 4.01 valid, nu puteți utiliza tabele pentru aspect. Ar trebui să utilizați numai tabele pentru date tabulare, iar datele tabulare arată în general ca ceva pe care l-ați putea afișa într-o foaie de calcul sau, eventual, într-o bază de date.

Cu toate acestea, HTML5 a modificat regulile și acum tabelele pentru aspect, deși nu sunt recomandate, sunt considerate HTML valide. Specificația HTML5 afirmă: „Tabelele nu ar trebui utilizate ca mijloace ajutătoare pentru aspect.” Acest lucru se datorează faptului că tabelele pentru aspect sunt dificil de diferențiat pentru cititoarele de ecran, așa cum am menționat anterior.

Folosirea CSS pentru poziționarea și aspectul paginilor dvs. este singura metodă HTML 4.01 validă pentru a obține desenele pe care le-ați folosit pentru a utiliza tabele pentru a crea, iar HTML5 recomandă cu tărie și această metodă.

instagram story viewer