Los enlaces no son un detalle
Las conexiones determinan cómo personas y sistemas encuentran, clasifican y relacionan contenidos.
Un viaje por el mundo del desarrollo web
Acompáñame en un viaje desde la idea de lo que más tarde se conocería como hipertexto,
pasando por los primeros sistemas de hipertexto hasta la web actual.
Comprende el origen del hipertexto y, por tanto, de la propia web.
Evolución de los sistemas de hipertexto
Desde los inicios hasta la actualidad
1945
Memex
Presentado en el artículo ‘As We May Think’ de Vannevar Bush en The Atlantic
Un concepto visionario de Vannevar Bush que sentó las bases del hipertexto y del desarrollo web moderno: organizar y enlazar información como en las bases de datos y enlaces actuales.
1960
Xanadú
El proyecto comenzó en los años 60; primer sistema publicado en 1988
Proyecto revolucionario de Ted Nelson para un sistema de hipertexto transclusivo. Influyó en tecnologías posteriores y en la forma de pensar la información enlazada.
1968
oN-Line System (NLS)
Nombre oficial del sistema mostrado en la ‘Mother of All Demos’
Sistema pionero de Douglas Engelbart con ratón y edición de texto interactiva: pilares de la interacción moderna.
1968
Augment
Presentado en la legendaria ‘Mother of All Demos’
Primeros sistemas de hipertexto que ampliaban la capacidad intelectual humana: un hito en la interacción con sistemas digitales.
1980
Enquire
Desarrollado por Tim Berners-Lee en el CERN — precursor de la Web
Primer sistema de hipertexto de Tim Berners-Lee que concretó la idea de la información enlazada e inspiró la Web.
1980
Tangle
Sistema experimental de Tim Berners-Lee
Desarrolló las ideas de Enquire con un enfoque en redes de información complejas.
1987
HyperCard
Presentado por Apple — facilitó crear contenido enlazado
Herramienta para crear contenido interactivo y enlazado: precursora de muchas aplicaciones web modernas.
1989
World Wide Web
Concepto en 1989; primera web en línea en 1991
Sistema de hipertexto de Tim Berners-Lee que popularizó la información enlazada y revolucionó el acceso al conocimiento.
Por qué importa el hipertexto
La base del desarrollo web moderno
Antes de que existiera la web, surgió la idea del hipertexto: enlazar la información.
Este concepto es el origen de lo que hoy conocemos como Internet y desarrollo web moderno.
Comprender la historia del hipertexto revela también los cimientos sobre los que se construyen HTML, CSS, JavaScript y otras tecnologías web.
Qué significa hoy el hipertexto
Desde enlaces y SEO hasta una arquitectura de información limpia
El SEO empieza en la estructura
Si entiendes el hipertexto, entiendes mejor por qué el enlazado interno, la semántica y el contexto importan para los buscadores.
Muchos problemas empiezan en la estructura
Navegación confusa, relaciones caóticas entre páginas y jerarquías ausentes rara vez son fallos de diseño. Son fallos de estructura.
Evolución de la red de información
De sitios web estáticos a la inteligencia artificial
1990er
Web 1.0
Páginas estáticas, HTML y CSS básico
La Web 1.0 era principalmente centrada en documentos. Los usuarios podían leer información pero apenas crear contenido propio.
2000er
Web 2.0
Redes sociales, JavaScript, AJAX
Con la Web 2.0, Internet se volvió más interactivo. Los usuarios podían crear, comentar y compartir contenido.
2010er
Web 3.0
Web semántica, APIs, Linked Data
En la Web 3.0, los datos están en el centro. La información está mejor conectada y es legible por máquinas, lo que permite aplicaciones inteligentes.
2020er
Web 4.0
Sistemas inteligentes, IA, experiencias personalizadas
La Web 4.0 combina inteligencia artificial con Internet. El objetivo es una web autoaprendente, consciente del contexto y altamente personalizada.
Cada fase de la web resuelve un problema y crea otro
El progreso en la web siempre implica un intercambio
Web 1.0
Las páginas estáticas hicieron accesible el conocimiento, pero los usuarios apenas podían reaccionar, participar o influir.
Web 2.0
La interacción se volvió más fácil, pero las plataformas ganaron un enorme control sobre contenido, alcance y datos.
Web 3.0
Los datos se volvieron más estructurados y conectados, pero también más complejos, más difíciles de modelar y de usar bien.
Web 4.0
El contexto y la IA prometen mejores sistemas, pero también plantean nuevas preguntas sobre dependencia, trazabilidad y calidad.
Fundamentos de la Web
Los bloques sobre los que todo se construye
La web moderna se basa en un conjunto de tecnologías esenciales que definen su estructura y funcionamiento.
HTML proporciona la columna vertebral al estructurar el contenido, CSS maneja el diseño y la maquetación, mientras que JavaScript permite la interactividad y el comportamiento dinámico.
Juntas, estas herramientas forman la base sobre la que se desarrolla cada sitio web y aplicación web.
Hitos del desarrollo web
Perspectivas del desarrollo web moderno
2010
Single Page Applications (SPA)
Experiencia de usuario sin recargas completas
Aplicaciones dinámicas e interactivas con carga asíncrona — popularizadas por frameworks como React y Vue.
2011
Web Components
Bloques de UI reutilizables y multiplataforma
Elementos HTML personalizados reutilizables en cualquier app; habilitados por estándares como Shadow DOM y Custom Elements.
2011
WebRTC
Comunicación en tiempo real en el navegador
Audio, video y datos sin plugins — base de muchas herramientas modernas de comunicación.
2015
Progressive Web Apps (PWA)
Rápidas, fiables y multiplataforma
Combinan lo mejor de la web y las apps nativas: offline, notificaciones push y experiencia similar a una app en el navegador.
2015
Service Worker y Web Push
Funciones offline y notificaciones
Permiten acceso sin conexión y notificaciones en tiempo real — hacen a las PWA potentes y flexibles.
2015
Jamstack
Arquitectura para sitios rápidos y seguros
Desacopla frontend y backend, combinando entrega estática con APIs dinámicas para rendimiento y seguridad.
2015
Compresión Brotli
Mayor compresión que Gzip
Cargas más rápidas gracias a una compresión más eficiente y menor consumo de datos.
2017
WebAssembly (WASM)
Alto rendimiento en la web
Permite rendimiento casi nativo ejecutando código compilado (p. ej., C++/Rust) en el navegador.
2018
HTTP/3 y QUIC
Conexiones más eficientes vía UDP
Conexiones más rápidas y estables con menor latencia — especialmente en redes móviles.
2021
Privacy Sandbox
Iniciativa de privacidad para una web sin cookies
Mejora la privacidad sin cookies de terceros y permite anuncios relevantes.
2022
WebTransport
Datos en tiempo real sobre UDP
Habilita comunicación en tiempo real de alto rendimiento para juegos, streaming y más.
2022
Container Query CSS
Más flexibilidad para diseño responsivo
Aplica reglas según el tamaño del contenedor en lugar del viewport — mejor control del layout.
2023
WebGPU
Reemplazo moderno de WebGL
Acceso directo a la GPU para 3D y ML en el navegador — rendimiento muy superior.
Por qué existen las tecnologías modernas
Las nuevas herramientas aparecen porque los límites antiguos duelen
El desarrollo web moderno es interesante, pero sobre todo es una respuesta a cuellos de botella reales. La pregunta clave no es solo qué es nuevo, sino qué problema pretende resolver.
SPA
Las Single Page Applications surgieron para hacer la interacción más fluida. A cambio, la navegación, la carga inicial y el SEO se volvieron mucho más difíciles.
HTTP/3
HTTP/3 existe porque TCP y las conexiones clásicas tienen límites con latencia y pérdida de paquetes. QUIC responde exactamente a ese problema.
WebGPU
WebGPU no es solo otra etiqueta de API. Responde a la necesidad de más potencia gráfica y de cálculo directamente en el navegador.
TTT: Consejos — Trucos — Herramientas
Blog de desarrollo web
Descubre en este blog dónde tiene su origen el desarrollo web y obtén consejos útiles, colecciones de enlaces, artículos de blog, así como documentos digitales y cursos en video para profundizar en el tema.
Desde la web estática y centrada en documentos 1.0, pasando por una web social 2.0 y una web semántica 3.0, hasta una web inteligente 4.0.
Descubre cómo se configura hoy el desarrollo web moderno: aprende las últimas tecnologías y tendencias, recibe guías prácticas y acceso a recursos valiosos como herramientas, frameworks y comunidades en línea que te ayudarán a llevar tus proyectos al siguiente nivel.