Las Mejores fuentes para usar en 2020. En este contenido, le mostraremos las 20 mejores fuentes HTML que puede usar en su sitio web.
Una fuente que se ajuste a su propuesta de proyecto en línea mejorará el diseño web, haciendo que el contenido sea más fácil de leer.
Sin embargo, elegir la opción correcta puede ser difícil. Precisamente porque hay muchas opciones por ahí. E incluso algunas fuentes son muy similares a otras para muchas personas.
¿Por qué necesita saber las fuentes para HTML?
Lo sepa o no, una fuente HTML es una parte fundamental de su sitio web . No solo permite a sus visitantes leer contenido más fácilmente, sino que también mejora la estética de una página.
Debe elegir la tipología de su sitio web con mucho cuidado. El uso de tipos muy pequeños o muy grandes puede tener un impacto negativo en la apariencia de su sitio para los lectores.
Además, algunas fuentes son seguras de usar en sitios web. Mientras que otros lo son menos. Entraremos más sobre esto en detalle a continuación.
¿Cómo cambiar una fuente de texto a fuentes HTML?
Para cambiar una fuente de texto a HTML, puede usar el atributo de estilo dentro de la etiqueta <p> que define el uso de los párrafos. Aquí hay un ejemplo:
- <p style = «font-family: mensajería, arial, helvética;» >
- Escribe tu texto aquí
- </p>
Hay tres tipos de fuentes en el ejemplo anterior (Courier, Arial y Helvetica). El segundo y el tercero son copias de seguridad en caso de que el primero no se encuentre en la página o no esté instalado.
¿Qué es una fuente web segura?
Safe Web Font es un término utilizado para describir una fuente que se instala universalmente en todas las computadoras. Su sitio web se cargará más rápido cuando use una fuente web segura que ya esté almacenada en su máquina.
Y afectará el SEO de su sitio, ya que los motores de búsqueda consideran la carga de una página como uno de los factores de clasificación más importantes.
Es por eso que recomendamos que siempre use una fuente web segura. Esto garantiza que sus visitantes puedan verlo fácilmente mientras mantiene el rendimiento de su sitio allí.
Tenga en cuenta que existen alternativas para proteger las fuentes web y que generalmente comparten algunas de las características más populares, como Helvetica , Futura , etc.
Por ejemplo, las alternativas a Sans Serif como Futura son Noir Pro y Lorin .
Aparte de eso, a diferencia de las fuentes web seguras, las fuentes alternativas no suelen instalarse en los sistemas operativos.
Sin embargo, es posible que desee usar algunos de ellos porque cree que una fuente en particular se usa de manera tan excesiva que desea diferenciarse.
Solo recuerde que, al elegir utilizar una fuente alternativa, la velocidad de su sitio web puede verse un poco comprometida.
¿Cuáles son las 5 familias de fuentes existentes?
En tipología, cada fuente es miembro de una de estas 5 familias de fuentes que mostraremos a continuación. Esta similitud se basa únicamente en el diseño.
Cursiva (ejemplo: Zapf-Chancery)
Las fuentes de la familia cursiva imitan la caligrafía humana. Es por eso que todas las letras están unidas, juntas y sin separaciones.
Fantasía (ejemplo: Star Wars)
La familia Fantasy generalmente tiene elementos decorativos en cada letra, pero aún representan personajes. Muchos libros de ficción o películas usan este tipo de fuente en sus títulos.
Serif (ejemplo: Times New Roman)
Tipografías.online
La característica más llamativa de esta familia de fuentes es una pequeña línea en los extremos de cada letra o símbolo. Varios sitios web usan Serif para el cuerpo de sus textos en contenido escrito.
Sans-serif (ejemplo: Helvetica)
Tipografías.online
A diferencia de Serif, Sans-serif no tiene la línea pequeña unida a cada letra o símbolo. Además, la fuente generalmente tiene un ancho similar, presentando una apariencia minimalista y moderna.
Monospace (ejemplo: Courier)
Cada letra y símbolo en la familia de fuentes Monospace ocupa exactamente el mismo espacio horizontalmente. A menudo se usa en máquinas de escribir o terminales de computadora.
Tipografías.online
¿Qué tipos de fuentes HTML utilizo en mi sitio?
Las fuentes que vamos a mostrar en nuestra lista de fuentes HTML son todas del tipo «web segura». Debido a esto, son compatibles en todos los sistemas y en una variedad de dispositivos.
Cada uno de ellos tiene características únicas. Por lo tanto, debe tener en cuenta el estilo de su sitio web y el tono de su escritura antes de elegir la fuente correcta.
Lista de fuentes HTML: las 20 mejores fuentes web seguras
1. Arial
Arial es una fuente de la familia Sans-serif y es una de las más utilizadas en el mundo. Muchos críticos dicen que esta fuente es una apuesta segura. Por lo tanto, ambos textos en Internet y en periódicos suelen tener la fuente Arial.
2. Times New Roman
Esta fuente HTML es una variación de la fuente Times anterior del grupo Serif. Times New Roman es la opción favorita para el contenido publicado en libros y publicaciones impresas. Esta fuente incluso fue recomendada por la APA (American Psychological Association).
3. Helvetica
Los diseñadores generalmente adoran Helvetica. Es por eso que las personas siempre lo hacen bien cuando lo eligen como fuente. Como era de esperar, las principales marcas mundiales como Jeep , Kawasaki , Motorola y BMW utilizan esta fuente en sus logotipos.
4. Times
The Times se imprimió originalmente en la mayoría de los periódicos más antiguos. Y si desea agregar una sensación tradicional o formal a su sitio web, esta fuente es perfecta para eso.
5. Courier New
Esta fuente es una de las alternativas a Courier. Es más delgado y visualmente más atractivo para la vista cuando lo ves en una pantalla. Es por eso que los dispositivos electrónicos casi siempre usan Courier New.
6. Verdana
Esta fuente se puede leer en tamaños pequeños en pantallas con resoluciones más bajas. Muchas personas identifican a Verdana como una fuente de pantallas, aunque eso no es del todo cierto. Por ejemplo, IKEA utiliza esta fuente no solo para el sitio web, sino también para los catálogos.
7. Courier
El Courier es una de las fuentes más famosas de la familia Monospace: todos los sistemas operativos se envían con él. Esta fuente HTML también se ha utilizado como estándar en los guiones de cine debido a su característica de ser similar a la tipología de la máquina de escribir.
8. Arial Narrow
Es una de las versiones más elegantes de Arial. Aunque es una alternativa, los usuarios pueden encontrarlo instalado en una variedad de sistemas operativos.
9. Candara
Microsoft Vista fue el primer sistema operativo en utilizar Candara. Junto con las fuentes Calibri y Cambria, la letra «C» en estas fuentes está bien integrada con el sistema de representación de tipografía de Windows.
10. Ginebra
Ginebra deriva de la ciudad donde vivió el diseñador que la creó (Ginebra, Suiza). La ginebra pertenece al grupo de fuentes de la familia Sans-serif.
11. Calibri
Es la fuente estándar utilizada en el conjunto de aplicaciones de Microsoft Office. Debido a que Windows es uno de los sistemas operativos más utilizados, estamos seguros de que esta fuente HTML se adapta a la mayoría de los sitios web.
12. Optima
Optima se inspiró en las letras romanas clásicas y se utiliza en cualquier tipo de texto, desde una señal de tráfico e incluso en logotipos de productos. Erik Spiekermann , una conocida impresora alemana, dice que Optima se puede encontrar en la mayoría de los estacionamientos y hospitales en los Estados Unidos.
13. Cambria
Junto con Calibri y Candara, Cambria es una de las fuentes que Microsoft usa como tecnología de representación de pantalla.
14. Garamond
Garamond es un tipo de fuente clásica que se imprime en muchos libros. Este estilo de fuente se ajusta a una propuesta en la que desea crear un aspecto seguro en su sitio web.
15. Perpetua
Esta fuente es la idea de un escultor inglés que quería crear una fuente totalmente original. Muchos artistas y textos académicos de Penguin Classics y la Universidad de Pennsylvania usan Perpetua en su trabajo.
16. Mónaco
Monaco es una fuente que viene integrada en MacOS X. Es una fuente de la familia Monosspace. Mónaco tiene una letra diferenciada «O» y el número «0» (cero), que contiene una línea diagonal dentro de ellos. Hasta 2009, MacOS usaba esta fuente en su terminal y en Xcode.
17. Didot
Didot es una fuente de la familia Serif y ha sido descrito como neoclásico por muchos críticos. Uno de sus usos más famosos es en CBS News y The Late Show of Stephen Colbert .
18. Brush Script MT
Esta fuente tiene un estilo de caligrafía basado en una técnica de escritura a mano. Por lo tanto, Brush Script MT se convierte en una opción de fuente HTML muy hermosa y fácil de leer para su sitio web.
19. Lucida Bright
Lucida Bright es una de las versiones de la familia de fuentes Lucida Bright. La diferencia es que las líneas de esta fuente tienen más contraste que los otros miembros del grupo. Una publicación famosa que utiliza Lucida Bright es la revista Scientific American .
20. Copperplate
Los diseñadores de Copperplate querían que la fuente se usara solo para encabezados y títulos. Es por eso que esta fuente está en mayúscula. Se hizo bastante famosa cuando el programa Who wants to be a millionaire comenzó a usarla como marca registrada.
