Características

• 3 Columnas.
• Menú con páginas estáticas.
• Configuración de colores desde el panel.
• Comentarios en el footer totalmente adaptados.
• Formulario en la misma página y excelente soporte de avatares.

Descargar

Blogger: Descargar | Demo
WordPress: Descargar | Demo

Instalación

Para instalarla consulta el videotutorial y nuestra miniguía de instalación. Además puedes leer nuestras preguntas frecuentes y enterarte de los problemas más comunes y su solución.

Configuración

1. Twitter

En el código de la plantilla (Inicio → Diseño → Edición de HTML) busca la siguiente URL:

http://twitter.com/btemplates

Y reemplázala con tu propia URL de twitter.

2. Menú

Para agregar enlaces al menú, solo crea una página estáticas desde el panel.

Licencia y condiciones de uso

Licenciado bajo Creative Commons Attribution-Share Alike 3.0. Uso en sitios personales y comerciales permitido dejando intactos los créditos de diseño (sin quitar o agregar enlaces en los créditos).

Free PSD Theme es un iniciativa del diseñador Dany Duchaine, que libera de forma gratuita el archivo fuente para Photoshop (PSD) o el código HTML de sus temas premium para WordPress. De este modo puedes codificarlo y usarlo de forma totalmente gratuita en proyectos personales y comerciales.

Además de usarlo como diseño completo, estos archivos pueden ser un buen repositorio de elementos web como botones, menús, formularios, etc. Actualmente hay 7 diseños en descarga directa.

Este modelo de regalar el archivo fuente (PSD o HTML) y vender una versión terminada es muy interesante. Se ganan enlaces, donaciones y reconocimiento por los archivos gratuitos y dinero con la venta del producto terminado.

Como sea, material de buena calidad para echar mano.

Sitio: freepsdtheme.com

Características

• 2 o 3 Columnas.
• 3 zonas para gadgets.
• Cuadro de estatus de Twitter.
• Menú con páginas estáticas.
• Marcadores sociales en páginas individuales.
• Tipografía Lacuna Regular en títulos (javascript).
• Configuración de colores desde el panel.
• Bordes redondeados con imágenes (ya saben, por IE).

Descargar

Blogger: Descargar | Demo
WordPress: Descargar | Demo

Instalación

Para instalarla consulta el videotutorial y nuestra miniguía de instalación. Además puedes leer nuestras preguntas frecuentes y enterarte de los problemas más comunes y su solución.

Configuración

1. Twitter

En el código de la plantilla (Inicio → Diseño → Edición de HTML) busca la siguiente URL:

http://twitter.com/btemplates

Y reemplazarla con tu propia URL de twitter.

Ahora buscar:

btemplates.json

Y reemplazar btemplates con tu propio nombre de usuario en twitter.

2. Menú

Para agregar enlaces al menú, solo crea una página estáticas desde el panel.

Licencia y condiciones de uso

Licenciado bajo GPL Uso en sitios personales y comerciales permitido dejando intactos los créditos de diseño, iconos y vectores (sin quitar o agregar enlaces en los créditos).

Es así como después de años de peticiones de sus usurarios, Blogger lanza un diseñador de plantillas nativo.

¿Qué es el diseñador de plantillas?

Esencialmente es una sección del panel desde donde se pueden personalizar las plantillas desde Blogger in Draft.

Inicio (draft.blogger.com) → Diseño → Diseñador de plantillas.

Desde el diseñador se puede personalizar:

• La imagen o color de fondo.
• Color, tamaño, estilo y familia de la tipografía, bordes y fondo.
  • Número y ancho de las columnas.
  • Un pequeño panel para agregar reglas CSS.

Ventajas y desventajas

Lo más novedoso quizá sea el control sobre la estructura del diseño en un ambiente muy sencillo. Las opciones de tipografía se amplían y se agregan cientos de imágenes para usar como fondo, provenientes de istockphoto. Soporte a páginas estáticas para usar como menú.

En contraparte, solo existen 15 plantillas para usar como base y al ser diseños muy flexibles, son también muy sencillos y sin soporte total para Internet Explorer (que también puede interpretarse como ventaja). Hacer modificaciones más allá de la capacidad de esta herramientas también se hace más complejo, pues hay que convivir con nuevas y copiosas variables por todas partes.

Notas

Las plantillas actuales funcionan normalmente, pero al no estar preparadas para el diseñador de plantillas de Blogger, no pueden personalizarse mediante este.

Los gadgets o widgets siguen siendo manejados desde el panel de "Elementos de página".

Conclusiones

El diseñador de plantillas me parece una buena herramienta, fácil de usar y posibilidades muy grandes de personalización, cubrirá sin duda, las necesidades de muchos de sus usuarios que hasta ahora se quedaban con los diseños por defecto.

Al final, es una evolución del editor de fuentes y colores.

¿Ya lo probaste? ¿Qué te parece?

Fuente: Blogger in Draft

1. Vector Social Media Icons

Otro gran paquete de iconos de Icon Dock, como su nombre indica, se enfoca en servicios sociales, abarcando a los más importantes. Realmente de gran calidad.

