Escribo esto porque mi impresión es que los tutoriales que he ido consultando están mal. O son incompletos, o son incomprensibles, o están alargados innecesariamente para hacer SEO.
Cómo se hace:
https://tuweb.com/fuentes/fichero.woff2
@font-face
{
font-family: 'NombreArbitrarioDeLaFuente';
src: url('/fuentes/fichero-de-la-fuente.woff2') format('woff2');
font-weight: normal;
font-style: normal;
}
Debes recordar que, aunque en Windows las mayúsculas y minúsculas son irrelevantes para un nombre de fichero, en Unix y Linux "Fichero.WoFF"
y "fichero.woff"
son dos archivos diferentes. Numerosos sistemas de alojamiento están basados en Linux. Puede que una mayoría. Por tanto, para evitarse problemas conviene usar sólo minúsculas en los nombres de archivo. Se podría usar mayúsculas sólo, pero la legibilidad es peor.h1
{
font-family: 'NombreArbitrarioDeLaFuente', verdana, arial;
font-size: 3em;
margin: 0em;
padding: 0em;
line-height: 1em;
}
Y ya está.
¿Por qué alojar tú tus fuentes pudiendo dejarlas en un servicio cacheado de terceros como Google? Se aducen varias razones, todas ellas opinables y discutibles, excepto una, que es definitiva: las fuentes de Google no cumplen el RGPD / GDPR porque sirven para perfilar a tus usuarios. Ya hay jurisprudencia.