PageSpeed es una aplicación online desarrollada por Google que permite a través de una URL conocer lo optimizado que se encuentra un sitio web. Para calificar un sitio y lo bien optimizado que este según PageSpeed, se utiliza una métrica del 1 al 100.

La verdad es imposible tener un PageSpeed en 100, de hecho el mismo Google solo alcanza una calificación máxima de 99 y es que en la actualidad muchos sitios web tienen llamadas de elementos externos, los cuales no pueden ser modificados porque pertenecen a terceras personas, por ejemplo los códigos de las redes sociales para mostrar los seguidores, o la publicidad de Adsense, etc. Todos estos elementos hacen prácticamente imposible alcanzar el 100.

Lo ideal debe ser optimizar todo lo que este ha nuestro alcance, aunque hay varias cosas que no se deben optimizar demasiado, por ejemplo el caché de un sitio web. PasiónSEO tiene un pagespeed de 90, cifra que nos parece perfecta y no deseamos ampliar más. Para logra tener un PageSpeed de 90 debes cumplir con lo siguiente:

• Eliminar las cadenas de consulta de recursos estáticos
• Ofrecer imágenes a escala
• Minificar JavaScript
• Minificar CSS
• Habilitar compresión
• Especificar caché de navegador
• Crear URL amigables

Puedes comprobar el PageSpeed de PasiónSEO o cualquier otro sitio web, utilizando la aplicación online de PageSpeed Online, desde el enlace de más abajo.

Enlace | PageSpeed

Siguiendo con la tanda de artículos sobre como optimizar un sitio web para que cargue mucho mas rápido, hoy hablaremos sobre cómo ofrecer imágenes a escala. Las imágenes tienen unos tamaños en internet que son definidos mediante pixeles, muchas imágenes cuando son publicadas en artículos por ejemplo usando WordPress son modificadas utilizando el código HTML mediante la opción de porcentajes que ofrece el CMS WordPress.

La forma correcta de escalar una imagen es ofrecer el tamaño real que tiene la imagen, por ejemplo si una imagen mide 150×150 pixeles y queremos que sea mas grande, la peor opción es hacer su tamaño mas grande utilizando a la fuerza el código HTML, lo preferible es editar la fotografía con un editor de imágenes.

Lo mismo sucede cuando el ejemplo es al revés, es decir, la imagen es muy grande y queremos mostrarla mas pequeña, cuando una imagen es descargada se muestra el tamaño real de la imagen y si esta es mas grande o pequeña que los pixeles especificados en el código HTML, el servidor trabaja doble por decirse así.

La manera correcta de ofrecer una imagen a escala es así:

1

<img title="Imagen 150 pixeles" src="imagen-150x150.jpg" alt="Escalar imagen" width="150" height="150" />

La compresión se utiliza en los sitios web para poder cargar un sitio mas rápido, al comprimir los archivos el servidor utiliza menos recursos, si no tienes ancho de banda ilimitado en tu servidor, es una buena forma de evitar que tu sitio web se caiga por demasiadas visitas o por muchas descargas que consumen el ancho de banda.

Habilitar Compresión en WordPress

Si tienes un blog creado con el gestor de contenidos WordPress, la mejor manera de habilitar la compresión es haciendo uso del archivo .htaccess, lo único que debes hacer es copiar y pegar el código de más abajo en tu archivo:

1

AddOutputFilterByType DEFLATE text/html text/css application/x-javascript

Con el código anterior le damos la orden a nuestro WordPress para que todos los archivos de texto, hojas de estilo, Javascript y documentos en HTML sean comprimidos.

Los sitios web necesitan de múltiples recursos para poder minimizar su tiempo de carga, uno de ellos es el caché, con el cual el administrador de un sitio web puede definir el tiempo de expiración de una imagen, texto, archivo, etc. Cuando se especifica el caché de navegador en una web lo que se esta haciendo básicamente, es decirle al navegador que tales archivos puede volverlos a mostrar como la primera vez que visito la web, así ahorra tiempo de carga al no tener que descargar nuevamente las imágenes.

Especificar caché de navegador en WordPress

Para especificar el cache de navegador en nuestro sitio creado con WordPress, haremos uso del archivo .htaccess, el cual descargamos de nuestro FTP para editarlo y colocarle el siguiente código (Código actualizado, el anterior presentaba problemas). Antes de borrar todo el contenido de tu archivo crea una copia de seguridad:

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
 
<IfModule mod_expires.c>
<filesmatch "\.(jpg|JPG|gif|GIF|png|PNG|css|ico)$">
ExpiresActive on
ExpiresDefault "access plus 31 day"
</filesmatch>
</IfModule>
 
# END WordPress

Con el código anterior estamos definiendo el tiempo de expiración de las imágenes  y de todos los archivos en un mes. Listo, ahora volvemos a subir nuestro archivo al servidor, de esta manera tu sitio web demorará menos tiempo en cargar. Cualquier problema con el código puedes dejarlo en los comentarios.

PageSpeed online es una aplicación desarrollada en el laboratorio de Google con la cual podemos analizar online el contenido de una pagina web. Posteriormente la aplicación arroja datos y sugerencias sobre la página con el fin de mejorar los tiempos de cargas.

Para qué sirve PageSpeed Online

Con PageSpeed online, un Webmaster o SEO puede mejorar el tiempo de carga de una pagina web, mediante esta técnica podrá disminuir el porcentaje de abandonos de un usuarios al ver que la pagina no carga, recuerde que solo tienes siete segundos para mostrar su web antes que el usuario se aburra y lo abandone.

Además con PageSpeed Online puede tener un HTML mucho más limpio y mejorar el posicionamiento de su sitio web. Para determinar el porcentaje de optimación que tiene una página web PageSpeed Online utiliza una valoración de 0 al 100.

Link | PageSpeed Online