Imaginería: Usando imágenes en el Diseño de Páginas Web

Lineamientos generales para Imaginería/Gráficos en el Diseño Web

Use imaginería para agregar significado: ya sea hacia la marca, o hacia el contenido.

Trate de ser tan económico como sea posible, y conseguir más significado de pocos gráficos. La imaginería que tiene significado (imaginería primaria) debe ser el foco del diseño de una página.

Concentre la imaginería primaria en las siguientes áreas:

• – Id / Logo del sitio
• – Contenido primario
• – Navegación primaria

Donde se usan otros gráficos, éstos deben sostener la imaginería primaria, ayudando al ojo a moverse sobre los elementos de menor prioridad. Esto no significa que las áreas no primarias no puedan ser ricas y sutiles, pero no deberían ser atractivas, en el sentido literal. Los colores simples, el contraste sutil, los gradientes simples, las curvas suaves, y los espacios en blanco frescos pueden ayudar a la concentración del usuario, y se ven muy bien.

Recuerde los objetivos del sitio y los del usuario, y aplique los gráficos en una proporción adecuada.

Uso efectivo de la imaginería: Firewheel design

Firewheel design, vea www.firewheeldesign.com

El sitio de Firewheel es un excelente ejemplo de energía bien aprovechada, creando una experiencia pura y concentrada.

Esta muestra es de 2/3 de su tamaño original, y aún así está claro qué es qué.

La navegación es texto simple – no hay nada más claro o más intuitivo.

La imaginería de fondo/interfaz es concisa. Los diseñadores sabían claramente qué imagen de marca querían proyectar, y lo hicieron simplemente y con confianza.

¿Qué es lo que atrae a su ojo? Inicialmente, el logo de Firewheel es atractivo a pesar de ser simple.

En segundo lugar, el título de página "Professional-grade.." sobresale por su sobriedad, color y claridad.

Usted es conducido entonces al resto de la imaginería de la página, toda la cual tiene valor, reforzando las credenciales de la compañía, dando al usuario buena información de calidad sobre los productos y servicios de Firewheel además de verse bien.

La página es además relativamente rápida de descargar.

Uso problemático de la imaginería: Yaxay

Yaxay.com es el sitio de una popular (y altamente recomendada) comunidad para diseñadores.

Sus páginas son intensas gráficamente, lo cual es típico del sector objetivo del diseño. La mayoría de los sitios que apuntan a una audiencia de diseñadores de paginas web emplean muchos gráficos ricos, para demostrar un nivel de habilidad en diseño gráfico para superar un supuesto nivel de respetabilidad.

Lo malo es que el contenido del sitio está definitivamente en segundo lugar con respecto al fondo/interfaz. No prioriza los objetivos del usuario, y creo que la experiencia del usuario se ve comprometida.

Entro a Yaxay casi todos los días, pero la encuentro una experiencia bastante cansadora, comparada con un diseño fresco y lleno de energía (como Firewheel.com).

Puntos específicos:

• El uso importante de íconos oscuros incrementan el alboroto y reducen la claridad del contenido
• Una cantidad importante de figuras contrastantes empujan al ojo hacia afuera
• El área de contenido tiene menos contraste que la interfaz, lo que lo hace más difícil de mirar
• El texto de contenido es innecesariamente pequeño, lo que lo hace más difícil de leer

Es bastante posible que los diseñadores de Yaxay fueran claros en sus objetivos, y decidieron que una riqueza gráfica era la aproximación correcta para conseguir el objetivo de ganar respeto por parte de su público objetivo. Si era así, ellos tuvieron éxito – sería difícil criticar su capacidad en diseño gráfico.
La experiencia inicial de la marca es "capacitada, rica, moderna"..

Sin embargo, creo que han fallado al priorizar lo suficiente los objetivos del usuario. Los sitios que fallan al servir los objetivos del usuario tienden a fallar en general.

"Necesitas  web hospedaje web con dominio al mejor precio, aprovecha nuestras promociones en registro de dominios . MX "

Navegación

La claridad es más importante que el atractivo para la navegación (y otros controles funcionales).
Los controles deben ser fáciles de identificar, y su propósito debe ser obvio. La manera más fácil de alcanzar ambas calidades es usar convenciones establecidas.

No reinvente los controles funcionales
Es más probable reducir la usabilidad dedicándole tiempo a diseñar controles funcionales y de interfaz.
Es muy difícil crear íconos efectivos, y consume demasiado tiempo para tan pequeño impacto.

Íconos de advertencia

Los íconos son increíblemente potentes, cuando funcionan! Un buen ícono es como una taquigrafía visual compacta que representa una idea compleja en un mínimo espacio. Un buen ícono no necesita decodificación – su significado es muy familiar y para nada ambiguo, p.ej. una impresora significa "Haga click aquí para imprimir", o un signo de exclamación marcado en un triángulo amarillo significa "Advertencia" o "Alerta".

Sin embargo, es extremadamente difícil diseñar un ícono efectivo, y aún es difícil diseñar un grupo de íconos efectivo. Piense mucho sobre sus razones para usar un ícono. Si se justifica usarlos, busque imágenes ‘icónicas’ establecidas.

No trate de reinventar la rueda. Una imagen no se vuelve un ícono sola, en cualquier esfera del diseño. Tiene que ser usada a lo largo de un período de tiempo, adoptada por más gente, y volverse establecida en la conciencia de la comunidad. (Ver ‘La persecución del original‘).

Las convenciones nuevas se están estableciendo todo el tiempo, p.ej. el ícono de dos personas de cara redonda, originaria del MSN Messenger, se está volviendo un atajo global para ‘amigos’