HTML5 теги

div — контейнер общего назначения, не обязательно смысловой. Дивы используются для разметки мелких блоков, создания сетки и декоративных эффектов.
section — более крупный логический контейнер, объединяющий содержание по смыслу. Например, блок «О компании», список товаров, раздел личной информации в профиле и так далее.

Создаются странные вопросы, вообщем четко не могу понять, где использовать div a где section.

Как правило, section подразумевает реальный контейнер, часть, смысловой блок. И чаще всего используется с заголовком. Когда для дива он не столь важен.

2 лайка

это всё для поисковиков придумали

В твоем примере можно использовать Section 2 раза: для блока контактов и для формы, если “Контакты” и “Записаться” будут заголовками.
В футере они ни к чему. Оборачивать еще и целый блок ( с белым фоном) не вижу смысла.

1 лайк

Стоит ли в этом примере в футере юзать тег <address> вместо первого div?

Эм. Зачем ему задавать display:block?
как обертку его точно не надо использовать. Больше для контактов автора сайта. Как правило. Этот тег формально только для СЕО.
http://htmlbook.ru/html/address

Нижние блоки в футере скорее всего тоже будут секциями, использовать adress для первого не обязательно. Секция при этом не обязательно должна иметь заголовок в своей структуре, это идет как рекомендация.

Первый блок в любом случае будет блочным, не важно что вы будете для него использовать div, p, section или adress

В верхнем блоке обертка с фоном не имеет семантики и поэтому просто div. Вложенные блоки это секции, но вот использовать ли внутри них для Контакты и Записаться заголовки - спорный вопрос. Но то, что это секции это бесспорно.

2 лайка

Нашел статью на web-standards.ru

Избегаем популярных ошибок в HTML5

1 лайк

О чем, в принципе, Я и говорил.
ИМХО, не вижу смысла в Section без заголовка

Посмотрел отладчик, я вижу что htmlacademy.ru не использует html5 теги и в поисковике “html css уроки” этот сайт находится на 10 строчке.


Читаю эту страницу Как сверстать веб-страницу. Часть 1 и эту http://www.w3.org/TR/2011/WD-html5-author-20110705/sections.html и читая :smiley: Курс у html academy про html5, у меня каша в голове, даже в понимании того что делают все по разному.


К примеру html academy указывает section блоки везде где есть внутри этого же section несколько других мини блоков которые имеют связь между собой, это несколько img, и это не только просто тексты или там где находится заголовок.


А из Как сверстать веб-страницу. Часть 1, я вижу что в footer вообще нет section.


И самое интересное, когда меня спросят. А почему ты используешь html5 теги ? Я могу только ответить, что так правильно, так в курсе htmlacademy написано или на www.w3.org, но как такового смысла я не понимаю, лучше это или хуже, я не понимаю важность этого способа, сколько и чего я потеряю когда не буду применять html5 теги.

Отчасти ты прав.
Еще раз скажу, что в большей степени мы с помощью section Должны выделять смысловые блоки на странице.
Будь то блок новостей ( с заголовком, что это новости), будь то что-то информативное, которое имеет определенное значение скорее для пользователя, чем для разметки. Т.к. тег секшн больше ориентирован на СЕО. Сколько бы споров не было - роботы яши и гугла умеют отличать уже современные сайты от старых, и им будет легче выделять какую-то информацию. А если задействовать еще и микроразметку, то Сайт будет максимально приближен к эталону (для поисковиков), которые и продвигать проще. Да и в поиске информация будет подцепляться лучше.

2 лайка