La evolución del diseño web, como era antes y como es ahora!

362

La World Wide Web fue inventada hace casi 30 años por Tim Berners Lee para ayudar a las personas a compartir fácilmente información en todo el mundo. Durante las siguientes décadas, ha cambiado significativamente, tanto en términos de diseño y funcionalidad como de su papel más profundo en la sociedad moderna.

Así como el estilo arquitectónico de un edificio refleja la sociedad de la que emerge, la evolución del diseño de sitios web refleja las modas, creencias y tecnologías cambiantes de la época.

El primer sitio web contenía solo texto con hipervínculos que explicaban qué era la web, cómo usarla e instrucciones básicas de configuración. Desde aquellos primeros días hasta el presente, el diseño web ha tomado un largo y sinuoso viaje.

Los estilos en el diseño de sitios web

A principios de la década de 1990, dimos la bienvenida al primer lenguaje de publicación de la Web:

Lenguaje de marcado de hipertexto, o HTML

Pero el lenguaje, utilizado para compartir páginas de solo texto a través de un navegador simple, era limitado. Muchos de los primeros sitios web eran básicos, con páginas estructuradas verticalmente y con mucho texto y pocos gráficos. Las personas se adaptaron rápidamente al texto de desplazamiento vertical y al llamativo hipertexto subrayado en azul para navegar por el espacio virtual de la Web.

Primera página web de la historia
El primer sitio web, restaurado por el CERN en 2013. Internet Archive

¡Las Tablas!

A mediados y finales de la década de 1990, los diseñadores se involucraron más en el diseño de sitios web, y llegó la interfaz gráfica de usuario (GUI), que permitió a los diseñadores incorporar imágenes e íconos gráficos en los sitios web.

Cuando la Web comenzó a ganar popularidad como medio para comunicar información, los diseñadores vieron la oportunidad de usar tablas para organizar texto y gráficos.

Sitio web de Apple en 1997
Sitio web de Apple en 1997. Internet Archive

Antes de la introducción de las tablas como una estructura de página web, había pocos componentes de diseño en los sitios web, y no había forma de emular los diseños de los documentos impresos convencionales.

Pero si bien las tablas permitieron a los diseñadores organizar el texto y los gráficos fácilmente, el código requerido para construirlos fue más complejo que los métodos que vinieron después.

Principios de e-Bay
Principios de eBay. Archivo de internet

La llegada de Flash

A fines de la década de 1990, apareció una nueva tecnología en escena: Flash.

Flash era una plataforma de software que permitía a los diseñadores incorporar música, video y animación a los sitios web, lo que brindaba una experiencia audiovisual más dinámica. Flash también dio a los diseñadores más libertad para hacer que los sitios web sean interactivos.

Este fue de hecho la era de un avance creativo y tecnológico en el diseño web. Los menús interactivos, las páginas de bienvenida, las animaciones decorativas y los botones de burbujas bellamente representados dominaron la tendencia del diseño web para sorprender a las personas.

El concepto de la Web todavía era nuevo para muchas personas, y estos diseños visualmente emocionantes tenían un doble propósito. No solo eran brillantes y llamativos, sino que también introdujeron tecnología desconocida para usuarios novatos: “Mírame”, gritaron. “Me veo como un botón real. ¡Presionarme!”

https://www.youtube.com/watch?v=3aT4wt0fmGU

Esta web de la agencia alemana de diseño web EYE4U creó un contenido entretenido utilizando Flash ™ para transmitir multimedia, animación y sonido. Un clásico del diseño web en Flash. 

Pero la popularidad de Flash fue de corta duración. Se requiere que los usuarios tengan instalado el último complemento Flash en sus computadoras, lo que limita la usabilidad y accesibilidad de los sitios web.

Aunque Flash no estuvo a la altura de las expectativas, cambió la forma en que los sitios web fueron diseñados y utilizados.

Las Hojas de Estilo

Las personas se volvieron sofisticadas al navegar por la Web, y los elementos de diseño ya no tuvieron que educar de una manera que articule visualmente la funcionalidad, como los hipervínculos subrayados en azul.

Luego surgieron las redes sociales y exigieron una flexibilidad aún mayor. Esto llevó al nacimiento de las hojas de estilo en cascada (CSS).

Se utilizaron CSS para definir estilos particulares, como tamaños de fuente más grandes para subtítulos, en varias páginas de un solo sitio web sin tener que codificar cada elemento individualmente. La idea detrás de CSS era separar el contenido (HTML) de la presentación (CSS).

Con esto cambiar el aspecto de una web era tan fácil como cambiar la hoja de estilos. En aquella época una web llamada Zen-Garden se hizo muy popular por permitir que cualquiera cambiara el diseño de la página con solo añadir un CSS personalizado.

zen-garden
Con zen-garden podemos entender fácilmente como funciona esta relación. Se trata de una página web en HTML, cuando seleccionamos un diseño, un javascript en la página lo único que hace es cambiar la hoja de estilos (CSS) y todo el diseño de la página cambia.

Ahora cualquiera puede hacer páginas web

Las plantillas de diseño web comenzaron a aparecer, permitiendo a las personas comunes crear y publicar sus propios sitios web. Desafortunadamente, esto a menudo fue a expensas de un diseño utilizable, accesible y estéticamente agradable.

templatemonster
templatemonster.com fue uno de los sitios mas populares por allá por el 2005 ofreciendo miles de plantillas fácilmente modificables.

Diseño Web Adaptable y el Diseño Plano (Flat)

Avancemos rápidamente hasta 2010 cuando Ethan Marcotte creó un nuevo enfoque de diseño web llamado diseño web adaptable. Esto cambió la forma de usar HTML y CSS.

La idea principal que sustentaba el diseño adaptable era que un solo sitio web podía responder y adaptarse a diferentes entornos de visualización, facilitando el uso en diferentes dispositivos. Las personas tendrían la misma experiencia en su dispositivo móvil que en su computadora de escritorio, lo que significa una mayor eficiencia en el diseño y mantenimiento web.

Esto llevó a otra ola de tendencia de diseño web: diseño plano. Esta tendencia adoptó un estilo bidimensional minimalista eficiente y visualmente agradable. Destaca la funcionalidad sobre los elementos de diseño ornamentales.

flat-design

Hoy en día, el diseño plano sigue siendo fuerte. El diseño web ha hecho un círculo completo desde el principio de la Web, priorizando el contenido y la comunicación de información.

Los botones e íconos han quedado en segundo plano, inclinándose con gracia al contenido como la vanguardia de los sitios web, y reduciendo la complejidad en el diseño.

El futuro del Diseño Web…

La historia de la Web es relativamente corta, sin embargo, ha pasado por una sucesión de renacimientos en un corto período de tiempo.

Anteriormente, la tecnología impulsó los avances en el diseño web. Pero creo que estamos en un punto donde el diseño web ya no está limitado por la tecnología. Prácticamente, podemos hacer casi todo lo que queramos hacer en la Web.

El futuro del diseño web ya no se trata de lo que podemos hacer, sino más bien de lo que debemos hacer. Eso significa ser considerado acerca de cómo el diseño puede afectar a las personas que lo usan y diseñar sitios web que resulten en experiencias positivas para los usuarios.

Puedes buscar versiones anteriores de sitios webs conocidos utilizando Wayback Machine. También existe un canal de Youtube: Web Design Museum especialmente interesante para ver viejas webs hechas con flash.

You might also like

Leave A Reply

¡NO sigas este enlace o serás bloqueado en este sitio!