Principal

Archive | Uso

Tipos de letras: esto es lo primero que debes saber

Una guía sincera y sencilla para principiantes sobre cómo y dónde conseguir tipos de letras de calidad para todos los bolsillos tipos de letras

Empecemos

Lo primero que debes saber es cómo se llama lo que buscas en las webs especializadas: por tipos de letras no encontrarás gran cosa porque el término que utilizamos en nuestro gremio es fuentes o tipografías (en inglés fonts y typefaces). Llamamos tipos a cada una de las piezas que forman una póliza, pero tipos de letra… no sé, mejor cambia el chip y utiliza la terminología profesional.

La diferencia entre fuente y tipografía prácticamente se ha difuminado desde que la tipografía es digital; cuando la tipografía era en formato físico sí tenía sentido separar ambos términos porque cada tipografía (Times New Roman negrita, por ejemplo) necesitaba de una fundición —fuente— para cada cuerpo —tamaño de letra—. La estructura era:

  1. familia tipográfica (Times New Roman),
  2. tipografía (Times New Roman redonda, negrita, cursiva o negrita cursiva) y
  3. fuente (la caja llena de tipos en un cuerpo determinado, por ejemplo 12 puntos).

En tipografía digital un sólo archivo sirve para todos los tamaños, con lo que sólo hacen falta dos niveles; en la práctica esto ha derivado en dos opciones:

  1. llamar tipografía a la familia tipográfica (Times) y fuente a cada archivo (Times negrita) o
  2. hacer que tipografía y fuente sean equivalentes; yo me inclino por esta segunda opción.

Si ha habido suerte y me he explicado bien, el siguiente paso es saber dónde se pueden conseguir buenas tipografías. Como eso de piratear está feo asumo que te quedan dos opciones:

Tipografías gratis para todos los casos

Para mis alumnos de la universidad tipos gratis es sinónimo de Dafont y en cada curso me toca explicarles que —por su bien y el de los ojos de sus clientes y usuarios— deben explorar otras opciones menos saturadas de basura tipográfica. Por lo general prefiero advertir a prohibir, y sé también que el sistema de etiquetado de Dafont es inigualable (de hecho estoy seguro que es la fuente de su éxito, porque la calidad de sus tipografías es más que dudosa) por lo que debo avisarte: las probabilidades de que lo que te descargues de Dafont sea de baja calidad son altísimas, se necesita de un afilado sentido tipográfico para separar el grano de la paja.

Las alternativas que te propongo son FontSquirrel y Google Fonts. La primera muestra una colección de tipografías gratuitas disponibles para descargar y en muchos casos para ser instaladas en tu servidor y usadas en tu web. La segunda es un servicio en la nube de tipografías gratuitas y también 100% de uso comercial listas para usarse sin necesidad de instalar nada. Ambas plataformas son un buen recurso tipográfico aunque en Google Fonts también hay bastante basurilla, especialmente la que se incluyó en su etapa más temprana, antes de empezar a aplicar criterios de selección y encargo con ayuda de tipógrafos expertos de todo el mundo.

fontsquirrel

Captura de pantalla de FontSquirrel

googlefonts

Captura de pantalla de Google Fonts

Tipografías de pago o comerciales para todos los bolsillos

Si el proyecto admite una pequeña inversión piensa que puedes alquilar o adquirir una licencia de uso de una tipografía de calidad, con todos los caracteres que necesitas (y más) y la ventaja añadida de una mayor exclusividad porque habrá menos usuarios que la tengan. En las tiendas donde puedes encontrar este tipo de productos la cantidad de basura tipográfica es mínima, si acaso el peligro es encontrar refritos y copias de tipografías clásicas a buen precio y poca personalidad. Pasemos a ver dos o tres de opciones donde comprar:

  1. MyFonts: es el mayor supermercado tipográfico del mundo, donde yo compro mis tipografías (prefiero recomendar siempre los productos que uso y conozco mejor). Es propiedad de Monotype, la mayor empresa tipográfica del planeta.
    myfonts
  2. Typekit: el concepto de tarifa plana aplicado a la tipografía, esta vez de la mano de Adobe. Pagas una cuota y tienes acceso a un catálogo bastante completo que te permite tanto usar las fuentes online (para tu web) como offline (en tu ordenador).
    typekit
  3. Fontstand: no lo he probado aún pero la idea es tan buena que me atrevo a recomendarla con los ojos cerrados; se trata de alquilar las tipografías por meses y a precios ridículos (1,5€ por fuente), aunque el repertorio no es tan grande como el de Typekit.
    fontstand

