Listado de la etiqueta: caché del navegador

Cómo especificar el caché del navegador

Ya hemos hablado en multitud de ocasiones de la importancia de la velocidad de carga para mejorar nuestro posicionamiento SEO. Hoy vamos a hablar un poco más de uno de esos factores, dentro de nuestra estrategia WPO (Web Performance Optimization),  que con muy poco trabajo, nos permiten mejorar el rendimiento de nuestras webs.

Habilitando el caché de navegador lo que hacemos es definir el tiempo de expiración de las imágenes, textos y resto de ficheros que nuestra página web le ofrece al usuario para su correcta visualización. Básicamente, lo que logramos con esto, es que nuestra página web le diga al navegador del cliente que determinados archivos debe mostrarlos empleando los archivos que se descargó la primera vez que visitó nuestra web, logrando de esta forma, ahorrar tiempo de carga, ya que evitamos que vuelva a descargar de nuestros servidores aquellas imágenes, ficheros css, js, o de cualquier otro tipo, que no haya sido modificado desde su última visita.

Especificar caché de navegador para WordPress

Si tenemos nuestra página web alojada en un hosting compartido, o administrado por nuestro proveedor, esto resulta tan sencillo como acceder a través de nuestra cuenta de FTP y modificar el archivo .htaccess, incorporándole el siguiente código:

<IfModule mod_expires.c>
<filesmatch “\.(jpg|JPG|gif|GIF|png|PNG|css|js)$”>
ExpiresActive on
ExpiresDefault “access plus 30 day”
</filesmatch>
</IfModule>

O, en caso de querer refinar un poco más nuestras directrices, podríamos especificar la caducidad en función a los tipos de ficheros que tengamos:

<ifmodule mod_expires.c>
ExpiresActive on
ExpiresByType image/jpg «access plus 60 days»
ExpiresByType image/png «access plus 60 days»
ExpiresByType image/gif «access plus 60 days»
ExpiresByType image/jpeg «access plus 60 days»
ExpiresByType text/css «access plus 1 week»
ExpiresByType image/x-icon «access plus 1 month»
ExpiresByType application/pdf «access plus 1 month»
ExpiresByType audio/x-wav «access plus 1 month»
ExpiresByType audio/mpeg «access plus 1 month»
ExpiresByType video/mpeg «access plus 1 month»
ExpiresByType video/mp4 «access plus 1 month»
ExpiresByType video/quicktime «access plus 1 month»
ExpiresByType video/x-ms-wmv «access plus 1 month»
ExpiresByType application/x-shockwave-flash «access 1 month»
ExpiresByType text/javascript «access plus 1 week»
ExpiresByType application/x-javascript «access plus 1 week»
ExpiresByType application/javascript «access plus 1 week»
</ifmodule>

 

Especificar caché de navegador con Apache

Si por el contrario, somos nosotros mismos los que administramos nuestro servidor, ya sea un servidor dedicado, o cualquier tipo de VPS en el que tengamos alojadas varias páginas web, podemos especificar el caché de navegador con Apache de una forma muy similar a la indicada en el punto anterior.

Antes de nada tenemos que cargar el módulo mod_expires en caso de no tenerlo ya instalado por defecto, para ello, si disponemos de un servidor Debian, es algo tan simple como ejecutar la siguiente instrucción:

a2enmod expires

Una vez hecho esto, y reiniciado el servidor Apache, podemos configurar el caché de navegador para todos los sitios web que tengamos alojados, únicamente incorporando el contenido anterior al fichero /etc/apache2/mods-available/expires.conf

vim /etc/apache2/mods-available/expires.conf

Una vez ajustado los tiempos en función a nuestras necesidades, tendremos que hacer un enlace del fichero de configuración que hemos creado en mods-available dentro del directorio mods-enabled

ln -s /etc/apache2/mods-available/expires.conf /etc/apache2/mods-enabled/

Por último, reiniciamos el servicio Apache

service apache2 restart

 

Podéis comprobar si se ha aplicado correctamente, haciendo uso de la herramienta de Google PageSpeed Insights.

Siguiendo estos pasos, creedme, es más sencillo de lo que pueda parecer, lograremos mejorar de forma considerable los tiempos de carga de nuestra web. Ya sabéis, si tenéis alguna duda, no tengáis reparo en preguntar a través de los comentarios.

 

Fotografía: Earlangen Germany