Как вложить в тег li изображения и еще список и подзаголовок?

Question

[Sozdavan]

Всем доброго времени суток!
Вот я не пойму один момент.
Нужно сверстать 4 блока, которые встали бы сеткой (два сверху, два снизу).
Как я понимаю, блоки я делаю как div в дивах уже использую список, подзаголовок, изображение, текст.

НО, мне утверждают что это неверно! Что надо эти 4 блока сделать как блок ul, в котором будут 4 элемента li
В чем я не прав? Что я не понимаю?
Это вообще по кодстайлу, или вообще правильно или нет в теге li делать еще подзаголовок, картинку, список, текст?
Для кого то может вопрос оказаться очевидным, но я только учусь, и не пойму почему именно так? И в чем не прав я.
Буду признателен как за критику, так и развёрнуый ответ, примеры как это используется или делается. я только начал познавать веб-верстку, так что для кого то это может даже показаться смешным, очевидным, но мне хочется разобраться дабы понять, а не найти подтверждение. спасибо

Comments

[Ankhena]

Выбор тегов определяется семантикой.
Тег div используется только тогда, когда нет никакого другого, более подходящего.

Внутренний список, заголовок, картинка вкладываются в li точно также как в div.
Не очень понятно в чем у вас проблема.

Не забывайте проверять код валидатором, чтобы проверить, правильно ли вы все написали.

[cssfish]

если коротко, количество оберток зависит от решаемой задачи, вашего стиля кода и к читаемости
понятно что список хорошо, но без оберток часто никак

Answer 1

[Вадим]

Тут всё зависит от контекста.
Если эти 4 блока между собой связаны, то есть демонстрируют некоторое перечисление, и можно их представить в виде плоского списка\перечня элементов, то да, СЕМАНТИЧЕСКИ более правильно сделать это списком.
Внутри li можно размещать практически какую угодно информацию.
При этом, на деле очень много кому семантика не важна и сделать дивами - тоже ок. Зависит от требований продукта и степени клиентаориентированности.

Соответственно, если эти 4 блока никак между собой не связаны, просто 4 слуайных элемента с разной информацией, о разном, никак не объединяются под какую то общую сущность, типа "меню" \ "сегодня в кино" \ "товары" \ "наши особенности" \ "контакты" и так далее - то можно и дивами.

НО, мне утверждают что это неверно! Что надо эти 4 блока сделать как блок ul, в котором будут 4 элемента li

Ну и когда Вам кто-то что-то утверждает, то спрашивайте аргументацию, ознакомьтесь с этой аргументацией и сделайте вывод. И только если Вы с ней не согласны, имеете свои контр аргументы, тогда можно пойти и задать вопрос на суд сообщества.

Comments

[Sozdavan]

спасибо за такое пояснение. вот сразу нельзя было так сказать почему именно списком...смысл, смысл! спасибо большое!