HTML, o lenguaje de marcado de hipertexto, es el lenguaje de marcado estándar para documentos diseñados para mostrarse en un navegador web. HTML es la piedra angular de cualquier desarrollador web. Es la estructura básica de cualquier página web. Una página web sin HTML es como un edificio sin cimientos. Por lo tanto, un conocimiento sólido de HTML es fundamental para convertirse en desarrollador front-end.
Estructura básica de HTML
La estructura básica de HTML consta de etiquetas que se utilizan para definir y organizar el contenido de la página web. Cada documento HTML comienza con la declaración de tipo de documento . A esto le sigue la etiqueta html que encapsula todo el contenido de la página web. Dentro de esta etiqueta html, tenemos dos partes principales: la etiqueta head y la etiqueta body.
<!DOCTYPE html> <html> <cabeza> <title>Título de la página</title> </cabeza> <cuerpo> Contenido de página </cuerpo> </html>
La etiqueta de encabezado contiene metadatos sobre la página web, como el título de la página, enlaces a CSS y JavaScript, y otra información diversa que no se muestra directamente en la página web. La etiqueta del cuerpo contiene el contenido real de la página web que se muestra en el navegador.
Etiquetas y atributos HTML
Las etiquetas HTML son la base de HTML. Definen y organizan el contenido de la página web. Cada etiqueta comienza con un corchete angular (<) seguido del nombre de la etiqueta y termina con un corchete angular (>). La mayoría de las etiquetas HTML vienen en pares, lo que significa que tienen una etiqueta de apertura y una etiqueta de cierre. La etiqueta de cierre es similar a la etiqueta de apertura, pero tiene una barra diagonal (/) antes del nombre de la etiqueta. Por ejemplo, la etiqueta de párrafo se escribe como <p> para abrir y </p> para cerrar.
Los atributos HTML se utilizan para proporcionar información adicional sobre las etiquetas HTML. Siempre se especifican en la etiqueta de apertura y normalmente vienen en pares de nombre/valor. Por ejemplo, la etiqueta de enlace (<a>) utiliza el atributo href para especificar la URL del enlace.
<a href="https://www.example.com">Este es un enlace</a>
AJAX y API de recuperación
AJAX, o JavaScript y XML asincrónicos, es una técnica que permite actualizar las páginas web de forma asincrónica, enviando y recibiendo datos del servidor sin interferir con la visualización y el comportamiento de la página existente. Esto significa que puedes actualizar partes de una página web sin tener que volver a cargar toda la página.
La API Fetch proporciona una interfaz para recuperar recursos (incluidos recursos de origen cruzado) en la web. Es una alternativa más moderna y flexible a AJAX, con una API más potente y fácil de usar. La API Fetch devuelve promesas y utiliza una sintaxis más limpia y elegante, lo que hace que el código sea más legible y fácil de mantener.
buscar('https://api.exemplo.com/dados') .entonces(respuesta => respuesta.json()) .entonces(datos => console.log(datos)) .catch(error => console.error('Error:', error));
En definitiva, HTML es el lenguaje de marcado que utilizamos para estructurar y dar sentido a nuestro contenido en la web, definiendo qué es una cabecera, un párrafo, un enlace, etc. Las etiquetas y atributos HTML son la base de HTML, mientras que AJAX y Fetch API son técnicas poderosas que le permiten crear experiencias de usuario dinámicas e interactivas en la web.