Las mejores fuentes estándar. Fuentes del sistema, conexión.

Una de las principales tareas del diseño web es elegir el software adecuado. fuentes estándar. Los servicios de incrustación de fuentes como Google Web Fonts o Typekit se crearon como alternativa con el objetivo de ofrecer algo nuevo.

Son muy fáciles de usar. Tomemos como ejemplo Google Web Fonts.

Elija la fuente Open Sans, Droid Serif o Lato. Escribe el código y pégalo en el elemento. documento HTML. ¡Estás listo para hacer referencia a él en CSS! Todo el proceso no duró más de 60 segundos. Y todo es completamente gratis.

¿Qué podría estar mal?

Es posible que algunas fuentes no estén disponibles para todos. Y esto significa que puede haber problemas. Está contento de haber elegido una fuente hermosa para el sitio, pero el visitante de la página web ve una escritura fea.

Esto no sucederá si implementa una opción de respaldo.

¿Qué importancia tiene utilizar fuentes web seguras?

Cada dispositivo tiene su propio conjunto de fuentes preinstaladas. Cuál depende del sistema operativo. El problema es que existen ligeras diferencias entre ellos.

¿Qué pasa con los sitios web? ¿Como éste? Es posible que la fuente que ve no sea la especificada originalmente para el sitio.

¿Qué significa? Digamos que el diseñador ha elegido alguna familia de fuentes pagas para el sitio. Si no los tiene instalados y no los proporciona un servicio web especial, entonces la fuente que ve es una de las opciones estándar. Por ejemplo, Times New Roman.

Por lo tanto, el texto en su pantalla puede verse simplemente terrible.

Y aquí fuentes estándar para el sitio disponible en todos los sistemas operativos. Esta es una pequeña colección disponible en Windows, Mac, Google, así como en Unix y Linux.

Con la ayuda de esta selección, los diseñadores, así como los propietarios de sitios web, pueden especificar qué fuente se debe utilizar como fuente de respaldo. Esto le brinda la posibilidad de controlar cómo se verá la página en diferentes dispositivos.

Como opción alternativa, el desarrollador selecciona una fuente que es muy similar a la original, y es ésta la que se mostrará al usuario.

Echemos un vistazo a una selección de los más populares. fuentes estándar HTML.

Las 15 mejores fuentes seguras para la web

  1. arial

Considerado estándar en la mayoría de los casos. La fuente más común " sans serif"o fuentes sans serif ( que no tienen serifas al final de las letras). A menudo se usa en Windows para reemplazar otros caracteres.

  1. helvética

Helvetica es un salvavidas para los diseñadores. Este fuente web estándar funciona casi siempre ( al menos como red de seguridad para otras fuentes).

  1. Times New Roman

Cumple la misma función para las fuentes serif que Arial para las sans serif. Es uno de los más populares en Dispositivos Windows. Esta es una versión actualizada de la antigua fuente Times.

  1. Veces

CSS fuente estándar El Times resulta familiar para la mayoría. Mucha gente lo recuerda en minúsculas en estrechas columnas de periódicos viejos. El tipo de impresión más común que se ha convertido en una tradición.

  1. Mensajero nuevo

Similar a Times New Roman y utilizado como una variación de los viejos clásicos. También se considera una fuente monoespaciada. A diferencia de las fuentes serif y sans serif, todos sus caracteres tienen el mismo ancho.

  1. mensajero

Una fuente antigua de ancho fijo que se utiliza como alternativa en casi todos los dispositivos y sistemas operativos.

  1. Verdana

Verdana puede considerarse legítimamente una verdadera fuente web ( verdadera fuente web) gracias a unas líneas sencillas que actúan como serifas, además de un gran tamaño. Sus letras son ligeramente alargadas, por lo que son fáciles de leer en la pantalla.

  1. Georgia