Cómo elegir una tipografía sin tener ni idea

Si te abruma la cantidad de tipografías disponibles y nunca sabes cuál elegir no te agobies, es lo normal cuando alguien empieza en diseño gráfico o sólo pretende hacer una breve incursión para ahorrarse unos eurillos (para luego darse cuenta de que es más caro hacerlo tú que encargarlo, pero eso ya es otra historia). En estos casos lo mejor es dejarse guiar por un experto en la materia y dejar que filtren y seleccionen las mejores tipografías para reducir la selección a unas pocas decenas de tipografías. Veamos unos cuantos ejemplos para que sepas de quién te puedes fiar:

Cómo elegir la pareja ideal para la tipografía escogida:

En mi blog tienes también listas de mis favoritas y de las mejores tipografías de Google Fonts que te podrán servir:

Bueno, te he prometido una guía breve de modo que lo voy a dejar aquí, iré añadiendo algunos enlaces conforme me vaya tropezando con ellos, te espero en los comentarios por si quieres añadir o discutir (en el buen sentido) algo.

Continue Reading · 2

Las tipografías cuentan historias, descubre cómo

Ayer tuve la suerte de compartir clase con Rodrigo Brod, profesor de diseño y tipografía de la Universidad brasileña de Univates (Lajeado, Río Grande del Sur). Había programada una actividad que consistía en elegir una tipografía que transmitiese lo mejor posible la personalidad de 4 cantantes, 4 actores y 4 países. Los alumnos pusieron sus trabajos en el panel de corcho y comenzó la discusión para ayudarles a entender lo que estaba pasando. Mi intervención se limitó a apoyar a Rodrigo y en un momento determinado les conté cuáles eran las dos principios semióticos que operaban en la creación de significado en una tipografía. Tuve la sensación (por las caras y los ojitos brillantes) de haber ayudado, de modo que comparto con vosotros este pequeño descubrimiento que hice hace no mucho.

bla

Al grano: tal y como yo lo entiendo la tipografía transmite historias porque tiene dos capas de significado; la primera es la de la palabra misma que se escribe (función informativa, poner en forma la palabra) y la segunda es gramática (función comunicativa, poner en común el concepto).

Esta segunda capa opera bajo dos principios semióticos bien conocidos por todos: la connotación y la metáfora. Vamos a verlas con detalle:

Connotación

Si pensamos en una tipografía gótica automáticamente la asociamos con Alemania, cerveza o iglesias y religión. ¿Qué hay dentro de la tipografía que tenga que ver con estos conceptos? Poco o nada, salvo el uso que históricamente se ha hecho de estas letras en diferentes ámbitos o productos. El uso prolongado de un alfabeto crea una imagen colectiva que se convierte en un potencial recurso de creación de significado cuando la tipografía se utiliza en el contexto adecuado.

¿Cómo puede ayudarte el proceso de connotación para escoger una tipografía u otra? Cuando tengas un encargo entre manos estudia los usos que se han hecho de las tipografías que estás eligiendo y sé consciente de lo que connotan para el público al que te diriges; lo mismo pasa con los colores, el negro es el color del luto en los países occidentales pero ojo, en Japón es el blanco. Debes estudiar el contexto siempre antes de empezar a tomar decisiones gráficas.

Para esto es importante saber en qué momento histórico se diseñó la tipografía, con qué función o para qué productos y si es posible en qué contextos se ha utilizado previamente que puedan haber generado una imagen en el subconsciente del colectivo al que te diriges.

Metáfora

Cuando no se conoce el origen o el uso de una tipografía también puede transmitir un concepto pero a través de otro principio semiótico: la metáfora. En la famosa canción Sabor de amor, del grupo español Danza Invisible el estribillo reza así:

Labios de fresa sabor de amor,
Pulpa de la fruta de la pasión.

La metáfora labios de fresa consiste en describir los labios a través de su semejanza con la fruta; se podría decir tus labios son dulces, rojos y carnosos, tus labios son dulces, rojos y carnosos como una fresa pero se opta por la metáfora por ser más sutil y poética, sustituyendo carnosos por una fruta dulce, roja y carnosa, dejando que el lector interactúe y haga el trabajo de asociación, mucho más rico y complejo en matices. Cada lector, en función de su experiencia con las fresas, interpretará algo distinto y a eso le llamamos subjetividad (porque somos sujetos, no objetos).

