Да се научите да пишете CSS оформления може да бъде трудно, особено ако сте запознати с използването на таблици, за да създадете луксозни оформления на уеб страници. Но докато HTML5 позволява таблици за оформление, това не е добра идея.
Таблиците не са достъпни
Точно както търсачките, повечето екранни четци четат уеб страници в реда, в който се показват в HTML, а таблиците могат да бъдат много трудни за анализаторите на екрана. Това е така, защото съдържанието в оформлението на таблицата, макар и линейно, не винаги има смисъл, когато се чете от ляво на дясно и отгоре надолу. Плюс това, с вложени таблици и различни разстояния върху таблицата клетки може да направи страницата много трудно да разбера.
Това е причината, поради която спецификацията на HTML5 препоръчва срещу таблици за оформление и защо HTML 4.01 я забранява. Достъпните уеб страници позволяват на повече хора да ги използват и са марката на професионален дизайнер.
С CSS можете да определите секцията като част от лявата страна на страницата, но я поставете последно в HTML. След това екранните четци и търсачките ще прочетат важните части (съдържанието) на първо място и най-малко важните части (навигация) последни.
Таблиците са трудни
Дори ако създадете таблица с уеб редактор, вашите уеб страници ще продължат да бъдат много сложни и трудни за поддръжка. С изключение на най-простите дизайни на уеб страници, повечето таблици с оформление изискват използването на много и атрибути и на вложени таблици.
Изграждането на таблицата може да изглежда лесно, докато го правите, но щом бъде направено, трябва да я поддържате. Шест месеца по-надолу може да не е толкова лесно да си спомните защо сте вложени в таблиците или колко клетки са подредни и т.н. Да не говорим, че ако поддържате уеб страници като член на екипа, трябва да обясните на всички участници как работят таблиците или да очакват от тях да отделят повече време, когато трябва да направят промени.
CSS може да бъде сложно, но поддържа представянето отделно от HTML и го прави много по-лесно да се поддържа в дългосрочен план. Освен това, с оформлението на CSS можете да напишете един CSS файл и да оформите всичките си страници така, че да изглеждат така. След това, когато искате да промените оформлението на сайта си, просто променете един CSS файл, а целият сайт се променя - вече не минава през всяка страница едно по едно, за да актуализира таблиците, за да актуализира оформлението.
Таблиците са гъвкави
Въпреки че е възможно да се създават таблични оформления с процентни ширини, те често се зареждат по-бавно и могат драматично да променят начина, по който оформлението ви изглежда. Но ако използвате конкретни ширини за таблиците си, ще завършите с много твърдо оформление, което няма да изглежда добре на монитори, които са оразмерени по различен начин от вашите.
Създаването на гъвкави оформления, които изглеждат добре на много монитори, браузъри и резолюции, е сравнително лесно. Всъщност, с 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, вашите умения за изграждане на таблица оформления ще бъдат в по-малко и по-малко търсене. Да, вярно е, че клиентите обикновено не ви казват точната технология, която трябва да използвате, за да изграждат своите уеб страници, но те искат неща като:
- Достъпни уеб страници: проектите, които могат да се разглеждат от екранни четци, се налагат от много държави и корпорациите намират достъпността все по-важни всеки ден.
- Поддържани уеб страници: проектите, които могат да предприемат с тях, дори ако няма да ги поддържате в бъдеще.
- Гъвкав дизайн: проекти, които работят в много браузъри, резолюции и устройства.
- Бързо изтегляне на страници: скоростта става все по-важна, дори и за SEO.
- Печатни дизайни: страници, които печатат без специални скриптове или допълнителни страници.
Ако не можете да доставяте това, което клиентите искат, те ще спрат да идват при вас за дизайн - период. Може ли наистина да си позволите да оставите бизнеса си да страда, защото не желаете да научите и да включите техника, която се използва от края на 90-те години на миналия век?
Морал: Научете се да използвате CSS
CSS може да е трудно да се учи, но нещо, което си заслужава, струва усилията. Не задържайте уменията си от застояване. Научете CSS и изграждайте уеб страниците си по начина, по който са били предназначени за изграждане - с CSS за оформление.