La fuente web estándar Georgia es similar en forma y tamaño a la fuente Verdana. Sus caracteres son más grandes que otras fuentes del mismo tamaño. Pero es mejor no utilizarlo en combinación con otros. El mismo Times New Roman parece un enano en comparación.

  1. Palatino

Palatino se remonta a la época del Renacimiento. Nada de bromas. Esta es otra fuente grande que es perfecta para la web. Se utiliza comúnmente en titulares y anuncios.

  1. Garamond

Otra pila antigua que apareció en el siglo XVI en París. Su versión nueva y mejorada viene de serie en la mayoría de los dispositivos Windows. Posteriormente, esta fuente fue adoptada por otros sistemas operativos.

  1. hombre de libros

hombre de libros ( o Bookman estilo antiguo) - uno de mejores fuentes estándar para encabezados. Su rasgo característico es la legibilidad incluso cuando se utiliza un tamaño pequeño.

  1. Cómic Sans MS

Comic Sans MS es una alternativa divertida para las fuentes serif.

  1. Trabuquete MS

Se trata de una fuente de temática medieval desarrollada originalmente por Microsoft a mediados de los noventa. Fue utilizado en Windows XP. Hoy en día se utiliza para componer el texto principal.

Una característica específica de RuNet es el problema con las codificaciones de páginas y la compatibilidad con el alfabeto cirílico en las fuentes. Para evitar problemas con varias codificaciones de caracteres, a personas inteligentes se les ocurrió una fuente que permite combinar caracteres de varios idiomas en una sola fuente. Por lo tanto, para las páginas en ruso es necesario utilizar únicamente fuentes Unicode que admitan cirílico.

A continuación se muestra una tabla de correspondencias de fuentes.

ventanas Mac OS Unix/Linux familia ancestral
Arial Negro Helvética C.Y. Nimbus Sans L Sans-serif
arial Helvética C.Y. Nimbus Sans L Sans-serif
Cómic Sans MS Mónaco CY * (vea abajo) cursivo
Mensajero nuevo * (vea abajo) Nimbus Mono L monoespacio
Georgia * (vea abajo) Libro escolar del siglo L Serifa
Impacto Carbón C.Y. * (vea abajo) Sans-serif
Times New Roman Times CY Nimbus Romano No9 L Serifa
Trabuquete MS Helvética C.Y. * (vea abajo) Sans-serif
Verdana Ginebra C.Y. DejaVu Sans Sans-serif

* en la columna opuesta a la fuente significa que el sistema operativo no tiene equivalentes cirílicos nativos de la fuente de Windows. Pero al mismo tiempo, existe una alta probabilidad de que esta fuente esté instalada directamente en el sistema operativo.

Por ejemplo, si el texto principal del diseño es Arial, buscamos esta fuente en la tabla y escribimos la línea correspondiente en CSS:

Cuerpo (familia de fuentes: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif;)

Esta entrada significa que si el usuario tiene la fuente Arial (y todos los usuarios de Windows y todos los usuarios de Mac OS X la tienen), la página se mostrará con esta fuente. Si el usuario no tiene esta fuente, entonces la página de un usuario de Mac OS 9 de habla rusa se mostrará exactamente en la fuente estándar del sistema Helvetica CY, y para un usuario de Unix/Linux se mostrará en la fuente Nimbus Sans L. , que está instalado en el 90% de los usuarios de Unix/Linux. Si el usuario de Unix/Linux se encuentra en el 10% que no tiene esta fuente, entonces la página se mostrará en la fuente serif configurada de forma predeterminada para ver páginas web.

Se pueden ver ejemplos de tales gobernantes, por ejemplo, en Dreamweaver.

Los diseñadores de diseño principiantes eligen una regla basándose en la primera fuente sin pensar en lo que significa esta larga línea. Algunos incluso borran todo excepto la primera fuente, privando a todos los usuarios que, por alguna razón, no tengan esta fuente instalada, de ver la intención del diseñador.

Pero ahora sabemos lo que significa esta línea, ¿no? Y ya podemos usarlo correctamente.

