Velocidad de carga

Una rápida respuesta de carga es determinante para el buen posicionamiento de un sitio web. Como ya sabes, Google busca siempre ofrecerle los resultados de mejor calidad a sus usuarios, esto incluye contenido actualizado y de calidad, pero también otros factores como el que vamos a tratar en este capítulo, la velocidad de carga.

Que la velocidad de tu sitio web sea buena determinará que el usuario se quede en tu sitio o en cambio con una velocidad lenta lo abandone. Según los estudios que Google ha publicado, el uso del móvil para acceder a internet supera en más del 50% al uso del PC, por lo que mejorar la velocidad de carga aún se hace más vital si quieres que los usuarios visiten tu sitio y sobre todo decidan quedarse en él por la fluidez que ofrece la navegación. Y es que si el usuario que decide hacer clic en tu enlace mostrado en las SERPs obtiene una interminable carga de la web hará que vuelva atrás antes de siquiera ver el contenido que le ofrecías y que elija otro sitio web que Google le ha mostrado en sus resultados. Por consiguiente obtienes mayor porcentaje de rebote y una disminución del CTR, poniendo en peligro la posición que habías conseguido.

Además unos de los factores que los robots analizan desde que se lanzó la actualización de algoritmo Mobile-first, es el tiempo de respuesta que ofrece el sitio web.

¿Cómo mejorar la velocidad de carga?

Una rápida velocidad de carga depende de varios factores que vamos a tratar detalladamente a continuación.

Servidor / Alojamiento Web

Elegir un buen servidor es primordial para que la velocidad de tu sitio no se vea perjudicada. A día de hoy existe un amplío abanico de opciones a elegir pero debemos tener en cuenta aspectos como si el servidor está preparado para el SEO, donde está ubicado, o si está especializado para el CMS que tú usas. Por ejemplo si usas WordPress, un hosting que ofrezca planes para WordPress con herramientas exclusivas para un rápido desarrollo y una fácil gestión, configuración de la caché… Son aspectos destacables a la hora de decantarse por una de las opciones.

Este punto sería fundamental para reducir el tiempo de respuesta del servidor. Si habéis realizado un test con la herramienta PageSpeed Insights de Google puede que en ocasiones una de las sugerencias de optimización que la herramienta os muestra sea “Reducir el tiempo de respuesta del servidor” que podremos mejorar teniendo un buen servidor entre otros aspectos que vamos a seguir tratando a lo largo del capítulo.

Compresión GZIP

Otro aspecto vinculado al servidor, ya que la compresión GZIP es un servicio que facilita el servidor. Con la compresión GZIP lo que se consigue es reducir el tamaño de las respuestas a solicitudes HTTP, disminuyendo a su vez el tiempo de descarga del rescurso que corresponda, y reduciendo también el tiempo de renderizado de las páginas que se cargan por primera vez. La compresión GZIP también puede habilitarse a través del htaccess de nuestro sitio pero antes debemos asegurarnos que nuestro servidor sea compatible con esto.

Caché

Antes que nada debemos saber qué es la caché, cómo funciona y qué tipos de caché hay.

¿Qué es la caché?

La caché es aquella que almacena documentos web como páginas, imágenes, logotipos, etc. para reducir la carga de los servidores, las peticiones realizadas y el tiempo de descarga de dicha página y renderizado.

¿Cómo funciona la caché?

La primera vez que un usuario visita una página web, en la caché se crean copias de parte del contenido que hay en la página que no serán modificadas con frecuencia. Esto pueden ser imágenes, logos, hojas de estilos (CSS), etc. Cuando ese mismo usuario vuelve a visitar el sitio web, es decir, es un usuario recurrente, la caché le sirve las copias anteriormente guardadas para que la carga de la página sea más rápida. Mejorando con esto también la experiencia de usuario.

Pero para que esto pase, y el navegador guarde archivos en caché, debemos configurarlo previamente en nuestro sitio web, para darle la orden al navegador de hacer una copia de los archivos.

La caché tiene un periodo de duración, que podemos elegir nosotros. Dependiendo del archivo, y la fecha de caducidad seleccionada, dichos archivos serán actualizados, creando nuevas copias de archivos en caché. Por ejemplo: Especificamos en la caché que la copia del logo de un sitio web debe durar 12 semanas. Por lo que al pasar ese tiempo si volvemos a acceder al sitio, la caché creará una copia nueva del logo, para servirla en futuras sesiones.

Tipos de caché

  1. Caché del servidor:  Como su nombre indica esta caché se encuentra en el servidor. Sirve para que cuando se hagan peticiones HTTP al entrar en una web el servidor sirva la copia que tiene en caché, haciendo este proceso mucho más rápido.
  2. Caché del navegador:  En este caso es el navegador quien guarda una copia de parte de la página para mostrarla al usuario cuando éste visite la web.

Ambos tipos de caché son complementarias y han de configurarse las dos para obtener mejor velocidad de carga.

