Защо трябва да избягвате таблици за оформление на уеб страници

CSS е най-добрият начин за създаване на дизайн на уеб страници

Да се ​​научите да пишете CSS оформления може да бъде трудно, особено ако сте запознати с използването на таблици, за да създадете луксозни оформления на уеб страници. Но докато HTML5 позволява таблици за оформление, това не е добра идея.

Таблиците не са достъпни

Точно както търсачките, повечето екранни четци четат уеб страници в реда, в който се показват в HTML. И масите могат да бъдат много трудни за анализаторите на екрана. Това е така, защото съдържанието в оформлението на таблицата, макар и линейно, не винаги има смисъл, когато се чете от ляво на дясно и отгоре надолу. Плюс това, с вложени таблици и различни разстояния върху таблицата клетки може да направи страницата много трудно да разбера.

Това е причината, поради която спецификацията на HTML5 препоръчва срещу таблици за оформление и защо HTML 4.01 я забранява. Достъпните уеб страници позволяват на повече хора да ги използват и са марката на професионален дизайнер.

С CSS можете да определите секцията като част от лявата страна на страницата, но я поставете последно в HTML. След това екранните четци и търсачките ще прочетат важните части (съдържанието) на първо място и най-малко важните части (навигация) последни.

Таблиците са трудни

Дори ако създадете таблица с уеб редактор, вашите уеб страници ще продължат да бъдат много сложни и трудни за поддръжка. С изключение на най-простите дизайни на уеб страници, повечето таблици с оформление изискват използването на много и атрибути и на вложени таблици.

Изграждането на таблицата може да изглежда лесно, докато го правите, но тогава трябва да я поддържате. Шест месеца по-надолу може да не е толкова лесно да си спомните защо сте вложени в таблиците или колко клетки са подредни и т.н. Освен това, ако поддържате уеб страници като член на екипа, трябва да обясните на всеки човек как работят таблиците или да очакват от тях да отделят повече време, когато трябва да направят промени.

CSS може да бъде сложно, но поддържа представянето отделно от HTML и го прави много по-лесно да се поддържа в дългосрочен план. Освен това, с оформлението на CSS можете да напишете един CSS файл и да оформите всичките си страници така, че да изглеждат така. И когато искате да промените оформлението на сайта си, просто променете един CSS файл, а целият сайт chnges - вече не минава през всяка страница едно по едно, за да обновява таблиците, за да обновява оформлението.

Таблиците са гъвкави

Въпреки че е възможно да се създават таблични оформления с процентни ширини, те често се зареждат по-бавно и могат драматично да променят начина, по който оформлението ви изглежда. Но ако използвате конкретни ширини за таблиците си, ще завършите с много твърдо оформление, което няма да изглежда добре на монитори, които са оразмерени по различен начин от вашите.

Създаването на гъвкави оформления, които изглеждат добре на много монитори, браузъри и резолюции, е сравнително лесно. Всъщност, с CSS медийни запитвания, можете да създадете отделни дизайни за различни размери на екрана.

Вложените таблици се зареждат по-бавно от CSS за същия дизайн

Най-често срещаният начин да се създават луксозни оформления с маси е да се "гнездят" таблици. Това означава, че една (или повече) маса е поставена в друга. Колкото повече таблици са вложени, толкова по-дълго ще е необходимо уеб браузърът да направи страницата.

В повечето случаи оформлението на таблицата използва повече знаци, отколкото създаването на CSS. И по-малко знаци означава по-малко за изтегляне.

Таблиците могат да навредят на търсачката за оптимизация

Най-често срещаното оформление на таблицата има навигационна лента в лявата част на страницата и основното съдържание вдясно. Когато използвате таблици, това (обикновено) изисква първото съдържание, което се показва в HTML, е лявата лента за навигация. Търсачките категоризират страниците въз основа на съдържанието и много двигатели определят, че съдържанието, показано в горната част на страницата, е по-важно от друго съдържание. Така че, на първо място страница с ляво навигация, ще има съдържание, което е по-малко важно от навигацията.

С помощта на CSS можете първо да поставите важното съдържание във вашия HTML и след това да използвате CSS, за да определите къде да бъде поставен в дизайна. Това означава, че търсачките ще видят първо важното съдържание, дори ако дизайнът го постави надолу на страницата.

Таблиците не винаги печатат добре

Много дизайни на таблици не печатат добре, защото те просто са твърде широки за принтера. Така че, за да ги настроите, браузърите ще отрежат масите и ще отпечатват секциите по-долу, което ще доведе до много несвързани страници. Понякога завършвате със страници, които изглеждат добре, но цялата дясна страна липсва. Други страници ще отпечатват раздели на различни листове.

С CSS можете да създадете отделен стилов лист само за отпечатване на страницата.

Таблиците за оформлението са невалидни в HTML 4.01

Спецификацията HTML 4 гласи: "Таблиците не трябва да се използват само като средство за оформление на съдържанието на документа, тъй като това може да доведе до проблеми при изобразяване на невизуални медии".

Така че, ако искате да напишете валиден HTML 4.01, не можете да използвате таблици за оформление. Трябва да използвате таблици само за таблични данни. Табличните данни обикновено изглеждат като нещо, което може да се показва в електронна таблица или евентуално в база данни.

Но HTML5 промени правилата и сега таблиците за оформление, докато не се препоръчват, сега са валидни HTML. В спецификацията на HTML5 се казва: "Таблиците не трябва да се използват като оформление."

Тъй като таблиците за оформление са трудни за разчитащите на екрана, както споменах по-горе.

Използването на CSS за позициониране и оформление на вашите страници е единственият валиден HTML 4.01 начин, за да получите дизайна, който сте използвали, за да създавате таблици. HTML5 силно препоръчва и този метод.

Таблиците за оформлението могат да повлияят на вашите перспективи за работа

Тъй като все повече и повече нови дизайнери се учат в HTML и CSS, вашите умения за изграждане на таблица оформления ще бъдат в по-малко и по-малко търсене. Да, вярно е, че клиентите обикновено не ви казват точната технология, която трябва да използвате, за да изграждате своите уеб страници. Но те ви питат за неща като:

Ако не можете да доставяте това, което клиентите искат, те ще спрат да идват при вас за проекти, може би не днес, но може би през следващата година или следващата година. Наистина ли можете да си позволите да оставите бизнеса си да страда, защото не сте готови да започнете да учите техника, която се използва от края на 90-те години на миналия век?

Морал: Научете се да използвате CSS

CSS може да е трудно да се учи, но нещо, което си заслужава, струва усилията. Не задържайте уменията си от застояване. Научете CSS и създайте своите уеб страници по начина, по който са били предназначени за изграждане - с CSS за оформление.