• PageSpeed Insights: Leverage Browser Caching

    Publicado en septiembre 8, 2013 por en PageSpeed Insights, Seo On Page

    Leverage Browser Caching - headers de expiración

    Leverage Browser Caching: Headers de Expiración

    Una de las maneras que tenemos para agilizar la velocidad de nuestro sitio es estableciendo headers de expiración forzando el cacheado del sitio.

    Cuando analizamos nuestra web con PageSpeed Insights de Google  si no tenemos implementadas las cabeceras de expiración se activa la regla Leverage Browser Caching  porque  detecta que en el servidor no se incluyen las cabeceras de caché o los recursos tienen un tiempo de vida  muy corto.

    Usar el almacenamiento en caché del navegador puede ser un recurso útil para los usuarios que visitan nuestro sitio de manera reiterada, les ahorraremos tiempo en la descarga.

    Las cabeceras de caché se deben aplicar a todos los recursos estáticos cacheables, no sólo a las imágenes,  esto incluye también a los archivos para alojar las funciones de javascript JS y las hojas de estilo CSS, archivos multimedia etc.

    Los archivos .html .php .htm no son considerados estáticos y por tanto no se debería cachear de manera predeterminada.

    Si se posee un gestor de contenidos tipo wordpress,  nos ayudaríamos usando  el plugin WordPress Super Cache  pero si por el contrario no usamos un gestor de contenido una de las opciones que tenemos para fijar el tiempo de duración del contenido cacheable es a través del archivo .htaccess.

    Para los que no han oído hablar nunca del archivo .htaccess diremos brevemente que es un archivo que podemos crear con un block de notas mismo, sin extensión y se guarda así: .htaccess (con el punto delante incluido)

    En este archivo se guarda en el directorio raíz del sitio y nos permite crear directivas de configuración para cada directorio (y subdirectorios) del mismo. Hay que usarlo con cuidado porque una mala gestión de este archivo puede tener consecuencias no muy deseables para nuestra web. Vamos a ver de qué manera lo vamos a usar nosotros.

    Uso de las cabeceras de expiración con .htaccess

    Para indicar al navegador las cabeceras de expiración incluiremos las instrucciones que siguen más abajo en él y remarco que el cálculo del tiempo está hecho en segundos teniendo en cuenta la operación de la siguiente manera: 60*60*24*7  segundos, minutos, horas, días.

    El tiempo no debería exceder el año porque eso infringe las RFC guidelines.

    # Con este par de reglas activamos la expiración y establecemos el tiempo por defecto en 7 días.

    ExpiresActive On
    ExpiresDefault A604800

    # Se activa la expiración para los archivos media por 1 mes

    <FilesMatch “\.(ico|gif|jpg|jpeg|png|flv|pdf|swf|mov|mp3|wmv|ppt)$”>
    ExpiresDefault A2419200
    Header append Cache-Control “public”
    </FilesMatch>

    # Se activa el tiempo de expiración por 2 horas para los archivos que se actualizan más comúnmente.

    <FilesMatch “\.(xml|txt|html|js|css)$”>
    ExpiresDefault A7200
    Header append Cache-Control “private, must-revalidate”
    </FilesMatch>

    # Se fuerza el no cacheo para los archivos dinámicos

    <FilesMatch “\.(php|cgi|pl|htm)$”>
    ExpiresDefault A0
    Header set Cache-Control “no-store, no-cache, must-revalidate, max-age=0”
    Header set Pragma “no-cache”
    </FilesMatch>

    También es posible indicar los tiempos de manera individual a los archivos pero para ello usaríamos la directiva ExpiresByType según el tipo de archivo (usando los tipos mime)

    ExpiresActive On
    ExpiresDefault A0

    ExpiresByType image/jpg A2592000
    ExpiresByType text/css A2592000
    ExpiresByType text/javascript A2592000

    Si necesitas un mayor control en la página de Apache tienes información mucho más ampliada.


Uso de cookies

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información.plugin cookies

CERRAR
Leer entrada anterior
Etiquetas h2 y h3
Etiquetas h2 y h3

Etiquetas h2 y h3 Continuamos hablando sobre otro de los elementos que pueden ayudarnos a mejorar el Seo de nuestra...

Cerrar