Cómo decidir qué familia de fuentes utilizar para el diseño web

Mire cualquier página web en línea hoy, independientemente del tamaño del sitio o de la industria para la que sea, y verá que una cosa que todos comparten en común es el contenido de texto.

Una de las formas más fáciles de afectar el diseño de una página web es con las fuentes que utiliza para el contenido de texto de ese sitio. Desafortunadamente, muchos diseñadores web que están al comienzo de sus carreras se vuelven un poco locos al usar demasiadas fuentes en cada página. Esto puede generar una experiencia confusa que parece carecer de cohesión en el diseño. En otros casos, los diseñadores intentan experimentar con fuentes que son virtualmente ilegibles, usándolas simplemente porque son “geniales” o diferentes. De hecho, pueden ser fuentes de aspecto atractivo, pero si el texto que deben transmitir no puede la "frescura" de esa fuente desaparecerá cuando nadie lea ese sitio web y, en su lugar, se vaya a un sitio que pueda ¡proceso!

Algunas reglas generales

  1. No use más de 3 a 4 fuentes en una página. Cualquier cosa más que esto comienza a parecer un aficionado, ¡e incluso 4 fuentes pueden ser demasiadas en algunos casos!
    instagram viewer
  2. No cambiar la fuente a mitad de la oración a menos que tenga una muy buena razón.
  3. Utilice fuentes sans serif o fuentes serif para el texto del cuerpo para facilitar la lectura de esos bloques de contenido.
  4. Use fuentes monoespaciadas para texto de máquina de escribir y bloque de código para diferenciar ese código de la página.
  5. Utilice fuentes de escritura y fantasía para acentos o titulares grandes con muy pocas palabras.

Recuerde que todas estas son sugerencias, no reglas estrictas y rápidas. Sin embargo, si vas a hacer algo diferente, debes hacerlo con la intención, no por accidente.

Las fuentes Sans Serif son la base de su sitio

Fuentes sans serif son aquellas fuentes que no tienen "serifas”- el tratamiento de diseño poco agregado en los extremos de las letras.

Si ha tomado algún curso de diseño de impresión, probablemente le hayan dicho que solo debe usar fuentes serif para los titulares. Esto no es cierto para la web. Las páginas web están destinadas a ser vistas por navegadores web en monitores de computadora y dispositivos móviles y los monitores y pantallas de hoy son bastante buenos para mostrar claramente las fuentes serif y sans-serif. Algunas fuentes serif pueden resultar un poco difíciles de leer en tamaños más pequeños, especialmente en pantallas antiguas, por lo que siempre debe Sea consciente de su audiencia y asegúrese de que puedan leer las fuentes serif antes de tomar la decisión de usarlas para su cuerpo. texto. Dicho esto, la mayoría de las fuentes serif de hoy en día están diseñadas para consumo digital y funcionarán bien como cuerpo de texto siempre que se establezcan en un tamaño de fuente razonable.

Algunos ejemplos de fuentes sans-serif son:

  • Arial
  • Ginebra
  • Helvética
  • Lucida Sans
  • Trebuchet
  • Verdana

Nota

Verdana es una familia tipográfica que se inventó para usar en la web.

Utilice fuentes serif para imprimir.

Si bien las fuentes serif pueden ser difíciles de leer en línea para pantallas antiguas, son perfectas para imprimir y buenas para titulares en páginas web. Si usted tiene fácil de imprimir versiones de su sitio, este es el lugar perfecto para usar fuentes serif. Las serifas, impresas, facilitan la lectura, ya que permiten a las personas diferenciar las letras con mayor claridad. Y debido a que la impresión tiene una resolución más alta, se puede ver con mayor claridad y no parece que se borre entre sí.

Algunos ejemplos de fuentes serif están:

  • Garamond
  • Georgia
  • Veces
  • Times New Roman

Las fuentes monoespaciadas ocupan el mismo espacio para cada letra

Incluso si su sitio no se trata de informática, puede utilizar el espacio único para proporcionar instrucciones, dar ejemplos o insinuar texto escrito a máquina. Las letras monoespaciadas tienen el mismo ancho para cada carácter, por lo que siempre ocupan la misma cantidad de espacio en la página. Las fuentes monoespaciadas funcionan especialmente bien para muestras de código.

Las máquinas de escribir suelen utilizar fuentes monoespaciadas, y su uso en su página web puede darle la sensación de ese contenido escrito a máquina.

Algunos ejemplos de fuentes monoespaciadas son:

  • mensajero
  • Courier Nuevo
  • Consola Lucida
  • Mónaco

Las fuentes de fantasía y guiones son difíciles de leer

Las fuentes de fantasía y script no están tan extendidas en las computadoras y, en general, pueden ser difíciles de leer en grandes porciones. Si bien es posible que le guste el efecto de un diario u otro registro personal que puede dar el uso de una fuente cursiva, sus lectores pueden tener problemas. Esto es especialmente cierto si su audiencia incluye hablantes no nativos. Además, las fuentes de fantasía y cursivas no siempre incluyen caracteres de acento u otros caracteres especiales que limitan su texto al inglés.

Utilice fuentes fantásticas y cursivas en imágenes y como titulares o leyendas. Manténgalos cortos y tenga en cuenta que la fuente que elija probablemente no estará en la mayoría de las computadoras de sus lectores, por lo que deberá entregarlos usando fuentes web.

Algunos ejemplos de fuentes de fantasía son:

  • Plato de cobre
  • Desdémona
  • Impacto
  • Kino

Nota

Impact es la familia de fuentes con más probabilidades de estar en máquinas Mac, Windows y Unix.

Algunos ejemplos de fuentes de script son:

  • Cancillería de Apple
  • Comic Sans MS
  • Escritura Lucida

Nota

Los estudios han demostrado que las fuentes que son más difíciles de leer pueden ayudar a los estudiantes a retener más información.