PREGUNTAS Y RESPUESTAS SOBRE Lenguaje HTML
Tanto si estás dando tus primeros pasos para aprender HTML, como si buscas respuestas concretas sobre HTML5 y las últimas novedades de HTML moderno, o deseas consolidar tus conocimientos, has llegado al sitio perfecto.
He recopilado las dudas más habituales sobre HTML, el lenguaje fundamental del desarrollo de sitios web accesibles, semánticos y eficientes, desde los fundamentos esenciales hasta las funcionalidades avanzadas y las mejores prácticas actuales.
En estos momentos respondo a 102 preguntas sobre Lenguaje HTML.
¿Por qué es importante la accesibilidad web (a11y)?
La accesibilidad web (a11y) es vital para que todos, incluyendo personas con discapacidad, usen la web. Descubre por qué es un derecho y un beneficio global.
¿Qué es WAI-ARIA y cuándo debo usar atributos ARIA?
Descubre WAI-ARIA: qué es y cuándo usar atributos ARIA como role, aria-label o aria-expanded para hacer tu contenido web y aplicaciones más accesibles.
¿Qué es el atributo role y cómo se relaciona con ARIA?
El atributo role en HTML, parte de ARIA, define la función de un elemento para mejorar la accesibilidad web. Aprende cómo usarlo con tecnologías de asistencia.
¿Cómo se usa el atributo tabindex para controlar la navegación por teclado?
El atributo tabindex en HTML controla el foco y la navegación por teclado. Aprende a usar 0, -1 y por qué evitar valores positivos para mejorar la accesibilidad.
¿Para qué sirve el atributo download en un enlace?
El atributo download en enlaces HTML («a») sirve para que el navegador descargue el recurso enlazado en vez de navegar a él. Aprende a usarlo y sus opciones.
¿Cómo uso los atributos data-* para almacenar datos personalizados en los elementos?
Aprende a usar atributos data-* en HTML para almacenar datos personalizados en tus elementos y cómo acceder a ellos fácilmente con JavaScript usando dataset.
¿Qué es el atributo hidden?
El atributo hidden en HTML oculta elementos no relevantes. Aprende cómo funciona, su impacto en accesibilidad y cómo manipularlo con JavaScript.
¿Para qué sirve el atributo contenteditable?
El atributo contenteditable en HTML permite a los usuarios editar texto y contenido directamente en la página. ¡Descubre cómo funciona y sus aplicaciones!
¿Qué hacen los atributos async y defer en las etiquetas «script»?
Optimiza la carga de JavaScript en HTML con async y defer. Aprende cómo estos atributos en «script» mejoran el rendimiento y la velocidad de tu página web.
¿Cómo funciona el atributo loading="lazy" para imágenes e iframes?
Descubre cómo loading="lazy" en HTML mejora el rendimiento al diferir la carga de imágenes e iframes hasta que son visibles. ¡Optimiza la velocidad de tu web!
¿Para qué sirve el atributo viewport en la etiqueta «meta»?
El atributo viewport en la etiqueta de HTML controla cómo tu web se muestra en dispositivos. Usa width=device-width, initial-scale=1.0 para un diseño adaptable.
¿Qué es el atributo charset en la etiqueta «meta»?
La etiqueta en HTML define la codificación de caracteres de tu web, asegurando que acentos y símbolos se muestren correctamente.
¿Qué son los microdatos y cómo se usan los atributos itemscope, itemtype e itemprop?
Aprende sobre microdatos HTML: usa itemscope, itemtype, itemprop y Schema.org para datos estructurados. Mejora el SEO y consigue «rich snippets» en buscadores.
¿Cómo puedo hacer que un enlace se descargue en lugar de navegar con el atributo download?
Haz que un enlace descargue archivos con el atributo download en HTML. Puedes sugerir un nombre de archivo.
¿Existen atributos para mejorar la seguridad en HTML?
HTML ofrece atributos para mejorar la seguridad: rel="noopener noreferrer" en enlaces, sandbox en iframes, e integrity para scripts. ¡Protege tu web!
¿Para qué sirve el atributo id y cómo se diferencia de class?
id es un identificador único por página (anclajes, JS). class agrupa elementos para CSS reutilizable o JS. ¡Entiende sus diferencias clave en HTML!
¿Qué son los atributos globales en HTML?
Los atributos globales HTML (id, class, style, title, lang) se pueden usar en cualquier etiqueta para añadir funcionalidades comunes. ¡Conócelos!
¿Hay herramientas para verificar la semántica de mi HTML?
Verifica la semántica HTML con validadores (W3C), herramientas de accesibilidad (Lighthouse, Axe, WAVE) y linters. ¡Asegura un código de calidad!
¿Es importante la jerarquía de encabezados para la semántica?
Sí, la jerarquía de encabezados («h1»-«h6») es vital para la semántica HTML, accesibilidad y SEO. ¡Aprende a estructurar tus títulos correctamente!
¿Para qué se usa la etiqueta «time»?
La etiqueta «time» representa fechas y horas de forma semántica y legible por máquinas con el atributo datetime. ¡Mejora SEO e interoperabilidad!
¿Cómo estructuro una página compleja usando HTML semántico?
Estructura páginas HTML complejas con semántica: usa «header», «nav», «main», «footer», «article», «section» y encabezados lógicos.
¿Qué hacen las etiquetas «details» y «summary»?
Las etiquetas «details» y «summary» crean desplegables (acordeones) nativos en HTML para mostrar/ocultar info sin JS. ¡Ideal para FAQs y contenido extra!
¿Para qué sirven las etiquetas «figure» y «figcaption»?
Con «figure» y «figcaption» agrupa contenido auto-contenido (imágenes, código) con su leyenda.
¿Cuál es la función de las etiquetas «header» y «footer» de sección y de página?
«Header» y «footer» en HTML: úsalos a nivel de página (logo, copyright) o de sección (título de artículo, autor). ¡Estructura semántica para tu web!
