Есть лендинг и один из разделов лендинга выглядит вот так
![5d134c700e90e612019393.png](https://habrastorage.org/webt/5d/13/4c/5d134c700e90e612019393.png)
исходя из
![5d134cdaa9519122301126.png](https://habrastorage.org/webt/5d/13/4c/5d134cdaa9519122301126.png)
![5d134ce185100344349857.png](https://habrastorage.org/webt/5d/13/4c/5d134ce185100344349857.png)
![5d134ce775562916767482.png](https://habrastorage.org/webt/5d/13/4c/5d134ce775562916767482.png)
![5d134d4e2dc99004100084.png](https://habrastorage.org/webt/5d/13/4d/5d134d4e2dc99004100084.png)
![5d134d5645482323259503.png](https://habrastorage.org/webt/5d/13/4d/5d134d5645482323259503.png)
я понимаю, что article является независимой частью на странице сайта, а секция зависящим элементом, какого то более крупного элемента.
т.е. в данном случае я понимаю что нужно делать как тут
![5d134cdaa9519122301126.png](https://habrastorage.org/webt/5d/13/4c/5d134cdaa9519122301126.png)
т.е.
article > section*3 {h + p и т.д.}
(
опираюсь на этот источник)
если же я сделаю как
section > article*3 то на выходе это зависящая от чего либо секция, но у меня это независимый "раздел" и он может быть размещен в любом месте сайта.
сделав
article > section*3 {h + p и т.д.}
я получаю:
![5d134e528f6ac814151619.png](https://habrastorage.org/webt/5d/13/4e/5d134e528f6ac814151619.png)
т.к. нет выраженого заголовка (даже если использовать section>article*3 будет тоже самое)
![5d134e631560b879534984.png](https://habrastorage.org/webt/5d/13/4e/5d134e631560b879534984.png)
так же в документации говорится о заголовках:
![5d1351d6dc9f2247279730.png](https://habrastorage.org/webt/5d/13/51/5d1351d6dc9f2247279730.png)
![5d1351e0e72f7540258016.png](https://habrastorage.org/webt/5d/13/51/5d1351e0e72f7540258016.png)
и так же о том, что не нужно лепить section как обертку, лучше для этого использовать див, по этому решаю что подход section>article*3 или section>div*3 не верен, о чем так же говорится
в этом источнике
если же делать div>article*3 или div>section*3 то будет:
![5d134f720da8c075579480.png](https://habrastorage.org/webt/5d/13/4f/5d134f720da8c075579480.png)
т.е. этот раздел ни как не выделен, по факту это получается 3 разных раздела, но на деле то это один раздел с 3мя подразделами
теперь вопрос:
1. верно ли использовать article>section?опираясь на статью и документацию, я понимаю, что это верный подход но возможно я ошибаюсь
Эти разделы:
![5d135003281f6340046476.png](https://habrastorage.org/webt/5d/13/50/5d135003281f6340046476.png)
я сверстал бы как article*4 > ..... (внутри могут быть section)
а не section*3> .....(внутри могут быть article)
2. как решить вопрос с невыявленным заголовком раздела? один из вариантов, сделать там и просто скрыть его стилями, тогда семантически все вродь читается, но верно ли это?
P.S. прошу не ругать за мой "русский" и не писать в стиле "ой да это ни кому не нужно" и т.п.