Iconos en el Diseño Web

Los iconos comunican una gran cantidad de información de manera rápida y efectiva. Hoy en día son un gran aporte a la Experiencia de Usuario de una web, sobretodo si se diseña teniendo en cuenta dispositivos móviles.

Iconos en el Diseño Web
Iconos en el Diseño Web

La primera reacción de un usuario al visitar una web es escanear el contenido buscando la información que más le interese. Los iconos pueden utilizarse para guiar al usuario a un lugar determinado o para facilitarle el escaneo.

Los Iconos comunican más que las Palabras

Icono del Carrito de la Compra
Icono del Carrito de la Compra

El ejemplo perfecto es el icono del carrito de compra en las tiendas online, es tan utilizado que no tiene sentido sustituirlo por texto. Otros ejemplos de iconos muy utilizados en la web, productos, aplicaciones y sistemas operativos son:

Iconos más utilizados
Iconos más utilizados
  • Papelera
  • Inicio
  • Correo
  • Cerrar
  • Refrescar
  • Volver Atras

Hay muchos más iconos muy utilizados; buscar, audio, símbolo del dolar, del euro, etc.

Dividir y jerarquizar la información

Dividir información mediante iconos
Dividir información mediante iconos

Esta es la web de rackspace, en este ejemplo utilizan iconos para facilitar la lectura haciendo la lista más rápida y fácil de leer. Los iconos ayudan a dividir la información y darle importancia.

Personalizar la web

Los iconos pueden ser una gran oportunidad para personalizar una web y diferenciarla de las demás.

CL Designz
CL Designz

CL Designz es la web de Christopher, un diseñador web filipino que aprovecha cada detalle de su pagina para mostrar su talento. Se puede ver que cada sección y elemento de navegación dispone de un icono personalizado.

Este es un caso excepcional, lo importante cuando se trabaja con iconos es utilizarlos adecuadamente, no diseñar iconos únicos y nuevos para cada proyecto.

Imagen de marca

Los SO visuales y la web han obligado a muchas empresas a generar una versión optimizada de sus logotipos, ya sea para los iconos del escritorio, el favicon de la web, la fotografía de perfil que se utiliza en redes sociales, etc.

Algunas empresas crean sus logotipos pensando en la web, dos ejemplos de esto son:

Aldeia Coworking

Aldeia Coworking
Aldeia Coworking

Scytale

Scytale
Scytale

Los logotipos de ambas empresas están pensados y optimizados para la web, son iconos que se pueden utilizar en cualquier red social, aplicación, etc.

En la primera se puede ver que utilizan iconos para la navegación, teniendo estos más peso que el texto.

¿Que te parece este artículo? Si te ha gustado compártelo y deja tu comentario.

No te olvides dejar un comentario