Flexbox Layout & Grid Layout делает мой HTML менее семантическим

Question

Мне всегда приходится создавать свой HTML при работе с макетом flexbox, и, по мнению многих, это плохо, потому что вам приходится описывать свою структуру с помощью HTML и стилизовать свой контент с помощью CSS.Я никогда не работал с сеткой, но думаю, что это будет так же.

Разве плохо сделать мой HTML менее семантическим, чтобы можно было использовать макет flexbox и сетку?

<header class="main-header">
  <h1 class="name">Best City Guide</h1>
  <ul class="main-nav">
    <li><a class="realmains" href="#">ice cream</a></li>
    <li><a class="realmains" href="#">donuts</a></li>
    <li><a class="realmains" href="#">tea</a></li>
    <li><a class="realmains" href="#">coffee</a></li>
  </ul>
</header>
<!--/.main-header-->


VS


<header class="main-header">
  <h1 class="name">Best City Guide</h1>
  <nav>
    <ul class="main-nav">
      <li><a class="realmains" href="#">ice cream</a></li>
      <li><a class="realmains" href="#">donuts</a></li>
      <li><a class="realmains" href="#">tea</a></li>
      <li><a class="realmains" href="#">coffee</a></li>
    </ul>
  </nav>
</header>
<!--/.main-header-->

Answer 1

Существует небольшая разница между вашими двумя примерами. Единственное отличие - это тег nav.Разница действительно вообще не имеет значения.