✅ Noticias, temas, complementos de WEB y WordPress. Aquí compartimos consejos y las mejores soluciones para sitios web.

Las 36 formas de acelerar su sitio de WordPress

13
Contenido

Es una locura ahí fuera.

No quiero ser cínico, pero esta es la verdad:

La mayoría de las publicaciones de blogs sobre cómo acelerar WordPress son un desastre.

En la parte superior de la lista, incluyen consejos que solo acelerarán su menú de administración en 0.01s o, literalmente, no mejorarán el rendimiento en absoluto.

Luego, cerca de la parte inferior, incluyen algunas de las técnicas de rendimiento más impactantes disponibles.

Eso es una locura. Así es como está organizada mi guía de rendimiento …

Comience con los pasos de alto impacto.

Primero enumeré las 9 formas más impactantes de acelerar su sitio. Estos son, con mucho, los pasos más importantes que puede seguir para que su sitio se cargue más rápido.

De hecho, si no usa ninguna táctica más allá de las primeras 9, estará bien.

Luego, después de eso, encontrará 27 formas adicionales de acelerar WordPress. Cada una de estas tácticas hará que su sitio sea un poco más rápido al aumentar los resultados que ya ha logrado.

Y hay una cosa más que debes saber.

Estas son las tácticas exactas que utilizo

No estoy enumerando ninguna táctica aquí que no esté usando en este momento.

De hecho, antes de escribir esta publicación, se me ocurrió una gran lista de técnicas de rendimiento, incluidas algunas cosas que nunca había probado antes, y las probé todas.

Competethemes.com ya se estaba cargando rápidamente, pero después de usar todas las tácticas de rendimiento que se enumeran a continuación, es increíblemente rápido.

Aquí están los resultados de GTMetrix :

Las 36 formas de acelerar su sitio de WordPress

Mi primera vez obteniendo un puntaje de PageSpeed ​​del 100%

Y si utilizo una ubicación cercana en Pingdom, informan que mi sitio se carga en solo 0.571 segundos.

Las 36 formas de acelerar su sitio de WordPress

Algunos puntos de referencia rápidos antes de comenzar:

  • > 3 s el tiempo de carga es lento
  • 2-3 segundos de tiempo de carga es bueno
  • El tiempo de carga de 1-2 s es rápido
  • El tiempo de carga de 0-1 s es muy rápido

Su primer objetivo debe ser que su sitio se cargue en menos de tres segundos. Es realmente importante alcanzar este punto de referencia o seguramente tendrá visitantes que se irán antes de que su sitio termine de cargarse.

Si implementa las primeras 9 tácticas a continuación, no debería tener problemas para que su tiempo de carga sea inferior a 3 segundos.

Si desea que su sitio se cargue en solo 1 s, deberá usar la mayoría, si no todas, las tácticas enumeradas aquí y es mucho trabajo. No te culpo si te afeitas unos segundos con las tácticas 1-9 y terminas el día 👍

Probablemente esté ansioso por comenzar ahora, así que este es el paso más importante que puede tomar para acelerar su sitio web.

¡Esta publicación es escandalosamente larga! Probablemente no lo termines de una vez, así que asegúrate de marcar esta página para más adelante para que puedas seguir regresando mientras optimizas tu sitio.

1 Cambie a un host más rápido

El alojamiento es la potencia de su sitio.

Con un alojamiento más potente, todo su sitio se cargará más rápido.

Puede implementar cualquier otra técnica con gran efecto, pero todas funcionarán mejor con un host de alto rendimiento. Además, cambiar de host en estos días es realmente fácil.

Uso Kinsta para Compete Themes y no puedo recomendarlos lo suficiente.

Las 36 formas de acelerar su sitio de WordPress

Además de las copias de seguridad diarias automatizadas, el hermoso panel de usuario y el soporte de chat en vivo realmente útil …

Harán que su sitio se cargue rápidamente.

Kinsta funciona muy bien porque está construido a partir de la infraestructura en la nube de Google.

Las 36 formas de acelerar su sitio de WordPress

Normalmente, este tipo de tecnología especializada solo está disponible para empresas debido a los costos y la dificultad de implementación, pero Kinsta se encarga de todo eso por usted. Simplemente obtienes un rendimiento increíble.

He estado usando Kinsta durante seis meses y ya estaba contento con su servicio cuando aumentaron aleatoriamente el rendimiento de todos en un 30-200% hace un par de semanas.

Después de casi una década de ejecutar sitios web de WordPress, nunca tuve un anfitrión que hiciera eso.

Echa un vistazo a Kinsta →

El alojamiento es la base del rendimiento de su sitio, por lo que si omite todo lo demás, asegúrese de realizar este paso correctamente.

Lo siguiente más importante que puede hacer para acelerar su sitio de WP es agregar almacenamiento en caché.

2 Agregar almacenamiento en caché

¿Cuanto es 9.027 dividido por 17?

Para responder a esto, necesita sacar una calculadora, marcar los números y luego podría decir con confianza la respuesta que es 531.

Ahora te preguntaré de nuevo, ¿cuánto es 9.027 dividido entre 17?

Esta vez supiste la respuesta al instante porque la tienes almacenada en tu memoria.

Así es el almacenamiento en caché.

Cuando alguien visita su sitio web, ejecuta varios procesos para generar la página. Sin almacenamiento en caché, esto sucede cada vez que alguien visita su sitio web. Es como usar una calculadora para obtener la respuesta una y otra vez.

Como puede comprender, esto es un desperdicio enorme.

Con el almacenamiento en caché, su sitio genera una página una vez y luego la guarda tal como guardó el número 531 en su memoria. Luego, cuando alguien visita su sitio nuevamente, la copia en caché se entrega inmediatamente sin necesidad de ejecutar todos los procesos que se usaron originalmente para crear la página.

¿Tener sentido?

Ahora hablemos de cómo aprovechar esta tecnología en su sitio web.

Cómo agregar almacenamiento en caché a su sitio

En primer lugar, su host podría proporcionar almacenamiento en caché integrado. Esto es cierto para Kinsta y muchos otros hosts de alto rendimiento. Por lo tanto, es posible que ya haya agregado el almacenamiento en caché.

Si su host no proporciona almacenamiento en caché, hay muchos complementos para elegir. En mi opinión, la mejor opción es WP Rocket.

