El rendimiento de WordPress es crucial, por lo que hacemos todo lo posible para que nuestros sitios web carguen lo más rápido posible. Consideramos que añadir “cabeceras caducadas” a nuestros sitios de WordPress es una forma inteligente de aumentar su rendimiento.
Las cabeceras caducadas son reglas que indican a los navegadores web si deben cargar los recursos de la página, como imágenes, desde la caché del navegador del visitante o directamente desde su servidor. Esto puede mejorar significativamente los tiempos de carga y la experiencia del usuario.
En este artículo, le guiaremos a través de dos métodos eficaces para añadir cabeceras caducadas en WordPress. Si sigues estos pasos, podrás optimizar la entrega de recursos y asegurarte de que tu sitio funcione sin problemas y de forma eficiente.
¿Cómo se utilizan las cabeceras caducadas en WordPress?
La primera vez que alguien visita una página web en su sitio web WordPress, todos los archivos se cargan uno a uno. Todas estas peticiones HTTP entre el navegador y el servidor de alojamiento de WordPress aumentan el tiempo de carga de la página web.
La caché del navegador almacena algunos o todos esos archivos en el ordenador del visitante. Esto significa que la próxima vez que visite la página, los archivos se pueden cargar desde su propio ordenador, lo que aumenta el rendimiento de su sitio web de WordPress y mejora la experiencia del usuario.
Tal vez se pregunte cómo saben los navegadores qué archivos deben guardar y durante cuánto tiempo. Ahí es donde entran en juego las “cabeceras de caducidad”.
Las reglas acerca de qué archivos guardar y cuánto tiempo hacerlo se establecen mediante cabeceras de caducidad o de control de caché. En este artículo, nos centraremos en las cabeceras caducadas porque son más sencillas de establecer para la mayoría de los usuarios.
Las cabeceras caducadas establecen una fecha de caducidad para cada tipo de archivo almacenado en la caché del navegador. Después de esa fecha, los archivos se volverán a cargar desde su servidor para ofrecer a los visitantes la versión más reciente de la página.
Le mostraremos cómo añadir cabeceras caducadas utilizando dos métodos diferentes. El primer método es más fácil y recomendado para la mayoría de los usuarios. Puede enlazar los siguientes métodos para saltar a la sección que prefiera:
Método 1: Añadir cabeceras caducadas con WP Rocket WordPress plugin
WP Rocket es el plugin de rendimiento para WordPress más fácil de usar del mercado. Una vez habilitado, trabaja inmediatamente para mejorar la velocidad de tu sitio web sin tener que meterte con complicados ajustes de configuración como muchos otros plugins de caché.
WP Rocket es un plugin premium, pero lo mejor es que todas las características están incluidas en su plan más bajo.
Lo primero que tienes que hacer es instalar y activar el plugin WP Rocket. Para más detalles, consulta nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.
Una vez instalado y activado, WP Rocket activará automáticamente el almacenamiento en caché del navegador. Por defecto, añade cabeceras de caducidad y cabeceras de control de caché con los mejores ajustes para acelerar tu sitio WordPress.
Eso es todo lo que necesitas hacer. Si quieres aprender más acerca del plugin, entonces consulta nuestra guía sobre cómo instalar y establecer correctamente WP Rocket en WordPress.
Si prefiere utilizar un plugin de caché gratuito para añadir cabeceras caducadas a su sitio web, le recomendamos que eche un vistazo a W3 Total Cache.
W3 Total Cache ofrece algunas de las mismas características que WP Rocket, pero no es tan fácil de usar para principiantes. Tampoco ofrece todas las características que se obtienen en un plugin de rendimiento todo-en-uno como WP Rocket. Tendrás que habilitar manualmente las cabeceras de expiración ya que no las habilita automáticamente.
Método 2: Añadir cabeceras caducadas en WordPress usando código
El segundo método para añadir cabeceras caducadas en WordPress consiste en añadir un fragmento de código a tus archivos de WordPress. No lo recomendamos para principiantes, ya que un error en el código podría causar errores graves y romper su sitio.
Antes de realizar estos cambios, le recomendamos que primero haga una copia de seguridad de su sitio de WordPress. Para más información, consulte nuestra guía sobre cómo realizar copias de seguridad y restaurar su sitio de WordPress.
Dicho esto, veamos cómo añadir cabeceras caducadas añadiendo código a WordPress.
Determine si su sitio web ejecuta Apache o Nginx
En primer lugar, debe averiguar si su sitio web utiliza servidores Apache o Nginx. Para ello, vaya a su sitio web, haga clic con el botón derecho en la página y seleccione la opción “Inspeccionar”.
A continuación, debes hacer clic en la pestaña “Red” situada en la parte superior de la página.
Es posible que tenga que actualizar la página para que se carguen los resultados.
Después, puede hacer clic en el nombre de su dominio en la parte superior de la columna “Nombre”.
A continuación, desplácese hasta la sección “Cabeceras de respuesta” y compruebe si hay un elemento / artículo llamado “servidor”.
Esto le mostrará qué servidor web se está utilizando. En este caso, el sitio se ejecuta en un servidor Nginx.
Ahora que ya sabe qué servidor web utiliza su sitio, utilice los siguientes enlaces para avanzar:
Cómo añadir cabeceras caducadas en Apache
Para añadir cabeceras caducadas a un servidor Apache, necesita añadir código a su archivo .htaccess.
Para editar este archivo, debe conectarse a su cuenta de alojamiento de WordPress con un cliente FTP o con la herramienta de gestión de archivos de su proveedor de alojamiento. Encontrará su archivo .htaccess en la carpeta raíz de su sitio web.
Nota: A veces, el archivo .htaccess puede estar oculto. Si necesitas ayuda para encontrarlo, consulta nuestra guía sobre por qué no puedes encontrar .htaccess en tu sitio WordPress.
A continuación, debe añadir cabeceras de caducidad para activar el almacenamiento en caché del navegador. Esto indica al navegador web cuánto tiempo debe almacenar los recursos de su sitio web antes de borrarlos.
Puede añadir el siguiente código cerca de la parte superior de su archivo .htaccess:
## EXPIRES HEADER CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType image/svg "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType application/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 3 days"
</IfModule>
## EXPIRES HEADER CACHING ##
Estos valores deberían funcionar bien para la mayoría de los sitios, pero puede ajustar los periodos de tiempo si sus necesidades son diferentes.
Fíjate en que el código establece diferentes fechas de caducidad de la caché en función del tipo de archivo. Las imágenes se almacenan en caché durante más tiempo que el HTML, CSS, Javascript y otros tipos de archivo porque suelen permanecer inalterados.
Cómo añadir cabeceras caducadas en Nginx
Si utiliza un servidor Nginx para alojar su blog de WordPress, deberá editar el archivo de configuración del servidor para añadir las cabeceras de caducidad.
La forma de editar y acceder a este archivo depende de su alojamiento, por lo que puede ponerse en contacto con su proveedor de alojamiento si necesita ayuda para acceder al archivo.
A continuación, debes añadir el siguiente código:
location ~* \.(jpg|jpeg|gif|png|svg)$ {
expires 365d;
}
location ~* \.(pdf|css|html|js|swf)$ {
expires 3d;
}
Este código establecerá los tiempos de caducidad para los diferentes tipos de archivo. Aviso de nuevo que las imágenes se almacenan en caché más tiempo que HTML, CSS, JS, y otros tipos de archivo ya que las imágenes suelen permanecer igual.
Tutorial en vídeo
Esperamos que este tutorial te haya ayudado a aprender cómo añadir cabeceras caducadas en WordPress. Puede que también quieras ver nuestra guía definitiva de seguridad en WordPress para mejorar la seguridad de tu sitio web y nuestra selección experta de los mejores servicios de marketing por correo electrónico para aumentar tu tráfico.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Jiří Vaněk
I would like to ask where the error could be. I have Expire headers set in htacess. Directives are fine. Even so, AIO SEO keeps telling me that they are not set. Where to look next?
WPBeginner Support
We would recommend reaching out to AIOSEO’s support to make sure there isn’t a detection issue you are running into with your site’s specific setup.
Administrador
Ivan Gneiding
I added the code into .htaccess (apache server) but pingdom.com still complaining about expires headers. What else should I do?
Thanks in advance.
Arthur Morehead
Dev tools did not reveal my server
Greg Murch
Love the code to the .htaccess, less likely to slow the site down with more plugins.
Lasha
Many people have problems with expire headers and this is a great guide. But for this kind of thing, I always prefer plugins then manual code injections.