La fuente que utilizamos en nuestra página web sólo se verá como la visualizamos nosotros si el internauta que la visita tiene el mismo tipo de fuente instalado en su ordenador. Por lo tanto, te recomendamos usar fuentes genéricas. En este artículo te hablamos de ello.
¿Cómo se pueden acomodar los tipos de fuentes?
Por ejemplo, si queremos que nuestra página aparezca con la fuente “Trebuchet MS", entonces deberemos definir el tipo de fuente:
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
Colocando "Trebuchet MS" en primer lugar, indicamos que deseamos que la página sea vista con esta fuente.
Si el internauta tiene esta fuente, entonces la verá en su pantalla con esta fuente. En caso contrario, el navegador lo intentará con la siguiente fuente (Verdana, Arial…) hasta encontrar la correcta.
¿Cuáles son las fuentes por defecto?
Cada sistema operativo y navegador interpretan de distinta forma estas fuentes predeterminadas:
- serif: "Times New Roman" en Windows, y "Times" en Mac (diferente a la de Windows).
- sans serif: “Arial” en Windows, y "Helvetica" en Mac.
- monospace: "Courrier New" en Windows, "Courrier" en Mac, y por lo general "VeraSans" o "DejaVuSans" en Linux.
Así es como se verán estas fuentes en Windows:
Lo mismo en Windows, pero con ClearType activado:
En MacOS X en Safari:
En Linux (Ubuntu) en Firefox:
¿Qué recomendaciones son prácticas para escribir el tipo de fuente?
Para las fuentes con serifa debemos definir:
"Times New Roman", Times, serif;
Para las fuentes sin serifa:
Verdana, Arial, Helvetica, sans-serif;
Nota: Verdana es más fácil de leer en la pantalla que Arial.
Para las fuentes con un espacio fijo:
"DejaVu Sans Mono","Bitstream Vera Sans Mono", monospace;
Recomendamos tener en cuenta que DejaVu y Vera son familias de fuentes open source fáciles de leer. Al contrario que Courrier) permiten distinguir bien el 0 de la O y el 1 de la l.
Webmaster
- Problemas fuente letras páginas web [resuelto] > Foros - Internet
- Páginas web en html hechas [resuelto] > Foros - Programación
- No puedo entrar a algunas páginas web que antes si podía [resuelto] > Foros - Software
- Icono de pagina web html > Guide
- Como subir una pagina web a internet gratis > Foros - Webmastering
- Cómo quitar el subrayado de los enlaces en HTML/CSS
- Por qué no aparecen imágenes en una página web
- Cómo adaptar una página web a diferentes resoluciones
- PhpMyAdmin: #1045 Access denied for user root@localhost
- Cómo crear una DIV transparente con CSS
- Cómo modificar la altura de un elemento HTML en Javascript
- Php/xhtml: cómo mostrar el código de páginas web
- Cómo insertar un PDF en una página web
- Índice indefinido en PHP: cómo solucionar errores
- Cómo redireccionar una página en PHP
- Cómo verificar el formato de una dirección de correo
- Cómo obtener la altura de un elemento HTML en Javascript
- Cómo verificar el dominio de una dirección de correo con PHP
- Cómo cambiar el aspecto del cursor
- Cómo integrar la función split() en Javascript
- Cómo detectar la resolución de la pantalla en PHP
- Las normas en ergonomía de software
- Cuál es la diferencia entre display:none y visibility:hidden
- Cómo insertar espacios consecutivos en HTML
- Cómo alojar imágenes en la Web con ImageShack
- Cómo crear una página web dinámica y bonita
- Cómo validar una página HTML
- Cómo instalar Joomla en Wamp
- Cómo obtener la concatenación de cadenas en Javascript
- Cómo hacer un formulario en línea
- Criterios Ergonómicos: métodos de evaluación
- Apache y Windows: cómo crear un host virtual