Таблична верстка нині зовсім не в пошані. Буквально на кожному кутку кричать, що треба переходити до верстки за допомогою шарів, тому що це відповідає стандартам, правильніше і взагалі «прикольно». Чому шари краще таблиць зазвичай не повідомляють, так що доводиться або вірити на слово, або вирішувати дилему самостійно. Тому спробуємо об'єктивно вирішити, що ж являють собою таблиці, де їх слід застосовувати, а де не варто.
Одразу слід обумовити, що суперечка навколо таблиць відбувається тільки в тому випадку, коли вони використовуються для верстки. Якщо справа стосується зберігання табличних даних, то не виникає сумнівів, що таблиці саме для цієї мети і призначені.
переваги таблиць
Таблиці досить довго панували в області верстки, оскільки пропонували дастаткова прості способи для розміщення різних елементів на web-сторінці за відсутності явних конкурентів. Завдяки наявності великої кількості параметрів, особливо кордоні нульової товщини, таблиця виступає в ролі невидимої модульної сітки, щодо якої додається контент, імаго і інші елементи. Зручність і широкі можливості верстки - ось основний реверанс на користь таблиць. І на цьому список не закінчується, далі розглянуті і інші плюси таблиць.
створення колонок
Одноколонного модульна сітка застосовується на з нашого сайтах дастаткова рідко. Дійсно, основний контент і посилання по сайту зручніше розташовувати в різних колонках, розділяючи їх тим самим. Таблиці ж добре виступають в якості многоколонной модульної сітки, кожна клітинка є окремою колонку. Це дозволяє легко створювати дво- і трехколонной макет об'єкта. При зміні розміру вікна браузера, колонки зберігають свій початковий вигляд, а не переносяться як шари один під одного. До того ж висота різних колонок при використанні таблиць залишається однаковою, незалежно від обсягу їх вмісту.
«Гумовий» макет
Таблиці вдало підходять для «гумового» макету, ширина якого прив'язана до ширини вікна браузера. Завдяки тому, що розмір таблиці можна задавати у відсотках, вона займає весь відведений їй вільний простір. Також можна регулювати і висоту вмісту. Наприклад, якщо контенту трохи, то «підвал» сторінки може висіти в її середині. Параметрами таблиці можна відрегулювати це так, що при невеликому контенті «підвал» щільно прилягає до нижнього краю вікна браузера, незалежно від розмірів вікна.
«Склеювання» малюнків
Малюнки часто розрізають на окремі фрагменти, а потім збирають їх знову в одне ціле, викидаючи одні фрагменти або замінюючи їх іншими імаго. Це потрібно для різних дизайнерських вишукувань на зразок розробки ефекту перекочування, анімації або зменшення обсягу файлів. Таблиці дозволяють легко забезпечити «склейку» кількох малюнків в одне зображення. Кожна картинка поміщається в певну комірку, параметри таблиці при цьому встановлюються такими, щоб не виникло стиків між окремими осередками.
фонові малюнки
В осередку таблиці дозволяється додавати фоновий малюнок, в залежності від розмірів осередку він може повторюватися по горизонталі, вертикалі або відразу в двох напрямках. За рахунок цього прийому на сторінці створюються декоративні лінії, рамки найрізноманітнішого виду, додається тінь під елементом.
вирівнювання елементів
Вміст осередків можна одночасно вирівнювати по горизонталі і по вертикалі, за рахунок чого розширюються можливості з розміщення елементів відносно один одного і на сторінці в цілому.
особливості браузерів
Браузери дастаткова вільно тлумачать деякі параметри CSS (ЦСС), тому створення універсального тегів із застосуванням шарів може стати справжнім головним болем для розробників. У цьому сенсі таблиці відображаються в різних браузерах практично однаково, тому створення web-сторінок спрощується.
недоліки таблиць
Незважаючи на описані гідності таблиць, у них є і певні недоліки, які часом змушують шукати інші способи верстки.
довге завантаження
Особливість таблиць така, що поки останнє слово в самому низу таблиці не завантажиться, на екрані вміст осередків відображатися не буде. Браузери використовують такий підхід, щоб отримати всю інформацію про таблиці для правильного форматування її вмісту. Але якщо таблиця велика по висоті, може пройти дастаткова багато часу, перш ніж ми побачимо потрібну інформацію.
Існують і способи обходу цієї властивості, зокрема, розбиття однієї великої таблиці на кілька таблиць поменше, а також використання стильової властивості table-layout.
громіздкий код
Таблиці містять складну ієрархічну структуру вкладених тегів, яка збільшує обсяг тегів, і підвищує складність зміни окремих параметрів. У деяких випадках для досягнення бажаного результату доводиться вкладати одну таблицю всередину іншої, а це також впливає на розмір «лушпиння», тобто тегів, який так само особистої участі у відображенні web-сторінки.
Погана індексація пошуковими системами
За рахунок того, що контент розташовується в окремих осередках таблиці, в коді він може знаходитися дастаткова далеко один від одного. Така роздробленість інформації, а також значна вкладеність тегів ускладнює правильне індексування сторінки пошуковими системами. Як результат файл не потрапляє в першу десятку видачі запиту за ключовими словами, хоча цілком може і заслуговувати це.
Немає поділу вмісту та оформлення
В ідеалі ШТМЛ-код повинен містити тільки теги з вказівкою стильового класу або ідентифікатора. А все оформлення на кшталт кольору контенту і положення елемента виноситься в CSS (ЦСС) і модифікується окремо. Такий поділ дозволяє незалежно правити код сторінки і міняти вид окремих її елементів. Хоча до таблиць стиль легко додається, але велика кількість «зайвих» тегів не дозволяє дійсно просто і зручно управляти видом окремих компонентів сторінки. До того ж не всі параметри таблиць мають свій стильовий синонім, тому в будь-якому випадку доводиться звертатися до коду web-сторінки і правити його.
невідповідність стандартам
Останнім часом стандарти ШТМЛ і CSS (ЦСС) міцно засіли в розумах web-розробників. Цьому сприяє розвиток XШТМЛ і XML, які більш «жорстко» відносяться до коду об'єкта, поява нових версій браузерів, які дотримуються специфікації, і мода на верстку шарами.
Що ж говорить специфікація щодо таблиць? А говорить вона, що таблиці в першу і останню чергу потрібні для розміщення табличних даних. Всі інші способи використання таблиць засуджуються.
Застосування таблиць для верстки
Зрозуміло, і плюси і мінуси таблиць не рівнозначні між собою. Те, що для одного з нашого сайту може бути пробачити, для іншого є грубою помилкою. Тому опишемо, в якому випадку таблиці використовувати для верстки логічніше, ніж інші засоби, зокрема, шари. Отже, таблиці добре підходять в деяких обставинах, які описані далі.
Висота колонок повинна бути однаковою
Таблиці допомагають встановити колонки однакової висоти при різному обсязі вмісту колонок. Зрозуміло, подібний ефект можна спостерігати тільки в тому випадку, якщо для колонок застосовується фонова заливка або додається рамка.
Макет повинен займати всю висоту вікна браузера, незалежно від обсягу інформації
За допомогою таблиці можна добитися ефекту, що нижня частина сторінки ( «підвал») вирівнюється по нижньому краю вікна браузера. Це має сенс в тому випадку, якщо обсягу даних не вистачає для збільшення висоти об'єкта. В іншому випадку частина сторінки буде «висіти» в середині вікна. Природно, для об'єкта дастатковаго обсягу його відображення відбувається як завжди.
Немає часу на складну верстку
Варто визнати, що таблична верстка якщо не легше, то набагато звичніше, ніж верстка за допомогою шарів. Таблиці використовують вже кілька років і природно, що прийоми верстки з їх допомогою стали канонічними. Тому, в умовах ліміту часу на створення з нашого сайту застосування таблиць більш ніж виправдане. До речі, багато дизайн-студії, які займаються розробкою сайтів, саме з цієї причини віддають перевагу табличній верстці. Результат виходить планованим і очікуваним, а Errors з відображенням з нашого сайту в різних браузерах практично не виникає.
Якщо підходити критично до способів використання таблиць, то дійсною причиною їх популярності є консерватизм розробників, звичність і швидкість верстки сайтів з їх допомогою. Ясно одне - таблиці поступово здають свої позиції на користь верстки шарами. Але пройде ще кілька років, перш ніж «табличні» сайти стануть раритетом і зникнуть з простору Рунета.