De esta forma cuando escogemos una tipografía redondeada podemos definirla como amable, cercana e incluso femenina. Los alfabetos angulosos pueden ser fríos, distantes tecnológicos y masculinos. Y así hasta el infinito y más allá.

Para construir metáforas tipográficas debes estar atento a la anatomía de las letras, la estructura y el contraste, por eso en los manuales se describen y clasifican de mil maneras distintas. Conocer, degustar y memorizar tantas tipografías como puedas —el equivalente a leer tantos libros como puedas si eres poeta o escritor— es imprescindible para ajustar al máximo las características de la tipografía a los valores que pretendas comunicar.

Ejemplo

En los años cincuenta las revistas Harper’s BAZAAR y VOGUE eligieron la tipografía Didot para sus portadas rompiendo con la tradición anterior; sus directores de arte utilizaron la metáfora para relacionar esta tipografía con lo femenino, con la elegancia, la precisión de la costura, la delgadez de las modelos. El uso de Didot y Bodoni —y sus miles de variaciones, por supuesto— por parte de la industria de la moda (ELLE, Vaniti Fair, etc.) se extendió hasta convertirse en connotación, de manera que ahora el público ve una didona y la asocia con la moda de manera automática.

Portada de abril de 1910

Portada de agosto de 1930

Portada de diciembre de 1958

Portada de enero de 2013 (edición inglesa)

Portada de abril de 1956

Portada de septiembre de 20014

Reflexión: sospecho que el público está más entrenado en la connotación que en la metáfora, y eso explicaría por qué los clientes suelen poner tantos frenos a los cambios tipográficos en logotipos, portadas y demás piezas que les proponemos. También evidencia la dificultad de hacer coincidir lo que el diseñador quiere transmitir con lo que el público interpreta, no sólo por el hecho de que cada persona tiene una memoria visual distinta, es que nosotros distinguimos y diferenciamos mejor las tipografías y por tanto manejamos un vocabulario más rico en matices.

Os dejo por lo tanto dos deberes que hacer: fijaos en los usos de las tipografías para entender sus posibles connotaciones y en la estructura/forma de las mismas para tener más herramientas y de ese modo evitar el cliché y la elección fácil. Os espero en los comentarios con ejemplos de cada figura y las preguntas que os surjan.

Continue Reading · 5

Veo tipografía por todas partes

En ocasiones veo tipos

En ocasiones veo muertos“, decía Cole, el niño de la película El sexto sentido, con una cara que no se me olvidará jamás. Pues bien, a mí me pasa algo parecido: veo tipografía por todas partes. ¿Es grave, doctor?

La última vez fue el pasado lunes 24 de junio, día de San Juan y día grande de las Hogueras, a fiesta por excelencia de la ciudad de Alicante, donde vivo desde hace 31 años mucho tiempo. Estábamos disfrutando de la última mascletà del concurso de este año (2013) y tras la traca final no se me ocurrió otra cosa que pensar: “esto es tipografía pura, tengo que escribir algo en el blog para explicarlo“. Echa un vistazo a este vídeo casero para hacerte una idea:

Disparada por la pirotecnia Martí, de Onda (Castellón); 150 kilogramos de pólvora puestos al servicio del espectáculo, que duró 7,18 minutos.

Vale, soy un friki. Admitido. Y ahora déjame que te lo explique, a lo mejor hasta te hace gracia: siempre utilizo analogías cotidianas para explicar conceptors tipográficos. Por ejemplo comparo elegir la ropa que te pones cada día con la elección de las tipografías para un trabajo, o el contraste tipográfico con los ingredientes de una paella. Ríete si quieres pero los alumnos lo entienden.

¿Qué tienen en común la tipografía, la ropa, la comida y las mascletades? en todos los casos se trabaja con elementos prefabricados y combinables entre sí. Las letras, las prendas de vestir, los ingredientes y los petardos ya están hechos y tu trabajo consiste en elegir los adecuados, combinarlos y establecer un ritmo y una harmonía que hagan interesante, atractivo o comestible el resultado.

En la mascletà del lunes el ritmo y la potencia fue subiendo como manda la tradición, pero lo que la hizo especial fue los descansos, las pausas entre series, el breve silencio antes del estallido final… fue sublime. Casi como una melodía de rock progresivo. Los que no sois de esta zona quizás os cueste entenderlo porque desde fuera es una costumbre bárbara, pero os aseguro que se le coge el gustillo rápido y se entiende por qué nos gustan tanto los petardos y las tracas.