Pero, ¿por qué la línea que construimos es tan diferente de la habitual en Dreamweaver?

Cuerpo (familia de fuentes: Arial, Helvetica, sans-serif;)

Además del hecho de que la tabla tiene en cuenta las fuentes Unix/Linux, también hay un extraño icono CY después del habitual Helvetica. ¡Averigüemos qué es!

Antes del lanzamiento de Mac OS X, esta línea tenía el siguiente significado: para los usuarios de Windows, mostramos la página en Arial, para los usuarios de Mac OS 9, en la fuente estándar Helvetica, y para el resto, vemos la página en el sistema. fuente sans-serif, que está configurada por defecto en el navegador. Pero, de nuevo, ¡un matiz importante! ¡La fuente Helvetica estándar de Mac OS 9 no tiene cirílico! Para la página en ruso, esto significó lo siguiente: para los usuarios de Windows mostramos la página Arial, para los usuarios de Mac OS 9, en la fuente estándar Helvetica, que muestra información ilegible, y el resto ve la página con el sistema sans-serif. fuente configurada por defecto en el navegador.

Para mostrar correctamente este conjunto a los usuarios de Mac OS 9, en lugar de Helvetica no cirílico, tiene sentido especificar la misma fuente estándar de Mac OS 9, Helvetica CY, que contiene cirílico.

La lectura de las reglas ha cambiado desde el lanzamiento de Mac OS X. Ahora hay una fuente estándar común especificada para Windows/Mac OS X. Y si queremos que los usuarios de Mac OS 9 puedan ver la intención del diseñador, debemos incluir una fuente que contenga cirílico en la línea de fuente.

Entonces, si bien no existen fuentes seguras, existen familias de fuentes seguras. También se les llama pilas de fuentes CSS. Además de las fuentes estándar de Windows/Mac OS X, estas líneas también pueden incluir fuentes equivalentes del conjunto estándar de Mac OS 9 (que no contiene fuentes "seguras" de forma predeterminada) y fuentes comunes de Unix/Linux.

Cualquier diseñador de diseño, tarde o temprano, se encuentra con un momento en el que un diseñador utiliza una fuente en un diseño que no está incluida en la lista de fuentes "seguras"; ¡Pero esto todavía no es motivo para hacer sonar la alarma! Por ejemplo, los diseñadores suelen utilizar en sus diseños la fuente Tahoma, que no está incluida en esta lista. Una línea de fuentes correctamente construida abre la posibilidad de utilizar no sólo Tahoma, sino también otras fuentes. Cada vez más diseñadores aprovechan esta oportunidad y un maquetador competente debería saberlo.

A continuación se muestra una tabla adicional de fuentes que no están incluidas en la lista de fuentes "seguras", pero que se pueden utilizar en diseños.

ventanas Mac OS familia ancestral
Consola Lúcida Mónaco monoespacio
Lúcida sin Unicode lucida grande Sans-serif
tahoma Ginebra C.Y. Sans-serif

¿Qué pasa si no existe el alfabeto cirílico?

Para los textos en inglés, las tablas anteriores tienen una apariencia ligeramente diferente.

ventanas Mac OS Unix/Linux familia ancestral
Arial Negro Artilugio Nimbus Sans L Sans-serif
arial helvética Nimbus Sans L Sans-serif
Cómic Sans MS Mónaco TSCu_Comic cursivo
Mensajero nuevo mensajero Nimbus Mono L monoespacio
Georgia * (vea abajo) Libro escolar del siglo L Serifa
Impacto Carbón Rekha Sans-serif
Times New Roman Veces Nimbus Romano No9 L Serifa
Trabuquete MS helvética Garuda Sans-serif
Verdana Ginebra DejaVu Sans Sans-serif

Para las fuentes Arial, Courier New y Times New Roman, al crear reglas, es mejor especificar primero la fuente Unix/Linux y luego la fuente Mac OS. Esto se debe a cierta corrupción del conjunto de fuentes principales de Linux X11.

