Cultura web: diseños de diseño basados en cuadrículas
La web semántica ha traído una nueva generación de tecnología de Internet. A medida que los diseñadores y los desarrolladores trabajan juntos para redefinir las reglas de la web, la cantidad de proyectos de código abierto y API de terceros continúa creciendo.
Las opiniones de los expertos en la web difieren en el uso de los sistemas de grillas . Muchos argumentan que el establecimiento de puntos en la grilla limita la creatividad de los diseñadores. Otros sostienen que una cuadrícula proporciona una base científica para perfeccionar un diseño.
Ambas partes proporcionan argumentos interesantes. Estas ideas se han convertido en parte de una cultura web única caracterizada por reglas de diseño influyentes y proyectos de código abierto.
La cuadrícula no es una llave maestra para un diseño perfecto. Sin embargo, las matemáticas han demostrado que ciertas especificaciones de diseño proporcionan las mejores proporciones para los elementos y diseños de la página. Si tu has escuchado sobre esto antes , puede que esté familiarizado con las muchas opciones que los diseños basados en cuadrículas ofrecen a los diseñadores.
Una comparación con la Web clásica
Las generaciones anteriores usaron el diseño como un mecanismo de control. Sus diseños presentaban información con precisión y de una manera que era fácil de manejar. Esto sigue siendo cierto hoy, pero estos principios de diseño obsoleto están siendo desarraigados.
A su paso, una nueva cultura web está despertando. Una cultura de estándares y protocolos abiertos, código fuente libremente compartido y potentes plataformas ejecutadas por programadores de todo el mundo.
Una razón para este desarrollo es el aumento significativo en el número de personas que trabajan en la web semántica. La causa subyacente proviene del impulso humano para contribuir a algo más que a nosotros mismos.
Trabajar para un día de pago es satisfactorio, pero no es algo que le apasione. Los desarrolladores que realmente se preocupan por los nuevos estándares quieren dejar su huella.
Donde las rejillas han evolucionado
No ha habido un gran estudio que compare las técnicas de diseño web prenormales y post-estándares. Sin embargo, podemos rastrear cómo las cuadrículas se han vuelto más populares con el tiempo.
El sistema de grillas se basa en las tendencias y avances tecnológicos actuales. Esto incluye estadísticas sobre la cantidad de personas que acceden a Internet en un momento determinado, los dispositivos que utilizan para acceder a Internet y las resoluciones de pantalla y los sistemas operativos de sus dispositivos. Los sistemas de cuadrícula proporcionan un equilibrio estructural a los diseños de sitios web. Proporcionan mediciones consistentes y permiten flexibilidad entre marcos.
A fines de la década de 1990, no muchas máquinas domésticas tenían una resolución superior a 800 × 600, e incluso menos pasaban de 1024 × 768. En los últimos 20 años, sistemas operativos intrincados y complejos se han desarrollado para mostrar resoluciones mucho más altas. 1024 × 768 es un entorno común en estos días.
Las resoluciones del monitor crecen exponencialmente, y esta tendencia no parece estar disminuyendo. Echa un vistazo a la tabla de datos de Estadísticas y tendencias web ; detalla las medidas de resolución de pantalla a través de W3Schools.
Diseños de cuadrícula visual
Todas las páginas web se basan en cuadrículas, ya sea que el diseñador sea consciente de esto o no. El trabajo digital está compuesto de píxeles y, como tal, se ajustará a un ancho y una altura establecidos, y también producirá efectos artísticos visualmente con espaciado y distancia entre los puntos.
En lugar de pintar en la oscuridad, por así decirlo, puede usar cuadrículas para iluminar el proyecto. Las rejillas se hicieron populares por primera vez con la aparición de Adobe Photoshop como la herramienta de facto para los diseñadores web. Tutoriales en la web presentan formas de mostrar e implementar líneas de cuadrícula al crear maquetas, logotipos, gráficos, iconos y otras obras de arte digital.
Con el tiempo, los desarrolladores se dieron cuenta de esto y comenzaron a implementar sistemas en su propio trabajo. Diseñar un diseño de cuadrícula en Photoshop es muy diferente a crear el mismo diseño en HTML y CSS.
El trabajo requerido para cada ruta es muy diferente, sin embargo, el sistema de la red en sí es universal. A medida que los estándares abiertos entran en su lugar, la cultura del diseño actual se está moviendo hacia estructuras basadas en grillas.
Reglas básicas de HTML y CSS
Las grillas usan algunas de las propiedades más comunes de las páginas web HTML. Los diseños de cuadrícula HTML generan la misma plantilla general cada vez.
La estructura comienza con un contenedor contenedor lo suficientemente ancho como para contener todas las columnas. Dentro de la división de envoltura debe haber una colección de subdivisiones. El número de subdivisiones debe ser el mismo que el número de columnas que necesita.
Para un diseño de dos columnas, puede tener dos divisiones, clasificadas como .left y .right . Todas sus columnas internas deben tener su propiedad de float CSS establecida a la izquierda o a la derecha, mientras que la envoltura debe contener un clase clearfix .
Para familiarizarse con el código HTML, puede consultar un generador de diseño de cuadrícula dinámico. Popular solución de la columna de la página ofrece una excelente estructura y admite diseños de múltiples columnas. Todo el HTML y el CSS se generan instantáneamente y pasan las pruebas de cumplimiento de estándares.
Rompiendo con relleno
El acolchado y las canaletas son partes integrales de cualquier sistema de grillas. Las piezas de contenido formateadas una al lado de la otra requieren espacio entre ellas, lo que podría hacer que el diseño se expanda de forma no natural, lo que da como resultado páginas rotas.
Cree definición en áreas acolchadas creando un diseño con contenido ficticio. Coloque sus columnas en una página y bríndeles contornos de 1 píxel usando varios colores. Esto proporciona una representación precisa de cómo se verá el diseño, delineando la porción de contenido de cada área.
Esta técnica funciona con diseños fijos y fluidos, por lo que la integración a los marcos de cuadrícula actuales es mucho más fácil.
Los canales tampoco necesitan seguir un marco establecido. Puede estar dispuesto a sacrificar el área de contenido para aumentar el espacio entre una división de dos columnas. Los marcos de código abierto son maleables y le permiten editar estilos directamente o incluso implementar los propios para sobrescribir reglas y definir propiedades.
Propiedad de CSS de cuadrícula de diseño
los layout-grid propiedad es una especificación anterior de CSS adoptada por Microsoft. Está escrito en forma abreviada para establecer una multitud de propiedades de grillas. Específicamente, hacen referencia layout-grid-mode , layout-grid-type , layout-grid-line , layout-grid-char y layout-grid-char-spacing .
Cada uno de estos se puede definir como propiedad propia y se puede escribir sin el alcance general layout-grid . Aquí hay una breve lista que explica cada uno:
layout-grid-mode
Controla qué tipo o modo de cuadrícula de disposición se usa. Los valores posibles incluyennonepara ninguna rejilla,linepara elementos de grilla en línea,charpara personajes y elementos de línea de bloque, ybothpara soporte completo.layout-grid-type
Controla qué cuadrícula se utiliza para representar la tipografía de página y los elementos de texto internos. Los pares de valores sonloose, que se usa para texto chino y coreano,strict, que se usa para caracteres japoneses, yfixed, que utiliza el monoespacio para aplicar la misma distancia entre los caracteres, independientemente del idioma.layout-grid-line
Controla la granularidad de la longitud de la grilla cuandolayout-grid-modese establece enlineoboth. Esta propiedad se comporta de manera similarline-heighty puede recibir valores numéricos establecidos en cm, px, pt, em o porcentajes.layout-grid-char
Controla el tamaño de la cuadrícula de caracteres para el contenido de texto de un elemento cuandolayout-grid-modese establece enlineoboth. Los valores que acepta esta propiedad son los mismos que los de arriba y afectan directamente a la altura de la línea de la página. La diferencia es quelayout-grid-lineafecta la cuadrícula de la página, mientraslayout-grid-charafecta la cuadrícula de espaciado de texto y caracteres.layout-grid-char-spacing
Controla el espaciado de caracteres cuandolayout-grid-modese establece encharobothy ellayout-grid-typela propiedad está configurada paraloose. Esta propiedad se comporta comoline-heighty debe usarse para áreas de texto de nivel de bloque.
El propósito de crear estas propiedades es adaptar diseños de cuadrícula para páginas codificadas en Asia. Los caracteres en idiomas asiáticos a menudo requieren diseños de página personalizados.
Cuando se ven en otros países, estos personajes podrían comportarse de manera extraña y romper los cálculos de la cuadrícula. Estas propiedades únicas permiten un mejor formato visual al utilizar un sistema de grillas de una o dos dimensiones.
Ritmo vertical de la página
Muchos artistas gráficos pasarán por alto la importancia del espaciado vertical en el diseño de la cuadrícula. Las líneas de división admiten el diseño de disposición horizontal y alinean los elementos de página vertical y la tipografía. Cuatro propiedades importantes manipulan el espaciado vertical: tamaño de letra, altura de línea, márgenes superior e inferior y relleno.
La altura de la línea es el factor más importante en el espaciado vertical. El texto de la página se escala por el tamaño de las letras individuales y por el espacio que requieren las líneas intermedias. Comúnmente, la altura de la línea se define en píxeles o ems, según la flexibilidad del diseño. Ems mantiene la consistencia tipográfica en todas las resoluciones y navegadores. El mejor enfoque es aplicar estilos de fuente a todos los principales elementos HTML, incluidos los encabezados, las comillas de bloque y los párrafos.
El ritmo vertical se puede retocar una vez que se ha establecido una cuadrícula, lo que hace que las escalas para diferentes ambientes sean simples. Los usuarios de escritorio tendrán una experiencia muy diferente a la de los usuarios de computadoras portátiles y dispositivos móviles, que tienen resoluciones mucho más pequeñas.
No se puede planificar la alineación vertical con precisión exacta, pero en la mayoría de los casos una conjetura educada producirá resultados de calidad.
La regla de los tercios
Divida un diseño en tres espacios horizontales y verticales. Esto creará una cuadrícula de nueve rectángulos ubicados en bolsillos recién formados. Es mucho más fácil trabajar con diseños que se dividen en áreas de bloques con puntos finitos.
La ciencia detrás de esta tendencia proviene de la "proporción divina", también conocida como la "proporción divina". La proporción de 1.618, que es la proporción divina, es una constante matemática. Cuando dividimos cualquier disposición de tamaño fijo en este valor, podemos calcular la división más precisa para una estructura de dos columnas.
Tome como ejemplo un diseño de 960 píxeles. Si dividimos 960 por 1.618, obtenemos aproximadamente 593. Según la proporción áurea, entonces, debemos establecer la longitud de la columna principal en 593 píxeles. Este método se remonta a los artistas hace siglos. Afortunadamente, con la expansión de los marcos de código abierto, la mayoría de las matemáticas ya se han calculado.
Construyendo un Rectángulo Dorado
Esta teoría para crear hermosos diseños rectangulares basados en cuadrículas se basa en la Regla de los Tercios. Los rectángulos divididos son geométricamente sólidos en comparación con la proporción áurea. Los valores numéricos para el ancho y la altura del rectángulo son proporcionales a la regla de oro.
Estos tipos de rectángulos se conocen como "rectángulos dorados". El lado más corto y más largo debe contener los valores de las variables a y b, respectivamente.
Estos rectángulos son útiles para construir diseños de página: miden qué tan grandes deben ser los elementos de bloque. Son extremadamente fáciles de calcular, y las herramientas para muchos frameworks grid populares están integradas.
Estos elementos son muy beneficiosos para los diseñadores web que usan grillas matemáticas. Imagine los múltiples escenarios en los que un rectángulo dorado cuidadosamente estructurado mejoraría la estética de una página. Esto podría incluir widgets de páginas, imágenes de productos de comercio electrónico e incluso tablas con contenido rico.
A partir de 960gs
Con toda esta información disponible para el público, los diseñadores web han comenzado a definir sus propios estándares.
De todos los marcos, el 960 Sistema de rejilla (960gs) es probablemente el más conocido. Esto no quiere decir que sea el mejor; ningún sistema de cuadrícula se ajusta perfectamente a todos los criterios, pero es fácil trabajar con él. 960gs es adaptable y funciona bien con casi cualquier sitio web. Y rinde bien en la mayoría de los navegadores y dispositivos
La matemática incluye 12 columnas a 60 píxeles cada una, junto con un margen de 10 píxeles en cada lado, produciendo un canal de 20 píxeles. La mayoría de los marcos de cuadrícula se basan en columnas de 12 a 24 píxeles. Por supuesto, no se espera que incorpores 12 columnas en tu diseño.
Eventualmente, combinará las columnas y las canaletas en una sola unidad de grilla. Publicar contenido es mucho más fácil cuando puede redactar detalles específicos para imágenes, widgets, videos y otros elementos de página.
960gs ha cosechado tanta publicidad porque se adapta bien a la web. La mayoría de las resoluciones de pantalla pueden mostrar un sitio web de 960 píxeles sin una barra de desplazamiento horizontal. Cada vez más, los diseños se ajustan a esta proporción, lo que indica que este es el futuro de la web. El ancho adicional no quita del diseño y expandir o contraer una plantilla es completamente posible.
Comprender un diseño completo de 960
Solo tantas columnas pueden encajar racionalmente en un diseño. Una grilla no tiene la intención de encerrarlo en una mentalidad limitante. Las grillas son guías a seguir: mejoran la interactividad del usuario y la colocación de elementos de página.
La cuadrícula más grande que podría crear es un área de contenido de 940 píxeles con canales de 20 píxeles. Es un uso tonto de la grilla, pero es bueno entender las posibilidades. Los diseños de dos columnas son bastante simples y ofrecen mucho espacio para el contenido. Ejemplos comunes incluyen:
- 780 x 140,
- 700 x 220,
- 620 x 300.
Tenga en cuenta que todos estos elementos suman 920. La pérdida de 40 píxeles puede explicarse por canaletas en cada "bloque" del diseño. Estos espacios mantienen a los usuarios enfocados y permiten que el contenido se divida sin problemas. Con elementos de contenido dividido, tenemos cunetas en el lado más alejado y entre los bloques, cada uno de los cuales representa 10 de los 40 píxeles.
Estos espacios aumentan a medida que agrega nuevos bloques al diseño. Un diseño de tres columnas tiene un poco menos espacio para el contenido que un diseño de dos columnas.
Si este concepto aún es confuso, consulte la imagen de arriba. La forma más sencilla de trabajar con cuadrículas es diseñar una hoja de referencia similar al gráfico anterior, con todas las interrupciones posibles para los bloques de contenido. Con esta información, mezcle y combine los estilos para determinar el tipo de diseño que mejor se adapte a su proyecto.
Por ejemplo, supongamos que queremos diseñar una maqueta utilizando tres columnas y el área de contenido más grande posible. Con el cuadro anterior, podemos dividir nuestra área de contenido en dos partes: una llena de contenido, pero dividida a la mitad para contener dos columnas. Esto requeriría un bloque de contenido de 450 píxeles y dos columnas de 210 píxeles.
Una vez más, estas cuadrículas no están destinadas a sofocar la creatividad. Permiten flexibilidad pero mantienen segura su estructura de back-end. La mayoría de los diseñadores no deliberarán sobre la ciencia de todo esto. La cantidad de tiempo que estos sistemas de código abierto guardan un proyecto es extraordinario, fácilmente vale la pena revisar la documentación e implementar su propio diseño.
Diseños de red fluida
No es común ver cuadrículas ancladas en diseños fluidos. Los píxeles son la unidad de medida más precisa para un sitio web. Para pasar a una medición, como porcentajes o ems, se requiere una consideración cuidadosa. Tales diseños son posibles con algunos cambios y selectores de CSS adicionales.
Fluid 960 Grid System es bien conocido, aunque la mayoría del código no es accesible para versiones anteriores de Internet Explorer. A través de la creación de prototipos interactivos y el trabajo en innumerables resoluciones de pantalla, puede escalar un diseño de 960 píxeles en muchas resoluciones de pantalla. Este marco abierto no es una copia exacta de 960gs, y viene con nueva documentación. Si estás interesado, mira el Repositorio GitHub para debates activos en el foro y sesiones archivadas de preguntas y respuestas.
Al igual que el resto de la comunidad de diseño web, probablemente estés ansioso por algo más estable. Algunos marcos fluidos que generan diseños increíbles.
Diseños de grillas YAML
Sin embargo, otro diseño Multicolumn (YAML) es uno de los marcos de CSS más populares. Contiene una gran base de código para manipular diseños XHTML y CSS flexibles. Es constantemente actualizado por desarrolladores activos de la comunidad.
El marco es extremadamente versátil, ofreciendo numerosos ejemplos prácticos con código El diseño de ancho fijo más pequeño se ajustará a 740 píxeles, y se ajustará a resoluciones de pantalla de 800 × 600. Las resoluciones de ancho máximo están configuradas en 80 em, ofreciendo escalabilidad entre navegación móvil y escritorio.
Establecido con fuentes web estándar, alrededor del 75% de los diseños se ajustarán a un máximo de 960 píxeles, aunque esto puede sobrescribirse.
Muchos de los errores encontrados en navegadores más antiguos han sido parcheados. YAML es compatible con Google Chrome, Mozilla Firefox, Safari y todas las versiones de Internet Explorer 5+. Ver el visión general y características del marco para obtener más información en profundidad.
Yahoo! Biblioteca de interfaz de usuario
YUI es un conjunto de bibliotecas de JavaScript y CSS distribuidas por Yahoo. La mayoría del código del proyecto y las correcciones de errores han sido escritos por desarrolladores profesionales de la comunidad YUI. La revisión más reciente es YUI2, aunque Documentos API YUI3 han sido lanzados a v3.1.1.
los Página de inicio de YUI2 tiene enlaces que conducen a los proyectos más populares. Hacia la parte inferior, enumerados en "Herramientas YUI2 CSS", hay cuatro marcos influyentes: Restablecimiento de CSS, Base, Fuentes y Cuadrículas. Este artículo está relacionado con CSS Grids, aunque se han hecho referencia a muchos de estos otros frameworks.
El archivo de descarga tiene solo 4 KB y ofrece más de 1000 diseños únicos de páginas web. Los ajustes incorporados permiten tamaños de ancho de diseño tanto fluido como fijo. Las columnas se autorregulan, por lo tanto, si está dividido en dos o cuatro direcciones, el contenido del pie de página siempre permanecerá debajo del contenido principal. Las propiedades tipográficas se unen para realizar ajustes flexibles específicos del usuario. Se cuidan muchas funciones principales, lo que hace que trabajar en YUI2 sea tan agradable.
El marco de Grids de CSS ofrece una pequeña cantidad de diseños basados en dispositivos móviles. Estos se procesan correctamente solo en navegadores con una versión relativamente nueva del motor Webkit. Esto incluye teléfonos inteligentes como dispositivos Android, iPhone, BlackBerry y muchos dispositivos con Windows Mobile.
La integración es agradable, pero este nuevo medio no se ha probado a fondo y aún puede mostrarse incorrectamente en algunos dispositivos móviles. Pero al final del día vale la pena, porque la mayoría de los visitantes móviles que están dispuestos a leer el contenido de su sitio web probablemente tengan un teléfono inteligente.
La evolución de la cultura web
Los diseñadores web se han vuelto bastante enfáticos sobre los sistemas abiertos y las reglas. La primera web no era una comunidad en absoluto. Había estándares HTML y CSS, pero la mentalidad detrás de la mayoría de los diseños era "lo que sea que funcione". Después de importantes desarrollos en la tecnología web, Internet se ha convertido en el mejor medio para la publicación en todo el mundo.
Los diseñadores y desarrolladores web pretenden simplificar el proceso de creación de sitios web sin restarle calidad o experiencia a un sitio web. Las rejillas son un instrumento armonioso en el sentido de que dan a los diseños un orden y una estructura. El caos y la creación aleatoria generalmente no arrojan resultados.
Esta es la razón por la que los diseños de cuadrícula son tan accesibles. La web se ha reformado en un sistema de desarrollo ágil. Los diseños basados en grid producen sitios web estables: no sorprende que la comunidad haya adoptado frameworks como práctica común.
En lugar de depender de métodos no confiables más antiguos, el diseñador web promedio de hoy puede enfocarse en crear sitios web que sean agradables para los usuarios, en lugar de coordinar creaciones perfectas para píxel.
Hoy en día, los diseñadores son mucho más jóvenes y tienen una mayor pasión por el diseño que nunca. Esto, junto con el movimiento de la web abierta, significa que una secuencia de código web nuevo se lanza constantemente al público. Repositorios de GitHub ofrece oportunidades de networking con otros desarrolladores de CSS.
Desarrollo del marco de cuadrícula personalizado
Los diseñadores han criticado muchos marcos abiertos por ser demasiado hinchado. Muchos son etiquetados como confusos, con demasiadas clases y reglas para trabajar. Esto puede ser cierto para algunos, y ciertamente no desacreditaré estos comentarios.
En definitiva, cuanto más flexible sea el diseño, mejor. Los artistas buscan herramientas que les faciliten el trabajo. Los marcos no son adecuados para todos los diseños. El desarrollo de marcos sobre proyectos web más pequeños ahorrará tiempo a largo plazo. Sin embargo, considere los sistemas CSS como una herramienta de aprendizaje más que un entorno de producción.
Las grillas pueden ser confusas al principio, sin dudas al respecto. Tener un marco de referencia y documentación para controlar durante todo el proceso ayudará a los novatos a integrarse rápidamente y con menos estrés.
Con suficiente práctica, desarrollar un marco CSS personalizado será simple. Los beneficios de esto superan con creces las ventajas de trabajar con la fuente de otra persona. Puede estructurar todos los formatos de diseño en una ubicación y definir propiedades como el tamaño de fuente, la altura de línea y los elementos de bloque. Nadie ha escrito código CSS perfecto, así que quédese con lo que mejor funcione para usted.
Marcos de malla CSS comunes
A continuación se encuentran algunos de los marcos de CSS más populares. Aunque no todos estos marcos se centran exclusivamente en el diseño de la cuadrícula, ofrecen bibliotecas útiles para estudiar e implementar en diseños web. El código fuente del proyecto es gratuito en cada caso y generalmente viene con documentación.
Rejilla de 1KB
Rejilla de 1KB es un gran marco CSS que enfatiza principalmente la velocidad. Los archivos de descarga tienen menos de 1 KB en total y contienen la mayoría de los selectores de CSS que necesita para crear un hermoso diseño de sitio web. El código CSS es personalizable antes de la descarga, lo que es un gran beneficio para todos los diseñadores web. Puede elegir entre cuántas columnas debe incluir y qué ancho deben tener las columnas y los canales. Esta grilla es extremadamente amigable para los recién llegados y una excelente manera de entrar.
Línea de base CSS
Base es otra plantilla CSS estándar disponible gratis para descargar. Este paquete no solo incluye código para grillas, sino que también estructura la tipografía de página y bloquea elementos. Todo el código es compatible con elementos CSS3 y HTML5, lo que les brinda a los desarrolladores el control sobre cómo estructurar el flujo de páginas. Baseline CSS ofrece soluciones para la manipulación del espacio vertical integrando la tipografía de página en una grilla flexible.
Sistema de cuadrículas CSS de 1140 px
CSSGrid.net es el hogar de un nuevo marco fluido para sitios web basados en grillas. Con 1140 píxeles y una división de 12 columnas, la estructura se adapta correctamente a todos los dispositivos, desde las resoluciones de monitores más grandes hasta las computadoras de mano. El marco utiliza consultas de medios para verificar cuándo mostrar un determinado diseño y cómo distribuir el contenido de la página. Autor Andy Taylor actualiza con frecuencia el proyecto, y puede descargar último lanzamiento 1.6 aquí .
YAML
YAML proporciona el marco más flexible para desarrollar diseños. La documentación ofrece una solución completa para todos los diseños fijos, elásticos y fluidos. Los archivos principales han sido probados extensivamente en sitios web pequeños y grandes. Si está buscando un marco CSS estable, YAML es una gran solución.
Blueprint CSS
Cianotipo contiene muchos de los beneficios de Baseline. La ventaja de este marco es su marca bien reconocida. Muchos desarrolladores activos han actualizado el proyecto con nuevas clases. Las grillas comprenden una gran parte del marco, pero muchos modelos se usan para formar tipografías, pantallas móviles e impresoras ¡y más!
Boilerplate de CSS
los Boilerplate de CSS proyecto fue iniciado por uno de los desarrolladores de Blueprint. El código es una versión más refinada y simplificada del marco Blueprint, optimizado para la velocidad y la facilidad de lectura. Si bien el proyecto no se ha actualizado recientemente, brinda la oportunidad a los principiantes de descartar sus propias definiciones de proyecto CSS.
YUI 2: Grids CSS
Rejillas YUI2 es un marco muy popular lanzado por Yahoo bajo su línea YUI2. El código es perfecto para diseños fijos y fluidos, siguiendo las reglas establecidas en CSS2 y CSS3. El marco está bien documentado en la Biblioteca de interfaz de usuario de Yahoo y se considera uno de los mejores marcos para principiantes.
Esta publicación fue escrita exclusivamente para Webdesigner Depot por Jake Rocheleau , un apasionado diseñador de páginas web y entusiasta de las redes sociales. A Jake le encanta leer y escribir sobre las últimas tendencias digitales de Internet y las redes dentro de la comunidad del diseño. Echale un vistazo en Twitter @jakerocheleau para más sobre su trabajo.
¿Utiliza un marco basado en la cuadrícula para sus diseños? ¡Comparte tus puntos de vista con nosotros!