La velocidad de carga, es sin duda uno de los más factores que más debes tener en cuenta en el proceso de optimización de un sitio web. En ocasiones, determinadas páginas ven aumentado su tiempo de carga considerablemente, debido a su peso, ya que éste puede incluir un gran número de archivos en formato vídeos e imágenes que ralentizan el tiempo de descarga y visualización. Aquí entra en juego lo que denominamos Lazy Load.

¡Sigue leyendo, si quieres conocer más sobre cómo configurar Lazy Load en WordPress!

¿Qué es Lazy Load?

Lazy Load o también conocida como carga diferida, es una tecnología que permite que ciertos recursos de la web, como imágenes o vídeos, solo carguen cuando éstos se encuentren siendo mostrados y no antes. Es decir, es una manera de evitar la carga de objetos que puede que no lleguen a visualizarse, por tanto, todo contenido que se encuentre fuera del área visible de la web al iniciar la navegación, no cargará, únicamente cuando lleguemos a él a través del scroll.

En la carga diferida, el navegador es capaz de construir la página web DOM, sin llegar a efectuar la descarga de las imágenes ni la carga de vídeos. De esta manera, a partir de JavaScript se determina qué imágenes y vídeos deben ser descargados y cargados, dependiendo del área visible de la página en el momento de la carga. Esto permite que la descarga de imágenes y vídeos adicionales se retrase hasta que el usuario se haya desplazado a lo largo de la página. Todo este proceso es complemente transparente para el usuario.

¿Cómo configurar Lazy Load para WordPress?

Al igual que otro tipo de funcionalidades, WordPress incluye plugins capaces de tratar la carga diferida. Existen muchos plugins gratuitos capaces de arreglar este problema en cuestión. En este post, vamos a hablaros de a3 Lazy Load, el cual es perfecto para este cometido, gratuito y además sencillo de usar.

Accede al apartado de plugins de tu WordPress y establece la búsqueda del mismo. Una vez instalado, podremos pasar a configurar Lazy Load a través del menú lateral Ajustes > a3 Lazy Load. Al entrar en los ajustes específicos del plugin, nos encontraremos un apartado denominado «Ajustes globales del framework del plugin«. En primer item, hará referencia si queremos que todos los menús de configuración del plugin se muestren abiertos o cerrados al acceder a la configuración del mismo. Por otro lado, tendremos la opción de eliminar todo rastro de código que haya podido dejar el plugin en nuestro WordPress, en caso de que decidamos desinstalarlo.

En el siguiente apartado «Activación de carga diferida» tendremos la opción de activar o desactivar el plugin en cuestión. Posteriormente, podremos escoger aquellos supuestos en los que queremos que se encuentre activado, ya sea en el caso de las imágenes («Carga diferida de imágenes«) o para vídeos e iframes («Carga diferida en vídeos e imágenes»). La configuración se establecerá por defecto para todas las opciones, no obstante podremos excluir los supuestos que así consideremos.

Otro opción muy interesante, es la posibilidad de excluir de esta carga en diferido urls o tipos de páginas concretas. El uso de «Excluir por URLs y tipos de página» es muy sencillo. Basta con incluir la url que queremos excluir o marcar las casillas para el tipo de página que más nos convenga.

También es de destacar, la opción de aquellos WorpPress que ya tengan instalado algún plugin que tengan como función principal gestionar el tráfico móvil. Ya que en «Plugins de plantilla móvil para WordPress», podremos desactivar la carga diferida tanto en WpTouch o MobilePress.

Alguna otra opción interesante, será la configuración de la «Optimización del script de carga» en caso de que tu tema tenga la función wp_footer(), así como el «Efecto y estilo» que se encontrará configurado por defecto dentro del spinner de carga. Además, te permitirá que sea compatible con Jetpack o incluso modificar el umbral de carga de la imagen, pudiendo ampliar el área visible que quieres que cargue en función de la cantidad de píxeles establecidos.

Ventajas de utilizar la carga diferida

Una vez hayamos instalado Lazy Load en WorpPress, podremos comprobar cómo se lleva a cabo el proceso de carga de vídeos e imágenes, el cual se realizará una vez nos encontremos haciendo scroll por la web, y por tanto, activando dichas peticiones donde se cargará el contenido.

Sin duda, esto nos ayudará a reducir el tiempo de carga de nuestra web, puesto que al tener que realizar menos peticiones de carga de elementos, el tiempo se verá reducido considerablemente. Te contamos algunos otros supuestos donde se recomienda la carga diferida de vídeos e imágenes:

• En el caso de landing page, donde buscamos abarcar todo el contenido en una única página, supone una ganancia considerable en el tiempo de carga de la misma, ya que como éstas suelen tener mucho scroll, los elementos irán cargando una vez el usuario se encuentre recorriendo la misma.
• Para móviles, supone también una ventaja añadida, ya que el área visible de la web inicial es aún menor. Todo tipo de imágenes, vídeos o frames, quedarán fuera de la carga inicial y no serán cargados a no ser que el usuario inicie el scroll.
• En el caso de páginas que incluyan gran cantidad de imágenes y vídeos en formatos de alta resolución, la inclusión de este tipo de sistemas de carga diferida, puede suponer un componente diferencial a la hora de optimizar sus tiempos de carga.

Ahora que ya conoces las ventajas de la carga diferida de vídeos e imágenes y sabes cómo llevar a cabo la configuración de Lazy Load en WordPress, te recomendamos que siempre que puedas pongas tu web en manos de un experto SEO. Desde Online Zebra, trabajamos el posicionamiento web para tu proyecto y sabemos que la velocidad de carga es cada vez un aspecto más fundamental entre los requisitos que Google tiene en cuenta a la hora de posicionar tu página web. Si quieres conocer más acerca de cómo podemos ayudarte a mejorar el posicionamiento orgánico de tu web, no dudes en ponerte en contacto con nosotros.