Qué hace que Knockout sea diferente
Hay varios frameworks de Webflow disponibles, que varían según el gusto personal, el uso y la calidad, al igual que hay muchos ingredientes en la góndola de café en el supermercado. Algunos son mejores que otros. Pero la diferencia entre dos frameworks también puede ser completamente subjetiva.
Knockout incluye muchas de las mismas características que otros framworks (clases, una guía de estilo básica, algunos componentes, etc.), pero no creamos Knockout solo para agregar un framework más a la pila. Lo creamos para resolver una serie de problemas específicos con los que nos encontramos durante siete años de trabajo en Webflow como agencia. Y el conjunto de herramientas resultante terminó definiendo nuestro enfoque para todos los proyectos, desde sitios boutique de marketing de una sola página hasta compromisos empresariales a gran escala y a largo plazo. Hay varias formas diferentes de preparar una taza de café, y cada persona puede tener su forma favorita. Pero esta es la forma en que funciona para nosotros. Y creemos que también va funcionar para vos.
Acá hay algunas cosas que hacemos de manera diferente a los demás.
1. Conversational, self-evident class naming
Nos gustan las mayúsculas y los espacios, y nos gustan las listas largas de clases de utilidad claramente nombradas. Bueno, no nos gustan. Pero creemos que recrear una serie de clases para realizar un cambio es mucho mejor para la capacidad de gestión a largo plazo de un proyecto que tener que aplicar ingeniería inversa a un montón de clases personalizadas. Es más limpio, es mejor para el trabajo en equipo y permite a los clientes comprender rápida y fácilmente cómo se construyó su proyecto. Además, ¿nunca has escuchado la historia de la tortuga y la liebre?
Lea más en Class Naming
2. El grid de 14 columnas responsive
Este es un nombre un poco inadecuado. Usamos un grid estándar de 12 columnas para el contenido (para que sea divisible por 2, 3 o 4), pero generalmente usamos las dos columnas exteriores como gutter. Descubrimos que este es el mejor enfoque para nosotros, ya que Webflow no es compatible con la función CSS calc (que nos permitiría mezclar píxeles y unidades VW). Usando el grid responsive de 14 columnas, podemos crear clases de padding y espaciado que respondan de manera fluida que se pueden usar de forma modular en todo el proyecto (lo que no sería posible con unidades porcentuales), lo que crea una tonelada de ahorro de tiempo y espacio.
Obtén más información en Grids, Spacing y Units
3. Optimización inteligente del viewport
Muchas optimizaciones están integradas en las clases de Knockout, específicamente en ventanas de visualización grandes y pequeñas. Por ejemplo, intencionalmente le dimos a nuestra suite de relleno nombres no específicos como Padding- XXL porque la definición va a cambiar a través de diferentes viewports. Una convención más específica como Padding - 128px exigiría una cierta rigidez. Pero preferimos optimizar previamente el relleno para dispositivos móviles a fin de reducir el trabajo pesado.
También hemos predefinido todas las clases de texto y spacing para escalar proporcionalmente a partir de 1440 px, y luego convertir a píxeles y alcanzar un máximo de 1920 px, eliminando gran parte del ajetreado trabajo de optimización del viewport.
Esto significa que mientras crea su proyecto en la ventana desktop, gran parte de la optimización para otras ventanas se realiza en segundo plano.
Lee más en Optimización de Breakpoints y Viewport
4. Adaptabilidad
Nuestras utility classes están diseñadas específicamente para adaptarse a las necesidades de un proyecto determinado. Nuestros sistemas padding y text, por ejemplo, se nombran con un sistema XXL-XXS para que puedan ajustarse según las necesidades de un proyecto. Y si un proyecto requiere un grid de 12 columnas de ancho completo, con un poco de esfuerzo, los valores de padding, margins y columns se pueden actualizar con matemáticas que son divisibles por 12, en lugar de 14.
Más información en Configuración de Knockout y Advanced Grids