Las 36 formas de acelerar su sitio de WordPress

WP Rocket proporciona almacenamiento en caché ultrarrápido y muchas otras optimizaciones de rendimiento. Voy a hacer referencia a este complemento unas cien veces más a lo largo de esta publicación, para que veas todo lo que puede hacer.

Aunque Kinsta proporciona almacenamiento en caché, también uso WP Rocket debido a las otras herramientas de rendimiento incluidas.

Puede seguir mi tutorial de configuración de WP Rocket para comenzar:

Echa un vistazo a WP Rocket →

Si desea una alternativa gratuita, le recomiendo WP Super Cache si desea algo fácil de usar y W3 Total Cache si desea opciones más avanzadas.

El alojamiento y el almacenamiento en caché de alto rendimiento son definitivamente las características de velocidad más importantes que necesita su sitio. Dicho eso …

Solo queda una cosa que puede descarrilar completamente su desempeño.

TIENE que seguir estos tres pasos siguientes

Una vez que haya configurado su almacenamiento en caché, dirija su atención a las imágenes de su sitio.

Si no optimiza sus imágenes, su sitio nunca alcanzará los tiempos de carga de 2 a 3 segundos, nunca obtendrá una puntuación de PageSpeed ​​optimizada.

Las imágenes pueden ser un lastre absolutamente enorme en los tiempos de carga, por lo que incluyo las tres formas en que puede optimizarlas aquí.

La primera forma de optimizar sus imágenes es comprimirlas.

3 Comprime tus imágenes

Los algoritmos modernos de compresión de imágenes son asombrosos.

Pueden reducir el tamaño del archivo de una imagen en un 70% sin afectar su calidad de manera notable. El punto es que puede hacer que todas las imágenes de su sitio se carguen mucho más rápido sin degradar su calidad. No hay inconvenientes, ¡en serio!

Cuando se trata de optimización de imágenes, mi complemento favorito es Optimole.

Las 36 formas de acelerar su sitio de WordPress

Aprenderá más sobre Optimole en los siguientes dos pasos, pero esto es lo que necesita saber primero:

Optimole utiliza un algoritmo de compresión muy eficaz para comprimir sus imágenes a una fracción del tamaño de archivo anterior. Lo que es aún mejor es que es muy fácil de usar.

Otros complementos de optimización de imágenes editan las imágenes en su sitio y utilizan los recursos de su servidor. Optimole no toca sus originales: copia sus imágenes en su servidor y luego las optimiza allí. Esto mantiene su biblioteca multimedia organizada y su sitio no se ralentizará cuando las imágenes se comprimen.

Si desea aprender cómo configurar Optimole en su sitio, puede seguir mi video tutorial completo:

Una excelente alternativa es el complemento ShortPixel. Es un poco más complicado de configurar, pero aún así es bastante fácil de usar.

Felizmente usé ShortPixel en este sitio durante años y solo cambié a Optimole para esta próxima táctica.

4 Cambiar el tamaño de sus imágenes

Preste mucha atención porque los detalles son críticos.

Esta es la gran idea:

Cuanto más grandes sean las dimensiones de una imagen, mayor será el tamaño del archivo.

Por ejemplo, una imagen de 3.000 px de ancho puede tener 900 kb, pero cuando se cambia de tamaño a 600 px de ancho, solo tiene 60 kb. ¡Eso es una reducción de 15 veces en el tamaño del archivo!

He aquí por qué es tan importante.

Las imágenes de esta publicación de blog solo se mostrarán 600 píxeles de ancho en su parte más ancha. Ejecutando mi ejemplo, esta imagen cambió de tamaño a 600px de ancho y solo tiene 60kb.

Las 36 formas de acelerar su sitio de WordPress

Si no cambiara el tamaño de la imagen y usara la versión de 3,000px, todavía se mostraría como 600px de ancho en esta publicación. La imagen le parecería igual, pero tardaría 15 veces más en cargarse.

En otras palabras, dimensionar sus imágenes correctamente antes de insertarlas en sus publicaciones puede marcar una gran diferencia en la rapidez con la que se carga su sitio.

Aquí está el problema.

Probablemente no sepa exactamente qué tan amplias se muestran sus imágenes en sus publicaciones. Además, los dispositivos móviles hacen que esto sea más complicado. Cuando se trata del tamaño de la pantalla, si consideramos todos los diferentes monitores y dispositivos móviles, hay literalmente miles de los que se deben tener en cuenta.

Si desea ofrecer imágenes que tengan el tamaño perfecto para sus visitantes, deben tener un tamaño dinámico, y es por eso que comencé a usar Optimole.

Optimole genera automáticamente versiones de sus imágenes de tamaño perfecto. Si alguien visita su sitio y la imagen se mostraría a 400 px de ancho, Optimole le da una versión de esa imagen de 400 px de ancho.

Otro visitante podría aterrizar en la página un segundo después usando una tableta que muestra la imagen a 510 px de ancho y Optimole cargará una copia diferente de la imagen que tiene exactamente 510 px de ancho.

Las ganancias de rendimiento que obtiene de esto son enormes y la mejor parte es que no tiene que hacer nada más que instalar el complemento Optimole. Funciona en el momento en que lo activa sin siquiera tocar ninguna configuración. ¡Es asombroso!

Pruebe Optimole en su sitio →

Hay una forma más de optimizar las imágenes en su sitio que potencialmente puede marcar una gran diferencia.

5 Carga perezosa tus imágenes

Esta publicación de blog es muy larga y tiene muchas imágenes.

Si ha leído hasta aquí, es probable que haya estado en esta página durante al menos un minuto. Sabiendo esto, ¿qué tan tonto sería hacerte cargar todas las imágenes en toda la publicación cuando cargaste esta página por primera vez? Aún no ha llegado a muchas de las imágenes, por lo que aún no es necesario cargarlas.

Con la carga diferida, solo se cargan las imágenes que aparecen en pantalla. Luego, a medida que se desplaza hacia abajo en la página, las imágenes restantes se cargan a medida que aparecen en la pantalla.

Hice una visualización en este video que ilustra cómo funciona esto más claramente de lo que puedo explicar con la escritura:

Ahora que comprende cómo funciona la carga diferida, hablemos de la implementación.

