Tutorial: ¿Cómo habilitar la caché del navegador?

En ocasiones, después de programar un sitio web descubrimos que estos no estan tan optimizados para cargar rápidamente que incluso Google con sus herramientas como PageSpeed Insights marca errores diciendo que la caché del navegador no está habilitada o que la compresión de archivos no está habilitada.

De tal forma que existen diferentes métodos para garantizar la velocidad de un sitio web. Y así pasar las pruebas que el buscador realiza y mejorar tu posicionamiento.

Tutorial para habilitar la caché de tu sitio Web

Los siguientes son tags que deberás habilitar en tu codigo HTML dentro de los tags <head></head> para lograr que la próxima vez que se visite tu sitio se sepa la fecha en la que fue modificada la información:

<meta http-equiv="last-modified" content="Fri, 14 Dec 2007 12:58:00 GMT" />

Así la próxima vez que el navegador solicite tu sitio web la respuesta de tu servidor será “Not Modified” y el navegador mostrará  lo que tiene almacenado en su cache.

Por otro lado, hay que informar al buscador la fecha en la que expira este contenido:

<meta http-equiv="Expires" content="Mon, 14 Dec 2007 12:58:00 GMT">

<meta http-equiv="Cache-Control" content="max-age=3600, must-revalidate“>

Por cierto, en caso que no quieras habilitar la caché los tags a usar son:

<meta http-equiv="Cache-Control" content="max-age=0, no-cache, no-store, private">
<meta http-equiv="Pragma" content="nocache">

Por último, deberás habilitar la caché por medio de tu .HTACCESS

Habilitar la compresión de contenido

El último paso será habilitar la compresión de contenido a través de tu archivo .htaccess que se encuentra en el directorio raíz de donde se encuentra almacenado tu sitio web. Para hacerlo solo debes ingresar el siguiente codigo


Header append Vary User-Agent env=!dont-vary

AddOutputFilterByType DEFLATE text/css text/x-component application/x-javascript application/javascript text/javascript text/x-js text/html text/richtext image/svg+xml text/plain text/xsd text/xsl text/xml image/x-icon application/json

DEFLATE by extension

AddOutputFilter DEFLATE js css htm html xml

Con este código ayudarás para que todo el contenido que sea HTML, texto plano, imagenes y javascript se entregue comprimido. Y por lo tanto, tu sitio web responda más rápido.

Como siempre si tienes alguna duda puedes ponerla en los comentarios.

Habilitar la caché del navegador





SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s,?\s)+|[X~-]{4,13}$ HAVE_Accept-Encoding
RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding

<ifmodule mod_filter.c>
    AddOutputFilterByType DEFLATE "application/atom+xml" \
                                  "application/javascript" \
                                  "application/json" \
                                  "application/ld+json" \
                                  "application/manifest+json" \
                                  "application/rdf+xml" \
                                  "application/rss+xml" \
                                  "application/schema+json" \
                                  "application/vnd.geo+json" \
                                  "application/vnd.ms-fontobject" \
                                  "application/x-font-ttf" \
                                  "application/x-javascript" \
                                  "application/x-web-app-manifest+json" \
                                  "application/xhtml+xml" \
                                  "application/xml" \
                                  "font/eot" \
                                  "font/opentype" \
                                  "image/bmp" \
                                  "image/svg+xml" \
                                  "image/vnd.microsoft.icon" \
                                  "image/x-icon" \
                                  "text/cache-manifest" \
                                  "text/css" \
                                  "text/html" \
                                  "text/javascript" \
                                  "text/plain" \
                                  "text/vcard" \
                                  "text/vnd.rim.location.xloc" \
                                  "text/vtt" \
                                  "text/x-component" \
                                  "text/x-cross-domain-policy" \
                                  "text/xml"

</ifmodule>
<ifmodule mod_mime.c>
    AddEncoding gzip              svgz
</ifmodule>

¡Dejános un comentario!

¡No olvides dejar un comentario!

Quobit

Quobit Autor

Somos Bit a Bit, llevamos los últimos consejos de tecnología hasta tu smartphone.

Deja un comentario

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.