@RiG1

Имеется вот такой простой макет

С тегами в шапке и нафигации я разобрался, а вот с блоком контента не могу.
Самое первое что я думаю надо сделать, это обернуть весь блок контента тегом <main>, это правильно?
Сам контент может быть представлен в разном виде. Вот например на главной странице сайта

каждый блок с картинкой надо обернуть в <section> и <article>? Или как то по другому?
При нажатии ссылки "Подробнее" открывается вот это

Опять же, верхняя часть в <section>, название фото в <header>, описание в <article>, "Название альбома, просмотров комментариев" в <footer>? После чего ещё 2 <section> для Добавления комментариев и для самих комментариев?

Подскажите пожалуйста как правильно.

0

@RiG1

ап ап

Добавлено через 9 часов 23 минуты
ещё раз ап

Добавлено через 23 часа 4 минуты
ап ап

0

@Padimanskas

Тег section это замена div в том случае, если необходимо изобразить блок содержащий какие-либо незначительные по объему элементы чем первичные части документа, но в большом объеме. Идеально подойдет для блока контента, который может содержать статьи, изображения, т.е. такие теги как header(вместо h1), footer, article, nav и т.д.

Для позиционирования кейса изображений используйте FlexBox.

Документация W3 не подразумевает, что страницы должны иметь некий раздел контента. Иначе, мы непременно имели бы в распоряжении что-нибудь вроде <content>. W3 хочет избавить нас от навязчивой идеи делить всю страницу, как настольное приложение, на части, хоть и предлагает некоторые экзотические теги. Ведь для правильного расположения элементов достаточно такого устройства как CSS. Эта философия укладывается в слова -"страница есть документ, а документ является контентом по своей природе".

1

@RiG1

Padimanskas, это мне теперь понятно. Но как же все таки быть в моём частном случае? На второй картинке каждый отдельный блок с картинкой это "минипревью картинки" со ссылкой на основную статью. Стоит ли каждый этот блок обернуть в section? На третьей же картинке как я писал, нужно сделать 3 тега section? Или же в section нужно обернуть только блок добавления комментариев и отдельно сами комментарии?

0

@Padimanskas

Вы должны понять семантику т.е. значение ваших элементов. Например, если вам нужен бордюр для картинки и текста то лучше использовать div, но если блок представляет информационную структуру, то смело берите section.

В общем, на втором слайде, я бы уложил все картинки в блоки div и все это обвязал section. В последний можно добавить элемент header с заголовком h1 внутри.

На третьем слайде, описание товара и все то, что касается комментариев, это разные вещи, они нуждаются в делении и тоже будут в разных элементах, которые, в свою очередь, тоже являются потомками одного большого section(этого родителя я описал во втором слайде). Элементы не одинаковы, описание товара это главная информация, а комментарии это дополнительная "левая инфа", поэтому описанием будет section, а комментариями aside в этом внутреннем section-е.


Знаю, что много БуКаФ, но иначе не объяснить

1

@RiG1

Padimanskas, вроде понял, а как быть с article? стоит ли картинку с описанием оборачивать в него? и тексты комментариев?
Так же интересует вопрос про другой тип макета, когда в контенте много повторяющихся блоков с типичным оформлением (заголовок, картинка, краткое описание, небольшой футер) но разным содержанием. Как оформлять эти блоки? Ссылку скину в ПМ

0

@Padimanskas

Article - это "чистый" текст(картинки и теги форматирования)
Комментарий - это article. Тогда получится section(товар) -> aside(все комментарии) -> article(1 комментарий) -> теги форматирования текста, картинки.

Если они одного ранга и находятся в общем узле, то структуру будут иметь одинаковую, вне зависимости от полноты содержания.

ok

0