Cómo agregar carga diferida

Agregar carga diferida es realmente fácil, por lo que es una táctica imprescindible en mi opinión.

Primero, si instaló Optimole, automáticamente agrega carga diferida, por lo que ya ha terminado con esta táctica.

En segundo lugar, si no está usando Optimole pero decidió usar WP Rocket, simplemente marque esta casilla aquí en la configuración:

Las 36 formas de acelerar su sitio de WordPress

Por último, si no va a utilizar ninguno de esos dos complementos, instale a3 Lazy Load.

Las 36 formas de acelerar su sitio de WordPress

a3 Lazy Load es un gran complemento e incluye muchas opciones de configuración.

En publicaciones de blog como esta, la carga diferida es muy importante. Es una de mis optimizaciones de rendimiento favoritas.

Las siguientes dos optimizaciones van de la mano y son especialmente importantes para los sitios web de WordPress.

6 Minifica tus archivos

Acaba de aprender que comprimir sus imágenes hace que se carguen más rápido porque las imágenes comprimidas tienen un tamaño de archivo más pequeño.

A veces nos referimos al tamaño del archivo como peso, por lo que comprimir una imagen reduce su peso.

La gran idea es que reducir el peso de su sitio hace que se cargue más rápido. Eso significa que desea reducir el tamaño de cada archivo que carga su sitio web.

Además de las imágenes, su sitio web carga archivos CSS, archivos Javascript y archivos de fuentes, entre otros tipos de archivos. Mantenga ese pensamiento por un momento y hablemos de minificación.

La minificación es un término de programación elegante que básicamente significa compresión para archivos basados ​​en texto. Comprime imágenes y minimiza archivos. Para nuestros propósitos, no necesitamos ser más detallados que eso.

Al igual que comprimió sus imágenes, puede minimizar sus archivos CSS y Javascript (y HTML) para hacerlos más pequeños y reducir el peso de su página.

Cómo minificar archivos

Una vez más, agregar minificación a su sitio es simple.

Con WP Rocket, hay casillas de verificación para habilitar la minificación para CSS, JS y HTML.

Las 36 formas de acelerar su sitio de WordPress

Minificar sus archivos CSS con WP Rocket es simple

Eso es todo lo que necesitas hacer.

La minimización es muy importante para los sitios de WordPress porque es probable que tenga al menos seis complementos y un tema cargando archivos en su sitio. Muchas veces, los desarrolladores no minimizan los archivos por sí mismos, por lo que WP Rocket se encarga de eso por usted.

Si desea una alternativa gratuita para la minificación, consulte el complemento Autoptimize.

7 Concatenar sus archivos

Concatenar es otro término técnico que significa "combinar".

Cuando concatenas archivos, los combinas.

Una vez más, dado que tiene todos estos complementos en su sitio cargando archivos, es importante usar un complemento como WP Rocket para combinarlos en la menor cantidad de archivos posible. Este es el por qué…

Ha aprendido que disminuir el peso de su página hace que se cargue más rápido, pero hay otro factor de rendimiento importante para optimizar: las solicitudes HTTP.

Sé que esta publicación se está volviendo bastante técnica, así que lo mantendré lo más simple posible.

Cada archivo que carga requiere una solicitud HTTP. Cada imagen, archivo JS, archivo CSS, etc., todos requieren una solicitud HTTP.

Su sitio web tiene un número fijo de solicitudes HTTP que puede manejar a la vez, por lo que se produce un efecto de cuello de botella al cargar archivos. Por esta razón, cuantas menos solicitudes HTTP haga su sitio, más rápido se cargará.

Por ejemplo, si su sitio web tiene 5 archivos CSS de 5 kb de tamaño, se cargará más rápido si los combina en un archivo CSS de 25 kb de tamaño.

Con la minificación, reducimos el peso de los archivos de su sitio y luego, con la concatenación, los combinamos para reducir las solicitudes HTTP.

Cómo agregar concatenación

También podemos recurrir al complemento WP Rocket para esta optimización.

Hay casillas de verificación para concatenar archivos CSS y archivos JS.

Las 36 formas de acelerar su sitio de WordPress

Solo necesita marcar ambas casillas, guardar los cambios y listo.

Estas opciones también están disponibles en el complemento Autoptimize.

Este siguiente consejo puede sorprenderte, pero en mi opinión, es otra optimización imprescindible.

8 Cargue archivos con un CDN

Internet es mágico.

¿Derecha?

Pero en realidad, no, no lo es.

Es una red de computadoras y las conexiones en esta red son todas, en última instancia, físicas.

Puede parecer extraño pensar en ello, pero la distancia entre el servidor donde se almacena el contenido de su sitio y la ubicación de un visitante es muy importante.

Si su servidor está en Nueva York y alguien de Tokio visita su sitio web, los archivos tardarán más en llegar a ellos que si lo visitara otra persona en Nueva York.

Dije que era extraño pensar en 😜

Entonces, ¿qué pasa si también almacena una copia de su sitio en un servidor en Tokio? Entonces, ¿no se cargaría más rápido para los visitantes de Japón?

¡Sí!

Y eso es exactamente lo que hace una CDN.

CDN significa red de entrega de contenido y es esencialmente una red de servidores que almacenan copias en caché de su sitio web en todo el mundo.

De esta manera, no importa dónde se encuentre alguien cuando lo visite, hay un servidor cercano para entregar el contenido de su sitio.

Cuando activa una CDN por primera vez, puede parecer que no está ayudando si vive cerca del servidor de origen de su host. Lo que es más importante es la rapidez con la que se carga el sitio web para el resto del mundo.

Cómo agregar una CDN a su sitio

Hay algunas opciones sólidas para agregar una CDN a su sitio.

Primero, si se ha registrado con Kinsta, puede usar su CDN incorporado. Todo lo que tienes que hacer es habilitarlo desde el menú.

Las 36 formas de acelerar su sitio de WordPress

Aunque uso Kinsta, uso el CDN de Cloudflare, que está disponible en su nivel de precios gratuito. Utilizo la CDN de Cloudflare porque también uso su firewall para bloquear una gran cantidad de tráfico de bots que estaba recibiendo este sitio.

Configurar Cloudflare es bastante fácil y viene con una variedad de otros beneficios. Puede seguir los pasos aquí para usar Cloudflare para su sitio.

