¿Hay un diseño HTML estándar con múltiples estilos CSS disponibles?

Question

Cuando se trata de diseño web, soy horrible en la producción de algo remotamente apuesto. Afortunadamente hay un montón de sources gratis para designtemplates. Sin embargo, un problema con estos diseños es que solo cubren una sola página y no muchos casos de uso. Si echa un vistazo a CSS Zen Gardens, tienen 1 único archivo HTML, y pueden modificar radicalmente el estilo simplemente cambiando el archivo CSS.

Ahora me pregunto si hay un diseño HTML estándar (etiquetas e identificadores), que cubre una gran cantidad de casos de uso, y puede ser temáticamente genérico con diferentes archivos CSS como Zen Garden. Lo que estoy imaginando es un conjunto de reglas sobre cómo escribir su html, y qué cajas, listas, menús y estilos se supone que debe usar. Se puede crear un conjunto de páginas de prueba estándar que cubran los diversos usos, y un nuevo archivo CSS, mientras que debe admitir todas las páginas diferentes en una buena vista.

¿Hay algún proyecto que cubra algo similar a lo que estoy describiendo?

Answer 1

He usado Bluprint CSS, es fácil y útil como verás. También tiene algunas secuencias de comandos de rubí que le permiten cambiar el número de columnas y la distancia entre ellas. Por defecto es 950px para un elemento span-24.

Answer 2

Echa un vistazo a Grids framework de YUI. Particularmente impresionante es el Grid Builder. Además, tienen un conjunto de archivos CSS de restablecimiento, base y de fuente que le brindarán una buena base de referencia sobre la cual construir.

Answer 3

Por lo general, trato de seguir las pautas establecidas por el estándar HTML en sí.

• Los títulos van en las etiquetas "h" (así que una etiqueta H1 para el encabezado principal, luego una o más etiquetas H2 debajo de eso, etc.).
• El texto libre se agrupa en párrafos en las etiquetas P.
• Las secciones de información agrupadas lógicamente van en etiquetas DIV.
• Cualquier tipo de lista (incluso los menús que eventualmente desearía que se coloquen horizontalmente) pertenece a etiquetas de lista como UL, OL o DL.
• Las tablas de información aparecen en las etiquetas TABLE. NO use etiquetas de tabla para el diseño.
• Sea inteligente con sus atributos ID y CLASS. Mantenga los ID únicos y asígnelos a elementos que sepa que representan algo único en la página, como un menú de navegación o un pie de página. Asigne la misma clase a los elementos que se repiten pero similares (que es posible que desee representar con un estilo visual similar).

Siempre empiezo con una página vertical muy simple: simplemente ejecute todo lo que quiero en la página en blanco y negro. Luego empiezo a agregar CSS para asegurarme de que los bits estén formateados y dispuestos de la manera que quiero.

Eche un vistazo a la fuente de mi home page para ver un ejemplo de lo que estoy hablando.

Answer 4

BluePrintCSS fue, por lo que sé, el primer marco de CSS. Como YUI CSS Framework, te ayuda a manejar el diseño.

Ese tipo de marco te ayudará a crear múltiples CSS para tu sitio.

BluePrintCSS es un proyecto bastante maduro, por lo que le recomiendo que lo compruebe.