:-) Guía sobre cómo optimizar fuentes en WordPress

√ćndice

¡Muy buenas querido lector! Ya estoy una semana más por aquí y, como siempre, te traigo un nuevo post en el que te mostraré cómo optimizar las fuentes de tu WordPress.

Por este motivo, en el post de hoy hablaré sobre WPO a fin de que consigas optimizar tu WordPress de la forma más óptima posible sin la ayuda de un consultor WPO.

Ten en cuenta que las fuentes y tipograf√≠as de un WordPress son uno de los elementos m√°s pesados ‚Äč‚Äčde cualquier p√°gina web desarrollada con el gestor de contenido WordPress.

Por todo ello, en esta gu√≠a te mostrar√© c√≥mo optimizar las fuentes o tipograf√≠as de tu WordPress y, adem√°s, le mostrar√© c√≥mo optimizar las fuentes de Google (Google Fonts) dentro de su p√°gina web como har√≠a un dise√Īador WordPress profesional.

Por tanto, no me entretengo m√°s que hay mucho que contar.

¡En el lío!

¬ŅPor qu√© ser√° importante optimizar las fuentes de tu WordPress?

Básicamente tendrás que optimizar las fuentes de tu WordPress porque éstas son uno de los componentes más lentos de cualquier página web.

Además, con la llegada de las Core Web Vitales de Google optimizar las tipografías de WordPress será fundamental para conseguir una buena nota en la herramienta de Google Page Speed.

De hecho, una mala optimización de las fuentes de tu WordPress provocará que estas Core Web Vitals nunca sean positivas.

¬ŅEs necesario optimizar las Google Fonts?

¬°Por supuesto que si es necesario hacerlo!

Las Google Fuentes (Tan utilizadas en todas las páginas web WordPress) son hoy día uno de los principales motivos por los que muchas páginas web suspenden sus tests de velocidad web.

Esto se debe a que la gran mayoría de webmasters no saben cómo optimizar las Google Fuentes de sus páginas web.

De hecho, estas Google Font ralentizan las páginas web ya que para cargarse necesitan hacer una petición externa desde tu página web a los servidores de Google provocando así una gran ralentización de la velocidad de carga de tu página web.

Por este motivo, hoy también aprenderás a optimizar las fuentes de Google en tu WordPress.

[TUTOSEO] Cómo optimizar las fuentes de WordPress

Bien, vamos con lo que realmente te interesa, cómo optimizar las fuentes de tu página web WordPress.

Para llevar a cabo esta optimización tendrás que seguir estos pasos:

Utilizar fuentes ligeras

Cuanto más pese una tipografía utilizada en tu página web más tardará ésta en cargar la página.

Por tanto, utiliza tipografías ligeras en tu WordPress.

¬ŅC√≥mo sabr√°s si una fuente es ligera?

  • Si te la descargas la fuente desde el portal oficial de Google Fuentes podr√°s saber el tama√Īo del archivo directamente.
  • Si esta fuente ya se encuentra alojada en tu p√°gina web bastar√° con utilizar una herramienta de medici√≥n como GTmetrix que le indicar√° el tama√Īo de cada recurso cargado en una URL en concreto.

Reduce al m√≠nimo el n√ļmero de fuentes

Cuantas más tipografías utilices en tu página web más recursos se tendrán que cargar.

Por tanto, utiliza un máximo de dos tipografías por página web e intenta utilizarlas siempre en el mismo grosor (No con diferentes variantes tipo 300, 400, bold, thin, etc).

Usa la precarga tus peticiones externas

Una forma de mejorar un poco la velocidad de carga de tu página web será mediante la precarga de tipografías.

Esta precarga lo que har√° ser√° priorizar la carga de recursos web que indiques antes de ponerse a cargar el resto de archivos que compondr√°n el dise√Īo de una URL de tu p√°gina web.

Es decir, será cómo priorizar la carga de un elemento dentro de tu página web.

Precarga de fuentes con WP Rocket

Preconecta el dominio de tus fuentes externas

La preconexión de dominios de fuentes externas provocará una leve mejora (Pero mejor al fin y al cabo) de tu velocidad web.

De esta forma, de nuevo priorizar√°s la carga de las fuentes por encima del resto de elementos.

En caso de que quieras preconectar tus Google Fonts deber√°s a√Īadir la siguiente l√≠nea:

//fonts.google.com

Preconecta con WP Rocket

Aloja localmente tus fuentes en WordPress

Cómo habrás podido comprobar siempre que se deba realizar una petición externa a otro servidor, tu velocidad web se verá afectada.

Por este motivo, y para que no te ocurra lo mismo te recomendaré alojar todas tus tipografías de WordPress de forma local para ahorrar peticiones externas en tu página web.

