Especial para diseñadores web que quieran mejorar su productividad, una enorme recopilación con 715 plantillas CSS gratis que puedes utilizar para tus sitios web y que mejorar tu productividad reduciendo significativamente tu trabajo.

Son unicamente las esctructuras, respetan grids y estan optimizadas para la mayoría de los navegadores sin duda una excelente fuente de recursos CSS gratis que deberías guardar en tus favoritos.

Enlace: 715 awesomely simple and free CSS Layouts

Simplemente vienen con las imagenes y el codigo XHTML sera tu trabajo integrarlo a tu blog, son diseños muy buenos que pueden servir perfectamente para tu negocio.

Aquí les dejo cuatros plantillas xhtml gratis que me han gustado con sus respectivos enlaces, para ver todas sigan el enlace al final.

Ver Demo | Descargar

Ver Demo | Descargar

Ver Demo | Descargar

Ver Demo | Descargar

Enlace: 50 free high-quality and “new” (X)HTML/CSS templates

En solucija tienen una excelente colección de plantillas css gratis que bien podríamos descargar y utilizar en nuestros sitios rápida y profesionalmente, son un total de 35 diseños distintos para descargar, en varios estilos y colores.

Así que si desean descargar plantillas css solo sigan el enlace para encontrar un muy buena cantidad de plantillas web gratis.

Enlace: 35 plantillas css gratis |   Vía: PuntoGeek

Entre las habilidades que recomiendan conocer estan:

• Crear plantillas CSS
• 40 tutoriales para crear plantillas CSS
• Entender el modelo de cajas y posiciones
• Como entender el modelo de cajas y posiciones CSS
• Mejoras practicas de programación para la optimización
• Tips para optimizar tu codigo CSS
• etc…

Este articulo viene acompañado de un gran numero de tutoriales CSS para aprender a dominar estas habilidades, el único problema es que todos están en ingles.

Enlace: 9 Top CSS Essential Skills That Every Web designer Should Learn

Entre los mil recursos que te puedes encontrar por la red están los diseños web donde únicamente descargar el archivo fuente del diseño en el caso de photoshop son los archivos PSD, o tal vez tienes un blog y eres bueno frente al photoshop pero al momento de programar no mas no le hayas como crear tu plantilla PSD a XHTML y CSS.

Bien en acomment.net han recopilado un total de 20 tutoriales que conforman una serie muy bien detallada paso a paso, detalle a detalle como convertir plantillas PSD a XHTML y CSS.

Este es un excelente listado de tutoriales que no debes dejar pasar, aquí les dejo los primeros 2 tutoriales de la lista para empezar paso a paso, si quieren conocer todos sigan el enlace.

• Tutoriales para crear templates CSS , este primer tutorial te enseña a como exportar tus plantillas PSD a templates CSS.
• De PSD a HTML/CSS en 4 pasos, tutoriales que te ayuda a convertir archivos PSD a HTML y CSS.

Enlace: Creating CSS Layouts from PSD files

Las hojas de estilo o CSS son un excelente recurso para diseñadores web porque nos permite controlar todo el diseño y estructura que se muestra en el navegador, pero que pasa cuando esa pagina web la imprimimos?

Bien pues el CSS también nos puede ayudar para imprimir con estilo, que posibilidades nos brindan las plantillas css para impresion?

• Ocultar elementos con las barras laterales o banners que estorben el contenido real del sitio
• Cambiar tipos de letras definiendo una para el navegador y una para la impresión
• Ofrecerle a tu usuario una información clara tanto en la web como en papel

Como se hace?

CSS para navegador:

body{ font-size:15px; }

#header{background:black; color:#fff;}

#content .contenido{width:400px;color:#333;font-size:12px;}

#content .sidebar{width:200px;background:#333;color:#fff;font-size:12px;}

#footer{background:red; color:#fff;}

CSS para imprimir, ocultando la barra lateral (sidebar):

body{ font-size:15px; }

#header{background:black; color:#fff;}

#content .contenido{width:400px;color:#333;font-size:12px;}

#content .sidebar{width:200px;background:#333;color:#fff;font-size:12px;}

#footer{background:red; color:#fff;}

@media print{

#content .contenido{width:100%;}

#content .sidebar{display:none;}
}

Si les intereso el tema y quieren saber mas acerca de como usar las hojas de estilo para imprimir les recomiendo estos enlaces:

• Crear hojas de estilo optimizadas para imprimir (en ingles)
• CSS para imprimir paginas web
• Going to Print
• CSS Print Profile (Tabla de propiedades)

Ayer escribía sobre YAML Builder un editor de plantillas CSS flexibles, y hoy seguimos con ese enfoque, les dejo un enlace para descargar 7 plantillas CSS multi-columna flexibles esta son perfectamente compatibles para navegar via iPhone y iPod Touch.

Características:

• No utilizan hacks
• Compatibles con iPhone y iPod Touch
• Optimizadas para SEO
• Sin imagenes
• Sin javascript
• Texto escalable

Enlace: Perfect mulyi-column CSS liquid layouts

YAML Builder es un completo constructor de plantillas CSS en linea totalmente gratuito, el cual te permite crear plantillas web muy personalizadas, entre las características que puedes controlar estan:

• Numero de Columnas
• Dimensiones de las capas
• Divisiones
• Formato de Menus
• Tipo de doctype
• Librerías Javascript para soporte Cross-Browser
• Descargar el código CSS y HTML por separado

Todo esto en una interfase muy clara y amigable, el resultado de tus plantillas es de plantillas flexibles a diferentes resoluciones, un articulo que va muy bien con YAML es el presentado en Smashing Magazine donde se habla de la tendencia a crear plantillas flexibles y donde recomienda YAML.

Enlaces:

• YAML Builder
• Flexible Layouts

CSS 4 Free en un sitio mas donde podrás descargar alrededor de 90 plantillas CSS gratis bajo licencia Creative Commons 2.5, ay varios estilos y no son los mismos que encuentras en otros sitios dedicados a los mismo.

Enlace: CSS4Free

Free CSS Templates es un excelente sitio donde te encontraras con una excelente colección de plantillas CSS para descargar completamente gratis.

No diseños no lo confundas, las plantillas o templates son la base para incrustar tu diseño algo así como los CSS Grids, pero mas sencillo.

Enlace: Free CSS Templates