Soy nuevo en esta plataforma al igual que en diseño web. Estoy haciendo un encabezado para mi página web la cual pretendo sea responsiva. Mi duda: ¿Es mala práctica tener dos encabezados en un HTML? Lo que busco con esto es dar estilos diferentes a cada header como muestro a continueación.
Al final lo que hago es "activar" y "desactivar" los header dependiendo la resolución de la pantalla, esto con JS.
<header class="header container-header">
<nav class="navigation-bar">
<ul class="navigation-bar__ul">
<li class="navigation-bar__li"><a href="index.php">Inicio</a></li>
<li class="navigation-bar__li"><a href="#">Comienzo</a></li>
<li class="navigation-bar__li"><a href="#">Tutoriales</a></li>
<li class="navigation-bar__li"><a href="#">Recursos</a></li>
<li class="navigation-bar__li"><a href="#">Nosotros</a></li>
</ul>
</nav>
</header>
<header class="header-flex container-header">
<div class="bar-main">
<div id="button-logo" class="container-button-bar">
<a href="index.php"><img src="img/Logotipo.png" alt="Logotipo" class="container-button-bar__img"></a>
</div>
<div id="button-menu" class="container-button-bar">
<img src="img/menu.svg" alt="Botón del menú" class="container-button-bar__img">
</div>
</div>
<nav class="navigation-bar-flex">
<ul class="navigation-bar-flex__ul">
<li class="navigation-bar-flex__li"><a href="index.php">Inicio</a></li>
<li class="navigation-bar-flex__li"><a href="#">Comienzo</a></li>
<li class="navigation-bar-flex__li"><a href="#">Tutoriales</a></li>
<li class="navigation-bar-flex__li"><a href="#">Recursos</a></li>
<li class="navigation-bar-flex__li"><a href="#">Nosotros</a></li>
</ul>
</nav>
</header>