Какой тип верстки использовать в контентной части интернет-магазина?
Добрый день, коллеги!
Я — дизайнер, и начинающий верстальщик. Учитывая тот факт, что хороший дизайнер должен уметь не только рисовать, но и как минимум иметь скилзы верстки — сподвигли меня на изучение...
Собственно, я уже верстаю. Дивами... Но... Сложился следующий момент. Я читаю документацию, смотрю видеоуроки, и к примеру, для верстки контентной части интернет-магазина, где расположены товары, некоторые "профи" используют дивы, а некоторые таблицы...
Меня бесят таблицы, и если честно, я считаю, что это средневековый век... Учитывая новые стандарты, HTML5/CSS3, и.т.д.
Но, я не профессионал... И я не могу судить, что правильно, а что нет... Прошу совета...
Собственно, вопрос. Учитывая современные стандарты, используют ли нынче таблицы для верстки макетов? То, что используют, вижу и знаю. Но, как вы относитесь к табличной верстке контента?! Постепенно забывать про нее или все же использовать?
Прошу прощения, если вопрос некорректен. Сформулировал так, как получилось. :)
Кинопоиск сверстан табличкой и процветает. Поэтому ответ - главное - что б работало.
Но вообще есть следующие идеи и их лучше придерживаться.
1) Таблицы для табличной информации. Если вам надо описать характеристики холодильника в вашем магазине - используйте таблицу.
2) для секций. Если вам нужно отделить блок с утюгами от блока с чаниками - поместите их в разные section
3) Для отдельных чайников в section используйте article.
4) Если первые три пункта не подходят по каким-либо причинам, используйте div
Не будем даже объясняться. Это просто факт - табличная верстка ужасная :)
Так что вы движетесь в правильном направлении - HTML5, CSS3. А особенно с приходом box в CSS3 жить стало еще лучше :)
На ваш взгляд использование таблиц является эффективным решением? Или все зависит от случая? Я прекрасно понимаю, что для стандартных табличных данных — таблица весьма неплохо подходит. Ну, а, как обстоят дела, к примеру, с контентной областью современного интернет-магазина? и.т.д.
Согласен @gogolinsky , что таблицам предоставьте табличную информацию, но в некоторых случаях действительно удобнее использовать таблицы для верстки контента, но как правило это отдельные информационные блоки (а не вся верстка), к примеру большие формы.
@GM2mars для сложных форм есть fieldset, label И прочие прелести. С помощью нескольких простых строк в CSS все выстраивается по типу таблиц. Почитайте про свойства display: table, display: table-row, display: table-cell.
@HeadOnFire знаком с этими свойствами. Но в чем выгода верстать кучей дивов и лейбами если к ним применять табличные свойства. Когда можно взять таблицу за контейнер и в ячейках использовать любые теги для семантики.
@GM2mars причин несколько: 1) Никаких дивов там вообще не надо, у форм есть свои теги, которых более чем достаточно для гибкой и корректной разметки - на выходе получаем чистый маркап ФОРМЫ 2) CSS и его свойства собственно для этого (отображения) и существуют - поэтому использование удобства таблиц для верстки форм через CSS является идеологически правильным решением 3) Взять таблицу за контейнер и использовать в ячейках теги для семантики не получится - это откровенно через жопу. Сделайте таким путем формочку сложную, со своими секциями, заголовками и т.д. и потом посмотрите Document Outline. Ваша семантика будет глубоко в одном месте, поскольку на самом верхнем уровне Outline у Вас стоит ТАБЛИЦА, и все, что внутри, воспринимается как табличные ДАННЫЕ, а не семантический лейаут.
Простой
