Introducción a HTML: Estructura Básica, Etiquetas y Atributos: Formularios en HTML
El lenguaje HTML (Hyper Text Markup Language) es la base para crear cualquier sitio web en la web. Es un lenguaje de marcado, lo que significa que se utiliza para estructurar el contenido de un documento, pero no para programar comportamientos o estilos. Para ello utilizamos otros lenguajes como CSS y JavaScript. En este capítulo, nos centraremos en comprender la estructura básica de un documento HTML, las etiquetas más comunes y cómo utilizar los atributos. Además, también aprenderemos a crear formularios HTML.
Estructura básica de un documento HTML
Cada documento HTML comienza con la declaración del tipo de documento, que le indica al navegador qué tipo de documento está leyendo. Para HTML5, la última versión de HTML, la declaración es simplemente . Después de eso, el documento HTML se divide en dos partes principales: el encabezado y el cuerpo. El encabezado contiene metadatos sobre el documento, como el título que aparece en la pestaña del navegador y enlaces a hojas de estilo CSS o scripts JavaScript. El cuerpo contiene el contenido real del sitio, que es lo que los usuarios ven y con lo que interactúan.
Ejemplo de la estructura básica de un documento HTML:
<!DOCTYPE html>
<html>
<cabeza>
<title>Título del sitio</title>
</cabeza>
<cuerpo>
Contenido del sitio web
</cuerpo>
</html>
Etiquetas HTML
Las etiquetas HTML se utilizan para marcar y categorizar contenido en un documento HTML. Cada etiqueta comienza con un corchete angular (<) y termina con un corchete angular (>). La mayoría de las etiquetas tienen una etiqueta de apertura y una etiqueta de cierre, con el contenido en el medio. La etiqueta de cierre es la misma que la etiqueta de apertura, pero tiene una barra diagonal (/) antes del nombre de la etiqueta.
Ejemplo de uso de etiquetas HTML:
<p>Este es un párrafo.</p>
<h1>Este es un encabezado de nivel 1.</h1>
<a href="https://www.example.com">Este es un enlace.</a>
Atributos HTML
Los atributos se utilizan para proporcionar información adicional sobre un elemento HTML. Se incluyen en la etiqueta de apertura y constan de un nombre de atributo y un valor de atributo. El valor del atributo debe estar entre comillas.
Ejemplo de uso de atributos HTML:
<a href="https://www.example.com" target="_blank">Este es un enlace que se abre en una nueva pestaña.</a>
<img src="image.jpg" alt="Descripción de la imagen">
Formularios HTML
Los formularios son una parte importante de cualquier sitio web, ya que permiten a los usuarios ingresar información e interactuar con el sitio web. Un formulario se crea usando la etiqueta <form>, y dentro del formulario usamos diferentes etiquetas para diferentes tipos de campos de entrada, como <input>, <textarea>, <select>, etc. Cada campo de entrada puede tener atributos para controlar su comportamiento, como tipo, nombre, valor, etc.
Ejemplo de un formulario HTML:
<form action="/submit_form" método="publicación">
<label for="nombre">Nombre:</label>
<tipo de entrada="texto" id="nombre" nombre="nombre">
<label for="correo electrónico">Correo electrónico:</label>
<tipo de entrada="correo electrónico" id="correo electrónico" nombre="correo electrónico">
<tipo de entrada="enviar" valor="Enviar">
</formulario>