Hay otros CDN de pago populares además de Cloudflare, pero no he probado ninguno de ellos personalmente, por lo que no puedo hacer recomendaciones adicionales.

Solo tengo un potenciador de rendimiento más para ti antes de todos los extras.

9 Elija un tema rápido

De acuerdo, tengo que admitir que este último consejo es un poco diferente.

Muchos blogueros de WP te dirán que elijas un tema que se cargue rápido, pero como desarrollador de temas, déjame explicarte cómo funciona realmente.

Un tema de WordPress no acelerará su sitio. Más bien, está buscando uno que no ralentice su sitio. Dicho esto, a menos que el tema esté realmente mal hecho, no ralentizará mucho su sitio si está utilizando las tácticas que enumeré anteriormente. Lo explicaré.

Con todos mis temas, cargo lo mínimo mientras sigo creando una experiencia de usuario elegante y moderna. Eso significa que los temas solo se cargan:

  • Un archivo CSS
  • Un archivo Javascript minificado
  • Una solicitud de Google Fonts
  • La fuente del icono Font Awesome (para iconos sociales)

Sin hacer sacrificios de diseño (como usar una fuente del sistema), eso es lo mínimo que puede llegar a ser un tema.

No todos los temas están así de optimizados, pero no es necesariamente una preocupación. Eso es porque incluso si su tema no está bien optimizado y carga dos archivos CSS y tres archivos Javascript y ninguno de ellos está minificado, un complemento como WP Rocket los concatenará y minificará por usted, por lo que el resultado final es prácticamente el mismo.

Básicamente, es poco probable que su tema ralentice mucho su sitio si utiliza las estrategias de rendimiento enumeradas anteriormente.

Elija un tema de un desarrollador de renombre y el rendimiento del tema no será un problema.

Optimizaciones adicionales

¡Uf!

Esta publicación ya es mucho más larga de lo que anticipé, y si llegó hasta aquí, espero que esté emocionado de aprender aún más sobre la optimización del rendimiento.

En el resto de esta publicación, cubriré optimizaciones más específicas y técnicas. He hecho estos consejos lo más amigables posible para los principiantes. Algunos de ellos son fáciles de implementar pero, para ser honesto, algunos son muy avanzados y así es como debe ser 🤷‍♂️

Use tantos como pueda en su sitio y recuerde, si ha implementado las primeras 9 tácticas y está siguiendo las mejores prácticas de rendimiento, entonces ya ha obtenido la mayor parte de los resultados.

10 Aplazar Javascript

Si usa solo una táctica del resto de esta lista, use esta.

Sin perderse demasiado en los detalles técnicos, el orden en que cargue los archivos en su sitio es muy importante. Este concepto se denomina optimización de la ruta de renderizado.

La idea es que el CSS de su sitio debe cargarse primero porque su sitio web será una pantalla en blanco hasta que eso suceda. En cuanto a los archivos Javascript, probablemente se usen para cosas como análisis que no necesitan cargarse de inmediato.

En lugar de mantener una página en blanco mientras se carga JS, pospones los archivos JS hasta que se haya cargado todo lo demás en tu sitio. De esta manera, su sitio se carga en la misma cantidad de tiempo, pero se muestra visualmente antes, lo que lo hace aparecer más rápido.

El concepto es bastante avanzado, pero una vez más no es tan difícil de implementar.

Cómo diferir Javascript

Te va a encantar esto.

Por más avanzada que sea la táctica, todo lo que necesitas hacer es marcar una casilla en la configuración de WP Rocket.

Las 36 formas de acelerar su sitio de WordPress

A menos que sepa lo que está haciendo, le recomiendo que deje marcada también la opción "Modo seguro".

También hay una forma de optimizar su CSS para la ruta de renderizado.

11 Optimizar la entrega de CSS

Al igual que Javascript, CSS bloquea el renderizado, por lo que también podemos aplazarlo para un mejor rendimiento.

Ahora sé lo que estás pensando: ¿no aplazamos JS para que se cargue el CSS y ahora también aplazamos el CSS?

Esto es lo que está sucediendo …

Para eliminar el CSS que bloquea el procesamiento, incorporará el CSS crítico que se utiliza para diseñar las partes de su sitio que se muestran de inmediato. Luego, el resto del CSS de su sitio se carga más tarde. Una vez más, esto significa que su sitio aparece visualmente incluso antes.

Esta es una táctica muy avanzada y ni siquiera me molestaría si WP Rocket no lo hubiera hecho tan fácil.

Cómo optimizar la entrega de CSS

Probablemente te estés acostumbrando a esto ahora …

Todo lo que tiene que hacer para optimizar su entrega de CSS con WP Rocket es marcar esta casilla:

Las 36 formas de acelerar su sitio de WordPress

WP Rocket luego genera el CSS crítico necesario para cada página y lo inserta en el HTML. Luego, el resto del CSS se aplaza.

Nunca intentaría hacer esto manualmente, por lo que es una optimización excelente tener automatizado de esta manera.

A continuación, tengo dos premios rápidos más para acelerar su sitio.

12 Desactive la compatibilidad con emoji de WordPress

WordPress agregó compatibilidad con emoji en la versión 4.2.

Para garantizar que los emojis funcionen en su sitio, WordPress carga un pequeño archivo Javascript en cada página de su sitio. Aquí está la cosa…

En realidad, no necesitamos este archivo para la compatibilidad con emoji porque prácticamente todos los dispositivos ya tienen una fuente de emoji instalada. Eliminé la compatibilidad con emojis de este sitio, por ejemplo, pero aún ves emojis porque tu dispositivo los tiene instalados 👍

Al eliminar la compatibilidad con emoji, su sitio ya no cargará el archivo Javascript adicional, lo que lo hará un poco más rápido.

Puede marcar esta casilla en WP Rocket para eliminar la compatibilidad con emoji:

Las 36 formas de acelerar su sitio de WordPress

El complemento Disable Emojis es una alternativa simple y gratuita.

13 Deshabilitar las incrustaciones de WordPress

Cuando pegas un enlace de Twitter en una publicación, WordPress creará automáticamente un bonito cuadro para insertar.

