HTML: Definición, Significado y Estructura del Lenguaje de Marcado de Hipertexto

HTML: Definición, Significado y Estructura del Lenguaje de Marcado de Hipertexto

HTML, siglas de HyperText Markup Language (Lenguaje de Marcado de Hipertexto), es la base de la World Wide Web. Es el lenguaje de programación que se utiliza para crear la estructura y el contenido de las páginas web que vemos en nuestros navegadores.

Imaginemos HTML como el esqueleto del cuerpo humano o la estructura de una casa. Define la forma, el orden y la disposición de los elementos, pero no su apariencia final. Para eso, necesitamos CSS (Cascading Style Sheets), que sería la piel o la decoración, y JavaScript, que añadiría la funcionalidad y la interacción, como los sistemas que dan vida a la casa.

¿Qué significa HTML?

HTML es una combinación de tres palabras clave:

  • Hypertext: El texto enlazado, que permite navegar entre diferentes páginas web de forma rápida y sencilla.
  • Markup: Se refiere al uso de etiquetas para dar formato y estructura al contenido.
  • Language: Es un lenguaje que entiende una computadora y le permite interpretar el código HTML para crear la página web.

¿Cómo funciona HTML?

HTML utiliza etiquetas para dar formato al contenido de una página web. Las etiquetas son palabras encerradas entre corchetes angulares, como <p>, <h1>, <h2>, <b>, <strong>, etc. Cada etiqueta define un elemento HTML, que combina la etiqueta de apertura y cierre con su contenido.

Por ejemplo, la etiqueta <p> define un párrafo, la etiqueta <h1> define un encabezado de nivel 1, la etiqueta <b> define un texto en negrita, etc.

Atributos HTML

Las etiquetas HTML también pueden tener atributos que añaden información adicional. Los atributos se colocan dentro de la etiqueta de apertura y se separan del nombre de la etiqueta con un espacio.

LEER:  CSS: Guía Definitiva de Colores para Diseñadores Web

Por ejemplo, la etiqueta <img> define una imagen. El atributo src define la ruta de la imagen, el atributo alt define un texto alternativo para la imagen, etc.

Estructura básica de una página HTML

Una página HTML tiene una estructura básica que se define con los siguientes elementos:

  • <html>: Este elemento es el elemento raíz de la página HTML. Define el inicio y el fin del documento HTML.
  • <head>: Contiene metadatos sobre la página, como el título, la descripción, la codificación de caracteres, las hojas de estilo CSS y los scripts JavaScript.
  • <title>: Define el título de la página, que se muestra en la pestaña del navegador.
  • <body>: Contiene el contenido visible de la página web.

HTML semántico

El HTML semántico se refiere al uso de etiquetas descriptivas para definir el tipo de contenido que se va a mostrar. Esto ayuda a los navegadores, motores de búsqueda y lectores de pantalla a comprender mejor la estructura de la página web.

Etiquetas semánticas comunes

  • <header>: Define la cabecera de la página, que suele contener el logo, el título y el menú de navegación.
  • <nav>: Define la sección de navegación de la página.
  • <main>: Define el contenido principal de la página.
  • <section>: Define una sección de contenido específica.
  • <article>: Define un artículo independiente, como un post de blog o una noticia.
  • <aside>: Define contenido relacionado con el contenido principal, como una barra lateral.
  • <footer>: Define el pie de página de la página, que suele contener información de copyright, enlaces a políticas de privacidad y redes sociales.

Ejemplo de un documento HTML básico

«`html





Mi primera página web

LEER:  SQL SELECT: Guía Definitiva para Consultar Datos

Mi página web

Mi primer artículo

Este es un ejemplo de un artículo en mi página web.

© 2023 Mi página web



«`

Conclusión

HTML es el lenguaje fundamental para crear páginas web. Comprender su definición, significado y estructura es esencial para cualquier persona que quiera aprender a desarrollar páginas web. Aprender HTML te permitirá crear la base de tu página web y convertir tus ideas en realidad en el mundo digital.