Верстка за допомогою шарів 2

Незважаючи на те, що термін «шар» досить стійко використовується при розробці сайту, розшифровці цього поняття в літературі по сайтобудування практично не приділяється увага. Надалі ми будемо активно використовувати термін «шар», тому спочатку необхідно визначити, що ж під ним мається на увазі.

В даний час розробники популярних браузерів стали дотримуватися вказівок для використання HTML і CSS, що сильно полегшило життя творцям сайтів, оскільки знизило час на налагодження сайту в різних браузерах. Проте, відмінності в підходах у браузерів існують і при їх виникненні розробники дотримуються наступних форм роботи.

Якщо спостерігаються невеликі відмінності у відображенні одного сайту в різних браузерах, то на ці відмінності закривають очі. Попросту кажучи, ніяк не виправляють. Тут слід зробити застереження, що сайт в будь-якому випадку повинен відображатися коректно і без помилок. Якщо у сайту є істотні відмінності при його показі в одному і іншому браузері, то для їх усунення застосовують хакі. Хак - це набір прийомів, коли певному браузеру «підсовують» код, який розуміється тільки цим браузером, а іншими ігнорується.

Незважаючи на те, що хакі працюють, використовувати їх слід обмежено або взагалі обходитися без них. Справа в тому, що хакі знижують універсальність коду і для модифікації параметрів одного елементу доводиться вносити зміни одночасно в різних місцях.

Є й інший, перспективний шлях - дотримуватися специфікації CSS. Незважаючи на те, що браузери не в повній мірі самі її підтримують, вони прогресують саме в цьому напрямку. А саме, повної підтримки різних специфікацій (HTML, CSS, DOM). Таким чином, виходить, що майбутні версії браузерів будуть уніфіковані і один і той же сайт стануть відображати коректно.

Знову повернемося до верствам. Зрозуміло, що вони безпосередньо пов'язані зі стилями. Раз так, то чи не виходить, що кожен елемент HTML-коду, до якого додаються стилі, є шаром? В якомусь сенсі так і є. Однак це внесло б неабияку плутанину, якщо замість «таблиця» або «параграф» ми б говорили «шар». Тому домовимося відносити цей термін тільки до тегам

Шар - це елемент веб-сторінки, створений за допомогою тега

про якого йдеться стильове оформлення.

Таким чином, верстка за допомогою шарів полягає в конструктивному використанні тегів

і стилів. При цьому дотримуються наступних принципів.

Розділення вмісту і оформлення Код HTML повинен містити тільки теги розмітки і теги логічного форматування, а будь-яке оформлення виноситься за межі коду в стилі. Такий підхід дозволяє незалежно управляти видом елементів сторінки і її вмістом. Завдяки цьому над сайтом може працювати декілька чоловік, при цьому кожен виконує свою функцію незалежно від інших. Дизайнер, верстальник і програміст працюють над своїми завданнями автономно, знижуючи час на розробку сайту.

Активне застосування тега

При використанні шарів істотне значення приділяється універсальному тегу

який виконує безліч функцій. Фактично це основа, на яку «навішуються» стилі, перетворюючи її то в іграшку, то в тваринку. Зовсім не означає, що застосовується тільки один цей тег, потрібно ж і малюнки вставляти і оформляти текст. Але при верстці за допомогою шарів тег

є цеглинкою верстки, її базовим фундаментом.

Завдяки цьому тегу HTML-код розпадається на ряд чітких наочних блоків, за рахунок чого верстка шарами називається також блоковою версткою. Код при цьому виходить більш компактним, ніж при табличній верстці, до того ж пошукові системи його краще індексують.

Таблиці застосовуються тільки для представлення табличних даних При верстці шарами, звичайно ж, використовуються таблиці, але тільки в тих випадках, коли вони потрібні, наприклад, для наочного відображення чисел і інших табличних даних. Варіант, коли від таблиць пропонується відмовитися взагалі, є недоцільним і, більш того, шкідливим.

Використання стилів не є обов'язковою характеристикою верстки шарами, і для табличної верстки стилі можуть застосовуватися достатньо активно. Інша справа, що це стає стандартом де-факто і без стилів тепер ніяк не обійтися.

Резюме Шар - це базовий елемент верстки веб-сторінок, при якій активно застосовуються стилі і дотримуються специфікацій HTML і CSS. При такому підході важлива роль приділяється тегу

з яким у більшості людей і асоціюються шари. В якомусь сенсі це є вірним, тому домовимося надалі вживати термін «шар» до тегу

для якого вказано стильової ідентифікатор або клас. Таким чином, вираз «шар з ім'ям content» має на увазі, що використовується тег

Хоча сучасні браузери більш-менш коректно працюють зі стилями, іноді між ними виникають розбіжності з приводу прочитання одного і того ж коду. У подібних випадках веб-сторінка буде по-своєму відображатися в різних браузерах. Щоб цього не сталося, використовують хакі - прийоми, спрямовані на те, щоб кожен браузер отримав свій власний код або стиль. Однак застосування хаков при верстці вважається поганим тоном, тому слід користуватися ними лише в крайніх випадках або взагалі обходитися без них.

Схожі статті