Eso es genial, pero lo que me molesta es que también hace esto al pegar enlaces a sitios de WordPress como este. Nunca uso esta función, así que prefiero desactivarla.

Dado que WordPress carga un archivo Javascript adicional para esta función de inserción, eliminarlo reduce el peso de su página y elimina otra solicitud HTTP.

WP Rocket tiene otra casilla de verificación para agregar fácilmente esta optimización a su sitio.

Las 36 formas de acelerar su sitio de WordPress

Es una pequeña optimización, pero todo ayuda.

14 Actualice su versión de PHP

Los lenguajes de codificación modernos son asombrosamente rápidos.

La mayoría de las tácticas de rendimiento no tienen nada que ver con la rapidez con la que se ejecuta el código de su sitio. Más bien, estamos optimizando la velocidad de envío del contenido de su sitio web al dispositivo del visitante. Esa es la parte que lleva tiempo.

Esta táctica es diferente porque en realidad acelera la rapidez con la que se ejecuta el código en su sitio.

Las versiones más nuevas de PHP son cada vez más rápidas, pero si todavía usa PHP 5, verá ganancias masivas al cambiar a 7.

Las 36 formas de acelerar su sitio de WordPress

Imagen cortesía de Kinsta

Es importante comprender que duplicar la velocidad del PHP de su sitio no hará que su sitio se cargue dos veces más rápido. Solo hace que el código PHP se ejecute dos veces más rápido, lo que probablemente sea una pequeña parte del tiempo de carga de su sitio.

Dicho esto, es potencialmente una ganancia de rendimiento muy fácil y también es mejor para la seguridad y la compatibilidad de complementos.

Cómo actualizar su versión de PHP

Aquí hay algo que he aprendido a lo largo de los años.

Las empresas de alojamiento de menor calidad utilizan versiones obsoletas de PHP y las mejores empresas de alojamiento se mantienen actualizadas con las versiones de PHP.

La actualización a la versión más reciente de PHP acelerará su sitio y, dependiendo de su host, debería ser muy fácil de hacer.

Por ejemplo, Kinsta tiene una opción en el tablero que puede usar para cambiar su versión de PHP con un solo clic.

Las 36 formas de acelerar su sitio de WordPress

Su host controla la versión de PHP que ejecuta su sitio y lo fácil que es actualizarlo. Verifique su panel de control y debería encontrar una opción allí para actualizar.

15 Reducir los complementos

¿Los complementos ralentizan su sitio?

Algo así como. Es complicado. Te daré algunos ejemplos.

Utilizo el complemento MonsertInsights para agregar Google Analytics a mi sitio. Google Analytics carga dos archivos Javascript en cada página de mi sitio, por lo que lo ralentiza (más peso y dos solicitudes HTTP).

Utilizo el complemento WPForms para todos mis formularios de contacto. WPForms carga un archivo CSS y, según las funciones que esté utilizando, también algunos archivos JS. Sin embargo, solo carga estos archivos en páginas que tienen formularios de contacto. Esto significa que no tiene ningún impacto en el rendimiento de mi sitio, excepto en la página de contacto.

Por último, utilizo un complemento llamado Format Media Titles para agregar automáticamente títulos a mis imágenes según el nombre del archivo. Este complemento ejecuta un poco de PHP en el panel de administración cuando subo imágenes y no tiene ningún impacto en el rendimiento de mi sitio.

Ahora puede ver por qué decir "los complementos ralentizan su sitio" no es cierto. Lo hacen, no lo hacen, lo hacen bajo ciertas condiciones, etc. 🤷‍♂️

El único complemento de mis ejemplos que puedo decir que ralentiza mi sitio es MonsterInsights, pero necesito mis análisis, así que estoy de acuerdo con intercambiar una pequeña cantidad de tiempo de carga adicional para esta función.

Como regla general, si el complemento cambia algo en el front-end de su sitio, afectará el rendimiento. Por el contrario, si el complemento solo afecta al panel de administración, probablemente no ralentizará su sitio.

El "front-end" de su sitio es lo que ven los visitantes. El "back-end" es su panel de administración.

Eche un vistazo a su menú de complementos y seleccione los complementos que realizan cambios en la parte frontal de su sitio. Si encuentra alguno que está activo pero no lo está utilizando, es probable que esté ralentizando su sitio, así que desactívelo.

16 Usar imágenes webP

Estoy seguro de que está familiarizado con formatos de imagen como JPG y PNG.

Bueno, Google lanzó un nuevo formato de imagen llamado webP que ha sido diseñado para un rendimiento óptimo. Cuando usa el formato webP, la imagen se ve idéntica pero se carga más rápido.

Suena muy bien al principio, pero aquí es donde se complica.

No todos los navegadores admiten imágenes webP todavía. Eso significa que si usó webP para todas sus imágenes, es posible que no aparezcan en navegadores como Safari. Por ahora, debe servir imágenes webP y también tener una versión de respaldo JPG o PNG de cada imagen.

Obviamente, parece más trabajo de lo que vale, pero una vez más, hay una solución muy simple.

Cómo usar imágenes webP

Si usa el complemento Optimole, se gestionará completamente por usted.

De hecho, ni siquiera hay un escenario para esto.

Optimole crea automáticamente versiones webP de sus imágenes y las envía a los visitantes si su navegador lo admite. Se carga un pequeño archivo Javascript con un polyfill para servir versiones JPG / PNG de las imágenes cuando el navegador del visitante no es compatible con webP.

17 Utilizar la captación previa de DNS

La captación previa de DNS es genial.

La mayoría de los archivos de su sitio se cargarán desde su dominio. Por ejemplo, el archivo CSS de su tema que diseña su sitio web está alojado en su sitio web.

Si utiliza Google Analytics, su sitio web cargará los archivos Javascript necesarios de los servidores de Google en lugar de los suyos. Esto lleva más tiempo que cargar archivos alojados en su dominio.

Básicamente, cuando utiliza la captación previa de DNS, su sitio web comienza el proceso de carga de los archivos externos antes. De hecho, cuando alguien escribe su dominio en su barra de direcciones, la captación previa de DNS comienza el trabajo de preparar los archivos externos incluso antes de visitar su sitio web.

Los detalles son bastante técnicos, pero esa es la idea detrás de esta táctica.

Cómo utilizar la captación previa de DNS

