HTML Básico

Inicio / Tema / HTML Básico / Introducción a HTML

Introducción a HTML

¿Qué es HTML?

HTML (HyperText Markup Language) es el lenguaje estándar para crear páginas web. Define la estructura de una página web y permite incluir elementos como texto, imágenes, enlaces y otros recursos multimedia. HTML es fundamental para el desarrollo web y es interpretado por los navegadores para mostrar contenido de manera visual a los usuarios.

Representación visual de una página HTML simple con diferentes elementos marcados, como texto y enlaces Representación visual de una página HTML simple con diferentes elementos marcados, como texto y enlaces

Estructura de un Documento HTML

Un documento HTML tiene una estructura básica que todos los navegadores reconocen. Esta estructura define cómo el contenido y los metadatos se organizan en la página. A continuación se muestra un ejemplo de estructura básica:

html

"La estructura comienza con el tipo de documento, seguido de la etiqueta html que encierra todo el contenido. En el encabezado se coloca el título de la página y los metadatos. Luego, en el cuerpo, podemos incluir elementos visibles como encabezados y párrafos."

Visión General de Etiquetas y Elementos

En HTML, usamos etiquetas para definir diferentes tipos de contenido. Cada etiqueta está delimitada por ángulos angulares, como <p> para un párrafo o <h1> para un encabezado. Las etiquetas suelen venir en pares, como <p> y </p>, aunque algunas son etiquetas de autocierre.

Ejemplo de diferentes etiquetas básicas:

html

"Aquí vemos un encabezado, un par de párrafos, y una línea horizontal. Cada etiqueta cumple un propósito específico, el encabezado destaca el título, y los párrafos agrupan bloques de texto."

Visualización de diferentes etiquetas y sus efectos en una página HTML Visualización de diferentes etiquetas y sus efectos en una página HTML

Estructura Básica del Documento

Declaración DOCTYPE

El documento HTML comienza con <!DOCTYPE html>, una declaración que informa al navegador el tipo de documento y la versión de HTML que estamos usando. Este es un paso importante para asegurar que el documento se renderice correctamente.

html

"Doctype es la primera línea y asegura que el navegador interprete el documento como HTML5. No lleva cierre, y es esencial en cualquier página HTML moderna."

La Etiqueta `<html>`

La etiqueta <html> envuelve todo el contenido de la página. Aquí también definimos el idioma del documento mediante el atributo lang.

html

"La etiqueta html contiene todo el contenido de la página. El atributo lang especifica el idioma, en este caso español."

Sección `<head>`

Dentro de la etiqueta <head> se incluye información sobre el documento, como el título, los metadatos y enlaces a estilos y scripts. Esta información no se muestra directamente en la página, pero es crucial para el funcionamiento y la accesibilidad del sitio.

html

"El encabezado incluye el título de la página, que aparecerá en la pestaña del navegador, y también metadatos como el conjunto de caracteres, que ayuda a mostrar el texto correctamente."

Sección `<body>`

La etiqueta <body> contiene el contenido visible de la página. Aquí es donde colocamos los textos, imágenes, enlaces, y otros elementos que deseamos que el usuario vea.

html

"El cuerpo contiene el contenido que verá el usuario en la página. En este caso, vemos un encabezado y un párrafo de bienvenida."

Cierre del Capítulo

Ahora que entiendes la estructura básica de un documento HTML, estás listo para explorar los diferentes elementos de contenido que puedes añadir a tus páginas. En el próximo capítulo, aprenderemos a trabajar con texto y las diferentes etiquetas que nos permiten darle formato.

Marcar como leìdo y continuar