Para alojar tus tipografías de forma local en tu WordPress tendrás diferentes métodos:

Mediante plugins de tipografías para WordPress

Podr√°s utilizar el plugin Tipo de letra alojados PRO para alojar localmente en tu p√°gina web las Google Fonts utilizadas en tu p√°gina web.

Además, también podrás utilizar el plugin Utilice cualquier fuente de WordPress para alojar cualquier tipo de fuente de forma local en tu WordPress.

Mediante plugins de rendimiento web

Gracias a plugins como Perfmateros y la sección fuentes podrás alojar localmente tus Google Fonts fácilmente.

Alojar fuentes de forma local con Perfmatters

Mediante los propios maquetadores web

Como ya sabrás querido lector soy fan de Elementor y, como no podía ser de otra forma, el mismo maquetador visual te permitirá instalar cualquier fuente en Elementor.

Para instalar una fuente en Elementor tendrás que ir a la sección Elementor > Tipografías personalizadas.

Instalar fuentes en Elementor

Vía FTP y CSS

Como √ļltimo m√©todo (Lo menos recomendado) podr√°s subir tus fuentes de forma local v√≠a FTP y podr√°s mostrarlas en tu p√°gina web mediante CSS.

Optimiza la visualización de tus tipografías en WordPress

No será suficiente que sólo alojes de manera local tus fuentes. También deberás optimizar su visualización.

Por eso, Google siempre le recomendar√° utilizar el formato SWAP.

Este método (Qué podrás configurar en plugins como Perfmateros , Utilice cualquier fuente de WordPress o Tipo de letra alojados PRO) te permitirá utilizar este sistema de visualización de fuentes que hará lo siguiente:

Primero cargará la fuente estándar de tu navegador (La más ligera disponible) para que el usuario pueda leer el contenido de tu página web lo antes posible y, mientras cargará el resto de la página incluidas las tipografías de tu página web.

De esta forma, el lector siempre tendrá texto disponible para leer mientras se carga la tipografía oficial.

PD. Si el método SWAP dispara el CLS de las Core Web Vitales de tu página web intenta optar por el formato OPTIONAL

Use un conector de caché

Las fuentes también serán susceptibles de ser cacheadas de forma que utilizar un plugin de caché en tu página web como WP Rocket le ayudará en esta tarea.

De hecho, WP Rocket registrar√° de forma nativa todas tus fuentes de WordPress.

Sirve las fuentes desde una CDN

Utilizar una CDN siempre ser√° √≥ptimo para proyectos web con p√ļblico de distintos pa√≠ses (Si haces SEO internacional, por ejemplo).

Por tanto, si este es su caso no desperdicia la opción de servir sus fuentes directamente desde una CDN.

De esta forma, ahorrar√°s recursos en tu servidor y mejorar√°s la velocidad de carga.

Conclusiones ¬ŅVale la pena optimizar las fuentes de un WordPress?

Como has visto a lo largo del post, optimizar las fuentes un WordPress supondrá una mejora significativa del rendimiento de ésta.

Por tanto, yo que t√ļ no dejar√≠a escapar esta oportunidad de optimizar cada palmo de tu p√°gina web ya que c√≥mo sabr√°s, desde que Google sac√≥ sus Core Web Vital est√° claro que el WPO cada d√≠a ir√° cobrando mayor relevancia en internet.

Por todo ello, no dejes de optimizar el WPO de cada proyecto web que arrojes y, en la medida de lo posible, intenta empezar por la optimización de las tipografías web.

Ahora te toca a ti querido lector ¬ŅTienes optimizadas las tipograf√≠as de tu p√°gina web? ¬ŅConoc√≠as todos estos m√©todos? Te leo en los comentarios.

¬°Nos vemos en dos semanas!

VER MAS ENTRADAS
virus rat la caixa
OPTIMIZACION SEO
Ibm Trusteer Caixabank, Virus RAT que genera transferencias de dinero

Cómo eliminar el malware RAT de IBM Trusteer: Herramientas y consejos
Descripci√≥n: El malware RAT de IBM Trusteer puede causar graves problemas de seguridad y privacidad en su ordenador. ¬ŅSospecha que su ordenador ha sido infectado? Descubra c√≥mo eliminar el malware RAT de IBM Trusteer con una lista ordenada de herramientas que incluye herramientas de eliminaci√≥n de IBM Trusteer, programas antivirus y antimalware, herramientas de escaneo en l√≠nea, firewalls y herramientas de limpieza y optimizaci√≥n de sistema. Haga clic aqu√≠ para obtener consejos √ļtiles y precauciones para proteger su ordenador y cuentas en l√≠nea.

Leer m√°s ¬Ľ