Las fuentes que no están incluidas en la lista "seguras", pero que se pueden usar en diseños, se definen mejor mediante pilas de fuentes CSS basadas en esta tabla.

ventanas Mac OS Unix/Linux familia ancestral
Consola Lúcida Mónaco monoespacio
Lúcida sin Unicode lucida grande Garuda Sans-serif
Linotipo Palatino Palatino Garuda** Sans-serif
tahoma Ginebra kalimati Sans-serif

Un guión en la columna Unix/Linux indica que los usuarios de estos sistemas operativos probablemente verán la fuente predeterminada en la página.

Las fuentes son una parte integral y muy importante del diseño de un sitio web, enfatizando su individualidad. El artículo hablará sobre cómo conectar fuentes estándar a una página web, también se les llama fuentes del sistema.

Fuentes de sistema, estándar y seguras

Cualquier navegador muestra solo aquellas fuentes que están presentes en el sistema operativo de la computadora. Por eso se llaman de sistema y se instalan por defecto junto con el sistema operativo.

Y se denominan fuentes seguras porque es probable que se muestren en el navegador de la mayoría de los visitantes del sitio web.

Pero el problema es que los diferentes sistemas operativos tienen instalados diferentes conjuntos de fuentes. Puede ver los conjuntos de fuentes suministrados junto con el sistema operativo en las páginas oficiales de Windows y Mac OS. Y en Unix/Linux no existe ningún estándar.

Para que la página de Internet se muestre de acuerdo con la idea del diseñador, se instaló en CSS una propiedad de fuente llamada font-family

propiedad de familia de fuentes

La propiedad font-family son familias de fuentes agrupadas por ciertas características.

Familias genéricas:
  • serif: fuentes con serifas en los extremos;
  • sans-serif - fuentes sans-serif;
  • cursiva - fuentes en cursiva;
  • fantasía - fuentes decorativas;
  • monospace - fuente monospace (con letras del mismo ancho).

De este modo, simplemente se seleccionan fuentes similares de diferentes sistemas operativos y se conectan a la página de Internet separadas por comas.

Aquí hay un ejemplo, solo para la percepción visual. Volveremos a este ejemplo más adelante cuando consideremos la conexión directa de fuentes.

Simplemente sigue la lógica y todo quedará muy claro.

Cuerpo ( font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; ) Analicemos lo que está escrito:

  • Sistema operativo Windows: Arial;
  • OC Mac OS - Helvética CY;
  • OC Unix/Linux - Nimbus Sans L;
  • Familia genérica: sans-serif.

Las llamadas fuentes seguras

Basado en el sistema operativo Windows, se ha elaborado una lista de varias fuentes seguras.

  1. arial
  2. Arial Negro
  3. Cómic Sans MS
  4. Mensajero nuevo
  5. Georgia
  6. Impacto
  7. Times New Roman
  8. Trabuquete MS
  9. Verdana

Todas estas fuentes están instaladas en Mac OS X, Windows y muchos usuarios de Unix/Linux que tienen instaladas las fuentes Core para el paquete Web.

Para otros usuarios, se proporciona una tabla de correspondencia. Contiene fuentes similares que pertenecen a una familia específica.

Tabla de correspondencia y pertenencia de tipografías a una familia concreta:

ventanasMac OSUnix/Linuxfamilia ancestral
Arial NegroHelvética C.Y.Nimbus Sans LSans-serif
arialHelvética C.Y.Nimbus Sans LSans-serif
Cómic Sans MSMónaco CY* (vea abajo)cursivo
Mensajero nuevo* (vea abajo)Nimbus Mono Lmonoespacio
Georgia* (vea abajo)Libro escolar del siglo LSerifa
ImpactoCarbón C.Y.* (vea abajo)Sans-serif
Times New RomanTimes CYNimbus Romano No9 LSerifa
Trabuquete MSHelvética C.Y.* (vea abajo)Sans-serif
VerdanaGinebra C.Y.DejaVu SansSans-serif

