diseño web

Cuenta la historia1, en nuestro caso, la Wikipedia, que la primera
web fue publicada en el año 1991 por Tim Berners -Lee. El padre de
la World Wide Web elaboró un documento informático que rompía
con lo anterior porque contenía hipervínculos, es decir, ofrecía
posibilidad de ir a otro texto al pulsar sobre una palabra.
Trece años después, en el año 2004, el descubrimiento de Berners -
Lee se reinventó, y no porque cambiara de un día para otro, sino
porque, como suele ocurrir en el mundo de Internet, alguien le
puso un nuevo nombre: Web 2.02.

La llegada de la Web 2.0 ha supuesto una revolución en el diseño, tanto en lo que se
refiere a la concepción artística como en las interfaces. El usuario adquiere un
nuevo papel dentro del soporte, ya que deja de ser un “escaneador ” de contenidos
para ser el que elige, el que participa e incluso el que crea esos contenidos.
Desde el punto de vista visual este nuevo modo de hacer webs ha supuesto una
estandarización. Mientras en la Web 1.0 los diseñadores realizaban páginas sin
apenas base previa, ya que existían pocas referencias de diseño digital, la Web 2.0
ha supuesto el nacimiento de los estilos.
Todos sabemos que nos encontramos en una página actual porque reconocemos una
serie de cánones repetitivos: bordes redondeados, degradados, un fondo con
diagonales y el logo reflejado.
El nacimiento de estos estilos viene derivado al mismo tiempo de la creación de
nuevos perfiles profesionales: diseñador gráfico web. Las páginas 1.0 fueron
dibujadas por diseñadores que provenían del mundo de los carteles, prensa y
papelería, sin embargo las 2.0 han sido pensadas por creadores especializados en
diseño de webs.
Las páginas han evolucionado, pero los usuarios más. Cada día son más exigentes a
la hora de elegir el tiempo que pasan en cada site. Gracias a esta demanda el diseño
2.0 se ha visto obligado a incluir como disciplina no sólo la elección de formas y
colores, sino también a pensar en el individuo que va a interaccionar. Así nace la
Usabilidad, un término que también surgió cuando alguien le puso nombre, en
concreto fue Jacob Nielsen.

La Web 2.0 ha supuesto la creación de una serie de clichés de diseño,
de elementos comunes, que configuran un estilo propio, hasta el
punto de que a la hora de abordar el diseño de una página se habla
del grado de aplicación del arquetipo 2.0 que debe tener.
Aunque existen unas características concretas, que abordaremos a
continuación, podemos definir el diseño 2.0 como una conjunción de
estilos cuya máxima es la sutileza y la combinación de elementos
dispares. Grandes masas con volumen, utilizando técnicas de 3D, a la
vez que figuras planas; pequeños detalles de luz o degradados
delicados, con grandes tipografías.
Siguiendo el artículo “How to destroy the Web 2.0 look”3, de Elliot
Jay Stocks, podemos definir las siguientes características:
1- Uso de colores vibrantes y contrastados: además de por criterios
puramente estéticos, la Web 2.0 se caracteriza por el uso colores con
mucho contraste

que facilitan la jerarquización de la información y, por lo tanto, la lectura.
Colores contrastados pero, al mismo tiempo, en menor número.
En ninguna web se suelen emplear más de dos colores, uno de ellos
habitualmente oscuro como el negro o gris, junto a otro más vivo como el
verde o el azul y, aumentando la variedad cromática, diferentes tramas de
estos dos colores.
Como si se tratara de una identidad corporativa tradicional, los
diseñadores seleccionan los colores y los aplican a todos los elementos de
la web: iconos, menús, efectos de los enlaces, etc.
2- Badges: se trata de una serie de botones con forma de chapas o placas.
Consiste en una estrella con bordes redondeados y que habitualmente se
utilizan para atraer la atención sobre un precio, una promoción o “un gran
mensaje de Beta”4, es decir, indica que se trata de una versión no
definitiva de la web.
3- Brillos, destellos y reflejos: tanto los logotipos como las barras de
menú y los distintos elementos de las composiciones cuentan con
destellos de luz y pequeñas zonas sobreexpuestas, que aportan volumen a
los diseños. Al mismo tiempo, las webs se llenan de objetos con un reflejo
de él mismo sobre su base.

