Esta guiá de los estilos visual ayuda a visualizar todos los elementos por defecto de la web.

Una de las formas para asegurarse que el equipo esté es sintonía al momento de diseñar distintas partes del sitio web.

Es de mucha ayuda tener una guía de estilo para crear una experiencia consistente entre las diferentes páginas. Además, ayuda a garantizar el futuro desarrollo o que la producción de terceros siga los mismos lineamientos de la marca y que se perciba como parte de esta.

¿Qué es una guía de estilo?

Las guías de estilo, también denominadas libros de estilo, hacen referencia en el ámbito del marketing online a los manuales para el diseño uniforme de páginas web. Aquí, además de las propias páginas web, también se engloban las cuentas en las redes sociales y las aplicaciones. Una guía de estilo está estrechamente relacionada tanto con el diseño corporativo como con la identidad corporativa de las empresas y se encarga de que la identidad visual de la empresa en cuestión también pueda ser reconocida inmediatamente en la red. A este respecto, las guías de estilo web resultan necesarias para presentar a las empresas como una unidad en la totalidad de los canales de comunicación en los que aparece, ya sea en las redes sociales, a través de los correos electrónicos, en la propia página web o en otras publicaciones. Este tipo de manuales ofrecen directrices para todos los trabajadores acerca de cómo se tiene que representar a la empresa tanto a nivel visual como textual para que los clientes (potenciales) puedan clasificarla enseguida.

Por lo tanto, una guía de estilo digital para las páginas web engloba mucho más que información para el logo y el rótulo empresarial: esta determina, además del tipo de letra y los colores, el diseño de las imágenes o la presentación de los elementos e incluye datos relativos al tono del texto. Si se hace uso del libro de estilo, la página web obtiene un aspecto uniforme, incluso si se da el caso de que haya varios diseñadores web implicados en la elaboración de cada una de las áreas de la página web.

¿Por qué es importante?

Los responsables de las empresas se enfrentan tarde o temprano a la pregunta de cuál es la mejor manera de que la página web refleje la esencia de la empresa y cómo los visitantes de la misma pueden evaluarla de manera correcta e inmediata. Las respuestas a estas preguntas desembocan en la guía de estilo, ya que esta agrupa los resultados obtenidos y crea los fundamentos para la elaboración de la página web. Los manuales de estilo son importantes porque tan solo con su ayuda se puede configurar la página web de manera unitaria y adecuándose al público objetivo. De este modo,es posible reconocer rápidamente a la marca en Internet. Una página web concebida adecuadamente se encarga, por lo tanto, de que los visitantes puedan identificarse con más facilidad con la marca e incluso de que estos la recomienden, a la par que transmite profesionalidad y seriedad, por lo que los clientes o usuarios se sienten atraídos por ella y permanecen más tiempo en la página.

Los colores

Es increíble cómo los seres humanos perciben los colores y los asocian tonalidades con marcas conocidas. Piensa en Coca-Cola, apuesto a que ves el color rojo en tu mente.

Empieza estableciendo en tu guía de estilo los colores primarios que predominaran en tu sitio web, los colores dominantes solamente deben incluir tres tonos. Sin embargo, en algunos casos necesitarás colores secundarios e incluso terciaros para ilustrar tu interfaz de usuario, asegúrate de también definirlos. Además, incluye colores neutrales como el blanco, gris y negro para que los colores primarios resalten.

Colores primarios

Utilizados en botones, lineas, enlaces, títulos y textos.

$Dark byzantium
#5F3D5A

$Keppel
#59C1A9

$Pastel pink
#DAAEB2

Colores secundarios

Tea green
#333333

Peach
#DAE2D5

Nyanza
#DAAEB2

Light pink
#DAAEB2

Raisin black
#DAAEB2

Titulos

Titulo 1

Titilo 2

Titulo 3

Textos

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.