Семантический HTML и БЭМ CSS - PullRequest
Новая
       18

Семантический HTML и БЭМ CSS

1 голос
/ 18 марта 2019

Я пытаюсь написать семантический HTML, а также пытаюсь использовать имена классов на основе методологии БЭМ.

Прежде чем начать проект с совершенно неправильной структурой, я просто хотел проверить у вас,правильно, что я делаю: 

    <main>
      <article class="card card--light">
        <section class="card__wrapper">
          <div class="card__image">
            an image
          </div>
          <div class="card__name">
            a name
          </div>
          <div class="card__button">
            <button>Click Me</button>
          </div>
        </section>
      </article>
    </main>

Это нормально, что все разделы идут внутри статьи?Я делаю, может быть, слишком много дел?

1 Ответ

1 голос
/ 19 марта 2019

Часто хорошим выбором является использование тега <article> для карты.

Есть одна ошибка, тег HTML5 <article> уже создает раздел страницы. Поэтому нет смысла иметь <section> как единственного ребенка. Это <section> означает «Я раздел статьи» , но здесь это не совсем так. Таким образом, вы должны использовать простой <div> вместо <section>.

Во всем мире будьте осторожны со слишком большим количеством семантических элементов HTML5. Использование дополнительного <div> не имеет плохих последствий, это не относится к тегам «секционирование контента» (<article>, <section>, <nav> и <aside>). Например, программа чтения с экрана будет уведомлять посетителя о каждом новом разделе.

...