Hay una opción simple proporcionada por WP Rocket para la obtención previa.

En el menú Precarga, puede ingresar URL para todos los archivos externos que carga su sitio web.

Las 36 formas de acelerar su sitio de WordPress

Es probable que su sitio utilice Google Fonts, por lo que agregar "//fonts.googleapis.com" habilitaría la búsqueda previa para ese nombre de dominio.

18 Límite de publicaciones por página

Si tiene un blog activo, su página principal de publicaciones es la página más importante de su sitio. También puede ser uno de los más lentos.

He visto blogueros que muestran cada una de sus publicaciones en su página de inicio. Cuando visita, el indicador de carga gira y gira y la página nunca se carga por completo. Es una experiencia de usuario terrible y, lo que es peor, les está costando una enorme cantidad de ancho de banda.

En algún momento, la gran cantidad de HTML necesario para las publicaciones se convierte en un problema, pero el problema principal son todas las imágenes. Por eso es tan importante que agregue la carga diferida a su sitio.

Además, debe establecer un límite razonable para la cantidad de publicaciones que muestra en cada página de su blog.

Cómo limitar sus publicaciones por página

WordPress tiene una opción incorporada para controlar sus publicaciones por página en el menú Configuración de lectura.

Las 36 formas de acelerar su sitio de WordPress

Siempre que tenga habilitada la carga diferida, puede mostrar de 10 a 30 publicaciones por página sin problemas. Dicho esto, 10 es probablemente el número promedio que usan los bloggers y no iría más allá de 10 sin usar la carga diferida.

19 Combinar solicitudes de fuentes de Google

Estoy 100% seguro de que tu tema carga las fuentes de Google.

Si es un tema bien codificado, solo debería haber una solicitud de Google Fonts, por lo que no hay problemas.

Sin embargo, existe la posibilidad de que los complementos de su sitio también estén cargando fuentes de Google, o que usted mismo haya agregado más fuentes. Si este es el caso, su sitio está realizando múltiples solicitudes de Google Fonts, lo que significa múltiples solicitudes HTTP. Recuerde, cuantas menos solicitudes HTTP, mejor.

Cómo combinar la solicitud de Google Fonts

Probablemente ya estés acostumbrado a esto …

Para combinar las solicitudes de Google Fonts en su sitio con WP Rocket, marque esta casilla:

Las 36 formas de acelerar su sitio de WordPress

Si no está seguro de si su sitio está realizando varias solicitudes de Google Fonts, no hay nada de malo en usar esta opción, por lo que le recomiendo que siempre la active.

20 Optimizar las solicitudes de Gravatar

Cuando las personas dejan comentarios en su sitio, sus avatares aparecen automáticamente. Eso es porque WordPress se integra con Gravatar para obtener los avatares.

Gravatar es un servicio gratuito y todo lo que hace es asociar un avatar con una dirección de correo electrónico. Si crea una cuenta y agrega un avatar, verá que aparece en su sitio y en toda la web automáticamente.

Las 36 formas de acelerar su sitio de WordPress

Aquí está el problema.

Cada una de esas imágenes realiza otra solicitud externa a los servidores de Gravatar. Eso significa que si obtiene 10 comentarios en una publicación, su sitio web realizará hasta 10 solicitudes HTTP externas, ¡eso es mucho!

Hay tres formas de optimizar Gravatar para que no ralentice su sitio.

Cómo optimizar los avatares de Gravatar

La primera opción es muy simple: carga diferida de imágenes de Gravatar.

Desafortunadamente, la carga diferida de Optimole no funciona con imágenes de Gravatar. Para cargar imágenes de Gravatar de forma diferida, puede utilizar el complemento gratuito a3 Lazy Load.

Alternativamente, puede desactivar Gravatar por completo. En la configuración de Discusión, desactive los avatares con esta opción:

Las 36 formas de acelerar su sitio de WordPress

Como implica la configuración, esto deshabilita los avatares en los comentarios por completo. Si aún desea que aparezcan los avatares predeterminados, puede instalar el complemento Disable User Gravatar en su lugar.

Si los comentaristas tienen sus propias cuentas en su sitio, puede usar el complemento WP User Avatar para permitirles cargar sus propios avatares.

La tercera opción es almacenar en caché las imágenes de Gravatar con un complemento como FV Gravatar Cache, pero este complemento ha recibido críticas de usuarios mixtas.

Si bien esas tres opciones son viables, esta próxima optimización del rendimiento es un cuarto enfoque y la solución que utilizo para este sitio web.

Esta es una optimización de rendimiento realmente genial que recién comencé a usar.

Los comentarios en su sitio no aparecen hasta después de todo el contenido de la publicación, entonces, ¿por qué cargarlos de inmediato?

Dado que Optimole no funcionaba para cargar imágenes de Gravatar de forma diferida, instalé el complemento Lazy Load for Comments para cargar de forma diferida toda la sección de comentarios. ¡Problema resuelto!

Las 36 formas de acelerar su sitio de WordPress

Ahora, cuando alguien visita una publicación, ninguno de los comentarios o imágenes de Gravatar se carga hasta que se desplaza hacia abajo hasta la sección de comentarios. Esto elimina todas las solicitudes HTTP de Gravatar hasta mucho después de la carga inicial.

Mientras hablamos de carga diferida, sigamos con una implementación más.

22 Carga diferida de todos los videos

¿Incrustan videos de Youtube en sus publicaciones?

La carga de videos puede suponer un gran lastre para el rendimiento, especialmente si tiene más de uno en la página.

Puede cargar de forma diferida sus videos (e iframes) como imágenes.

Cómo cargar videos de forma diferida

Utilizo la función de carga diferida de Optimole para imágenes, pero WP Rocket tiene una opción específicamente para iframes y videos que puede habilitar de esta manera:

Las 36 formas de acelerar su sitio de WordPress

También hay una opción para cargar una miniatura en lugar del video, pero personalmente no me gusta esta opción porque hace que los visitantes hagan clic en el video dos veces, lo que me resulta molesto.

23 Reducir redireccionamientos

Si visita este sitio web utilizando "http", lo redireccionará a la versión "https" en su lugar.

Además, si visita sin "www", se le redirigirá a la versión con "www".

