guia-uso-fuentes-css

La fuente juega un papel fundamental en el diseño de nuestro sitio web, ya sea su diseño interior o exterior. Esto es así porque de ella dependerá que un lector abandone la página por culpa de la ceguera de esta, o siga leyendo. (Esto se conoce como percepción del observador).

En esta entrada se resumen los conceptos más importantes para el buen uso de las fuentes en la Web y así poder lograr diseños de gran calidad.

Peso

El peso de una fuente consiste en el volumen o el peso que el visitante percibe sobre un texto o logo. Existen dos tipos: La fuente liviana consta de trazos finos, con mucho aire y zonas libres. Este tipo de fuente está dirigida más bien a tipos de pantalla específicos. La fuente pesada tiene mucho más volumen, es sólida y de trazos anchos, se podría decir que tiene pocos “huecos de aire” en sus formas. La fuente pesada se utiliza más bien en logotipos, carteles, títulos, etc. Un uso correcto del peso de la fuente nos dará mayor legibilidad a nuestro sitio web.

Constraste y color

Debe de existir una combinación entre el color de fondo, el color de composición y la fuente, así que debemos armonizar lo mejor posible estos tres para que el usuario se sienta cómodo en nuestro sitio web y no le dañe la vista. Lo ideal sería tener fondos claros y color de texto acorde al fondo para una adecuada lectura. A veces los colores intensos tanto en el fondo como en el texto quedan bien (Ejemplo: Cartel, banner publicitario), pero siempre se debe buscar una armonía.

Separación entre caracteres

Si existe poca separación entre cada carácter tendremos una difícil lectura rápida del texto. Si separamos cada carácter nos proporcionará una mayor velocidad de lectura rápida. Se recomienda que en formatos verticales se utilize poca separación de caracteres, mientras que en formato horizontal se utiliza una mayor separación de caracteres.

Interlineado

Si el salto de cada línea es muy grande entorpecerá la lectura y no podremos seguir bien el párrafo del texto (es decir, pasar de una línea a otra). Tampoco es recomendable tener una línea de texto con mucha longitud. Yo recomiendo establecer la longitud de cada línea de texto entre 500 píxeles y 600 píxeles.

Abuso de efectos (y conclusión)

No se debe abusar de efectos en las fuentes (Por ejemplo, véase blink y otros parámetros en la propiedad text-decoration) ya que entorpecen la lectura y ciegan al lector. No hace mucho se usaba para llamar la atención pero ahora digamos que los visitantes (especialmente los habituales) se saltan esta prueba y no harán ni el más mínimo caso al texto. De todas formas los efectos pueden usarse con la publicidad para impresionar al lector, aunque yo no lo recomiendo ya que se debe comunicar la información al lector, no intentar impresionarlo.

Vía | Webtaller

Si te ha gustado este artículo, puedes recibir gratis más y mejor por RSS, Twitter, Facebook o correo electrónico. ¡Muchas gracias por leerme!