↓ Descargar iconos / Licencia de uso: No vender, no distribuir directamente.

2. Massive Web UI & Button Set

Increíble paquete con botones, separadores (breadcrubs), formularios y cajas en formato PSD y PNG con gran calidad.

↓ Descargar iconos / Licencia de uso: Permitida comercial y personal. No vender, no distribuir.

3. Shine iconset

38 iconos en tres dimensiones muy realistas.

↓ Descargar iconos / Licencia de uso.

4. Chalkwork Payments

Un paquete de iconos perfecto para sitios de comercio electrónico, con monedas, tarjetas de crédito y otras formas de pago como Paypal. Son 21 diferentes, en varios formatos y tamaños.

↓ Descargar iconos / Licencia de uso.

5. Colorful Stickers

Es un serie de varios paquetes de iconos estilo stickers diseñados por Dryicons. En total, más de 120 iconos gratuitos.

↓ Descargar iconos: 1, 2, 3, 4, 5, 6 / Licencia de uso.

6. Android Icons

Iconos pensados para los desarrolladores en Android, pero que por su calidad pueden usarse perfectamente en cualquier ramo del diseño. Son 30 iconos en formato PNG y EPS.

↓ Descargar iconos / Licencia de uso (cc).

7. Iconic

Paquete minimalista con 103 iconos de gran estilo. Disponibles en formato PNG y SVG, en 14 diferentes colores y 5 tamaños distintos.

↓ Descargar iconos / Licencia de uso (cc).

8. Sketching & Wireframing Kit

Paquete de elementos de diseño para bosquejar tus ideas en papel o en web directamente. Contiene todos los elementos web principales y esta disponible en formato PDF, SVG, AI, y EPS

↓ Descargar paquete / Licencia de uso: Permitida comercial y personal. No vender, no distribuir.

9. Web Form Elements

Elementos para formularios con un toque muy elegante. Disponibles en PSD para sacarles provecho directamente en tu HTML.

↓ Descargar iconos: 1, 2 / Licencia de uso (cc).

10. Mono Icons

Paquete con 108 iconos monocromáticos, minimalistas y muy elegantes para diseño web.

↓ Descargar paquete / Licencia de uso: Permitida comercial y personal. Atribución, no distribuir.

Postre: 11. Yummy

20 Iconos para el desayuno

↓ Descargar iconos / Licencia de uso.

Y para tener una base al iniciar un diseño se han hecho un buena cantidad de plantillas imprimibles:

960 Grid

Del famoso framework del mismo nombre, que uso –a medias- en el maquetado de este sitio. Hay plantillas para uno o varios bosquejos en la misma página y siempre con espacio para notas.

↓ Descargar plantilla.

Paper browser

Plantillas de un navegador web escalado a 1024px de ancho y con una cuadricula que te permitirá llevar los valores directamente a Photoshop. Diseñado por Behance.

↓ Descargar plantilla vertical.
↓ Descargar plantilla horizontal.

6 A la vez

Una plantilla ideal para hacer el bosquejo de hasta distintas 6 esquemas de contenido pero sin entrar mucho en detalle. Diseñado por nunile.

↓ Descargar plantilla PDF.

Wireframe template

Sencilla pero elegante plantilla para presentar bosquejos. Creada por Alfonso Bozzelli.

↓ Descargar plantilla PDF.

iPhone App Wireframe Template

Excelente plantilla para bosquejar versiones móviles de un sitio web o aplicaciones directamente diseñadas para el iPhone. Diseñada por full of design.

↓ Descargar plantilla horizontal.
↓ Descargar plantilla vertical.

iPhone Wireframe Templates for Sketching

Si crees que la plantilla anterior es más de lo que necesitas, esta versión de Evan K. Stone te vendrá mejor en tu incursión con el diseño en celulares.

↓ Descargar plantilla horizontal.

Conclusión

Sea que uses plantillas o no al iniciar tus diseños, siempre es buena idea iniciar en papel, es una de los primeros medios con que aprendimos a comunicarnos y la naturalidad de su uso hace que te enfoques solo en lo que quieres hacer. Además, ¿no se antoja siempre rayar una hoja en blanco?

Teniendo esto en mente, me he dado una vuelta por BTemplates (mi sitio favorito para plantillas de Blogger desde antes de escribir por aquí) y he seleccionado 9 plantillas bajo los siguientes criterios:

• Que tengan el fondo blanco (sólo hay una excepción: no me pude resistir).
• Que tengan una sola barra lateral (también hay una excepción que me fue irresistible).
• Que no tengan imagen de cabecera o que apenas destaquen (para no ser menos, también puse otra excepción).

Si tienes dudas acerca de la instalación de plantillas en Blogger, puedes revisar el videotutorial de Patricia Pilar, la miniguía publicada por aquí hace un tiempo o la entrada sobre Preguntas Frecuentes acerca de este tipo de plantillas.

Showoff Light

Think Simple

Whiteness

The Journalist

Árbol

Kiss

Miniml

Stripped

Ser Photoblogger