* Al conectar fuentes, puede confiar en ellas con seguridad. La tabla admite caracteres cirílicos y el alfabeto ruso.

Conexión de fuentes del sistema al sitio.

Si necesitas conectarte fuente principal para todo el documento, sólo necesitas agregar el siguiente código a la hoja de estilos CSS:

Cuerpo ( /* conecta la fuente a todo el documento */ font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; /* establece adicionalmente el tamaño de fuente */ font-size: 16px; / * establezca la fuente en negrita, o en lugar de 400, establezca el valor - normal */ font-weight: 400; )

Y así es como se conectan las fuentes del sistema en el marco Bootstrap 4: Las fuentes se incluyen pensando en los dispositivos móviles.

Cuerpo (familia de fuentes: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"; )

Asignar una fuente para los títulos

H1, H2, H3, H4, H5, H6: aquí es lo mismo, solo que configuramos el valor de negrita para resaltar los títulos:

H1, h2, h3, h4, h5, h6 ( familia de fuentes: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; /* conecta la fuente a los encabezados */ peso de fuente: 600; / * establezca el peso de la fuente, o en lugar de 600, establezca el valor en negrita */)

Asignamos una fuente solo a los párrafos:

p (familia de fuentes: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; peso de fuente: normal; tamaño de fuente: 16px;) Línea por línea se ve así:
  1. Conectamos la fuente a los párrafos, se puede aplicar a listas li, bloques div, formularios y otros elementos;
  2. Establezca el peso de la fuente o, en lugar de 600, establezca el valor en negrita;
  3. Además, configuramos el tamaño de fuente para los párrafos.

A asignar una fuente solo a un párrafo específico, o bloque, primero debes asignar una clase a este bloque en el documento HTML:

Aquí hay un párrafo con una fuente complementaria.

Y en la tabla CSS escribe el siguiente código:

Fuente principal (familia de fuentes: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; peso de fuente: normal; tamaño de fuente: 16px;)

Ahora, a cada etiqueta, un elemento html con una clase .font (llámelo como quiera), se le asignará una fuente Arial, con negrita normal (400) y un tamaño de 16 píxeles.
De manera similar, puede asignar diferentes fuentes a listas li, tablas, bloques div completos, palabras individuales o frases.

Conexión de fuentes directamente en un documento HTML

Las fuentes se incluyen directamente en un documento HTML de la misma manera que un archivo CSS, la única diferencia está en la sintaxis. Puede incluir fuentes en el encabezado del documento, entre etiquetas (similar a un archivo CSS) o en línea: asigna propiedades directamente a las etiquetas html.

Incluir fuentes en el encabezado, entre etiquetas . Para hacer esto, agregue el siguiente código al documento html:

Todo es similar a la conexión en el archivo CSS.

Conexión de fuentes en línea

Directamente a los elementos del sitio. Déjame darte algunos ejemplos:

Conectando la fuente al párrafo.

Aquí hay un párrafo con texto.

Resaltamos una palabra separada en negrita y asignamos una fuente separada de la principal

Aquí hay un párrafo con texto, y este palabra, que debe resaltarse en negrita

Resaltamos el enlace en negrita y le asignamos una fuente separada de la principal.

Este es texto simple. Aquí el enlace también es texto simple.

De manera similar, asignamos fuentes a cualquier etiqueta html.

Nota: fuentes del sistema en Bootstrap 4

Los desarrolladores del famoso Framework Bootstrap 4 conectan las fuentes de la siguiente manera para que casi cualquier dispositivo pueda utilizar las fuentes estándar del sistema.

Cuerpo (familia de fuentes: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";)

En este artículo compartiré mi solución al problema de visualización incorrecta de fuentes en Windows 7, que requiere restauración de todas las fuentes estándar enventana 7. El trasfondo de la pregunta es este: recientemente estuve buscando nuevas fuentes originales para usar en un editor de gráficos, descargué un montón de ellas, pero luego me di cuenta de que cuando se agrega una nueva fuente al sistema, si hay una coincide, la fuente original se reemplaza por una nueva (instrucciones sobre cómo instalar fuentes en Windows 7). Como resultado de esta actividad, se volvió imposible trabajar en la mitad de los paneles y aplicaciones del sistema debido a que hablaban en idiomas que no conocía :).

Una búsqueda rápida en Google de " restaurar las fuentes del sistema aventana 7" Y " fuentes estándar paraventana 7", no dio mucho resultado, las soluciones propuestas no ayudaron a fkb (naturalmente, reinstalar el sistema no me convenía). Por lo tanto, decidí seguir mi propio camino y, para empezar, simplemente copié las fuentes originales de un sistema normal conocido (permítanme recordarles que las fuentes se almacenan en el directorio %windir%\fuentes) y reemplacé las fuentes de mi sistema con ellas. La solución solo ayudó parcialmente, fue posible trabajar en el sistema, aparecieron mis caracteres cirílicos nativos, pero los parámetros de fuente dejaban mucho que desear. En primer lugar, el tamaño de algunas fuentes ha cambiado, o su escritura ya no se corresponde con el original, o por alguna razón la fuente se ha puesto en negrita.

Sin embargo, logré descubrir cómo superar este problema. Para hacer esto, necesita restablecer la configuración de fuentes en el registro, para lo cual descargue el archivo adjunto a continuación, que le permite restaurar asociaciones para fuentes estándar en Windows 7. Puede descargarlo:

Este archivo representa el contenido exportado de la sección del registro. HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows NT\CurrentVersion\Fonts en Win 7. Después de aplicar este archivo .reg, es necesario reiniciar el sistema, ¡he aquí! ¡El problema con las fuentes debería desaparecer!

Aquellos. La secuencia que me ayudó a restaurar las fuentes estándar del sistema en Windows 7 es esta:

  • reemplazar fuentes en el directorio %windir%\fonts con fuentes de un sistema "limpio"
  • exportar rama de registro HLM\SOFTWARE\Microsoft\Windows NT\CurrentVersion\Fonts

Espero que si tus fuentes también fallaron, esta solución también te ayude. En cualquier caso, si encuentras un método alternativo que te haya ayudado en tu situación, no dudes en compartirlo en los comentarios. En teoría, las instrucciones también son adecuadas en los casos en que la fuente deseada se eliminó accidentalmente y, después de encontrarla y copiarla, los fallos no desaparecen.

PD. Si no tiene Windows 7 limpio a mano, puede descargar un archivo con fuentes estándar aquí: http://narod.ru/disk/52061075001.99f42303cf1a0ac70dc978dd20406657/original_fonts.zip.html, el tamaño del archivo es de aproximadamente 350 MB.

Esta lista contiene fuentes comunes a todos los sistemas operativos Windows actuales (de hecho, desde Windows 98) y sus equivalentes en Mac OS. Estas fuentes a veces se denominan "fuentes seguras para el navegador" ( fuentes seguras para el navegador). Este es un pequeño libro de referencia que utilizo cuando hago páginas web y creo que también te será útil.

Si eres nuevo en el diseño web, es posible que estés pensando algo como: “¿Por qué debería limitarme a un conjunto tan pequeño de fuentes? ¡Tengo una colección enorme de fuentes hermosas! El hecho es que el navegador del visitante solo puede mostrar aquellas fuentes que están instaladas en su Sistema operativo ( aprox. traductor: Actualmente, ya es posible utilizar prácticamente cualquier fuente al diseñar páginas utilizando CSS 3 y su nueva propiedad. @Perfil delantero; sin embargo, no todos los navegadores todavía soportan esta función), lo que significa que cada el visitante de su página debe ser el propietario de las fuentes que ha elegido. Por lo tanto, sólo debes utilizar fuentes que estén disponibles en cada sistema operativo. Por suerte, CSS tiene una propiedad @Familia tipográfica, lo que facilita esta tarea.

Lista

@font-familia significado ventanas Mac Familia
Arial, helvética, sans-serif arial Arial, Helvética sans-serif
"Arial Black", Gadget, sans-serif Arial Negro Arial Negro, Gadget sans-serif
"Comic Sans MS", cursiva Cómic Sans MS Cómic Sans MS 5 cursivo
"Courier New", Courier, monoespacio Mensajero nuevo Mensajero Nuevo, Mensajero 6 monoespacio
Georgia, serifa georgia 1 Georgia serifa
Impacto, Carbón, sans-serif Impacto Impacto 5, Carbón 6 sans-serif
"Lucida Console", Mónaco, monoespacio Consola Lúcida Mónaco 5 monoespacio
"Lucida Sans Unicode", "Lucida Grande", sans-serif Lúcida sin Unicode lucida grande sans-serif
"Palatino Linotipo", "Libro Antiqua", Palatino, serif Linotipo Palatino, Libro Antiqua 3 palatina 6 serifa
Tahoma, Ginebra, sans-serif tahoma Ginebra sans-serif
"Times New Roman", Times, serifa Times New Roman Veces serifa
"Trebuchet MS", helvética, sans-serif Trabuquete MS 1 helvética sans-serif
Verdana, Ginebra, sans-serif Verdana Verdana, Ginebra sans-serif
Símbolo Símbolo 2 Símbolo 2 -
Cintas Cintas 2 Cintas 2 -
Wingdings, "Zapf Dingbats" Alas 2 Zapf Dinbats 2 -
"MS Sans Serif", Ginebra, sans-serif MS Sans Serif 4 Ginebra sans-serif
"MS Serif", "Nueva York", serif MS Serif 4 Nueva York 6 serifa

1 Las fuentes Georgia y Trebuchet MS se envían con Windows 2000/XP y están incluidas en el paquete de fuentes de IE (y de hecho vienen con muchas aplicaciones de Microsoft), por lo que se instalan en muchas computadoras con Windows 98.

2 Las fuentes de símbolos se muestran solo en Internet Explorer; en otros navegadores generalmente se reemplazan por una fuente estándar (aunque, por ejemplo, la fuente Symbol se muestra en Opera y Webdings en Safari).

3 La fuente Book Antiqua es casi idéntica a Palatino Linotype; Palatino Linotype viene con Windows 2000/XP y Book Antiqua viene con Windows 98.

4 Tenga en cuenta que estas fuentes no son TrueType, sino mapas de bits, por lo que pueden verse mal en algunos tamaños (están diseñadas para mostrarse a 8, 10, 12, 14, 18 y 24 pt a 96 DPI).

5 Estas fuentes solo funcionan en Safari en estilo estándar, pero no funcionan en negrita ni cursiva. Comic Sans MS también funciona en negrita, pero no en cursiva. Otros navegadores de Mac parecen poder emular por sí solos las propiedades de fuente que faltan (gracias a Christian Fecteau por el consejo).

6 Estas fuentes se instalan en Mac solo con instalación clásica

Capturas de pantalla

  • Mac OS X 10.4.8, Firefox 2.0, ClearType habilitado (gracias a Juris Vecvanags por la captura de pantalla)
  • Mac OS X 10.4.4, Firefox 1.5, ClearType habilitado
  • Mac OS X 10.4.11, Safari 3.0.4, ClearType habilitado (gracias a Nolan Gladius por la captura de pantalla)
  • Mac OS X 10.4.4, Safari 2.0.3, ClearType habilitado (gracias a Eric Zavesky por la captura de pantalla)
  • Windows Vista, Internet Explorer 7, ClearType habilitado
  • Windows Vista, Firefox 2.0, ClearType habilitado (gracias a Michiel Bijl por la captura de pantalla)

Publicaciones sobre el tema.