Mostrando entradas con la etiqueta Plantillas. Mostrar todas las entradas
Mostrando entradas con la etiqueta Plantillas. Mostrar todas las entradas

Nuevo diseño del blog

Captura de pantalla del nuevo diseño del blog.

Legibilidad, agilidad y espacio en blanco son las principales características de la versión 3 de la plantilla.

Aún no está completa al 100%, le faltan algunos detalles y está llena de bugs que iré corrigiendo con el tiempo mientras siguen apareciendo otros, pero estoy muy satisfecho con el resultado hasta ahora y quiero compartirlo con todos aquí.

Plantilla Base Adaptable

Esta es mi Plantilla Base Adaptable. Es bastante sencilla y sirve de punto de partida para crear plantillas adaptables más completas. Vean la demo y cambien el tamaño de la ventana de su navegador para verla en acción.

Demo Descargar

HTML5 y Blogger

Hace algún tiempo las "Plantillas de diseño" de Blogger fueron actualizadas para incluir html5 en su código, lo usan moderadamente, pero lo usan. Y si hablamos de las más nuevas, las de "Vistas Dinámicas", también están hechas en html5 y, aunque aún no son editables, algún día lo serán y hay que estar preparados.

En una entrada anterior explicaba las nuevas etiquetas del html5, sus funciones y cómo implementarlas. Es algo muy básico, solo explica las etiquetas más relevantes con definiciones que parecen sacadas del diccionario. Pero mientras la escribía me surgieron unas preguntas:

¿Qué tanto soporta Blogger el html5? ¿Cómo puedo implementarlo en mi blog? ¿Qué limitaciones hay?

Con motivo de responder estas preguntas, decidí crear una plantilla usando html5. Porque para aprender, nada mejor que la experiencia propia.

Plantilla Base Simple Blogger

Antes de desarrollar el código de una plantilla siempre seguía los mismos pasos.

  1. Elegir una plantilla base de Blogger.
  2. Borrar las variables.
  3. Eliminar la Navbar.
  4. Comentar el código.
  5. Hacer más legible el CSS.
  6. Implementar un sistema de cuadriculas.
  7. Agregar un borde a los elementos principales para diferenciarlos.
  8. Y ahora si puedo crear mi plantilla.

Por eso decidí crear una plantilla base con los ítems anteriores ya implementados en ella, solo para facilitar mí trabajo.

Para la cuadricula utilicé el sistema de 960 Grid System, que creo que es el que tiene el paquete más completo (CSS, plantillas demo, «sketch books» y una herramienta muy útil que se instala en los marcadores).

También creé unas entradas predeterminadas con todo lo que necesito para hacer pruebas (imágenes, listas, blockquotes, códigos, etc.). Así solo tengo que importarlas desde mi PC al blog cada vez que las necesite.

Demo Descargar