Cómo construir consistencia de marca en el diseño de su sitio web

Entonces, es oficial. Lanzó esa brillante idea de inicio con la que soñaba en los almuerzos. Compró el dominio de la compañía, escribió un slogan inteligente e incluso construyó un modelo de negocio sólido.

Ahora es el momento de enfocarse en ganar tracción con su público objetivo y crear su presencia en línea. Eso significa diseñar un sitio web con consistencia de marca.

Su marca es la historia que conecta a las personas con los productos y servicios que ofrece. Si el aspecto de su sitio web coincide con esta narración, su empresa se sentirá aún más atractiva y auténtica. Y es por eso que es tan importante fusionar la consistencia de la marca en su diseño web. Obtendrá reconocimiento con sus consumidores.

Todo, desde colores y fuentes hasta las palabras y el diseño representa su marca. Pero esos elementos de diseño no necesitan ser ruidosos, abarrotados o exagerados para llamar la atención y tener un impacto duradero.

La constancia con la que se traduce la marca a su sitio web determina qué tan exitosamente la audiencia percibe, reconoce y se conecta con su negocio. Via Claudiu Fagadar 

Simplemente siga estos seis (6) pasos para crear consistencia de marca en su sitio web. El producto final comunicará una declaración audaz y memorable que los clientes seguramente notarán.

1- Ruede con su rueda de color

Cada color que usa en el sitio web afecta la forma en que las personas experimentan su empresa porque cada una evoca su propia respuesta emocional. Esto se conoce como teoría del color y elegir la combinación correcta le brinda a su audiencia más información sobre de qué se trata la marca. Por ejemplo, el negro y el rojo se sienten nerviosos. Marrón y verde se siente terroso.

Una vez que haya determinado los colores primarios y secundarios de su marca, intégrelos en su sitio web. Comience con un color base dominante, como el utilizado en su logotipo.

Aplíquelo en titulares, subtítulos, imágenes de fondo e ilustraciones, cualquier lugar al que la gente gravitará de forma natural en su sitio.

El destacado color de base turquesa compensado con acentos pastel frescos reflejan el enfoque joven, fresco y moderno de esta empresa emergente para los negocios. Via Nikguk

Los suaves tonos azules utilizados en este sitio web evocan una sensación de calma que juega con el estado de ánimo pacífico de este espacio de mindfulness-meditación. Via Ink’d

Utilice los matices de acento más sutiles para los aspectos más funcionales, como las pestañas de navegación, los enlaces, los iconos de la barra lateral y los menús. El código de color de su sitio web lo mantiene luciendo nítido y limpio en lugar de distraerlo y desenfocarlo.

2- Aprovechar el poder de los espacios en blanco

Aunque es tentador llenar cada centímetro cuadrado de su sitio web con contenido, la necesidad de espacios en blanco no puede pasarse por alto. La fusión de esta técnica de diseño en su sitio en realidad aumenta los períodos de atención y las tasas de comprensión en un 20%.

El destacado grado de espacio en blanco utilizado en este sitio web hace que las características en negro y gris se destaquen casi tridimensionalmente. A través de PRANETOR 

Sus ojos son propensos a la sobreestimulación, pero el espacio en blanco es un lienzo en blanco que les permite respirar. Los clientes serán mucho más capaces de conservar su identidad de marca que si satura el sitio con palabras y gráficos.

En lugar de llenar todos los espacios y márgenes disponibles, rodee las imágenes y el texto con espacios en blanco para aumentar la legibilidad y comunicar sus ideas de manera más efectiva.

El motivo sutil pero efectivo de esta página web de una imagen en escala de grises que se difumina en el espacio en blanco subraya el lema de la compañía, “el arte del espacio”. Via Piparus 

El diseño de un sitio web que equilibra el contenido visual con el espacio en blanco estratégico está organizado, pulido y accesible, tres atributos que obviamente desea asociar a su marca.

3- Mantenga sus fuentes simples

Al igual que los colores de su marca, los tipos de letra en su sitio web deben ser uniformes en general. Hay varios estilos de fuentes, pero demasiada variedad afectará su mensaje.

En lugar de entrar en una sobrecarga de fuentes, elija dos que se complementen y respalden el tono de su marca. Tendrá coherencia en el diseño sin limitar la personalidad de la marca.