4- Bordes redondeados: la llegada de la Web 2.0 ha supuesto el fin de las
esquinas, dando paso a un nuevo arquetipo en el que todos los bordes
son redondeados. Bien sea a través de los programas de diseño o a través
de las hojas de estilo CSS; incluso han surgido una gran cantidad de
aplicaciones online que redondean los diseños por nosotros.
5- Degradados: sin duda es una de las técnicas visuales que más han
calado entre dos diseñadores de Web 2.0. Más pronunciados o más
sutiles, los gradientes de color son empleados desde los fondos de las
páginas hasta los favicones, los pequeños iconos que se muestran junto a
la dirección web en el navegador de Internet.
6.-Líneas diagonales: se emplean especialmente en los fondos de las
páginas y en los de los titulares, como motivos decorativos que se
repiten. Estos patrones rayados se componen habitualmente de un color
y una trama de este, es decir, una versión más oscura o más clara de la
misma. El contraste siempre es leve para no dificultar la lectura ni
centrar la atención sobre elementos decorativos.
7- Desenfoques: se hacen especialmente patentes en las sombras. En
lugar de ser sombras duras, los diseñadores utilizan leves desenfoques.
8- Logotipos reflejados: durante un tiempo se convirtieron
prácticamente en un estándar los logotipos reflejados, de forma que
según va separándose el dibujo del reflejo va desenfocándose como si se
tratara de papel mojado.

A estos clichés podemos sumar los elaborados por Ben Hunt en su artículo
“Web 2.0
How to design guide5”, y que se refieren más a conceptos de diseño
general:
1. Simplicidad: “en igualdad de condiciones la solución más sencilla es
probablemente la correcta”6. Este principio, conocido como el de la Navaja
de Occam, se ha convertido en la base del diseño. Buscar la opción que
haga la navegación más sencilla y que exijan menos esfuerzo a los
usuarios, evitando las interferencias de elementos superfluos y otorgando
una mayor importancia a aquellos en los que queremos que fijen su
atención.
Esta simplicidad ha tenido como consecuencia también que el color blanco
adquiera un mayor protagonismo: a nadie le asusta ya ver una página con
fondo blanco (Google es blanco) y, en general, ha pasado de proporcionar
sensación de web poco trabajada a otra de web clara y ordenada.
2. Diseño centrado: mientras en la web 1.0 todo el contenido se alineaba a
la izquierda, las páginas 2.0 siempre están centradas, mejorando la
visualización de los contenidos en cualquier tipo de resolución de
escritorio.

3. Menos columnas: antes la páginas se estructuraban en un mayor número de
columnas, imitando tal vez el estilo de los periódicos; el diseño actual tiende
hacia dos, en el caso de los blogs, y tres en el caso de las páginas con un mayor
volumen de contenido.
4. Separar la navegación: aunque siempre fueron distintas la zona superior y la
inferior, ahora se marca más visualmente. Al mismo tiempo, cada área está
claramente definida para un tipo de navegación o de interacción y una serie de
contenidos.
5. Navegación simple: el concepto de Usabilidad en sí mismo. Organizar la
página para que el usuario navegue intuitivamente y sepa para qué sirve cada
elemento y con cuáles puede interactuar.
6. Tipografías más grandes: tras un período en el que la tendencia era emplear
fuentes pequeñas, como indicativo de elegancia, se ha pasado a un modelo en
el que se consigue que las fuentes grandes también sean visualmente
atractivas. Los sites pueden ser bonitos y a la vez respetar los principios de la
usabilidad.
7. Leads en negrita: en general, la negrita se ha convertido en el modo más
eficiente de destacar la información sin recurrir a colores que ensucien la
identidad corporativa de la página. Esto, unido a la necesidad de jerarquizar
los contenidos, ha derivado en los tagline, es decir, frases que resumen el
contenido de la página o de la empresa, así como entradillas que
esquematizan los servicios o contenidos de la entidad o de la aplicación.

8. Iconos atractivos: han dejado

de ser un elemento auxiliar del
diseño para convertirse en un
componente prioritario. En
general, se puede decir que la
principal característica del
diseño 2.0 es la sutilidad, los
pequeños detalles, y por ello los
iconos son uno de los campos
de acción más interesantes para
los diseñadores

Hablar de diseño implica en general
referirse a una estandarización, hablar
de escuelas, de tendencias, de modos de
actuar generalizados, pero, al mismo
tiempo, de ruptura y originalidad. Todos
los movimientos artísticos se
caracterizan porque mucha gente hace lo
mismo, hasta que alguien lo rompe y crea
algo más innovador. Por esta razón la
Web 2.0 está generando un movimiento
en contra de estos estándares.
Precisamente el artículo citado
anteriormente, How to destroy the Web
2.0 look”7, de Elliot Jay Stocks, se ha
constituido en un referente para este
movimiento. Para el autor “los clichés de
diseño siempre han existido. Lo
importante es conocerlos, saber por qué
existen y cómo evitarlos”. “Hay que
enseñar a las masas que el look Web 2.0
es un término sin significado. El Web 2.0
es un concepto… no un diseño estético.”

