Aumenta la velocidad de carga y mejorarás tu SEO

La pasada semana el equipo de Web Conversion Master asistió al Seminario #Seopro celebrado en las instalaciones  Fundesem de Alicante. En este evento, que reunió a algunas de las caras más conocidas del panorama online, pudimos disfrutar de una ponencia sobre WPO (Web Performance Optimization) de la mano de Miguel López (@MiguelLopezGo), director del Congreso SEO Profesional.  Si queréis saber todo lo que nos contó, poned mucha atención y ¡seguid leyendo!

Ya te lo contábamos tiempo atrás en nuestro artículo 3 Claves para mejorar tu web y ahora te lo volvemos a recordar. La velocidad de carga de tu página es ESENCIAL para obtener un buen rendimiento web y, por consiguiente, un buen posicionamiento.

Pero no sólo te lo decimos nosotros. El gran Matt Cutts, director del departamento contra el spam en web de Google,  apuntó  en 2011 (¡¡En 2011!!) que uno de los  factores clave del posicionamiento, tanto SEM como SEO, era el  rendimiento web.

Por lo tanto  ¡ya tienes deberes!

 

Cada 3 segundos tus ventas bajan un 25%

La tasa de rebote está directamente relacionada con la velocidad de carga de tu sitio. Pero esto no es nuevo. Piensa en tu propio comportamiento cuando navegas: Cuando llegas a una página que tarda mucho en cargar ¿Qué haces?

Efectivamente; te vas.

Según los estudios, si tu página tarda 3 segundos en cargar,  el porcentaje de rebote aumenta de forma considerable afectando directamente a tus ventas que pueden experimentar una caída del 25%.

Esa cifra aumenta hasta el 40% si la demora alcanza los 5 segundos… y la cosa continúa con esta misma dinámica por cada segundo que pasa.

¿Deberíamos preocuparnos? Rotundamente, SÍ.

 

La velocidad de carga en dispositivos móviles

Cuando un usuario visita nuestra página desde su dispositivo móvil  (smartphone, Tablet, etc.) y la velocidad de carga es muy lenta, nos enfrentamos a un problema más complicado que el hecho de perder visitas, cosa que, ya de por sí, es grave.

En estos casos tenemos que lidiar con un usuario que se siente frustrado por la sensación de estar perdiendo megabytes de descarga.  Y esta es una creencia más extendida de lo que crees. Cuando algo tarda en el móvil la gente piensa que se le agotan los megas.

 

Pongámonos manos a la obra

Lo primero,  ANALIZAR.

Aquí  te dejamos unas cuantas herramientas gratuitas que pueden ayudarte a medir el rendimiento de tu página.

 

Estas ya deberías conocerlas…

Google PagesSpeed

Pingdom

LoadImpact

Gtmetrix

 

Aquí van unas cuantas más…

YSlow

WebPagetest

Google mobile

 

También puedes acceder a estos datos desde tu panel de Analytics en el apartado “comportamiento” > “Velocidad del sitio”.

 

En general, lo que obtendrás con estas herramientas es un listado con todos los elementos que están aumentando el peso de tu sitio y, por consiguiente, afectando negativamente al rendimiento de tu página.

Es necesario que estudies y consideres cada uno de los detalles porque te darán muchas indicaciones de mejora.

 

Los errores más comunes

Para facilitarte un poco más la tarea te vamos a enumerar los errores más comunes que se detectan en los test de rendimiento web.

Como bien dijo Miguel López. “El diablo está en los detalles” por lo tanto tenemos que estar atentos a cualquier mínimo elemento que pueda estar consumiendo más recursos de los necesarios.

1. Chats online

Muy útiles, pero muy peligrosos si lo que valoramos es el rendimiento de nuestra web.  La cuestión aquí es preguntarse si realmente generan un beneficio real para nuestra página y, en caso afirmativo, optar una opción que perjudique lo menos posible a nuestra velocidad de carga.

