Si sois lectores habituales del blog y lo habéis visto alguna vez vía web, no a través del RSS, habréis visto que he hecho algunos pequeños cambios de tipo estético, que aun siendo menores, creo que han quedado muy bien y que hacen que el blog sea más bonito.
Seguimos con un sistema de rejilla
Tanto ahora como antes, el blog sigue utilizando un sistema de rejilla o grid system de 16 columnas, para hacer más fácil la alineación de elementos, como se puede ver en la imagen, con un ancho total del contenedor de texto de 940px.
Lo que he cambiado principalmente es la distribución de las columnas, ya que ahora la caja de búsqueda además de estar a la misma altura que el menú de navegación (antes estaba a la altura del título del blog), ha pasado de una columna a 4, con lo que la diferencia es muy notable y queda mucho más visible y usable, que al fin y al cabo es de lo que se trata.
En cuanto al contenedor principal, la distribución de columnas sigue siendo asimétrica, aunque ahora es de 4-10-2, en lugar de las 3-11-2 de antes, pero ahora os cuento más cosas de esto.
El menú de navegación
Desde que reestrené el blog, el menú de navegación se había quedado casi sin tocar respecto a la plantilla que utilizo, que no es que estuviera mal, pero no me terminaba de convencer. En primer lugar, en la plantilla el menú estaba dentro de un contenedor centrado para él sólo, lo que hacía que quedara separado del resto de elementos del blog y, sobre todo, ya que había puesto unos márgenes arriba y abajo al cuerpo del blog para que pareciera una hoja de color blanco sobre un fondo gris, en la cabecera esto no se veía.
Lo primero que hice fue integrar el menú dentro del contenedor centrado donde ya estaban el resto de elementos del blog y quitar ese contenedor extra que ahora ya no me servía de nada. Con esto, ya conseguí que se viera el blog más parecido a lo que yo quería, pero el menú seguía teniendo dos líneas de texto, y cada opción seleccionada un borde superior de color naranja, y yo quería algo más minimalista.
Así que quité esa segunda línea de texto, porque, ¿para qué tener un enlace que decía «archivo – vista al pasado», si con «archivo» ya bastaba? y eliminé ese borde superior para simplemente mostrar el enlace que tenía el cursor encima con un color diferente, el mismo que el del elemento que estamos visualizando en cada momento. Creo que sigue siendo igual de claro que antes, pero queda mejor.
Redistribuyendo la información
Quizás los cambios más importantes están en el contenedor principal, donde se muestran las entradas, porque antes, por encima del borde superior que separaba unas entradas de otras, no había nada, mientras que ahora he añadido la fecha alineada a la izquierda y los plugins sociales a la derecha.
El cambio de la fecha ha estado motivado porque al pasar el contenedor izquierdo de 3 a 4 columnas, tenía demasiado espacio para simplemente mostrar la fecha con una cajita como si fuera una hoja de calendario, pero claro, esto me dejaba esas 4 columnas libres.
En la plantilla original había un footer con información de las categorías y etiquetas, pero yo lo quité, así que el único sitio en el que se veían, además de la sección «Archivos», era al final de cada entrada y no me terminaba de convencer, sobre todo porque muchas de mis entradas son largas con muchas fotos, así que otro de los cambios ha sido mover la información de categorías y etiquetas a esas 4 columnas a la izquierda que he liberado.
A la derecha, donde está la información del número de comentarios, he mantenido las 2 columnas que había antes, pero he quitado el plugin social que estaba utilizando porque, en la vista de entrada única, al estar alineado en columna, necesitaba un primer párrafo muy largo para que si ponía imágenes muy anchas los contenidos del plugin social no se solaparan. Además, como ese plugin no muestra los contadores en la página de inicio del blog, me quedaba feo y desalineado, y no me terminaba de convencer.
Más importancia a las imágenes
Esto ha hecho que el contenedor de texto de las entradas pase de 11 columnas a 10, es decir, de 640px a 580px, lo que también me ha gustado más de cara a darle más importancia a las imágenes.
Una de las cosas que más me gustó de la plantilla era que venía ya lista para hacer que las imágenes rompieran los márgenes del texto, que aunque es algo muy sencillo de hacer con CSS, cuando no tenía muy claro qué apariencia quería que tuviera mi blog, necesitaba algo que visualmente me llamara la atención desde el primer momento.
Muchas de las imágenes las pongo a 940px, así rompen los márgenes por ambos lados y quedan estupendas, pero cuando la entrada no es tanto fotográfico como de información, utilizaba uno de los tamaños intermedios que me ofrece Flickr, el de 640px, y claro, con un contenedor de texto de esa misma anchura, se perdía un poco la gracia.
Al haber hecho el contenedor de texto un poquito más estrecho, sin cambiar las imágenes, éstas ahora ya rompen el margen del texto y queda más visual. De hecho, todas las imágenes de esta entrada tienen un ancho de 640px, y como podéis ver, todas rompen el margen izquierdo del texto.
¡Espero que os gusten los cambios tanto como a mí!