Ya sea que prefiera el serif de la vieja escuela, el sans serif moderno o el script de forma libre, asegúrese de que el tipo de letra sea legible primero.

Esto puede sonar como una obviedad, pero independientemente de cuán moderno se vea la fuente, si no puede leerla, su audiencia tampoco. Algunas fuentes son demasiado extravagantes para ser prácticas.

Diseño de DSKY

Trabajo de diseño de HITRON

Diseño de Mila Jones Cann

Trabajo de diseño de arosto

También puede personalizar su propio tipo de letra, pero al seguir esta ruta, verifique que sea compatible con todos los navegadores de Internet; de lo contrario, el texto no se cargará correctamente cuando las personas vean su sitio web.

Para eludir este problema y aun así lograr esa sensación única, elija una fuente web alojada a través de un servidor como Google, incrustada en el navegador y luego codificada directamente en el sitio web.

Aunque esto suena complicado, el proceso real es sencillo y garantiza que su fuente personalizada se formateará en el sitio web como usted lo pensó.

4- Agregar detalles personales

La gente quiere saber que hay un verdadero nombre, rostro e historia detrás de su negocio, así que infunda toques humanos genuinos en su sitio web.

Piense en su presencia en línea proyectando una visión que le dice a su audiencia: “Nos preocupamos por usted y queremos servirle”. Cuando las personas invierten, están dispuestas a apoyar sus esfuerzos.
Entonces, en lugar de convertir el sitio web en un centro de comercialización, concéntrese en los detalles personales para crear una experiencia personalizada con la que otros puedan conectarse.Un buen punto de partida es una declaración de misión que les dice a los clientes de qué se trata y cómo puede enriquecer sus vidas. Mantenerlo conciso, pero específico. Y haga que el tema central tenga una mentalidad social.Una declaración de misión efectiva también tiene la libertad y la fluidez para evolucionar a medida que su marca cambia en función de las necesidades del cliente.Por ejemplo, todos conocemos a Chipotle como la autoridad indiscutible del guacamole (¡a quién le importa si cuesta más!). Pero su misión no es solo acerca de su producto: se trata de las personas:“Más de 23 años después, nuestra devoción por buscar los mejores ingredientes que podamos, criados con respeto por los animales, los agricultores y el medio ambiente, sigue siendo el núcleo de nuestro compromiso con ‘Alimentos con integridad’. Y a medida que hemos crecido, nuestra misión se ha ampliado para garantizar que todos tengan acceso a mejores alimentos “Una vez que haya definido su declaración de misión, encuentre maneras creativas de incorporar esos valores en su diseño web. Aquí hay una idea: publique fotografías del equipo detrás de escena que respalden su misión de darle a su marca un ambiente auténtico y orientado a la comunidad.Este vistazo sin filtro a la cultura de su empresa dará energía al sitio web con vitalidad y vida. Además, su público se sentirá más conectado con usted.Otro elemento que agrega credibilidad a su marca es el testimonio. Asegure el permiso de los clientes, por supuesto, luego designe espacio en la página de inicio para historias reales y citas de personas que han sido impactadas a través de su negocio.El respaldo de un compañero le dice a un cliente potencial que puede confiar en usted para cumplir con su misión.

5- Acentúe su contenido con imágenes

Los gráficos en su sitio web no deben ser más llamativos que el mensaje que su marca se está comunicando. Pero los acentos o sub-capas de imagen sutiles pueden agregar profundidad creativa y estética cuando se usan con moderación.

Coloque fotografías de alta calidad intencionalmente para mostrar a su audiencia lo que representa, incluso antes de leer las palabras.

Asegúrese siempre de que las imágenes sean compatibles con el contenido de su sitio web. Debe tanto aclarar como amplificar la voz de la marca, para que la gente pueda visualizar lo que significa ser parte de su clientela.

Por ejemplo, piense en el cliente de Nike: esta marca se ha centrado en una campaña exitosa en torno a inspirar a su público a ser feroces y agresivos rompedores de reglas. Y el estilo elegante de sus gráficos sugiere que poseer un equipo de Nike puede desarrollar esta personalidad.

En otras palabras, las imágenes estratégicamente curadas envían poderosas señales no verbales.

 

