0Una guía de estilo de vida es una documentación de los elementos de interfaz de y los patrones obtenidos de un sitio o aplicación con el fin de permitir a los desarrolladores usar estilos consistentes a través de todo su proyecto . En el pasado, los desarrolladores de estilo creados guías manualmente, lo que es mucho trabajo. Después de un rato, empezaron a automatizar el flujo de trabajo y herramientas de guía de estilo que transforman código front-end en las bibliotecas de interfaz de bien organizados han comenzado a aparecer.
Viven guías de estilo son diferentes de guías de estilo de código , ya que éste contiene reglas sobre cómo escribir código legible y fácil de mantener, mientras que viven las guías de estilo son colecciones de patrones de front-end, tales como clases CSS para los botones, widgets y elementos tipográficos . Guías de estilo Código garantizar la coherencia de código , mientras que viven guías de estilo de garantizar la coherencia visual a través de un sitio.
En este Tutorial En Linea, hemos reunido 10 herramientas útiles que pueden ayudar a generar su propia guía de estilo de vida .
1. Stylify mí
Esta herramienta es muy divertido: sólo tiene que pegar el enlace de la página web que desea analizar, y ver como se genera la guía de estilo en un solo clic de un ratón. Con Stylify mí , puede obtener rápidamente una visión general de los patrones de un sitio, incluidos los colores, tipos de letra, tamaño y el espaciado. Una vez que el proceso se haya completado, se puede descargar el libro de estilo en formato PDF .
2. Fabricator
Fabricante le permite crear su propio conjunto de herramientas de interfaz de , organizar su sistema de diseño, y generar una guía de estilo de su código de caja de herramientas. Si trabaja en un equipo, puede escribir en la documentación de rebajas para que sea más fácil para otros desarrolladores usar. Puede ayudarle a organizar su rutina de diseño / codificación de la forma que desee.
3. Frontify
Frontify incluye todo, desde maquetas digitales para wireframing. También tienen una herramienta de guía de estilo que ofrece un proceso de diseño minimalista limpio, sin ningún problema. Puede registrarse de forma gratuita, e insertar toda la información necesaria de forma manual. El proceso debe incluir la paleta de colores, opciones de fuente, iconos, logotipos, eslóganes o posiblemente copia de la tela preferido.
4. Aigis
Con Aigis , puede generar guías de estilo de cualquier archivo de texto (por ejemplo, Css , .scss , .styl , .md ). También puede escribir documentación en Markdown, y personalizar su tema del sitio.
5. holograma
Holograma fue creado por Trulia, y es una gran solución para la generación de guías de estilo. Es una gema Ruby que analiza los comentarios en tu CSS con el fin de generar guías de estilo impresionante. Holograma tiene un sistema de plantillas con algunos estilos básicos de navegación y para que su generación de libro de estilo aún más fácil.
6. Styledown
Con Styledown , puede escribir guías de estilo CSS con facilidad, ya que es un generador de libro de estilo basado en Markdown . Se trabajará con la mayoría de configuraciones de desarrollo web, ya que es independiente de la plataforma. Se requiere muy poco para verlo en funcionamiento. Además, los comentarios que hay que añadir a su CSS son muy mínimos. Puede crear la documentación de CSS, ya sea en comentarios en línea CSS, o como un archivo separado de rebajas.
7. KSS
KSS (Knyle Style Sheets) es principalmente una especificación de documentación y un formato de guía de estilo que tiene su propia sintaxis comentar . KSS también incluye una biblioteca de Rubí que analiza .sass , .scss y Css archivos documentados con las directrices KSS en una guía de estilo cuidado. KSS es para los s más avanzados y equipos profesionales, como la generación de una guía de estilo con el que requiere el conocimiento de codificación.
8. Guía de Estilo Generador SC5
Con la Guía de Estilo SC5 generador puede crear y editar las guías de estilo directamente en su navegador. Se basa en KSS con algunas características interesantes incluyen, por ejemplo, una interfaz de AngularJS potencia que ayuda a ver, buscar y probar sus estilos. SC5 usa la misma notación documento como KSS. Es compatible con SASS, MENOS, PostCSS y hojas de estilo CSS puro.
9. Styledocco
StyleDocco es una aplicación muy útil que Node.js crea guías de estilo de hojas de estilo . Se puede instalar con la NGP. En la guía de estilo generado, StyleDocco muestra una vista previa con los estilos que haya aplicado y un ejemplo del código HTML.
En la página principal del StyleDocco, se pueden encontrar dos ejemplos de estilo de guía, uno generado a partir de una hoja de estilo por defecto , y otro generado a partir de un sitio de Bootstrap . Los ejemplos también pueden ayudarle a captar la sintaxis documentación utiliza SytleDocco.
10. Laboratorio Patrón
Lab patrón es un conjunto de herramientas que ayudan a crear un sistema de diseño modular . Lab patrón es una costumbre generador de sitio estático que cose juntos todos los elementos de estilo en un sitio, y forma las plantillas y las páginas de ellos. Puede servir como su proyecto de biblioteca de patrones y estilo de interfaz de guía . Patrón Lab le permite ver sus componentes estilo al mismo tiempo de manera abstracta y en su contexto.
Comentarios