IMG_20140306_130821

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%

3segundos_25ventas

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 鈥渃omportamiento鈥 > 鈥淰elocidad 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. 鈥淓l 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.

el-demonio-esta-en-los-detalles

  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.

  1. 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.

 

  1. 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.

 

  1. 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.

 

  1. 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.

 

  1. 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.

 

  1. 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 鈥済uardar 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!