Una posible solución que se apuntó durante la ponencia sería implementar este tipo de recursos de forma asíncrona en lugar de sincronizada.

2. Códigos de analytics

Debemos revisar el código de analytics que está utilizando nuestra página y actualizar nuestra versión para así mejorar el rendimiento general del site.

 

3. Ficheros .css y .js

Dentro del esquema de archivos que conforman nuestra web verás que existen muchos ficheros .css y .js. Estos elementos se encargan de dar estilo a nuestra web así como de ejecutar las diversas funciones implementadas. Sin embargo consumen algunos recursos cuyo número podemos disminuir.

¿Cómo? Minificando o agrupando dichos archivos en un sólo documento. Aquí te dejamos una herramienta que puede serte de ayuda: Minify

Una vez realizada esta minificación tendremos menos peso y además, habremos reducido considerablemente el número de peticiones al servidor.

Pero ten cuidado, si esta agrupación de archivos no se hace bien, podemos tener un serio problema de codificación. Por lo tanto, te recomendamos que realices este paso conjuntamente con tu webmaster.

 

4. Caché

Si muchas de las páginas de tu sitio web no experimentan cambios importantes en su estructura y contenido, te aconsejamos que optes por cachearlas. De esta forma, cuando un usuario visite tu site no tendrá que descargar todos los apartados, simplemente, lo que consulte.

 

5. Paginación de productos

A efectos de usabilidad y rendimiento no es recomendable que nuestras páginas de catálogo tengan un larga línea de scroll ya que eso supondría tener que sumar el tiempo de carga de todos y cada uno de los elementos que aparezcan para que la página se viese correctamente.

Es mejor recurrir a la paginación de productos o,si se prefiere, a la carga de los elementos conforma el usuario haces scroll.

 

6. Plugins

Como ya hemos avanzado anteriormente, la inclusión de código puede aumentar el peso de la página. Pues bien, los plugins son píldoras o parches de código que se insertan en las páginas web para realizar algún tipo de función. Muchos de ellos son tan pesados y consumen tanto recursos que son directamente responsables de la tasa de rebote de tu página. Te recomendamos que revises tu lista de plugins y te desagas de los que no necesites.

 

7. Imágenes. La gran batalla

Las imágenes se llevan la palma en cuanto a consumo de recursos. Pero los principales culpables de que esto ocurra somos nosotros mismos ya que no las preparamos adecuadamente para la web.

Seguro que muchos de vosotros utilizáis el formato “guardar para web y dispositivos móviles” de Photoshop. Si esto es así, debo deciros que ya tenéis media batalla ganada. Efectivamente tenéis mucho camino por recorrer pero ya mostráis la actitud correcta.

Para aquellos que no os preocupáis en absoluto por optimizar las fotos que subís a vuestra página. Debéis saber que estáis más que suspendidos.

 

El objetivo:

Bajar el peso de las imágenes

 

El gran reto:

Que esas imágenes no pierdan calidad

 

¿Cómo conseguimos eso?

El primer paso es, efectivamente optimizar las imágenes todo lo posible. Como ya hemos dicho la opción de guardar para web y dispositivos es una buena forma de empezar.  Sin embargo, una vez hecho esto, existen más herramientas que pueden afinar mucho más la compresión y reducir al máximo el peso de la página (en función claro está de sus dimensiones)

 

Aquí te dejamos algunos de esos recursos para que vayas probando

Riot (Radical Image Optimization Tool)

JPG Mini

JPG lossless

 

Un ejemplo que nos encontramos mucho. El típico slider con fotos gigantes que se repite en todas las páginas de nuestro site. Traducido, eso son kb y kb de descarga por cada una de las imágenes del slider para cada una de las páginas de tu sitio, y todo eso, multiplicado por todas las visitas que entran en nuestra web. ¡Mucha atención!

 

Esperamos que este post te haya abierto un poco los ojos y que puedas empezar desde ya mismo a optimizar tu página.  ¡Nos vemos la próxima semana!