Es una pregunta simple: ¿Necesita una guía de estilo? Y tiene una respuesta simple: sí. Cualquier marca, empresa, blog o página web que desee crear y mantener la coherencia y una sensación profesional debe tener una guía de estilo.
Las guías de estilo son una necesidad para cualquier editor con varios empleados. Esto es especialmente importante si más de una persona trabajará en cualquier elemento de marca (desde el sitio web hasta los materiales impresos), y para garantizar que las transiciones entre los empleados sean perfectas para los usuarios. Hoy, echamos un vistazo a la guía de estilo bien documentada de MailChimp y destacamos las cosas que puede eliminar al crear su propio documento por primera vez.
¿Qué es una guía de estilo?
Una guía de estilo es el recurso definitivo para el tono visual y de escritura de su marca. La guía no está diseñada para ser leída de principio a fin (y no debe escribirse de esa manera), y debe organizarse como un simple manual de recursos.
Las guías de estilo cubren dos grandes áreas: visuales y escritura. Para el desarrollo de un sitio web o una aplicación, una guía de estilo puede contener una tercera área, que define cómo debería funcionar la interfaz de usuario o los detalles de codificación.
Una guía de estilo es un documento fluido y, una vez escrito, debe actualizarse periódicamente. Al crear este documento, considere cómo se verá y se usará durante el proceso. Su guía de estilo debe seguir los estilos definidos. Use la paleta de colores de su marca y el mismo estilo de escritura con el que desea asociarse a la marca.
MailChimp's? Voz y tono? guía de estilo sigue este concepto. El tono es simple y la guía se ve y se siente como el sitio web. Además, MailChimp también tiene una "Marca de Activos". Guía de cómo se utilizan los elementos visuales.
Empezando
Crear una guía de estilo desde cero no es una tarea que pueda completar en una hora. Tomará algo de planificación y tiempo. Pero una vez que se crea el documento y si se actualiza con regularidad, puede ahorrar tiempo a largo plazo. Antes de escribir la primera palabra de instrucción, reúna (o cree) esta lista de materiales para facilitar la compilación de su guía.
Definiciones de marca, estilos y logotipos: Esto incluye ejemplos de cómo se pueden y no se pueden usar los logotipos, así como fuentes, tamaños y muestras de colores.
Paleta de fuentes: Listar todos los tipos de letra, tamaños y colores que son aceptables. Incluya especificaciones sobre cómo se usa cada uno de los estilos para el tipo de cuerpo, encabezados, citas, etiquetas, títulos, elementos de navegación, etc.
Imágenes, iconos y botones: Define el estilo, color, tamaño y ubicación de cada uno.
Estilos para formularios o llamadas a la acción: Defina qué tipo de información se puede recopilar y cómo funciona la recopilación de datos. Escribe e incluye información de descargo de responsabilidad.
Diseño básico: ¿Cuál es la plantilla básica para su diseño? Incluya algunos ejemplos de cómo deben lucir sus membretes, materiales impresos o páginas web.
Estilo visual
La sección de imágenes de la guía de estilo incluye varias partes clave: fuentes y uso aceptables, incluidos los estilos normal, negrita, cursiva y especial; color y tamaño para tipografías; Configuraciones para balas o listas; paleta de color; y pautas de imagen, como tamaño, especificaciones de borde y usos como ajuste de texto o combinaciones de imagen y texto.
Estos estilos deben estar escritos en un lenguaje simple y claro e incluir especificaciones técnicas, como nombres completos de fuentes, muestras de mezcla de colores (en RGB, CMYK o Pantone) y pautas de uso para páginas web e impresas (si corresponde). Algunas marcas tienen una guía impresa y de estilo web; Otras marcas optan por un documento que cubre ambos.
El estilo de MailChimp para tipografía es directo y muestra cada fuente y uso. La guía de estilo debe incluir especificaciones HTML, así como para los estilos de sitio web. Qué elementos usan una etiqueta H1 versus H2 versus H3. (Vamos a entrar en más detalles sobre las características específicas de la web en la sección HMTL).
Además, las pautas de estilo visual deben incluir una descripción completa de cuándo, cómo y dónde se pueden usar las marcas y los logotipos. Esto incluye el aspecto del logotipo, si se pueden modificar los colores o las fuentes (normalmente no) y en qué casos es aceptable el uso.
Estilo de escritura
Tan importante como su estilo visual es el tono de la escritura. Puede ser chocante para los usuarios venir a ver el material de su marca y leerlo de forma ligera y tonta en un caso y frío y estéril en otro. La forma en que las palabras se unen puede ayudar a los clientes o usuarios asociados con sus productos, haciendo que un estilo de escritura sea vital.
Las partes clave del estilo escrito incluyen el tono; ortografía y lenguaje; nivel de lector o jerga; voz; estructura; uso de símbolos, números y listas; uso de marca o marca registrada; y anulando guía de estilo de elección.
Hay un puñado de guías de estilo escritas generalmente aceptadas para publicaciones en inglés. La mayoría de las guías de estilo de la compañía lo dirigen a usar una de estas para preguntas sobre cuestiones de uso y estilo.
Estilo AP: El Libro de estilo de Associated Press es utilizado por profesionales del periodismo y la redacción en forma impresa y en línea. El estilo se centra en la consistencia y la brevedad y es común debido a estos atributos.
Estilo Chicago: El Manual de estilo de Chicago es utilizado por académicos y para trabajos académicos, empresas e incluye lo básico para un estilo de escritura más formal.
Estilo MLA: La guía de estilo de la Asociación de lenguas modernas se usa más comúnmente en académicos, artes liberales y humanidades.
La guía de estilo de escritura de MailChimp incluye excelentes ejemplos de comunicados de prensa y cómo debería leerse el sitio, así como la forma en que la marca interactúa con los clientes en las redes sociales, el blog y cómo se deben manejar los chistes de marca registrada de la compañía.
Interfaz de usuario y HTML
Si está creando contenido para la web, también necesita reglas para la publicación digital.Si bien las pautas de texto, color y tono se detallarán en otras guías, también debe tener en cuenta cómo deberían funcionar el sitio web y la interfaz de usuario. (La guía PRL es un excelente recurso.)
Texto: Explicar las reglas de marcado HTML. ¿Qué tipo de encabezados se utilizan y cómo? ¿Cuál es la diferencia de uso entre un H2 o un H3? Además del uso, ¿qué marca utiliza su sitio? Esta es la parte de la guía que detalla cada uso.
Imágenes: Las reglas para el uso de la imagen deben ser tan claras como para el texto. ¿Tienes un ancho o alto específico para cada imagen? ¿Hay un tamaño de borde o borde de texto estándar? Cómo se deben usar las etiquetas alt. Asegúrese de responder a cada una de estas preguntas con claridad.
Nombrando y guardando archivos: Además de cómo deben verse las cosas, considere un poco de limpieza web. ¿Cómo se deben nombrar y guardar los archivos en el CMS? Establezca pautas claras para que el mantenimiento de sus archivos esté limpio y los archivos se guarden en tamaños manejables y sean fáciles de encontrar.
Prácticas de codificación: Determine y establezca estándares de codificación para HTML, CSS y JavaScript. Incluir ejemplos.
Interfaz de usuario: Si no incluyó una guía visual para los elementos y el funcionamiento de la interfaz de usuario, inclúyala aquí. ¿Qué tipo de entradas se utilizan y cómo se etiquetan? (¿Utiliza palabras como? ¿Continuar,? ¿Enviar,? O? ¿Aceptar?) ¿Incluir un kit? de los elementos y el uso de la interfaz de usuario de su sitio.
Conclusión
La mejor manera de comenzar a crear una guía de estilo es leer un par. Piense en la información que desea aclarar sobre su marca y cómo se utiliza. Eso es lo que debe incluirse en su guía.
Las guías pueden imprimirse y distribuirse o crearse y distribuirse digitalmente en forma de PDF en un servidor de la empresa o como sitio web.
LogoDesignLove tiene una gran lista de más de 60 guías de estilo de marca que puede descargar y leer para comenzar. ¡Buena suerte!