Hvorfor du bør unngå tabeller for websideoppsett

click fraud protection

Lære å skrive CSS oppsett kan være vanskelig, spesielt hvis du er kjent med å bruke tabeller for å lage flotte nettsideoppsett. Men mens HTML5 tillater tabeller for layout, er det ikke en god idé.

Tabeller er ikke tilgjengelige

Lik søkemotorer, de fleste skjermlesere leser nettsider i den rekkefølgen de vises i HTML-koden, og tabeller kan være veldig vanskelige for skjermlesere å analysere. Innholdet i et tabelloppsett, mens det er lineært, gir ikke alltid mening når det leses fra venstre til høyre og topp til bunn. I tillegg, med nestede tabeller og forskjellige spenn på bordcellene, kan det være vanskelig å finne ut siden.

Dette er grunnen til at HTML5-spesifikasjon anbefaler mot tabeller for layout og hvorfor HTML 4.01 ikke tillater det. Tilgjengelige nettsider tillater flere å bruke dem og er merket til en profesjonell designer.

Med CSS kan du definere en seksjon som tilhører på venstre side av siden, men plassere den sist i HTML. Så vil skjermlesere og søkemotorer lese de viktige delene (innholdet) først og de mindre viktige delene (navigasjon) sist.

instagram viewer

Tabeller er vanskelige

Selv om du lager en tabell med en webredaktør, vil websidene dine fremdeles være kompliserte og vanskelige å vedlikeholde. Med unntak av de mest enkle nettsidedesignene, krever de fleste layouttabeller bruk av mange og attributter og nestede tabeller.

Å bygge bordet kan virke enkelt mens du gjør det, men når det er gjort, må du vedlikeholde det. Seks måneder etter linjen er det kanskje ikke så lett å huske hvorfor du nestet bordene eller hvor mange celler som var på rad og så videre. For ikke å nevne, hvis du vedlikeholder nettsider som et teammedlem, må du forklare alle involverte hvordan bordene fungerer eller forvente at de tar ekstra tid når de trenger å gjøre endringer.

CSS kan også være komplisert, men det holder presentasjonen atskilt fra innholdet og gjør det mye lettere å vedlikeholde på sikt. I tillegg med CSS-layout kan du skrive en CSS-fil og style alle sidene dine slik at de ser ut. Så når du vil endre oppsettet til nettstedet ditt, endrer du bare en CSS-fil og hele nettstedsendringer - ikke mer å gå gjennom hver side en om gangen for å oppdatere tabellene for å oppdatere oppsett.

Tabeller er ufleksible

Selv om det er mulig å lage bordoppsett med prosentvis bredde, er de ofte tregere å laste inn og kan dramatisk endre hvordan oppsettet ditt ser ut. Men hvis du bruker spesifiserte bredder for bordene dine, ender du opp med et veldig stivt oppsett som ikke vil se bra ut på skjermer som har en annen størrelse enn din egen.

Å lage fleksible oppsett som ser bra ut på mange skjermer, nettlesere og oppløsninger er relativt enkelt. Faktisk, med CSS-mediespørsmål, kan du lage separate design for forskjellige størrelser.

Tabeller skader søkemotoroptimalisering

Det vanligste tabellopprettede oppsettet bruker en navigasjonslinje på venstre side av siden og hovedinnholdet til høyre. Når du bruker tabeller, krever denne tilnærmingen (generelt) at det første innholdet som vises i HTML-filen, er den venstre navigasjonslinjen. Søkemotorer kategoriserer sider basert på innholdet, og mange motorer bestemmer at innholdet som vises øverst på siden er viktigere enn annet innhold. Så, en side med venstre navigering først, ser ut til å ha innhold som er mindre viktig enn navigasjonen.

Ved å bruke CSS kan du plassere det viktige innholdet først i HTML-en og deretter bruke CSS til å bestemme hvor det skal plasseres i designet. Dette betyr at søkemotorer vil se det viktige innholdet først, selv om designet plasserer det nede på siden.

Tabeller skrives ikke alltid godt ut

Mange borddesign skrives ikke bra ut fordi de rett og slett er for brede for skriveren. Så, for å få dem til å passe, kutter nettlesere tabellene og skriver ut seksjoner nedenfor, noe som resulterer i usammenhengende sider. Noen ganger ender du opp med sider som ser bra ut, men hele høyre side mangler. Andre sider vil skrive ut seksjoner på forskjellige ark.

Med CSS kan du lage et eget stilark bare for utskrift av siden.

Tabeller for layout er ugyldige i HTML 4.01

De HTML 4 spesifikasjonstilstander: "Tabeller bør ikke brukes utelukkende som et middel til å utforme dokumentinnhold, da dette kan gi problemer når de gjengis til ikke-visuelle medier."

Så hvis du vil skrive gyldig HTML 4.01, kan du ikke bruke tabeller for layout. Du bør bare bruke tabeller for tabelldata, og tabelldata ser vanligvis ut som noe du kan vise i et regneark eller muligens en database.

HTML5 endret imidlertid reglene, og nå anses tabeller for layout, men ikke anbefalt, å være gyldige HTML. HTML5-spesifikasjonen sier: "Tabeller skal ikke brukes som layouthjelpemidler." Dette er fordi tabeller for layout er vanskelige for skjermlesere å skille, som tidligere nevnt.

Å bruke CSS til å plassere og utforme sidene dine er den eneste gyldige HTML 4.01-måten å få designene du brukte til å lage tabeller for å lage, og HTML5 anbefaler også denne metoden.

instagram story viewer