Foundation 6 está casi listo para salir de la versión beta, y es mejor que sus predecesores en casi todas las formas imaginables: es más simple, más simple y, sin embargo, de alguna manera más sofisticado. Zurb se han superado a sí mismos.
Como verá por sí mismo cuando finalmente lo instale, lo suficientemente simple en OSX o Linux, pero en Windows, Node puede ser complicado: Foundation 6 solo se puede instalar a través del administrador de paquetes en estos días. Siento que me estoy haciendo viejo, soñando con los viejos tiempos cuando los marcos CSS entraban en archivos .zip, y no desde un comando de terminal.
Aún así, no mentí cuando dije que Foundation 6 es increíble. Bueno, debería decir "Foundation for Sites", porque Foundation ya no es solo un framework. Además de Foundation para aplicaciones, Zurb también ha estado ocupado haciendo algunas herramientas para acelerar el desarrollo.
Esta versión se basa en el rendimiento ... puedes construir sitios más rápido, esos sitios se descargarán más rápido y el JavaScript se ejecutará más rápido.
Primero, está el CLI de Fundación , que puede instalar cualquier versión de Foundation para ti, completa con proyectos iniciales. El CSS precompilado de Foundation for Sites estará disponible para su descarga por separado en el lanzamiento final. Por ahora, sin embargo, la CLI es la forma de obtenerla y mantenerse actualizado con respecto a cualquier cambio antes del lanzamiento final.
Luego está Panini , un compilador de páginas estáticas con plantillas de Handlebars y varias otras características para ayudarlo a crear prototipos estáticos y / o sitios rápidamente. Compila el Sass, pone todo el JavaScript en un archivo, puede comprimir todo su código y más.
Ahora, no entiendo la idea de que esta versión de Foundation está llena de funciones, todavía tiene todo lo que necesita y más, pero debe tenerse en cuenta que algunos elementos que se adaptaron mejor a las aplicaciones que a los sitios se han eliminado. Esos elementos son ahora parte de Fundación para aplicaciones .
El resto del trabajo en esta versión tenía que ver con deshacerse de código redundante y racionalizar todo lo que quedaba.
Por ejemplo, en lugar de crear tres componentes de menú diferentes para tres diseños de menú diferentes, solo hay un componente de menú, con varias variaciones. Para la persona que escribe el código HTML, hay poca diferencia: agrega una clase y tienes un menú; cambia algunas clases, y tienes un menú que se ve completamente diferente.
De hecho, a pesar de todas las diferencias, muchas de las clases y el marcado se verán muy familiares, si no es lo mismo. Todo está basado en Sass para que puedas personalizarlo como siempre.
Esta versión ha sido todo sobre el rendimiento. Una vez que aprenda cómo, puede construir sitios más rápidamente, esos sitios se descargarán más rápido y el JavaScript se ejecutará más rápido. En la actualidad, la Fundación es aproximadamente la mitad de lo que era en términos de tamaño de archivo. Mitad
Las versiones anteriores soportaban RTL (de derecha a izquierda) idiomas como el árabe hasta cierto punto; pero necesitaban algunos ajustes. Foundation 6 tiene soporte incorporado.
La grilla Flex es exactamente lo que crees que es: es el componente Rejilla hecho con Flexbox. Por un lado, esto le da una serie de características y opciones que una grilla regular basada en flotador no puede manejar. Por otro lado, probablemente no sea tan bien soportado, especialmente por IE. Es una compensación.
Se incluyeron algunas mejoras geniales para la tipografía de estilo de sitio web. Específicamente, hay clases de ayuda diseñadas para hacer que los diseños tipográficos sean un poco más fáciles de tratar:
Como se mencionó anteriormente, todos los componentes de navegación anteriores se combinaron en un único componente flexible. Esto significa que todos los tipos de navegación jugarán muy bien entre ellos. También significa que puede elegir diferentes tipos de navegación para diferentes tamaños de pantalla.
¿Desea una navegación detallada en un teléfono inteligente y una barra horizontal en un escritorio? Fácil de hacer con las clases específicas del tamaño de la pantalla. ¿Quieres tu "barra superior" de nuevo? Simplemente agregue un div envoltorio alrededor de los componentes de menú predeterminados.
Pero aunque es más sencillo de usar en general, todavía está cargado de funciones. Asegúrese de revisar la documentación sobre menús y navegación .
¿Conoces esos pequeños círculos o cuadrados, usualmente colocados en o cerca de iconos de algún tipo, con pequeños números en ellos? ¿Como cuando tienes notificaciones de Facebook? Esas son llamadas insignias.
Tu aprendes algo nuevo cada dia. Además, Foundation los tiene ahora.
¿Necesita hacer que algo permanezca en la pantalla mientras el usuario se desplaza? ¿Quieres que se detenga en un cierto punto? ¡Sticky es tu complemento! Esto también es lo que debe usar si desea que el menú de Magellan funcione como lo hizo en Foundation 5.
En caso de que los desplegables, acordeones, profundizaciones, información sobre herramientas y modales no sean suficientes para usted, aquí hay una forma genérica de hacer que las cosas aparezcan o desaparezcan. Es un simple evento de alternar basado en JavaScript que se puede aplicar básicamente a cualquier cosa.
Me imagino que es para esos momentos en que ninguno de los otros componentes se ajusta al propósito, o sería excesivo. Integra la biblioteca Motion UI, por lo que puedes animar el acto de desaparecer de la forma que quieras.
Bueno, el nombre suena como si fuera un elemento donde puedes incrustar un video o un objeto Flash (yuck), y podrías hacer eso, supongo. Para qué sirve realmente es mostrar cualquier objeto multimedia, como una imagen, junto con información de texto.
Por ejemplo, puedes poner el avatar de un usuario junto a su nombre de usuario y su comentario en una sección de comentarios. O bien, puede usarlo para colocar la fecha de lanzamiento de una película, los actores principales y otros metadatos al lado de una revisión de la película. Verifica la documentación por ejemplo.
Cada característica ha sido actualizada o reescrita. Sin embargo, muchos están funcionalmente sin cambios. Revisa la documentación para asegurarte de que tienes las clases correctas, revisa algunas de las actualizaciones y listo. Estas son las características más o menos iguales, en orden alfabético:
Sip. El enfoque renovado en la construcción de sitios (en lugar de un marco que intente satisfacer las necesidades tanto de sitios como de aplicaciones) es refrescante, y el tamaño reducido siempre es un plus.
Esperamos que salga a la luz muy, muy pronto.