El diseño de los blogs famosos

por Andrés Borbón el 27 July, 2008

en Blogueradas

El blog Smashing Magazine ha realizado un interesante estudio para determinar cómo es el diseño de los 50 blogs más importantes en la lista de los más enlazados de Technorati.

Desde mi punto de vista, sus resultados no deben ser tomados en cuenta con demasiada seriedad para decidirnos sobre el diseño que más nos favorece a nosotros. Como bien saben los que se dedican a estos menesteres, el diseño web no es una serie de reglas, como una receta de cocina. La coherencia, el significado y la eficiencia se consiguen tomando en cuenta el tema del blog, sus lectores, la tecnología que utiliza y las preferencias de los autores. Yo diría que la palabra clave es “armonía”.

De todas formas, es interesante descubrir qué decisiones de diseño han tomado “los grandes”.

DISEÑO

1) Número de columnas:

  • El 58 por ciento usa un diseño con 3 o más columnas
  • 42% utiliza un diseño de 2 columnas.

2) Diseño centrado o cargado a la izquierda

  • El 94% de los 50 blogs más importantes usan un diseño centrado en la ventana del explorador

3) Diseño Fluido, Elástico o Fijo.

  • El 92% de los blogs estudiados usa un diseño con ancho Fijo.

4) Ancho del diseño (en los diseños fijos)

  • 56% con ancho de 951 a 1000 pixeles
  • 20% con ancho de 900 a 950 pixeles
  • 15% con ancho de 801 a 900 pixeles
  • 9% con ancho de 800 pixeles o menos

5) Proporción entre el ancho total y el ancho destinado al contenido.

  • 96% de los blogs dedican la mitad (o más) del ancho total al contenido
  • 54% dedican entre el 50 y el 60% del ancho total al contenido
  • 46% dedican entre el 60 y el 70% del ancho total al contenido.
  • En promedio, los blogs usan el 58% del ancho total para el contenido

6) Diseño con CSS o con tablas

  • El 90% usan CSS

TIPOGRAFÍA

1) Fondo Negro vs Fondo Oscuro

  • El 98% usan texto negro sobre un fondo blanco.

2) Caracteres por línea

Varios estudios confirman que el número de caracteres por línea debe encontrarse entre los 52 y 68 caracteres (tomando en cuenta signos de puntuación y espacios en blanco. Sin embargo, los resultados de los blogs arrojan resultados algo distintos:

  • 10% usa 65 a 74 caracteres por línea
  • 18% usan 75 a 84 caracteres por línea
  • 34% usan 85 a 94 caracteres por línea
  • 18% usan 95 a 104 caracteres por línea
  • 16% usan 105 o más caracteres por línea

3) Fuente:

  • 34% usan Verdana
  • 24% usan Lucida Grande
  • 18% usan Arial
  • 14% usan Georgia
  • 6% Usan Trebuchet

4) Tamaño de la fuente

  • 34% Usan 12 pixeles
  • 30% Usan 13 Pixeles
  • 14% usan 14 pixeles
  • 12% usan 11 pixeles
  • 4% usan 15 pixeles

5) Fuente para los títulos de las entradas

  • 30% usan Arial
  • 22% usan Georgia
  • 8% usan Lucinda Grande
  • 8% usan Helvética
  • 6% usan Verdana
  • 6% usan Trebuchet
  • 4% usan Helvetica Neue

6) Tamaño de las letras del título:

  • 24% usan 20 a 22 pixeles
  • 22% usan 23 a 25 pixeles
  • 22% usan 17 a 19 pixeles
  • 16% usan 14 a 16 pixeles
  • 6% usan 26 a 29 pixeles

CONCLUSIÓN:

En esta primera parte del estudio, resulta evidente que los blogs más famosos utilizan:

Un diseño hecho con CSS de 3 columnas, centrado, con un ancho fijo que se encuentra entre los 951 y los 100 pixeles, de los cuales por lo menos el 58% se destina al texto, con letras oscuras sobre un fondo claro, con 85 a 94 caracteres por línea. La fuente preferida es Verdana de 12 pixeles y para los títulos de las entradas la fuente preferida es Arial de 20 a 22 pixeles.

Artículos Relacionados

  • Artículos Relacionados
 
Suscríbete por: Email | RSS | Twitter
  • Imprime este Articulo!
  • Envialo por E-Mail a un amigo!
  • Meneame
  • del.icio.us
  • Facebook
  • Twitter
  • Bitacoras.com
  • Live
  • FriendFeed

{ 3 trackbacks }

El diseño de los blogs famosos
27 July, 2008 at 2:44 pm
Mundo Enfermo
31 July, 2008 at 8:34 pm
El diseño de los blogs famosos II | Tecnoculto
6 August, 2008 at 8:00 pm

{ 6 comments… read them below or add one }

1 MnS 27 July, 2008 at 12:24 pm

Interesante estudio
por parte de SM!…

Se fijo hasta en los
más mínimos detalles…!

Yo nunca le prestaría
atención a cuántos
caracteres usan por línea,
ni de qé tamaño son…

Muy interesante & bien
elaborado!…

2 Andrés Borbón 28 July, 2008 at 9:36 pm

@MnS: Sí, a mí me pareció interesantísimo. Llama la atención que la mayor parte de los blogs famosos usen pocos de los recursos del diseño web más moderno, como los diseños fluidos o elásticos, y que elijan la tradicional combinación de fondo blanco y letras oscuras.

3 León 11 September, 2008 at 8:28 pm

Lo que pasa es que no hay nivel xD! jeje

=P por aca solo repasando.

Por cierto le pusiste en la conclusión 100px en lugar de 1000 ;)

les voy a enseñar a estos novatos un nuevo estilo, lo llamaré gelatinoso :) xD!!!

=P

4 León 11 September, 2008 at 8:29 pm

Por cierto Andrés… que vas a hacer cuando tu contador llegue a 999999?

5 Andrés Borbón 11 September, 2008 at 10:05 pm

@León: Je, je. Estaría bueno

6 Andrés Borbón 11 September, 2008 at 10:07 pm

@León: Me voy a tomar una cerveza y a fumarme un puro para celebrarlo. Je, je. No sé, la verdad. Tal vez ponerle un 1 antes de la imagen. Je, je.

Leave a Comment

Post Anterior: Posts patrocinados y Bloggers predicadores

Post Siguiente: El matrimonio homosexual en Costa Rica