Nuevo diseño responsive del blog Pa Monísima:Yo

Tener un blog de Blogger no significa que no se pueda lucir un diseño moderno y profesional, como el de un blog de Wordpress. En este post te muestro el nuevo diseño del blog Pa Monísima: Yo, al que he instalado y personalizado una plantilla premium responsive.

Si me sigues sabrás que a principios de Enero fue mi propio blog el que sufrió esta transformación, instalando la plantilla Voux de Themexpose. Tenía muchas ganas de dar el paso, pero por un motivo u otro lo iba dejando, hasta que un día me planté y lo instalé en una sola noche. Y no puedo estar más contenta del resultado, no sólo por la mejora del aspecto, sino también por una sensible subida en mi posicionamiento.

Es por este motivo que no dudé en partir de una plantilla premium para el rediseño del blog de Débora, Pa Monísima: Yo. Actualmente cualquier web o CMS (gestor de contenido como Blogger o Wordpress) presenta un código sumamente complejo en el que participan varios lenguajes de programación. Diseñar una web desde cero supone un gran trabajo, y es por eso que actualmente se suele partir de plantillas i/o frameworks donde una gran parte del código está ya hecho.

La elección de una buena plantilla de base es fundamental. Y para ello Débora y yo analizamos muy bien qué funcionalidades necesitabamos implementar en su blog.

Evidentemente el nuevo diseño debía ser responsive, es decir que se viera bien en cualquier dispositivo/pantalla. También teníamos claro que mantendríamos el aspecto de blog tradicional, con una columna lateral (sidebar) y una página de inicio sencilla.

El blog de Débora es el escaparate de sus creaciones: detalles y complementos hechos a mano en muy diversos materiales y técnicas, fieltro y ganchillo principalmente. Tiene una tienda en construcción, y un catálogo pendiente. Y es que uno de los puntos débiles de su anterior diseño era la dificultad de hacerse una idea de todas las monerías que crea.

En este sentido le sugerí crear un menú con subcategorías para filtrar sus creaciones según destinatarios: bebé, niños, mujeres y hogar. Y complementarlo con un menú secundario en la sidebar con etiquetas más concretas. Esto exige un trabajo de redefinición de etiquetas, de momento pendiente pero que muy pronto estará completado.

Por otra parte Débora es muy activa en varias redes sociales, y por tanto la presencia de botones y gadgets sociales en la plantilla debía estar asegurada.

Teniendo todo esto en cuenta escogimos la plantilla Minimal de Themexpose. Ésta posee un menú fijo desplegable muy completo, con iconos de redes sociales y buscador. Además de tener un diseño limpio y moderno.

La plantilla en si ya es plenamente funcional y solamente necesita ser instalada y traducir algunos de sus elementos. Aún así añadí directamente una serie de funcionalidades nuevas que pacté con Débora:

• Botones de redes sociales en el footer
• Botón de subir arriba flotante
• Carrousel con las fotos de Instagram en el footer
• Botón de compartir en Google +
• Botón pin-it al pasar por las imágenes del post
• Páginas estáticas sin sidebar
• Tablas responsives en dos, tres y cuatro columnas editables desde el panel de control edición de entradas
• Formulario de contacto responsive
• Aumentar las entradas relacionadas mostradas de 3 a 5

Además revisé e introduje el código imprescindible para mejorar el SEO y permitir que el blog se posicione mejor en su temática.

Aunque el trabajo más completo fue su personalización. Constituyó un reto para mi poder borrar el aspecto un tanto frío de blog de moda de la plantilla. En este sentido la aportación de Débora fue esencial. El logo o imagotipo, una simpática monita, es de su creación, y ella aportó también las cintas rosas así como ideas de estilo como el uso de textura téxtil y pespuntes que ya existían en su anterior diseño. A partir de aquí fui configurando la nueva imagen, puliendo y armonizando todos los elementos en juego: tipografías, colores y formas.

Antiguo diseño de Pa Monísima: Yo

Nuevo diseño responsive

Entre otras cosas se modificó mediante CSS:

• La barra de información de cookies, que se envió al pie de la pantalla y se redujo su tamaño.
• La cabecera anterior se redujo para adaptarla al móvil, optimizar el espacio y permitir mostrar el principio de las entradas.
• Se aportó un toque de estilo a la foto de presentación, retocando el encuadre y exposición, y colocándola sobre un fondo de tela.
• Se creó una guía de estilo para aplicar en las entradas, con cuidado diseño de encabezado y destacados, aplicables de manera automática desde el editor de entradas. Se definió la etiqueta que crea una fina línea de separación, y la decoración de las tablas responsive.

En todos estos cambios se fueron introduciendo las modificaciones necesarias para que se vieran bien en la gran mayoría de dispositivos y pantallas. Una odisea de cambios y pruebas, pero con llegada a buen puerto.

¿Qué opinas? ¿Aún no le has echado un ojo? Pues ve ahora mísmo al blog de Débora! ¡Tus apreciaciones serán muy bienvenidos abajo en los comentarios!

SUSCRÍBETE A MI NEWSLETTER Y RECIBE GRATIS:
guía para escoger y usar tipografías
catálogo de las mejores familias tipográficas de Google Font