Controles hipermedia en HTML: Navegando más allá de la simple lectura

Los controles hipermedia son elementos dentro de un hipermedia (como HTML) que permiten al usuario interactuar con un sistema remoto, generalmente un servidor. A diferencia del texto estático, los controles hipermedia codifican información sobre una acción específica que el cliente debe realizar al interactuar con ellos.

En HTML, los dos controles hipermedia principales son:

• Etiquetas de anclaje (): Estas etiquetas crean hipervínculos, permitiendo al usuario navegar entre diferentes documentos o recursos en la web. El atributo href dentro de la etiqueta <a> especifica la URL del recurso al que se accede al hacer clic en el enlace.
• Etiquetas de formulario (): Estas etiquetas se utilizan para enviar información al servidor, generalmente a través de una solicitud POST. Los formularios contienen diferentes tipos de elementos de entrada, como campos de texto, botones de opción y casillas de verificación, que permiten al usuario ingresar datos. El atributo action de la etiqueta <form> indica la URL a la que se enviará la información del formulario.

<form action="/submit" method="post">
  <input type="text" name="username">
  <input type="submit" value="Enviar">
</form>        

Estos dos controles, aunque simples, proporcionan una gran capacidad expresiva a HTML, permitiendo la creación de aplicaciones web interactivas. Sin embargo, HTML en su forma básica limita los controles hipermedia a solo dos métodos HTTP: GET (para etiquetas de anclaje) y POST (para formularios). Esta limitación ha llevado al uso extensivo de JavaScript para manejar interacciones más complejas y el intercambio de datos con el servidor, a menudo a través de API JSON.

Es importante destacar que la creciente popularidad de las SPA, que utilizan JavaScript y API JSON como su columna vertebral, no niega la utilidad y la potencia de los controles hipermedia y el enfoque de diseño centrado en el servidor que representan. Las bibliotecas como htmx buscan revitalizar el uso de hipermedia en el desarrollo web moderno, extendiendo las capacidades de HTML y permitiendo la creación de aplicaciones web interactivas y dinámicas sin abandonar completamente el modelo hipermedia.

Htmx, por ejemplo, permite que cualquier elemento HTML se convierta en un control hipermedia, ampliando las posibilidades de interacción más allá de los simples enlaces y formularios. Además, htmx permite el uso de los cinco métodos HTTP (GET, POST, PUT, PATCH, DELETE), proporcionando una mayor flexibilidad en el diseño e implementación de aplicaciones web.