Recursos para encontrar buenos esquemas/combinaciones de fuentes web

Comencé a hacer algunos trabajos de diseño de sitios web independientes para clientes de pequeñas empresas, y parte de mi trabajo consistirá en seleccionar fuentes para usar en los sitios que crearé.

Dado que la tipografía no es mi punto fuerte, me preguntaba si hay un sitio web que ofrezca una colección de esquemas/combinaciones usando fuentes web. Por "esquema" me refiero a algo tan simple como una pequeña lista de fuentes que se han propuesto para funcionar o verse bien juntas, por ejemplo, Fuente A para encabezados, Fuente B para subtítulos, Fuente C para el cuerpo del texto, etc. Básicamente, algo como Combinaciones de colores , a excepción de las fuentes web.

Creo que un sitio como este sería un gran recurso para las personas como yo que no son las mejores para elegir fuentes que funcionen bien juntas. Sería genial si el sitio web indicara cuáles de los esquemas de fuente incluidos consisten completamente en fuentes web de uso gratuito, ya que obviamente serían muy fáciles de implementar.

Entonces, ¿alguien sabe de algún sitio web como este?

No respondo directamente a su pregunta, pero esta es una gran lectura si desea comprender cómo emparejar mejor las fuentes: mejores prácticas para combinar tipos de letra

Respuestas (7)

Esta no es exactamente la respuesta que está buscando, pero aquí hay algunas ideas:

Hoefler & Frere-Jones son prácticamente la flor y nata de la cosecha tipográfica. Enviaron un correo electrónico hace un tiempo que mostraba algunas combinaciones de fuentes realmente geniales (con sus fuentes, por supuesto), pero en la parte superior hay una buena regla en la lista:

... todo construido en torno al primer principio altamente científico de combinación de fuentes de H&FJ: mantenga una cosa consistente y deje que una cosa varíe.

Continúan mostrando algunas similitudes y diferencias realmente esotéricas (que funcionan muy bien), pero es bueno tener en cuenta esa regla. Si usa un sans-serif para el texto del encabezado, use un serif para el texto del cuerpo. Si tiene algo con trazos gruesos, compárelo con algo más delgado. Como se discutió en un hilo algo similar , Bauhaus y Bembo no tienen mucho en común, pero Bauhaus y Futura comparten algunas formas de letras geométricas mientras varían en grosor y llamativos en general.

Fonts In Use es un gran recurso del que puede inspirarse. Enlacé a la sección Web. No tratan con fuentes gratuitas, pero espero que esto le resulte útil.

Recomiendo encarecidamente este sitio web: http://hellohappy.org/beautiful-web-type/ . No hay tantas combinaciones, pero las muestran de una manera tan inspiradora.

Todas las fuentes están disponibles de forma gratuita para uso comercial en el brillante directorio de fuentes de Google .

Si quiere probar sus propias combinaciones para ver qué le gusta (ya que eso es lo más importante, después de todo), vaya a http://font-combinator.com/ donde hay una gran herramienta para editar algunos bloques de texto para vea cómo van juntos, también utilizando el recurso gratuito Google Font.

Realice una búsqueda de " Combinaciones de fuentes de Google " para obtener más inspiración.

Para una mejor comprensión de las fuentes, puede consultar https://typekit.com/

Tienen una gran colección de fuentes para usar en el diseño web, e incluso las fuentes de Google también tienen una buena colección de fuentes gratuitas.

Trabaje con fuentes, juegue con fuentes. Es la única forma de volverse bueno en la selección de fuentes.

¿ Has probado fooont.com ? Consiste en su totalidad en pares de fuentes alojadas en Google Webfonts.

Simplemente descargue el archivo CSS y utilícelo instantáneamente en su sitio web. Espero que esto ayude :)

Mixfont es un sitio que muestra varios emparejamientos de Google Fonts y hace que los usuarios voten a favor de sus emparejamientos favoritos.

Hay muchos sitios que ofrecen combinaciones de fuentes. Algunos que aún no se han mencionado incluyen

  • Femmebot : para emparejamientos de fuentes de Google.
  • Par de fuentes : también para emparejamientos de fuentes de Google.
  • Canva : combinaciones de fuentes más generales.
  • DesignModo : también combinaciones de fuentes más generales.
  • FontJoy : para la generación aleatoria de pares de fuentes mediante el aprendizaje profundo.

Recomiendo Typewolf.com . El sitio está dirigido por el diseñador llamado Jeremiah Shoaf.

Hay dos secciones que encuentro particularmente útiles:

  1. Recomendaciones y listas de fuentes incluye un par de listas de combinación de fuentes.
  2. Web Fonts in the Wild es una base de datos de fuentes que incluye una lista de combinaciones sugeridas y una muestra de combinaciones de fuentes de toda la web.

El sitio también presenta un excelente índice de fuentes similares/alternativas, incluido un documento disponible para comprar que enumera muchas alternativas gratuitas para fuentes pagas; esto es especialmente útil si tienes un presupuesto limitado.