Para configurar la caché debemos contactar por un lado con el servidor, en caso de que no estuviese ya en funcionamiento. Es algo que por defecto los servidores tienen configurado.

Por otro lado mediante algún plugin, módulo o con la inserción de código directamente en htaccess podemos configurar la caché del navegador. Eligiendo el tiempo de caducidad que sea conveniente en cada caso.

Nota: solo se podrá configurar y establecer la caché para recursos internos de la web. No es posible configurar la cache de recursos de dominios externos como Google Analytics por ejemplo, un caso muy común.

Optimización de imágenes

Subir a un sitio web imágenes sin optimizar repercute en el tiempo que necesita la web para ser mostrada. Esto se debe a que si se suben a un sitio imágenes con un gran peso que no han sido preparadas para web, en cuanto a tamaño y resolución, se estará cargando información innecesaria que dará como resultado más tiempo en procesar dicho sitio. Se recomienda subir imágenes con el tamaño al que se vayan a mostrar y no dejar que sea el archivo CSS el que escale la imagen al tamaño que corresponde. También se debe realizar un compresión sin pérdidas, que respetará la calidad del archivo, pero reduciendo su resolución y con ello su peso.

Esto podrá hacerse con cualquier programa de edición, incluso existen plugins y módulos que realizan dichas optimizaciones en imágenes que ya han sido previamente subidas al sitio.

Minificación de JavaScript, CSS y HTML

¿Qué es la minificación de JavaScript, CSS o HTML?

La minificación de un código como JavaScript, CSS o HTML es la optimización del código, cuando se reduce el archivo quitando espacios en blanco, saltos de líneas, comentarios, etc. Con esto se consigue reducir el peso del archivo y como resultado se obtiene una velocidad de carga más rápida.

Para los programadores y desarrolladores es muy útil en cuanto a organización estructurar el archivo con saltos de líneas, comentarios o espacios, para tener una mayor claridad en el trabajo que están realizando, pero para los robots como el de Google, dicha jerarquización del contenido no le es de utilidad, y lo que va a analizar es que la carga de estos sea rápida. Esto se consigue minificando los códigos. También existen herramientas online y plugins que realizan dicha tarea.

CDN

¿Qué es una CDN?

CDN por sus siglas en inglés Content Delivery Network, es un conjunto de servidores distribuidos en diferentes lugares, que tiene como función entregar de una forma más rápida y eficiente el sitio web a los usuarios. Por ejemplo: Si tu sitio web está alojado en Francia y tienes activo el servicio de CDN, al usuario que visite la web desde Nueva York, la CDN le servirá tu sitio desde un servidor de Nueva York o desde el servidor más próximo a la ubicación en la que se encuentre el usuario.

Ventajas de la CDN

Al servir el contenido de un sitio web desde el servidor más cercano al usuario, hace que la velocidad de carga que presenta el sitio sea mucho menor. Por lo tanto la usabilidad y la experiencia de usuario será mucho más positiva, consiguiendo con esto mejorar el SEO de la web.

Otros aspectos a tener en cuenta

Hay ciertas cuestiones que se deben tener en cuenta a la hora de mejorar la velocidad de carga de un sitio web que son los siguientes:

  • Elegir la plantilla adecuada: Ciertas plantillas cargan y añaden mucho código innecesarios que hacen más lenta la carga de una web.
  • Diseños recargados: Al igual que en las plantillas, un diseño recargado de un sitio conlleva a una lenta velocidad de carga.
  • Número excesivo de plugins: Se debe evitar por todos los medios usar innumerables plugins en un sitio web. Esto carga el sitio web con código no optimizado que afecta a la velocidad. Es recomendable usar el menor número de plugins posibles. El uso de plugin puede sustituirse directamente por la inserción de código en el sitio web. Por ejemplo si tenemos configurado en nuestro sitio un plugins de Google Analytics, que puede incluir otras funciones que no estemos usando, es mejor integrar el código que nos facilita Analytics en nuestra cabecera del sitio. Así evitaremos la inclusión de código innecesario. Otro aspecto a tener en cuenta es eliminar todos los plugins que no usemos y que tengamos desactivados.
  • Mantener las actualizaciones al día: Tener tu sitio web actualizado al completo, además de ayudarte a proteger y mejorar la seguridad de tu web, también mejora la velocidad de carga. Ya que dichas actualizaciones se realizarán para corregir posibles errores que pudiesen ralentizar el sitio, añadir más código del necesario, etc.
  • Borrar el contenido demo o de prueba: Cuando se está creando un sitio web, se suele subir contenido de prueba para ir viendo la forma que va teniendo el sitio y cómo va quedando en cuanto a diseño. Dejar este contenido ahí no solo conlleva a que este aparezca en las SERP’s, también tiene la desventaja de que el usuario tiene que esperar a que más contenido extra se cargue al visitar el sitio web.
¿Quieres acceder al listado con las mejores herramientas para optimizar y minificar el código de tu página web así como las imágenes?Regístrate gratis