Gracias a un tuit de Julieta Lionetti decidí escribir esta entrada sobre el uso de tipografía en los blogs.
Digo decidí porque hace rato que este tema rondaba en mi cabeza y nada mejor que exponerlo aquí. Y me rondaba, sobre todo, porque me gusta saber si mi blog se lee adecuadamente.
Si bien esta entrada no tiene relación directa con hacer libros sí lo tiene con parte del alma de ellos: la tipografía, las fuentes y las letras.
Por supuesto, a todos nos interesa que nuestras bitácoras sean visitadas y leídas. ¿Por qué? Porque queremos que nos lean y si se hace sin dificultad aumentará las ganas de seguir siendo leídos.
Además, si gusta lo que dice, cómo se dice y la experiencia de usuario es agradable nuestros artículos se compartirán en las redes sociales.
Seamos autores o profesionales del sector del libro, o de cualquier otro, debemos preocuparnos por la famosa marca personal. Cuidar de nuestros sitios web e imagen en redes sociales es parte de ello.
Vamos, que hablamos de marketing y promoción de nuestro trabajo y de nuestros libros. ¡Para nada una nimiedad!
Lo que sí comparten libros y blogs, y cualquier pieza o composición que contenga texto, es la legibilidad tipográfica.
Y este es un factor vital que se debiera respetar si queremos ser leídos. Tanto en el diseño editorial como en el diseño web la legibilidad es elemental.
En el diseño, como en todas las disciplinas, hay tendencias que se convierten en moda. Así, hubo épocas en las que se escribía sin una sola letra mayúsculas y otras en las que los textos de las piezas gráficas eran diminutos y había que entrecerrar los ojos para poder leerlos.
¿Habrá llegado hoy la moda del color gris pálido para los textos a las páginas web y blogs? 😆 Recuerda: ¡la legibilidad es un clásico! Jamás pasa de moda.
La legibilidad de la tipografía en los blogs y páginas web
Hay al menos tres principios básicos de la legibilidad que aplican tanto para una pantalla como para el papel:
- El contraste entre el color del fondo y el color de la letra o del objeto.
- El tipo de fuente que se elija.
- El tamaño y el peso de los caracteres de esa fuente.
Por tanto, algunos supuestos que arriesgo son:
1. Cualquier letra en color gris se ve menos sobre fondo blanco que una en color negro.
2. Los caracteres pequeños presentan más dificultad para ser leídos que los grandes.
3. Las letras finas pierden un poco de visibilidad frente a las variantes con trazos más grueso.
4. Una letra sans serif es mejor que una serif para un blog.
5. Los textos son mejor interpretados si no se usan cursivas.
6. Los fondos que no sean blancos entorpecen la lectura.
¿Hasta qué punto es así?
Ninguna regla es exacta e inamovible para obtener legibilidad en nuestros textos. Depende de cómo se combinen los tres principios mencionados arriba obtendremos resultados más buenos o no tanto.
Por ejemplo, en el supuesto 1 los textos en gris oscuro funcionan igual de bien que si van en negro; aunque para ello deben tener un tamaño aceptable y mejor si es una fuente paloseco. Un gris claro sobre fondo blanco pierde la partida…
En 2, si por pequeño entendemos 10 px, sí, definitivamente, costará leer el texto. Pero si por pequeño pensamos en 14 px y la fuente es una Sans no habrá inconvenientes.
El supuesto 3 dependerá de la fuente elegida y de cuán fina sea; es decir, del peso de la tipografía que tenga, de cuán delgada o rellenita sea.
En 4 dependerá del tamaño de la letra y de la una tipografía con serifa elegida. Hay páginas web con fuentes romanas que tienen suficiente tamaño para ser leídas sin problema en pantalla; ayuda si el color es negro o un color oscuro.
El 5 está supeditado a la cantidad de texto: una entrada entera en cursiva es un agobio; no si es una frase, cita o texto corto y tampoco lo es para determinadas palabras en los párrafos.
Y en 6 podría ser siempre que el color de fondo sea bien tenue y mantenga el contraste con los párrafos.
La clave está en encontrar el balance; en hallar el equilibrio entre buena experiencia de lectura y lo que nos gusta para nuestro blog.
Sí hay algunas cuestiones que dificultan la lectura hasta llegar a imposibilitarla; por ejemplo:
- los fondos de los páginas web con texturas, con imágenes (¡peor si son gif!) o ilustraciones;
- las mezclas tipográficas sui generis y los textos rebosantes de colores;
- todos los textos en cursiva o en mayúsculas, incluso los textos con cada letra inicial con mayúscula, y
- los párrafos con diferentes alineaciones, entremezclados y sin jerarquizar, entre otros.
Una forma de conocer la tipografía en los blogs es usando la herramienta WhatFont. Este es un ejemplo hecho en Lenguaje CSS, que tiene una legibilidad tipográfica excelente.
No podemos contentar a todos nuestros lectores y tenemos que aguantárnoslo
Más de una vez me han preguntado qué fuente uso en esta página web. Cuál es la de los títulos y cuál la del cuerpo de las entradas, y a qué tamaño está.
Hace un par de años decidí usar Raleway para todos los textos del sitio. El tamaño ha ido variando y ahora está a 18 px, con una altura de línea de 25 px. (No confundir la altura de línea [line-height] con la altura de x).
El color de los textos no es cien por cien negro, sino casi negro: #151515; (puedes ver la composición en diferentes espacios de color aquí).
Hay personas a las que esta fuente, que tiene un peso (font-weight) de 500 en este blog le parece demasiado fina. Pero a la gran mayoría les parece adecuada y, por tanto, decidí dejarla así.
Vale aclarar que la plantilla base de Elegant Themes no venía con esta fuente por defecto sino con Nunito. La cambié yo cuando vi que algunos blogs con mucho tráfico la estaban usando y me gustaba cómo se leía.
Y también cambié más cuestiones tipográficas, espacios y colores, en los estilos CSS para que se vea como yo quiero.
Cuando un par de lectores cuestionaron la fuente de este blog hice una encuesta en Twitter. Un 80 % de quienes la respondieron dijeron que el blog se leía bien. Y entonces dejé la fuente con las características descritas.
No todos los gustos son similares ni todos los ojos ven lo mismo 😉 . Pero no te preocupes, que hay un par de soluciones a la vuelta de la esquina.
Ejemplo de cómo podría visualizarse este blog abusando de la palidez y cómo se ve ahora en un ordenador.
En definitiva, no podemos contentar a todos los lectores. Sin embargo, sí podemos ofrecerles una alternativa para que nos lean a su gusto.
Ajustar la tipografía en los blogs como nos dé la gana
Podemos sortear problemas de visualización de tipografía en los blogs que nos agradan, pero nos cuesta leer, con aplicaciones de lectura.
Otra opción es aumentar la vista de la página web y adaptarla a la pantalla en la que leemos.
Aplicaciones de lectura para adaptar los textos a nuestro gusto
Hay varias aplicaciones de lectura que permiten ajustar la fuente de los artículos que leemos. Entre ellas, Instapaper, Evernote, Raindrop, Tagpacker, y muchas otras. Yo uso Pocket.
Pocket me resulta muy práctica, sobre todo, porque guardo los artículos para leerlos en otro momento. Y puedo hacerlo tanto en el ordenador como en el móvil o la tableta.
Es más, hago que Pocket me lea los artículos; sí, la voz no es la mejor del mundo pero la cuarta entrada te acostumbras y puedes leer/oír más contenidos.
Con Save to Pocket como complemento de Google Chrome o Firefox es muy fácil guardar artículos. Solo un clic en el icono y el contenido queda ya disponible en la aplicación.
También porque me permite esquivar la publicidad revoloteando a los costados de los textos y las ventanas emergentes. Además, su diseño es minimalista al extremo y me encanta.
En el ordenador, la aplicación solo da tres posibilidades de cambio de tipografía en los blogs y webs que se visualizan. ¡Pero son más que suficientes! (ver combinación de opciones). Pocket permite:
- Alternar entre una fuente serif y una sans serif.
- Reducir o aumentar el tamaño de la fuente.
- Cambiar el tema entre claro, oscuro y sepia.
Con estas tres características los textos de los blogs pueden ajustarse a nuestros ojos y antojo.
Diferentes opciones de visualización tras hacer cambios en la fuente, el tamaño y el fondo de Pocket en el móvil de esta entrada.
También utilizo Feedly, aunque en este caso lo hago más para organizar los blogs que sigo que para leerlos. Entre otras funcionalidades, en el móvil, con esta aplicación se puede:
- Cambiar entre fuentes sans serif en la versión gratuita y también con fuentes serif en la versión de pago; además de OpenDyslexic en sus dos planes.
- Reducir o aumentar el tamaño de la fuente en cuatro escalas.
- Cambiar el tema entre modo día y modo noche.
Si alguien que nos dice que nuestro blog no se lee bien podemos invitarle a descargar y usar algunas de estas aplicaciones. 😉
El recurso que más a mano tenemos y el que yo primero uso es el de Zoom en Chrome. El mismo nombre recibe en Explorer y Tamaño en Firefox.
Se trata de agrandar lo que vemos en la pantalla apretando Control y haciendo girar la ruedecilla del ratón hacia adelante. También funciona con Ctrl y el signo +. Según el navegador que uses funcionará una u otra opción o más de una.
Es cierto que no modifica el tipo de fuente ni da la opción de cambiar el fondo. Pero si solo es una cuestión de tamaño es la alternativa más rápida. De hecho, siempre tengo la vista de este blog a 110 % en mi ordenador principal.
Tengo pendiente hacer una nueva revisión de este sitio, pero en la lista de prioridades hay otros temas que le ganan posición…
Mientras, si quieres conocer más sobre legibilidad en blogs lee esta entrada de Silo Creativo y esta en Jimdo.
¿Estás pensando en trastear con el CSS de tu blog? Entonces, recomiendo que antes leas esta entrada y esta otra. No sea cosa que te cargues parte de tu web, como alguna vez he hecho yo con la mía… 😆
¿Qué fuente usas en tu blog? ¿Y qué tamaño tiene? ¿Qué otras aplicaciones usas para leer artículos?
Muy útiles los consejos. Yo seguí el primero que me diste sobre las cursivas y hace poco lo recordé más cuando vi en un libro, varias páginas en cursiva que me dañaron un poco la vista.
Gracias por tu comentario, Ernesto. Textos muy largos en cursiva se vuelven difíciles de leer, pero más aún si todo está en mayúsculas. Solo hay que ponerle a un documento estas características y corroborarlo. Saludos.
Cuando encuentro un texto en gris pálido sobre fondo blanco (o cualquier otra barbaridad) utilizo el inspector de estilo (en herramientas del desarrollador) para cambiarlo. En Firefox se abre con Ctrl+May+C; en Chrome Ctrl+May+I.
En cualquier navegador apretando la tecla F12 logras lo mismo. 😉 Gracias por comentar.
Muy buena entrada, y más con las aplicaciones recomendadas. Me interesan los temas editoriales y creo que la tipografía puede ser subvalorado, pero cómo importa frente a la comodidad para disfrutar de un libro. Para mí es tan importante que suelo evitar a toda costa libros con letras muy pequeñas o cuando se ve la página con el texto «amontonado», es casi un criterio a la hora de comprar un libro. Lamentablemente, hay libros que me veo obligado a leer pese al desastre tipográfico pues a veces necesito su contenido para estudiarlo, pero mientras pueda encontrar versiones más cómodas para la vista, mucho mejor. Por cierto, apenas es la segunda entrada que leo de este sitio y me ha encantado. Felicidades. Seguiré leyendo. Saludos.
Gracias a ti por leer mi blog y comentar. Deseo que más entradas te sean útiles. Saludos.
Buenos días,
Muchas gracias por el post.
Tengo una duda. Para publicar un capítulo en una entrada de mi blog, veo que por su extensión incomoda su lectura. Paral leerlo en línea, no se puede guardar con un punto como cuando lees un PDF en una app de lectura. ¿En el caso de querer publicar relatos y novelas en mi blog, es recomendable ofrecer la versión PDF para que sea más fácil su lectura?
Gracias de antemano y un saludo.
Depende. La comodidad de lectura dependerá de lo que quiera el lector: algunos prefieren leer en PDF, otros en EPUB, otros en HTML, directamente desde una web. Leer un PDF en un móvil, por lo general, es bastante engorroso, y más aún una novela. Por otro lado, es posible que lo que se lee en una app no sea un PDF, sino un archivo de otro tipo. Saludos.
Buenos días,
Gracias por la rápida contestación.
Con la App, independientemente que se lea en formato Word, PDF, u otro tipo de archivo, puedes guardar cómodamente el punto por donde lo dejaste. Por lo tanto, publicar los capítulos de una novela en las entradas de un blog, no tiene mucho sentido, si también ofreces la posibilidad de descargar los capítulos en PDF ¿no crees?
Gracias de antemano y un saludo.
Como casi todo: “depende”. Depende la app (muchas no aceptan Word ni PDF); depende del lector (tal vez quiera imprimir y el PDF le resulte más cómodo, o únicamente tiene software para leer PDF o solo sabe manejarse/usar PDF); depende de las posibilidades del cacharro tecnológico que tenga el lector, etc., etc. Las variables son muchas y diferentes. Si para ti es importante que se guarde el progreso de la lectura, toma una decisión basándote en ese aspecto y hazlo como consideres oportuno.
Ya que me preguntaste qué opino di mi parecer, pero no me convence el argumento, porque para mí las prioridades son otras: no leo libros en PDF a menos que sean de consulta, para el trabajo, y por la facilidad de búsqueda; una novela en PDF la descarto de plano: compro el libro impreso o la leo en digital.