Таблична верстка VS Блокна верстка
Однією з найпопулярніших суперечок між верстальниками - це, яка верстка краща:таблична або блокова. Питання це дуже спірне і кожен по-своєму має рацію. Хоча я переконаний, що все залежить від конкретної ситуації, тому іблочна верстка, ітаблична версткамають право на існування. І в цій статті я постараюся розібрати переваги та недоліки кожної з них. Щоб при виборі типу верстки для свого сайту, Ви спиралися насамперед на їх особливості.
Почну зпереваг і недоліків табличної верстки:
- Таблиці не перекриваються один з одним при невеликих дозволах.
- Легко робити кросбраузерний дизайн.
- Набагато простіше блокової верстки.
- Дуже багато зайвого коду, зважаючи на нескінченне створення рядків і стовпців.
- Не кожен дизайн можна створити з допомогою таблиць.
Тепер пропереваги і недоліки блокової верстки:
- Значно меншеHTML-кодуі, як наслідок, зменшення ваги сторінки.
- Блоки завантажуються швидше за таблиці (особливо великих таблиць).
- На відміну від таблиць, блоки – універсальний засіб для створення будь-якого дизайну.
- Набагато складнішетабличні верстки.
- Величезні проблеми з кросбраузерністю.
- Блоки починають наїжджати (чи спадати) друг на друга при невеликих дозволах екрана.
Ось усіпереваги та недоліки блокової та табличної верстки. Від себе хочу додати, що у99%Ви використовуватимете і те, й інше, але зараз питання стоїть про створення самого макета сайту в цілому. І тут я хочу дати Вам рекомендацію, який із типів верстки вибрати.
Блокова верстка краща за табличну,АЛЕза умови, що Ви досягнете кросбраузерності іхорошого відображення сайту при різних дозволах екрану. Даний сайт зверстан блоками, однак, добитися кросбраузерності і хорошого відображення на дозволах (я досяг хорошого відображення на дозволах від800 на 600, хоча на практиці достатньо від1024 на 768) дуже важко. Про це я попереджаю заздалегідь, тому якщо у Вас ще маленький досвід верстки, то забудьте про блокову взагалі. Краще робіть табличну верстку.
Додайте до мене у друзіВКонтакте: http://vk.com/myrusakov. Якщо Ви хочете дати оцінку мені та моїй роботі, то напишіть її в моїй групі: http://vk.com /rusakovmy.
Запропонуйте цю статтю друзям:
Якщо Вам сподобався сайт, розмістіть посилання на нього (у себе на сайті, на форумі, в контакті):
Вона виглядає ось так:
Коментарі ( 33 ):
А як натягнути таблицю на всю сторінку, у мене чомусь з усіх боків 1-2 пікселя займає порожнє місце сторінки
Вибачаюсь за питання, чи він здасться тупуватим, то що всі такі таке блокова верстка, розказано, наскільки я побачив тут тільки про таблиці, заздалегідь дякую.
Блокова верстка - це використання стилізованих div в основі структури сторінки.
так ось зараз сюди перейшов щоб видалити пост)) Зрозумів раптово, дякую
Верстаю сайт блоками див. Конструкція проста. шапка і футер, між ними ще три блоки (margin: 0; padding: 0;). має вміщатися,а ні.Правий блок падає вниз,роблю трохи менше крайній блок до тих пір, поки вміщається,тоді у мене з'являється горизонтальна смуга прокрутки.Вирішив все переробити в %. Всівийшло рівно нічого не падає все як має бути. багато хто так написали. І може я щось не так робив коли робив у пікселах?
У % треба писати тільки центральний блок, а ось лівий та правий – можна в абсолютних одиницях, а можна і у відсотках. А взагалі, як такого правила, або поганого тону не існує на цю тему. Все залежить від типу верстки, і обидва варіанти допустимі.
Ще питання .Padding Збільшує розмір блоку? А то у мене чомусь збільшує, як таке може бути?
Padding збільшує розмір блоку. Тому при збільшенні padding потрібно самостійно зменшувати width.
Я хочу дізнатися думки експерта, а все-таки Михайло, яка найкраща верстка "Блочна" або "Таблична"? Яку верстку ви віддаєте перевагу? Чекаю на вашу відповідь.
Хоча у них свої переваги та недоліки, в основному, професіонали обирають блокову.
У мене виникла ще одна проблема з таблицями. бік мені потрібно підняти "Меню" сайту. Я вже взяв меню в таблицю і пробував різними атрибутами підняти, але все одно нічого не отримується. Шановний Михайле, може є якийсь "тег" або "атрибут" щоб я міг підняти "Меню" на лівий бік нагору?
Перегляньте через firebug вкладку Layout для потрібного елемента. Можливо у Вас звідкись з'явилися відступи, які Ви не обнулили.
Не допомогло, я інакше зробив я підняв меню за допомогою позиціонування і тепер розміщую таблиці куди треба. Ви мене вибачте за помилки втексті, тому що я з України і не врахую російську мову, тільки українську та англійську. Але все одно дякую що відгукнулися! Підкажіть Михайло!з допомогою якого тега чи атрибута я можу переміщати "Блоки",які створюють з тега
Михайло! А скажіть ще як робити відступи від межі екрану? як наприклад вконткти.
Тут Вам не потрібні відступи, а фіксований розмір блоку. Тобто. у px, а чи не відсотках.
Здрастуйте, Михайле. Я написав сторінку для завантаження фотографій на сайт. Але у мене є проблема: я додаю картинку у верхній лівий кут, коли я додаю другу картинку вона стає нижчою за першу, а я хочу щоб вона додалася на рівні з першою. Ось код: Додавання фото
Для вирівнювання елементів вертикалі можна використовувати таблиці.
Михайло, в табличній верстці атрибут colspan встановлює розмір у комірках (colspan = '2', отже одна комірка дорівнюватиме двом коміркам). А ось є атрибут, щоб встановлювати розмір не в осередках, а рядках?
Здрастуйте, Михайле! Я роблю верстку статичного шаблону, у мене така проблема, розміри шапки та горизонтальне меню стали маленькими. Що треба зробити?
Що означає стали маленькими? Ви ж задаєте фіксовані розміри, як я розумію.