Ambos redireccionamientos son muy rápidos, pero aún llevan tiempo y, en lo que respecta al rendimiento, cada fracción de segundo cuenta.

Al vincular a su propio sitio web, ya sea internamente o desde otro sitio web, asegúrese de utilizar siempre la URL final a la que llegan los visitantes. Siempre uso " https://www.competethemes.com/ " para que no haya redirecciones.

Al vincular siempre a la versión correcta de su URL, evita enviar visitantes a través de redireccionamientos que hacen que su sitio parezca más lento.

24 Alojar Google Analytics localmente

He mencionado Google Analytics varias veces hasta ahora porque es una pérdida de rendimiento inevitable.

Una de las razones por las que ralentiza tu sitio es que tienes que cargar los archivos desde un servidor externo (Google) que requiere más pasos que cargar un archivo desde tu servidor.

Al alojar los archivos de Google Analytics localmente, puede cargarlos un poco más rápido.

Cómo cargar Google Analytics localmente

Una vez más, el complemento WP Rocket ha hecho que esto sea increíblemente fácil y confiable.

En el menú Complementos, hay una opción simple que puede habilitar para alojar Google Analytics localmente en lugar de cargarlo desde sus servidores.

Las 36 formas de acelerar su sitio de WordPress

Esta opción funciona con la mayoría de los complementos utilizados para agregar Google Analytics, incluido MonsterInsights.

Una excelente alternativa gratuita es el complemento CAOS.

25 Utilice menos fuentes

Ya ha optimizado su JS y CSS, así que tomemos en serio la optimización de fuentes también.

Cuando se trata de rendimiento, las fuentes son caras.

Si lees mi publicación sobre cómo hacer que tu sitio sea más hermoso, entonces sabrás que abogo por usar una o dos fuentes como máximo. Además de ser una buena regla de diseño, también es una buena regla de rendimiento.

Cada fuente que carga tiene un impacto en el rendimiento de su sitio, por lo que cuanto menos use, mejor.

Ahora vamos a ser un poco más detallados.

26 Utilice menos pesos de fuente

Cada peso de fuente multiplica el costo de rendimiento de su elección de fuente.

Por ejemplo, si usa la fuente Roboto, cargará el peso predeterminado. Si también lo desea en cursiva y negrita, esos son conjuntos de caracteres completamente diferentes y significa que ahora está cargando tres archivos de fuentes, todos aproximadamente del mismo tamaño.

Si también está utilizando la fuente Playfair Display y carga una versión en negrita y cursiva, ahora está cargando seis archivos de fuentes que tendrán un gran impacto en la velocidad de su sitio.

Su sitio puede verse genial y ser versátil con una sola fuente cargada en un estilo predeterminado, en cursiva y negrita. Si desea absolutamente otra fuente, úsela para los títulos para que no tenga que tener varios pesos o cursiva.

27 Cargue solo el juego de caracteres de su idioma

Acaba de aprender que cargar una fuente en diferentes pesos multiplica la cantidad de archivos que su sitio necesita cargar.

Siguiendo ese mismo hilo, cuantos más caracteres haya en la fuente, más grande será el archivo. El punto es que solo desea cargar los caracteres que necesita.

Asegúrese de que solo está cargando fuentes de Google en el idioma que usa. Para los usuarios de inglés, solo necesita el juego de caracteres latinos y no el latino extendido, que a menudo se carga de forma predeterminada.

Dependiendo de cómo agregue Google Fonts a su sitio, es posible que tenga o no la capacidad de cambiar esto, así que consulte las opciones de tema o complemento disponibles.

28 Desactivar las funciones OpenType en Adobe Fonts

Si usa Adobe Fonts (anteriormente TypeKit) para sus fuentes, probablemente tenga acceso a algunas funciones de OpenType.

Si bien las características de OpenType son increíbles para agregar hermosas fracciones, versalitas y muchas otras características tipográficas, lo más probable es que no las necesite.

Dado que OpenType incluye muchos glifos de caracteres nuevos, hace que los archivos de fuentes sean más grandes, lo que se traduce en tiempos de carga más prolongados.

Al editar su proyecto, desactive las funciones OpenType aquí:

Las 36 formas de acelerar su sitio de WordPress

Como puede ver en mi ejemplo, solo estoy cargando los tres pesos de fuente que necesito y el subconjunto en inglés como se explicó en las tácticas anteriores.

29 Reemplazar Font Awesome con Fontello

Esta táctica es muy técnica, pero como me ayudó, la incluyo para todos los que lean y se sientan cómodos escribiendo código.

Si utiliza Font Awesome u otra fuente de iconos para su sitio, es probable que esté cargando toda la fuente, es decir, que esté cargando cientos de iconos. Lo más probable es que solo esté usando unos pocos íconos en su sitio.

Con Fontello, puede crear su propio paquete de fuentes de iconos utilizando solo los iconos de Font Awesome que está usando en realidad.

Las 36 formas de acelerar su sitio de WordPress

Como solo estoy usando 26 íconos diferentes en este sitio, pude reducir enormemente el tamaño del archivo de fuente y su hoja de estilo (aproximadamente 100 kb).

Si tiene control técnico total sobre su sitio, eliminar Font Awesome y reemplazarlo con un paquete de fuentes web personalizado de Fontello es una excelente manera de mejorar aún más el rendimiento de su sitio.

Otras optimizaciones

Veo otros sitios web recomendando los siguientes consejos todo el tiempo, pero aquí está la cuestión …

Estas tácticas finales no harán que su sitio se cargue más rápido. Optimizarán el rendimiento de su sitio web, pero no exactamente en formas que lo aceleren.

Reducirá la cantidad de espacio en disco que usa su sitio, potencialmente hará que su sitio sea más seguro e incluso reducirá el ancho de banda que usa. Eso es suficiente para que estas tácticas valgan la pena a mis ojos, y es por eso que las he incluido al final de esta publicación.

Aquí están las últimas 7 tácticas.

30 Desactivar pingbacks y trackbacks

Ya nadie usa pingbacks o trackbacks por razones legítimas.

Antes de las redes sociales, cuando la gente publicaba blogs personales, los pingbacks eran como @ -ing a alguien. En otras palabras, te avisarían cuando otro bloguero hiciera referencia a tu sitio.

