Etiquetas para la estructura de una página web

Etiquetas para la estructura de una página web y su función

En HTML, las etiquetas son los elementos fundamentales que estructuran una página web. A continuación, te muestro las más importantes y su función dentro de una página web:


📌 Etiquetas principales de la estructura de una página web

🔹 <!DOCTYPE html> → Indica que el documento es de tipo HTML5.

🔹 <html> → Contiene todo el código HTML de la página.

🔹 <head> → Incluye metadatos (información sobre la página web) como el título y enlaces a hojas de estilo o scripts.

  • <title> → Define el título de la página que aparece en la pestaña del navegador.
  • <meta> → Proporciona información sobre la página (ejemplo: codificación de caracteres, descripción, autor).
  • <link> → Vincula archivos externos como hojas de estilo CSS.
  • <script> → Agrega código JavaScript.

🔹 <body> → Contiene todo el contenido visible de la página web.


📌 Etiquetas dentro del <body> (estructura del contenido)

Estructura general

  • <header> → Define el encabezado de la página, puede incluir el logo y el menú de navegación.
  • <nav> → Contiene los enlaces de navegación (menú principal).
  • <main> → Representa el contenido principal de la página.
  • <section> → Define una sección temática dentro de la página.
  • <article> → Contiene contenido independiente, como un blog o una noticia.
  • <aside> → Se usa para contenido secundario, como barras laterales o widgets.
  • <footer> → Representa el pie de página con información de contacto, derechos de autor, etc.

Elementos de texto

  • <h1> a <h6> → Definen títulos y subtítulos (h1 es el más importante).
  • <p> → Define párrafos de texto.
  • <a> → Crea enlaces a otras páginas o secciones (href="URL").
  • <ul>, <ol>, <li> → Listas desordenadas y ordenadas.
  • <span> → Se usa para aplicar estilos a partes específicas de un texto.
  • <strong> → Destaca texto en negrita.
  • <em> → Aplica énfasis (cursiva).

Elementos multimedia

  • <img> → Inserta imágenes (src="URL" para la imagen).
  • <video> → Agrega videos.
  • <audio> → Inserta archivos de audio.

Elementos de formulario

  • <form> → Define un formulario de entrada de datos.
  • <input> → Permite ingresar datos (texto, contraseña, correo, etc.).
  • <textarea> → Área de texto más grande.
  • <button> → Botón interactivo.

Comments

Popular Posts