Blink

Web & Creativity

  • Home
  • Estrategia
  • Cómo
  • Servicios
  • Portafolio
  • Blog
  • Contacto
  • Asesoría Gratuita
You are here: Home / Design & Strategy / Las bases del diseño web que funciona

Las bases del diseño web que funciona

Jun 04 2016

Las bases del diseno web que funciona

¿Tu sitio web fue diseñado para extraterrestres? No creo, cierto?
Nuestro sitio web es creado para que seres humanos interactúen con él. Y nosotros, los seres humanos – en toda nuestra esplendorosa variedad – compartimos algunos comportamientos universales, sin importar de dónde seamos.

Como creadores de contenido en la web, ignoramos esos comportamientos a nuestro propio riesgo. Pero cuáles son? Creo que nunca nos lo hemos preguntado.

Aquí te damos una serie de bases importantes para que diseñes sitios web que los seres humanos quieran leer…

Los seres humanos quieren interactuar, así que haz que sea fácil

¿Haz visto a alguien navegar en internet con un arma en la cabeza? Yo tampoco.

Para la mayoría de nosotros, es un acto voluntario. La gente navega en internet porque busca cosas y quieren interactuar con lo que están buscando.

Pero aún, sitio tras sitio se siguen poniendo barreras que hacen la interacción más difícil. Usan nombres inteligentes, títulos oscuros y navegación “divertida” que en realidad lo que logran es hacer que el usuario se rasque la cabeza confundido y en últimas termine por abandonar el sitio.

Cómo puedes lograr un sitio limpio y fácil de usar?

Cuenta con una introducción sencilla

Si tu sitio está en español (o alguna lengua occidental), tus visitantes leerán de arriba hacia abajo y de izquierda a derecha. Cuando llegan a la página de inicio de tu sitio web, sus ojos naturalmente irán a la parte superior izquierda para asegurarse de que están en el sitio correcto. En este punto (Esquina Superior Izquierda) tus lectores deberían encontrar el nombre de tu negocio y el eslogan. Esas palabras son esenciales que les permitirá saber que han encontrado lo que estaban buscando.

Use términos de navegación obvios

Si estás en un restaurante y hay un incendio, qué señal buscarás: “Egreso”, “Puerta” o la señal de “Salida de Emergencia”? La respuesta es obvia.

De igual manera cuando una persona hace click en los enlaces de tu menú de navegación, es porque quiere dejar la sección donde está e ir a alguna otra. Entonces esto no significa que en el menú debes hacer todo tu despliegue de “creatividad” y llamar a las cosas obvias con nombres o cosas más complicadas. Use convenciones o nombres más universales a las que todos estamos acostumbrados.

Los humanos necesitan leer. No te interpongas en su camino

Los sitios web están esculpidos con pixeles, y los pixeles más importantes en tu sitio web son tus palabras.
Para hacer que sean leídas esas palabras, use estos importantes conceptos de diseño para establecerlas y hacerlas fáciles de absorber.

Muestra algo de compasión por tus ojos

Hay un demonio en las tendencias de diseño que es popular ahora mismo. Entre más viejos sean mis ojos, menos me gustan. Yo lo llamo el estilo “tono a tono”.

Tu lo has visto antes. – es el texto gris sobre un fondo gris más claro, o texto café sobre un fondo sepia. Es esa tendencia de darle un color a la fuente un tono ligeramente distinto al de el fondo sobre el cual está.

En este estilo, se da muy poco contraste, no es amigable con el lector y eso no beneficiará mucho a tu sitio.
A cambio, usa un estilo de alto contraste. Quieres el texto más legible de todos? Utiliza un texto oscuro sobre un fondo claro, o viceversa.

Este es un sitio sobre el Contraste. Él te muestra por qué el contraste es tan importante. Toma dos minutos para leerlo y nunca más volverás a usar el bajo contraste de nuevo.

Ten en cuenta el flujo de escaneo

Ya que los lectores escaneamos de arriba a abajo y de izquierda a derecha, tú debes dejarlos ver y leer tu información en un orden específico. No querrás que su vista salte de lado a lado en la página mirando montones de gráficos y textos que lo distraen.

Ubica tu contenido de manera que cuando el lector se mueva a través de él, estará absorbiendo tu información de manera ordenada. Pon los ítems más importantes de primero justo abajo del encabezado del sitio y a la izquierda.

Luego usa la jerarquía visual para mover el lector por tu página en las secciones y la dirección que tu quieras que lo haga.

Ellos quieren saber quién eres. Permíteles saberlo

La primera vez que los visitantes del sitio lleguen a tu página de inicio, están llenos de preguntas.

¿Qué es este sitio? Quién lo dirige? ¿Qué es lo que entiendo sobre los valores y la personalidad de este negocio?

Debido a que las primeras impresiones son visuales, es importante responder a estas preguntas en los primeros segundos con el diseño de su sitio.

Tus herramientas de elección principales son dos: los colores y los tipos de letra.

Aférrate a dos colores principales en el sitio.

Así es, toma dos colores y deja que sean la constante en tu sitio, por ejemplo  – en el sitio de Blink – azul y gris, luego puedes aplicar algún otro color que haga un alto contraste para denotar acentos, por ejemplo en los botones o CTAs.

Personaliza fuentes y agrega personalidad a tu sitio de manera que resalte de la masa.

Es más fácil que nunca salirse de las fuentes tradicionales y experimentar con nuevas combinaciones de fuentes. Lee este artículo sobre las combinaciones de fuentes.

Mantén los ojos en el contenido

Los sitios web son hechos para la gente que los visitará. No es necesario un mensaje de agradecimiento que salte cuando llegan a la página de inicio, darles un buen diseño, es una forma de agradecerles.

Trabaja con la naturaleza humana, no contra ella. Siempre hazte la pregunta, “¿Qué podría hacerlo más claro y legible?” y no te equivocarás.

¿Qué harás para darle la bienvenida a los visitantes de tu sitio y mantenerlos conectados?
Comparte tus ideas en los comentarios.

Photo by Patricia M

Escrito por: Sacha | Categorías: Design & Strategy | Tags: Colores, Diseño Web, Fuentes

Deja un comentario Cancelar respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Newsletter

Regístrate para obtener nuestras últimas informaciones directamente a tu buzón.

No enviamos SPAM, puedes darte de baja en cualquier momento.

Entradas Recientes

  • 5 Maneras de atraer más Tráfico con el Content Marketing
  • Las bases del diseño web que funciona
  • Primero fue la idea
  • Design Thinking & Diseño de Experiencia de Usuario
20% Off WP Engine
CoSchedule: The Editorial Calendar For WordPress

NUESTRAS OFICINAS

BOGOTÁ

Transversal 28 #53B
Bogotá, Colombia

Tel: (+57) 314 2704617
hello@theblink.co

MILANO

Via Mecenate 76/18
20138 Milano, Italia

Tel: (+39) 02 36644025
hello@theblink.it

  • Facebook
  • Google+
  • Twitter

EQUIPO

Sacha

Desde niño utilizó gafas. Esto le permitió ver las cosas de manera diferente y apasionarse por "lo que es bueno", sobre todo para los demás. Es el que se encarga de gestionar el desarrollo de la estrategia y los sitios, y a pesar de su itañol hace un excelente trabajo. Ahora, gracias a la operación láser no usa más sus lentes, pero esto no ha afectado su forma de "ver".

Arsen

© 2014-2019 · Blink Colombia SAS · Todos los derechos reservados.