¡Hola Sergio!
Para mejorar la accesibilidad y semántica de la navegación principal del sitio web de "Jornada", te recomendaría utilizar elementos semánticos de HTML5 como <nav>
, <ul>
y <li>
. Además, es importante añadir atributos role
y aria-label
para mejorar la accesibilidad.
Aquí tienes una versión mejorada del código HTML:
<header class="encabezado__container">
<a href="#" class="encabezado__logo" aria-label="Logo de la Jornada">
<img class="encabezado__logo--icono" alt="Logo de la Jornada, blanco" src="./img/logoproviblanca-1@2x.png" />
</a>
<nav class="encabezado__navegacion" aria-label="Navegación principal">
<ul>
<li><a class="encabezado__navegacion--elemento" href="#" aria-label="Ir al blog">Blog</a></li>
<li><a class="encabezado__navegacion--elemento" href="#" aria-label="Ver paquete de viaje">Paquete de viaje</a></li>
<li><a class="encabezado__navegacion--elemento" href="#" aria-label="Contactar con nosotros">Contacto</a></li>
</ul>
</nav>
</header>
Con estos cambios, estaremos utilizando elementos semánticos adecuados y proporcionando etiquetas aria-label
para mejorar la accesibilidad del sitio web.
Espero que esta solución sea de ayuda para el equipo de "Jornada" en su desafío de mejorar la accesibilidad y semántica de su sitio web.
Espero haber ayudado y buenos estudios!