Lenguaje HTML
1. ¿Qué significa HTML y para qué se utiliza?
HTML significa Lenguaje de Marcado de Hiper Texto (Hiper Text Markup
Language), es decir, utilizar este lenguaje nos sirve para etiquetar un texto a fin
de que un software reconozca cada una de las partes de las que se compone la
estructura de dicho texto. El software que lee este tipo de lenguaje se
llama navegador y seguro que estás utilizando uno de ellos para leer esta
entrada de blog. Chrome, Firefox y Safari son algunos de ellos, por mencionar
los más comunes.
2. ¿Cuáles son los elementos básicos de una etiqueta HTML?
Elemento: es el nombre de la etiqueta, generalmente pareada (es decir: con
apertura y cierre, como lo acabamos de mencionar), y aparece entre los signos
de apertura. Por ejemplo: <title>Partes básicas de etiquetas HTML</title>, que
indica que esa frase es un título.
Atributo: es lo que diferencia a un elemento y que le da ciertas características,
como tamaño, color, tipo de fuente. Se escribe antes del signo de igual (=), junto
al elemento de la etiqueta, únicamente en la apertura, y antes de la variable. Por
ejemplo: <font face="Arial">. Este texto aparecerá en tipografía Arial</font>. El
atributo es el tipo letra, es decir: face.
Contenido: es el texto que modifica las etiquetas, lo que aparece entre las
etiquetas y atributos.
Variable: es la característica del atributo de una etiqueta: color, tamaño, tipo de
letra, y se escribe generalmente entrecomillado después del signo de igual. En
el ejemplo de atributo, la variable es Arial.
3. ¿Cuál es la diferencia entre una etiqueta de apertura y una de cierre en
HTML?
La etiqueta de apertura viene dada por los símbolos <> mientras que las
etiquetas de cierre vienen dadas de la forma </>
4. ¿Cuáles son las etiquetas HTML más comunes y para qué se utilizan?
- : Define el principio y el final de un documento HTML.
- <head>: Define la sección de encabezado de un documento HTML, que
contiene información sobre el documento, como el título, la descripción, las
palabras clave, etc.
- <title>: Define el título del documento HTML que aparece en la pestaña del
navegador.
- <body>: Define la sección del cuerpo de un documento HTML, que contiene el
contenido de la página web.
- <h1> a <h6>: Define los títulos o encabezados de la página, siendo <h1> el
más grande y <h6> el más pequeño.
- <p>: Define un párrafo.
- <a>: Define un enlace a otra página web o a una sección de la misma página.
- <img>: Define una imagen que se mostrará en la página web.
Evolución del lenguaje HTML
1. ¿Cómo ha evolucionado el lenguaje HTML desde su primera versión hasta
la actualidad? ¿Cuáles son las principales diferencias entre ellas?
HTML 1.0 (1993): La primera versión de HTML solo incluía un conjunto básico
de etiquetas, como <html>, <head>, <title>, <body> y <h1>-<h6>. No había
soporte para imágenes o multimedia, ni para estilos o scripts.
HTML 2.0 (1995): Esta versión agregó nuevas etiquetas, como <table>, <img> y
<form>, y se introdujeron las primeras especificaciones para definir el aspecto
de las páginas web mediante la inclusión de hojas de estilo (CSS) y la capacidad
de incorporar scripts (JavaScript).
HTML 3.2 (1997): Esta versión introdujo importantes mejoras en la estructura y
presentación de páginas web, incluyendo soporte para marcos (frames) y tablas
más complejas. También se agregaron nuevas etiquetas, como <embed> y
<object>, para permitir la inclusión de contenido multimedia.
HTML 4.01 (1999): Esta versión incluyó mejoras en la accesibilidad, soporte para
hojas de estilo en cascada (CSS), tablas más avanzadas y nuevos elementos de
formulario, como la validación de formularios. También se agregaron nuevas
etiquetas para hacer posible la creación de aplicaciones web complejas.
XHTML (2000): XHTML (Extensible HTML) fue una nueva versión que siguió las
reglas de XML y trajo una sintaxis más estricta y compatible con otros lenguajes
basados en XML. La sintaxis XHTML debía seguir reglas más estrictas que
HTML y la codificación XML permitió a los desarrolladores trabajar con una única
sintaxis, mejorando la interoperabilidad.
HTML5 (2014): La versión actual de HTML incluye muchas características
nuevas, como etiquetas semánticas (<header>, <footer>, <nav>, etc.), mejoras
en la compatibilidad multimedia (audio y video), una API de canvas para dibujar
gráficos, animaciones y efectos, soporte para almacenamiento local, mejoras en
formularios, y una mejor compatibilidad con dispositivos móviles.
3. ¿Qué son los estándares web y cómo han afectado la evolución del
lenguaje HTML?
son pautas y especificaciones técnicas desarrolladas por organizaciones como
el Consorcio World Wide Web (W3C) y la Web Hypertext Application Technology
Working Group (WHATWG) para asegurar que las tecnologías web sean
consistentes y funcionen correctamente en todos los navegadores y dispositivos
4. ¿Cuáles son las características principales de HTML5 y qué mejoras ha
introducido con respecto a sus versiones anteriores?
- Semántica mejorada: HTML5 ha introducido nuevas etiquetas semánticas, como
<header>, <footer>, <nav>, <article>, <section>, <aside>, etc. Estas etiquetas
permiten a los desarrolladores web crear sitios web más claros y estructurados,
lo que mejora la accesibilidad y la usabilidad para los usuarios.
- Soporte multimedia mejorado: HTML5 ha mejorado el soporte multimedia,
permitiendo a los desarrolladores web incorporar audio y video directamente en
una página web, sin necesidad de complementos adicionales. También se ha
introducido una API de canvas, que permite a los desarrolladores web dibujar
gráficos, animaciones y efectos en la página web.
- Formularios mejorados: HTML5 ha mejorado la funcionalidad de los formularios,
permitiendo a los desarrolladores web agregar nuevas características como la
validación de campos de entrada y la selección de fechas.
- Compatibilidad con dispositivos móviles: HTML5 ha sido diseñado para ser
compatible con dispositivos móviles, permitiendo a los desarrolladores web crear
sitios web responsivos y adaptativos que se ajusten automáticamente a
diferentes tamaños de pantalla.
- Mejoras en la sintaxis: HTML5 ha simplificado la sintaxis del lenguaje, lo que
hace que sea más fácil para los desarrolladores web escribir código HTML y para
los motores de búsqueda entender el contenido de una página web.
5. ¿Qué son las etiquetas semánticas en HTML y cómo han influido en la
evolución del lenguaje?
Algunas de las etiquetas semánticas más comunes en HTML5 incluyen
<header>, <footer>, <nav>, <article>, <section>, <aside>, <figure> y
<figcaption>. Estas etiquetas son específicas para describir diferentes partes de
una página web, como el encabezado, el pie de página, la barra de navegación,
el contenido principal y el contenido secundario.
Las etiquetas semánticas han influido significativamente en la evolución del
lenguaje HTML, ya que han introducido una nueva forma de describir y
estructurar el contenido de una página web. Antes de la introducción de las
etiquetas semánticas, los desarrolladores web a menudo utilizaban etiquetas
genéricas como <div> y <span> para estructurar el contenido de la página web,
lo que hacía difícil para los motores de búsqueda y otros dispositivos entender el
significado del contenido y proporcionar una experiencia de usuario mas sensible
6. ¿Cómo ha evolucionado la accesibilidad web en relación con el lenguaje
HTML?
Etiquetas semánticas: Con HTML5, se introdujeron nuevas etiquetas
semánticas, como <header>, <nav>, <article>, <section>, <aside> y <footer>.
Estas etiquetas permiten a los desarrolladores web crear una estructura más
clara y significativa en sus páginas web, lo que facilita la navegación y la
comprensión del contenido para los usuarios con discapacidades.
Atributos accesibles: HTML proporciona una serie de atributos accesibles que
permiten a los desarrolladores web agregar información adicional a las etiquetas
para mejorar la accesibilidad. Por ejemplo, el atributo "alt" se utiliza para describir
una imagen en caso de que el usuario no pueda verla, mientras que el atributo
"title" se utiliza para proporcionar información adicional sobre un elemento.
Compatibilidad con tecnologías de asistencia: Los desarrolladores web pueden
utilizar HTML para crear sitios web que sean compatibles con tecnologías de
asistencia, como lectores de pantalla y teclados de navegación. Por ejemplo, las
etiquetas de encabezado permiten a los usuarios de lectores de pantalla saltar
rápidamente a las secciones de contenido importantes, mientras que los
atributos "tabindex" y "accesskey" permiten a los usuarios de teclados de
navegación acceder a los elementos importantes de forma más eficiente.