La pancarta del paisaje urbano contra un fondo negro y azul marino que contrasta le da a este sitio web de administración de capital un aspecto elegante y cosmopolita. A través de tale026 

Las tres imágenes de fondo apiladas una encima de la otra crean un efecto parecido al de un hombre combinando siluetas apagadas y detalles nítidos y vívidos. A través de slf1986 

También puede experimentar con imágenes de fondo o pancartas en la página principal de su sitio web para crear aún más dimensiones y refinar la identidad de la marca.

Por ejemplo, si su negocio tiene una sensación artística -una galería, una marca de moda o una firma de diseño- agregue imágenes vívidas y texturizadas para ilustrar este concepto.

El estudio de diseño gráfico Pentagram lo hace intercalando un collage geométrico de pequeñas fotos con una presentación de diapositivas rotativa de fotos grandes.

El resultado es movimiento, colores, formas y medios mixtos para apoyar el énfasis de la compañía en la imaginación y la innovación.

6- Coloque su logotipo estratégicamente

El logotipo de una empresa es como su apretón de manos. Es la primera impresión que los posibles clientes reciben cuando encuentran su marca.

Los logotipos más fuertes son una fusión de profesionalismo y personalidad, pero tan cruciales como el diseño de su logotipo en sí es donde se muestran en su sitio web.

El logotipo de este sitio web se coloca en la esquina superior izquierda para obtener la máxima visibilidad, y su tema hexagonal está entretejido en toda la página de inicio. A través de martinthehorrible 

El logotipo de este sitio web se coloca al lado de la barra de navegación, lo que lo hace accesible a los visitantes, y las letras en relieve agregan una sensación orgánica y local. A través de CreativeDove 

Sea deliberado y resuelto sobre dónde se coloca el logotipo. Es más probable que los visitantes recuerden un logotipo situado cerca de la esquina superior izquierda en lugar de derecho porque la mayoría de los idiomas se leen de izquierda a derecha. Coloque el logotipo allí y será la primera imagen que los lectores asocian subconscientemente con su sitio web.

Por supuesto, podría parecer innovador ignorar el modelo convencional de la parte superior izquierda y elegir un diseño más exclusivo, especialmente si la marca es conocida por las normas desafiantes y establecer nuevas tendencias. La originalidad importa, pero la visibilidad es más importante. También es una buena idea agrupar el logotipo y las pestañas de navegación entre sí para una experiencia de usuario cómoda, sin esfuerzo y optimizada.

La consistencia es la clave

Desde los elementos principales hasta los detalles minuciosos, cada aspecto del sitio web le dice a su público objetivo qué esperar de su marca.

Si su diseño web está pulido, cohesionado y organizado, la gente confiará en que su negocio ofrecerá la misma consistencia en servicio y calidad.

En otras palabras, ser coherente en la manera en que presenta la marca en línea le comunica cómo opera su negocio fuera de línea.

¿Quieres ser conocido como confiable y de vanguardia? ¿O inconexo y desenfocado? ¡Si, exacto!

#SeguimosEnLínea

Por |2018-05-02T16:40:03+00:0011 mayo , 2018|Branding|

2 Comments

  1. Victoria 11 mayo, 2018 en 10:53 am

    Magnífico artículo Nana. Me ha encantado. Me gusta el color y siempre trabajo con colores fuertes pero realmente me ha sorprendido la técnica de espacios en blanco. Lo has explicado fenomenal y los ejemplos que incluyes son estupendos para comprobar efectivamente los efectos beneficiosos de un diseño predominando el color blanco. Visualmente me ha impactado.
    También muy interesante tu consejo sobre el uso de Google Fonts.
    Un abrazo!
    Victoria

    • Nana González 11 mayo, 2018 en 12:01 pm

      Hola mi estimada Victoria, mil y mil gracias no solo por pasar y leerme, sino te agradezco enormemente este comentario. Realmente el trabajo de generación de contenido me fascina y le pongo mucho empeño y cariño para poder lograr mi objetivo, que es compartir lo aprendido. Feliz fin de semana.
      Un beso muy grande!
      Nana

No se permiten comentarios.

Facebook
Google+
Twitter
Pinterest
LinkedIn
RSS
Follow by Email