Te pongo otro ejemplo que entenderá más gente: todo el mundo sabe que una paella o una tortilla de patatas no necesita 20 ingredientes para estar buena. De hecho suelen ser dos, a lo sumo tres, las combinaciones ganadoras. Pero luego hacen un cartel y usan 6 tipografías distintas… es muy difícil hacer un buen cartel con 6 tipografía. No es imposible pero es mejor empezar por el principio.

En la mascletà no se usaron petardos distintos a los de otros días, ni de más variedad. ¿Qué fue lo que cambió?

Venga, piensa un poco…

Un poco más…

Venga, que tú puedes…

tic tac

tic tac

Vale, vale, ya paro con la tontería. La respuesta es:

tic tac

tic tac

Venga ahora sí:

EL SILENCIO. EL VACÍO. LA PAUSA. LA NADA.

Efectivamente, eso es exactamente lo que maneja un diseñador, un cocinero, un músico y un pirotécnico: la elección de los ingredientes y el vacío que los relaciona. Eso es tipografía, el control del vacío. No me he metido en una secta Zen ni nada parecido, es que después de mucho tiempo es la conclusión que saco —a lo mejor debería aprender a cocinar— y cada vez soy más sensible al vacío. El otro día disfruté mucho del silencio entre tracas. Sólo quería compartirlo contigo.

Si tú también ves tipografía por todas partes te animo a que lo compartas aquí y nos cuentes dónde. Gracias por leerme.

 

Continue Reading · 6

Tendencias y buenas prácticas en tipografía web

tendencias Smashing Magazine es uno de los sitios de referencia a nivel mundial en materia de diseño, realmente te lo recomiendo. Hace poco publicaron un estudio hecho entre 50 webs destacadas por su cuidado y su contenido para deducir cuáles eran las tendencias y buenas prácticas de los diseñadores responsables de cada proyecto. Lo interesante es que lo han podido comparar con otro estudio similar que hicieron en 2009. A continuación os sintetizo —y en la lengua del imperio para que no tengáis problemas— las conclusiones más destacadas para que podáis ir probándolas en vuestros proyectos:

¿Romana o palo seco?

Ah, la eterna pregunta del principiante… a la que solemos responder con el siempre socorrido “depende”. Pues bien, si quieres salir de dudas, veamos lo que hacen los grandes:

Headings_serif_-sans1

 

body_serif_sans1

La disputa anda bastante más apretada que en 2009 cuando el dominio del palo seco era abrumador. De hecho las romanas se están imponiendo para cuerpos de lectura mientras se reparten protagonismo en los titulares. Al final volvemos a los clásicos… pero, ¿a qué se deberá este retorno a los orígenes? Sospecho que detrás de todo esto está la evolución de las webfonts y la enorme oferta que existe ahora; hace 4 años era más difícil poder usar tipografías de pago en diseño web. ¡Vaya! Me acabo de dar cuenta de que estoy dentro del promedio de este estudio (uso un palo seco para titulares y una romana para cuerpo de lectura). Pero me pregunto qué hará la gente de a pié… se me ocurre consultar las estadísticas de Google Fonts, veamos cómo se reparten el cotarro entre las 10 más usadas: 8 palos secos, una romana y una caligráfica. Muy interesante también la gráfica donde se listan las familias más utilizadas: Georgia y Arial ganan de calle a cierta distancia de la Helvética que se mantiene en el podio; pierden puestos a toda pastilla Verdana y Lúcida, mientras la parrilla se llena de webfonts… la verdad es que no me sorprende, hay tipografías muy buenas en la lista. Pero el dato que más me llama la atención es la atomización de la muestra, fíjate la cantidad de resultados que obtiene la categoría “otras”. Es un reflejo de la oferta tan amplia de que disponemos los diseñadores —y que aumentará con la inclusión de Typekit en el paquete Adobe Creative Cloud—.

¿Fondo claro u oscuro?

Aquí el panorama no ha cambiado mucho, el fondo claro y las letras oscuras sigue siendo el predominante; lo que sí se aprecia en el estudio es un descenso del contraste conseguido gracias a oscurecer el blanco y aclarar el negro (justo como hago yo en el blog).

¿Qué tamaño usar?

Otra pregunta interesante: en titulares la media del estudio está en los 38 píxeles (que en pantallas normales, de baja definición, equivale a 38 puntos), 10 píxeles por encima de las muestras de 2009; yo he optado por 48px porque estoy usando una versión estrecha —condensed— y me lo estaba pidiendo a gritos para diferenciarse claramente del texto principal y de los encabezados. Mira el gráfico si quieres:

heading_font_sizes

En el cuerpo de lectura también se observa un crecimiento de 2 píxeles, hemos pasado del cuerpo 12 o 14 al 14 o 16. La explicación de este cambio es puramente técnica: los ordenadores se sitúan a mayor distancia que una publicación en papel, que se suele sujetar con las manos. Ese incremento de distancia en tipografía web se ha de compensar con un aumento del cuerpo principal, que en la mayoría de las tipografías se sitúa en 16 píxeles (es el cuerpo que uso yo). Puedes leer el artículo de Oliver Reichenstein que puso en marcha esta tendencia.

body-copy-font-size

Ten en cuenta que este tipo de consejos sirven sólo de guía, siempre tienes que evaluar el resultado y crear reglas nuevas para tu diseño. Si sigues la regla de los 16 píxeles usando Verdana no creo que te entusiasme el resultado. Cada tipografía tiene unas proporciones que te pedirán —si tienes un poco de sensibilidad y de cintura— lo que tienes que hacer, de modo que la Verdana o la Georgia las puedes componer a 14 píxeles obteniendo el mismo resultado que con una Helvética o una Times a 16. En el estudio han encontrado una proporción entre el cuerpo de lectura y titulares de 2,5 de media. Yo uso una proporción de 3 (16 px y 48px) que en mi caso creo que se lee mejor; puedes plantearte también aplicar la proporción áurea (1.618) si quieres aunque conseguirás menos contraste tipográfico. Todo depende de la selección de tus materias primas.

Interlínea

Aquí también hay un cambio respecto a las reglas que imperan en diseño editorial, que sospecho tiene el mismo fundamento que el aumento del cuerpo de texto hasta los 16 píxeles: a mayor distancia, mayor interlínea. Si al diseñar para el papel la interlínea que se considera como punto de partida es un 20% del cuerpo de texto (10/12 por ejemplo) en pantalla se recomienda un 50% (10/15); la media del estudio está en un 46% (o 1,46 por cifrarlo como se hace en HTML con la interlínea, que se establece con una etiqueta CSS llamada line-height). Yo uso esta proporción con lo que obtengo un 16/24 píxeles. Aquí me gustaría investigar un poco más porque es cierto que se agradece una interlínea generosa…

Longitud de línea

Este es otro de los datos que les suele llamar la atención a mis alumnos, que se sorprenden de que haya una regla hasta para eso. De hecho Alfredo, uno de ellos, se ha inventado una regla mnemotécnica estupenda para recordar la cifra mágica: medio twit, 70 caracteres (Bringhurst establece el promedio en 66). Sin embargo el estudio refleja que la media está en 84, quizás en un intento de mantener la proporción en el aumento de cuerpo e interlínea. A mí me parece demasiado, yo intento no pasar de 80. Por supuesto, no verás ninguna web decente con el texto justificado, al menos hasta que se solucione técnicamente la partición y justificación en todos los navegadores.

characters_per_line1

 ¿Tipografía responsive?

Vaya con la palabreja, no hay manera de traducirla… es una técnica bastante sencilla —aunque tremendamente laboriosa— que permite hacer la maquetación relativa a un determinado espacio o resolución. Dicho de otra manera, permite tener un mismo diseño con medidas diferentes en función del dispositivo que cargue la web: si es un teléfono usará una sola columna, un cuerpo determinado y una navegación más sencilla. Si es un iMac de 27 pulgadas puedes pasar a 3 ó 4 columnas, menús desplegables, etc. Yo lo he hecho con este blog, si quieres ver cómo funciona haz la ventana de tu navegador más pequeña y verás cómo cambia el diseño (o carga el blog desde el teléfono). Un 42% de las páginas estudiadas tienen algún tipo de estrategia responsive, con lo que podrías empezar a investigar sobre el tema y plantearte aprender a hacerlo, porque no es una moda pasajera. Los tiempos están cambiando…

Conclusiones

No te tomes este artículo como un conjunto de reglas inviolables; diseñar consiste en crear reglas adecuadas a cada proyecto. Tómatelo como un punto de partida y recuerda que siempre debes hacerle más caso a tu intuición femenina —o sentido arácnido si se da el caso— que a tus profesores. De hecho, acabo de recordar un artículo genial de mi admirado Gerrit Noordzij que habla justamente sobre este problema: se titula Rule or Law (si no funciona el enlace puedes leer la versión guardada en caché por Google). Te lo recomiendo.

Continue Reading · 1

