Class Naming

La gestión de clases puede ser una verdadera fuente de confusión para los equipos que trabajan juntos en un proyecto. Las clases pueden tener un nombre tan genérico que no transmiten ningún propósito de la clase, como Div 16 . O, de lo contrario, pueden tener un nombre tan específico que haga referencia a contenido que puede no ser permanente, como Cat Photo . No hay nada más confuso que encontrarse con una foto de un perro con la clase Cat Photo después de que se actualizó el contenido. Pero estas cosas suceden porque averiguar el nombre ideal para docenas o cientos de elementos puede ser agotador.

La biblioteca de clases atómicas de Knockout debería ser suficiente para la gran mayoría de los casos de uso, aliviando al desarrollador/a de la carga de nombres. Y también elimina la necesidad de aplicar ingeniería inversa a clases complejas a través del panel de estilos para comprender lo que están logrando. Un compuesto como Headline M Text - Primary Uppercase es evidente para cualquier miembro del equipo que lo vea. Y si bien puede ser tentador combinar estas clases en una sola clase compleja, hacerlo reduciría la claridad y la modularidad de la construcción. Mantener las atomic classes, aunque a veces puede parecer difícil de manejar, es importante para la mantenibilidad a largo plazo del proyecto. Elimina declaraciones de estilo redundantes y evita una hoja de estilo inflada.

Pero cuando la biblioteca de clases no aborde una necesidad, será necesario crear una nueva clase. Esta puede ser una clase que define el tamaño & desplazamiento de margen para un elemento absolutamente posicionado ( Background Element 01 ). O puede hacer referencia a una modular animation ( Anim - Card Flip). O incluso podría ser una extensión de la biblioteca de las atomic class de Knockout ( Padding - XXXXL ). En cualquiera de estos casos, es importante considerar si un cliente u otro miembro del equipo entendería la convención de nomenclatura. Por lo tanto, puede ser importante hacer referencia al uso del elemento, en lugar de su contenido o ubicación, y mantener la coherencia con las clases existentes. Considera que una clase puede reutilizarse en un componente diferente, en una página diferente o con contenido diferente.

Sobre Formatting

Webflow convertirá los nombres de las clases en minúsculas y los espacios en guiones bajos en la hoja de estilo, por lo que a algunos desarrolladores les gusta usar minúsculas y guiones en la denominación de sus clases para mantener la paridad entre la interfaz de Webflow y cualquier código personalizado. Y esa puede ser una gran estrategia si su cliente va a interactuar regularmente con el código personalizado. Pero tratamos de mantener cualquier contenido con el que el cliente interactúe dentro de la interfaz de Webflow. Y hemos descubierto que el éxito se inclina hacia la claridad y la legibilidad, confiando en nuestros desarrolladores para realizar esas traducciones de formato en lugar de obligar a los clientes a adoptar una convención de nomenclatura más técnica.