Hoy en día, se utilizan más o menos exclusivamente para el spam y la explotación de vulnerabilidades de seguridad (como DDoSing). Es mejor simplemente deshabilitarlos con estas dos opciones en la configuración de Discusión.

Las 36 formas de acelerar su sitio de WordPress

No se necesitan complementos.

31 Reducir la velocidad de la API Heartbeat

La API Heartbeat se ejecuta en WordPress para mantener ciertas funciones ejecutándose en su navegador. Por ejemplo, WordPress guarda automáticamente sus publicaciones mientras trabaja en ellas para evitar que pierda su contenido en caso de error o error.

Esta API normalmente se ejecuta una vez por minuto y es posible que le ralentice un poco mientras trabaja en una publicación o usa otras funciones en su administrador.

Si bien no es un gran problema para la mayoría de las personas, también puede ralentizarlo con esta configuración en el complemento WP Rocket:

Las 36 formas de acelerar su sitio de WordPress

Reducir la actividad simplemente le dice a la API Heartbeat que se ejecute una vez cada dos minutos en lugar de cada minuto.

32 Deshabilitar hotlinking

Hotlinking es cuando alguien muestra una imagen en su sitio web, pero usa una URL de imagen de su sitio para mostrar la imagen. Lo que sucede entonces es que cada vez que alguien visita su sitio, la imagen se solicita a su servidor en lugar de al de ellos.

La conclusión es que, cuando alguien enlaza una de tus imágenes, pagas por el ancho de banda y no obtienes ningún beneficio. Es robar.

Cloudflare incluye su servicio ScrapeShield en el nivel gratuito que tiene una opción para evitar que las personas pongan un enlace directo a sus imágenes.

Las 36 formas de acelerar su sitio de WordPress

¿No te encantan todas estas sencillas opciones de habilitar con un clic?

Encendí esto recientemente y me ahorró una tonelada de ancho de banda. Supongo que los enlaces directos comenzaron a sumarse para mi dominio a lo largo de los años, y esta opción anuló instantáneamente estas solicitudes.

33 Optimiza tu base de datos

La limpieza de su base de datos probablemente no hará que su sitio sea más rápido, pero reducirá la cantidad de espacio en disco que usa.

Si tiene mucha hinchazón en su base de datos, es más probable que esto ralentice su panel de administración que el front-end de su sitio. Por ejemplo, si tiene decenas de miles de comentarios de spam, es posible que el menú Comentarios tarde más en cargar debido al gran volumen de datos.

Hay muchos complementos disponibles para optimizar su base de datos, pero esto es algo que también hago con WP Rocket.

Las 36 formas de acelerar su sitio de WordPress

El menú Base de datos en la configuración de WP Rocket incluye opciones para eliminar automáticamente los comentarios de spam y otros datos inútiles de su base de datos.

Aún mejor, puede programar esta automatización para que se ejecute todos los días, semanas o meses.

34 Deshabilitar o limitar las revisiones de publicaciones

Acaba de enterarse de que WordPress utiliza la API Heartbeat para guardar borradores de sus publicaciones de forma rutinaria. Bueno, WordPress también guarda revisiones que puede restaurar más tarde si es necesario.

El problema de almacenar toneladas de revisiones es que ocupan espacio en su base de datos. Una publicación con 19 revisiones es como almacenar 20 publicaciones en su base de datos. Si bien puede deshabilitar las revisiones con un complemento o limitarlas, también puede simplemente eliminarlas.

El menú Base de datos en WP Rocket incluye una opción para eliminar las revisiones de publicaciones.

Las 36 formas de acelerar su sitio de WordPress

Puede ejecutar esta opción manualmente o programarla.

Y solo un aviso, siempre debe hacer una copia de seguridad de su sitio antes de ejecutar cualquier optimización de la base de datos.

Tengo programado WP Rocket para ejecutar esta optimización todos los días porque Kinsta también hace una copia de seguridad de mi sitio a diario.

35 Eliminar cadenas de consulta

Hay mucho que explicar aquí, pero como no acelerará su sitio, iré directamente al fondo.

Las cadenas de consulta en las URL de archivos pueden potencialmente evitar que se almacenen en caché. Con la mayoría de los complementos de almacenamiento en caché, como WP Rocket, este no es el caso, por lo que la presencia de cadenas de consulta no es un problema.

Además, las cadenas de consulta a menudo no deben eliminarse porque son necesarias para que los complementos funcionen correctamente.

Simplemente active esta opción en WP Rocket y termine con ella:

Las 36 formas de acelerar su sitio de WordPress

Han optimizado esta función para que no rompa las cosas en su sitio y no verá advertencias de GTMetrix y otras herramientas de auditoría de rendimiento que necesita para eliminar las cadenas de consulta de los recursos estáticos.

36 Eliminar complementos inactivos

Cuando desactivas un complemento, simplemente lo desactivas. Puede reactivarlo y se restaurará su configuración anterior.

Sin embargo, si elimina un complemento, esto normalmente elimina la configuración y los datos creados por el complemento. Esto se debe a que la mayoría de los complementos tienen un proceso de limpieza que se ejecutan cuando se eliminan para no dejar un desastre en su base de datos.

Si tiene complementos inactivos que aún no ha eliminado, eliminarlos puede ayudar a optimizar su base de datos. Además, es solo una buena práctica en general 🙂

Disfrute de su sitio web más rápido

Con más de 7.000 palabras, esta es oficialmente la publicación de blog más larga que he escrito. ¡Quería incluirlo todo!

Solo hay una cosa más que tengo que decirte …

En lo que respecta a la optimización del rendimiento, su trabajo nunca está realmente terminado. Una vez que haya implementado las tácticas que desea probar en su sitio, asegúrese de volver aquí una o dos veces al año para revisar la lista nuevamente y volver a optimizar su sitio.

Me parece que necesito volver a optimizar mi sitio al menos una vez al año para mantenerlo en plena forma.

También puede encontrar que la primera vez que usa esta lista, algunas de las tácticas eran demasiado técnicas para comprenderlas. A medida que se convierta en un profesional de WordPress, es posible que vuelva a encontrar estas tácticas mucho más sencillas de aplicar.

Si tiene alguna pregunta, dejaré abierta la sección de comentarios, ¡así que publique a continuación!

Fuente de grabación: www.competethemes.com

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More