Navegador:
Un navegador es un programa que se utiliza para acceder a la web. Desde
el primer explorador, llamado NCSA Mosaic de principio de los noventa
hasta hoy, la evolución ha sido espectacular.
Netscape consiguió ser el navegador de referencia desde el 1994 hasta
que, en el año
1997, Microsoft introdujo el Internet Explorer en el Sistema Operativo
Windows 98.
El dominio que ejerció IE fue tal que el desarrollo web se orientó
totalmente a la visualización en este navegador. Nacieron frases como
“Optimizado para Internet Explorer”, que venía a significar en muchos
casos que si no usabas el Explorador de Windows, no ibas o poder ver la
página o algunos servicios no iban a funcionar.
A pesar de que las estadísticas actuales nos dicen que IE sigue
caminando, las corrientes alternativas van abriéndose paso. Opera abrió
el camino y, hoy en día, Mozilla FireFox está haciendo “pupa” al dominio
de IE con cuotas del 20% en algunos países europeos.

Los otros navegadores:
Hoy en día existen otras aplicaciones que están ganando
importancia como son los navegadores para móviles y para PDA,
los navegadores de sólo texto…. 52 Asociación Nacional de
Empresas de Internet, ANEI

Esto supone una gran ayuda en el campo de los estándares, de lo
que hablaremos más adelante. Lo más importante es que cada
navegador interpreta a su modo el código HTML, por lo que los
desarrolladores web se ven obligados a que sus páginas puedan
ser consultadas por distintos medios.
Inicialmente se optó por hacer versiones específicas para cada
tipo de navegador, pero es un coste inasumible ante la gran
proliferación de aplicaciones y dispositivos. No queda más
remedio que utilizar un estándar común.

Flash:

Los archivos elaborados con el programa de
animación 2D por excelencia en el campo web,
Flash, han pasado de ser la solución definitiva
cuando deseamos hacer una web visualmente
atractiva, a una posición mucho más discreta.

AJAX :

El término AJAX (Asynchronous JavaScript And XML), al igual
que el de Web 2.0, no es ningún invento, ni un gran avance
tecnológico, es el nombre que se le puso a una serie de técnicas
y combinación de tecnologías ya existentes. Poco a poco se ha
convertido en una palabra de moda, que popularizó Jesse James
Garrett en su artículo “Ajax: A New Approach to Web
Applications”

El internauta 2.0:

¿Qué evolucionó antes? ¿El internauta o la web? Como en el
famoso caso del huevo y la gallina, no está claro quién nació
antes, pero parece evidente que con el surgimiento de las
aplicaciones 2.0 los usuarios comenzaron a exigirlas. Entre una
web donde ver vídeos y otra donde además de ver vídeos puedo
comentarlo, compartirlo y subir los míos propios, el usuario
elegirá siempre la segunda opción.

Usabilidad:
El considerado gran gurú de la Usabilidad, Jacob Nielsen, la definió
así en el año
2003: “El atributo de calidad que mide lo fáciles que son de usar las
interfaces Web”11.
Se trata en una disciplina cuyo objetivo es facilitar la interacción
del usuario y, por esta razón, es lógico que naciera o, más bien,
cobrara fuerza, con la llegada de la Web 2.0. Si el mundo web se
sustenta en que los internautas participen, es necesario estudiar
qué es lo que los estimula.

Usabilidad frente al diseño :

La Usabilidad se desarrolla con la parte izquierda del cerebro y
representa la razón y la acción lógica; por lo tanto se
corresponde con Marte. Por su parte, el Diseño reside en la
parte derecha del cerebro y se identifica con lo emocional y la
acción intuitiva, así que se corresponde con Venus. Esta teoría,
desarrollada por Curt Cloninger en su artículo “Usability experts
are from Mars, graphic designers are from Venus”14 es una
muestra de la lucha aparentemente existente entre diseño y
Usabilidad.

No está claro de donde provino el estilo 2.0. Nos recuerda elementos muy dispare
desde la portada del disco Tubular Bells de Mike Oldf ield, hasta los refl obras de
Roy Lichtenstein o las siluetas contrastadas de Keith que sí está claro que esta
forma de diseñar está traspasando l o de ordenador, para convertirse en un
referente del diseño, por ejemplo, en los grafismos de televisión..
Toda la imagen corporativa de las cadenas, desde los printers con el nombre de
los presentadores hasta las ráfagas entre programas o los gráficos explicativos
de las noticias, la pantalla va llenándose de degradados, reflejos y demás.
¿Supondrá la 63 Asociación Nacional de Empresas de Internet, ANEI

transición a televisión digital la misma revolución visual que para la web fue el
aumento de la resolución y del ancho de banda?
Como conclusión, podemos resumir todo lo expuesto hasta ahora en que el diseño
Web 2.0 pronto estará pasado de moda. Cuando las normas de un estilo están tan
claras, es porque el siguiente paso será su redefinición. El diseño supone en gran
medida romper los cánones, así que debemos estar preparados para la llegada de
la próxima tendencia.
Un nuevo modo de hacer webs, donde se imponga unos nuevos hábitos de
navegación por parte de los usuarios y que nos obligue a redefinir la usabilidad, el
aspecto visual y, en conjunto, la interacción.

diseño web

Más contenido relacionado

La actualidad más candente

Similar a diseño web

diseño web