¿Puedo usar la tipografía Helvetica en mi web?

Helvetica_rojo

Ah, la Helvetica, la tipografía que los diseñadores amamos amar… siempre que doy clases de diseño web llegamos al mismo punto: los alumnos se dan cuenta de que es una tipografía elegante, versátil y omnipresente pero en sus versiones de Windows (salvo el Vista que sí la llevaba) no aparece.

Profeeeee, ¿podemos descargar y usar la Helvetica en nuestra web?

Si tú te haces la misma pregunta y no leiste mi anterior entrada “¿Debo pagar por usar una fuente en mi proyecto?” has aterrizado en el sitio correcto; voy a compartir contigo un reciente descubrimiento que no le va a hacer ninguna gracia a los señores de Linotype (ahora propiedad de Monotype, quién se lo iba a decir en su día) y que no viola ninguna ley de la propiedad intelectual. Pero vayamos por pasos:

¿Puedo usar la Helvetica que venía en mi Mac para mi web?

Si te refieres a instalarla en tu servidor y usarla con @fontface la respuesta es NO. Puedes usar la Helvetica de tu Mac para un cartel y cualquier otro trabajo comercial pero no puedes pasársela a nadie: ni al impresor ni al copistero, y eso incluye dejarla en un servidor para que todo el mundo se la descargue.

Lo que sí puedes hacer es una imagen en jpg —como he hecho yo en la cabecera de la entrada— o establecer la Helvetica como la primera opción de una font stack. Si el usuario la tiene instalada el navegador la usará, de lo contrario pasará a la siguiente opción de la lista (que suele ser Arial o un genérico como Sans Serif).

¿Puedo descargarla por ahí?

Hay infinidad de sitios web donde puedes descargarte una copia ilegal de la Helvetica para instalarla en tu servidor. Eso no se debe hacer bajo ningún concepto —siempre he defendido que los alumnos deben probar las mejores tipografías aunque no tengan dinero para comprarlas, pero en un contexto determinado: en clase y en los proyectos de la carrera, nunca para trabajos profesionales— por dos razones: es un delito y nunca sabes si te puedes fiar de lo que bajas.

En ese caso ¿hay alguna alternativa a la Helvetica que se parezca y sea gratuita? Esa es la buena noticia, he encontrado las siguientes opciones:

  1. Nimbus Sans L, se distribuye bajo una licencia GNU y puedes hacer con ella lo que quieras; suele venir instalada en los Linux. Idéntica a la Helvetica, se trata de un clon que hizo URW en 1987 en plena batalla contra el monopolio de Adobe y sus tipos PostScript. En aquella época copiarse tipografías de unas fundiciones a otras era el pan nuestro de cada día y nadia protestaba.
    Nimbus Sans L
  2. Free Sans, también con licencia GNU, es una desarrollo de la Nimbus Sans L con un juego de caracteres más amplio. El aspecto es el mismo.
    Nimbus Sans L
  3. Liberation Sans, en este caso el parecido es menor y menos criticable, creo que es tu opción si las dos anteriores te parecen demasiado bestias.Liberation Sans

Espero haberte servido de ayuda, comparte esta entrada si ha sido así, por favor.

Continue Reading · 14

Font stacks a prueba de bombas

Si eres desarrollador web y no te quieres complicar la vida cargando fuentes de servidores externos como Google Fonts o Typekit, habrás visto que hay una colección de tipografías de sistema que se instalan en los dos grandes sistemas operativos pero, ¿qué pasa con Linux?

Seguramente ya te has dado cuenta de que la gran mayoría de las fuentes de sistema no están presentes en las distribuciones del sistema operativo del pingüino, pero no te preocupes porque yo mismo me hice la pregunta una vez y me dediqué a compararlas hasta encontrar 5 secuencias tipográficas (font stacks, listas de fuentes para que el navegador escoja la que tenga disponible) que contienen tipografías presentes en el 95% de los ordenadores del mundo y que son clavaditas entre sí:

  1. font-family: Palatino, “Palatino Linotype”, “Urw Palladio L”, Serif;
  2. font-family: Georgia, “Dejavu Serif”, Serif;
  3. font-family: “Courier New”, Courier, “Nimbus Mono L”, Monospace;
  4. font-family: “Helvetica Neue”, Helvetica, “Nimbus Sans L”, San-Serif;
  5. font-family: Verdana, “Dejavu Sans”, San-Serif;

De acuerdo, no hay mucha variedad, pero es suficiente para hacer algo digno, limpio y claro.

Continue Reading · 0