Ajustando Khaducsti

He estado ajustando el diseño del blog a un sistema reticular más coherente que el de la plantilla original. Como ahora tengo que lidiar a diario con retículas, estoy aprendiendo a valorarlas y casi casi a utilizarlas :)

Desde un primer momento, el diseño de Khaducsti sigue un esquema fluído de maquetación. El contenido se adapta al ancho de la ventana manteniendo siempre las proporciones (que no las medidas) entre los elementos y sus distancias.

El primer paso a la hora de definir un sistema reticular para un site con dos zonas tan diferenciadas como éste (el contenido y la barra lateral), es valorar la importancia que ambos elementos deben tener en pantalla. En mi caso, teniendo en cuenta que la relación de usuarios nuevos por día es bastante alta (principalmente porque el blog es nuevo y los lectores habituales, que alguno hay, acceden vía RSS), decidí darle a la barra lateral un tercio del espacio total en pantalla. De esta forma, se puede acceder de un vistazo a la información principal del blog, que puede interesar a primeros visitantes, de manera mucho más cómoda. Además, la longitud de línea del contenido quedó reducida de 20 a 15 palabras, facilitando más la lectura (estimado a un ancho de 1024px).

Este primer paso compensó bastante las dos zonas de información principales. Las alineaciones horizontales se limitaban a ajustar el logo con respecto al campo de búsqueda y la sección “About” con el primer titular. Lo siguiente fue recolocar los elementos de la barra lateral.

En un principio, la barra lateral se disponía en una única columna. Los primeros elementos ocupaban sin problemas el ancho reservado, pero al llegar al listado de links, categorías y archivo, dejaban un espacio enorme a su derecha que descompensaba el diseño y alargaba demasiado el contenido. Algo tan sencillo como subdividir la barra en dos columnas (una vez sobrepasado el contenido principal) resolvió el problema de la economía de espacio y añadió un plus de coherencia a la jerarquía de los contenidos de esta sección.

Quizás puedan parecer ajustes poco significativos, a mí hasta hace unos meses también me lo parecerían, pero la verdad es que el resultado es un equilibrio mucho mayor entre los elementos y mucha más facilidad en la experiencia de lectura.

Al fin y al cabo, de eso se trata.

Recursos
Grid systems for web design: Part 1 (y siguientes!).
Si usas Fireworks, deberías echar un ojo a Reticulator, desde Sofá Naranja, y al resumen de su clase en el Programa Vostok.

  • Una de estadísticas

    Fuentes: Wikipedia y Pitchfork. No se tienen en cuenta los recopilatorios ni los recientemente editados "Archivos" pero sí los discos con...

  • Gráficas y prensa online

    Las gráficas de la prensa online son una de esas cosas que, sobre todo si eres diseñador, molan tela. Por lo general solían ser ejercicios de...

  • Los Antonios ya no van en tren.

    En la web de renfe, que es la peor web que cualquiera se puede echar a la cara, si entras desde Os X y Chrome (como mínimo, no sé si desde...


Di algo:

Marca esta casilla si quieres que te avise de nuevos comentarios en este post.