Icono del sitio WannaROI

Cómo mejorar la velocidad de carga de una página o sitio web

cómo mejorar la velocidad de carga de una página web o sitio web

C√≥mo mejorar la velocidad de carga de una p√°gina o sitio web es una tarea que no debemos dejar de lado, ya que es unos de los factores principales para el posicionamiento SEO en Google. Pero, ¬Ņpor qu√© Google pone tanto empe√Īo en que las webs se muestren r√°pidas? Para ofrecer la mejor experiencia al usuario. Algo que queremos todos, ¬Ņno?

En nuestro día a día vamos corriendo de un lado a otro, con prisas, no queremos hacer colas, nos da ansiedad todo lo relacionado con perder el tiempo y solo queremos rapidez.

Pues bien, esto pasa igual cuando un usuario entra en una web. Si al hacer clic en tu web sale una pantalla en blanco, el usuario no da la oportunidad de esperar a que cargue y se va directamente de tu negocio. ¬ŅSabes cu√°nto dinero puedes perder por ello? Miles de euros.

A pesar de ello, la mayor√≠a de negocios no lo tienen en cuenta. Y es que, si tu web tarda m√°s de 3 segundos en cargarse, los usuarios abandonan tu sitio web corriendo. Seg√ļn una encuesta realizada por Google, la carga optima en dispositivo m√≥viles es de 15 segundos.

Por todo ello, te vamos a explicar cómo mejorar la velocidad de carga de una página o sitio web. ¡Vamos a por todas!

¬ŅQu√© es la velocidad de carga web?

La velocidad de una p√°gina web es el tiempo que transcurre mientras se espera que aparezca en la pantalla de cualquier dispositivo.

Esto se calcula desde que el usuario hace clic en la p√°gina o escribe el dominio en el buscador, hasta que la p√°gina est√° completamente visible.

Es importante recalcar que una misma p√°gina puede tener diferente velocidad seg√ļn el navegador que est√°s utilizando y seg√ļn las plataformas donde lo est√©s midiendo. Adem√°s, una p√°gina de tu sitio web tambi√©n puede tener una velocidad distinta a otra p√°gina de tu mismo sitio.

Hay distintas herramientas para saber todo esto y que veremos más adelante en el artículo.

Cómo mejorar el tiempo de carga de mi web

Para mejorar la velocidad de mi sitio web hay que tener en cuenta unas series de factores que te comentamos a continuación:

Las imágenes es uno de los factores principales que hacen que una web pese más de la cuenta. Se pueden subir imágenes hasta 1MG, aunque, personalmente, me parece una burrada. Mi recomendación es subir imágenes entre unos 50KB y 70KB. Ten en cuenta estos pesos, ya que te va a facilitar mucho a la hora de aumentar la velocidad.

¬ŅC√≥mo lo hago para que las im√°genes que subo a las webs de los clientes pesen tan poco? Existen varias herramientas que te optimizan las im√°genes, pero utilizamos tres:

1. Tinypng. Es una herramienta muy f√°cil de manejar y te permite optimizar im√°genes en formato PNG, JPEG y WebP. Subes la imagen a esta plataforma y te la comprime sin perder calidad.

optimización imágenes Tinypng

2. Photoshop. Puede ocurrir que Tinypng no te reduzca mucho el peso y siga pesando una much√≠simo. Entonces es la hora de abrir Photoshop o pedirle al dise√Īador que te reduzca el peso de la imagen.

Aunque, tengo que reconocer que el dise√Īo no es lo m√≠o, esta forma de exportar las im√°genes es muy f√°cil. Te explico c√≥mo lo hago:

Una vez abierto Photoshop y cargamos la imagen que queremos optimizar, hacemos clic en archivo ‚Äď> guardar para web y se nos abre una pantalla donde podemos modificar la calidad de la imagen y el tama√Īo. Recomiendo optimizar las fotos en JPG y usar el PNG para fotos muy importantes como puede ser el logo de tu negocio.

3. Smush. Esto es un plugin para WordPress que también optimiza las imágenes, aunque también existen otros muy buenos. Yo lo uso cada cierto tiempo para que optimice todas las imágenes que se hayan podido pasar de peso.

¬ŅQu√© quiere decir esto? Si vas a colocar una imagen en un espacio que ocupa un tama√Īo de 650√ó470, por ejemplo, no subas una imagen que sea mayor que ese espacio. Esto retrasa la velocidad web, ya que la imagen ocupa un espacio innecesario.

Por ello, guarda las im√°genes en el tama√Īo correcto.

Cuando entras en una p√°gina web una de las primeras cosas que carga son todas las fotos, retrasando la velocidad. La carga diferida o Lazy Load, quiere decir que va cargando las im√°genes conforme el usuario va haciendo scroll a lo largo de la p√°gina. Esto es muy √ļtil y hay plugins para wordpress que lo hacen para que no tengas que meter c√≥digo, como, por ejemplo, Lazy Load, Autoptimize o WP Rocket.

Las p√°ginas AMP es un proyecto de Google para hacer que las p√°ginas web, en dispositivos m√≥viles, sean m√°s r√°pidas. ¬ŅPuede parecer interesante, no? Pues hay que tener cuidad√≠n, ya que no respeta la tipograf√≠a ni formato. Es muy √ļtil para sitios de noticias o medios digitales.

Nosotros lo utilizamos para aumentar la velocidad de nuestros artículos.

Otra de las claves para saber c√≥mo mejorar la velocidad de carga de una p√°gina o sitio web es evitando hacer direcciones m√ļltiples. Una redirecci√≥n en el mundo SEO es indispensable para que nuestros usuarios no naveguen hacia un p√°gina rota y Google nos penalice por ello. Pero, muchos redireccionamientos hacen que sobrecarguen el servidor y, por tanto, reduzca la velocidad de carga.

La mejor pr√°ctica es redirecconar la p√°gina de origen con la √ļltima que quieres mostrar.

  • Redireccionamiento no correcto: wannaroi.com/posicionamiento-seo hacia wannaroi.com/posicionamiento-web-seo hacia wannaroi.com/posicionamiento-google hacia wannaroi.com/especialista-seo
  • Redireccionamiento correcto: wannaroi.com/posicionamiento-seo hacia wannaroi.com/especialista-seo

Para saber si en tu web tiene redireccionamientos m√ļltiples, hay extensiones de SEO para Chrome muy √ļtiles y que te facilitar√°n el trabajo.

Al desarrollar una página web o crearla con un CMS se crean códigos innecesarios, saltos de líneas e, incluso, espacios en blanco.

Todo esto no afecta al contenido que ve el usuario, pero si a la carga, ya que ocupa un gran espacio. Por ello, hay que minificar o reducir estos códigos para que más veloz.

Para hacer esto existen varios plugins para WordPress, como los que hemos comentado anteriormente: Autoptimize, WP Rocket o W3 Total Cache.

Llegamos al momento m√°s esperado de todo el art√≠culo. Te ense√Īaremos c√≥mo saber la velocidad de carga de mi web con unas herramientas. Tienes que tener en cuenta que no puedes obsesionarte con sacar la mayor puntuaci√≥n de velocidad, ya que hay muchos factores involucrados.

Puede ocurrir que, por mejorar un punto, da√Īes otro que pueda afectar a la experiencia de usuario. Una vez dicho esto, te vamos a ense√Īar las herramientas que m√°s utilizamos para medir la velocidad web:

Gtmetrix es una de las herramientas para aumentar la velocidad de carga m√°s conocidas. Te permite conocer visual y detalladamente el proceso de carga y los puntos que tienes que mejorar.

Cuando accedes a GTmetrix, tienes que introducir la página de tu web que quieres analizar. Una vez que ya has puesto la URL, tienes que pinchar en las opciones y poner la ubicación más próxima a la tuya, ya que, por defecto, está puesta en Canadá. En nuestro caso, seleccionamos Londres.

Esta es otra herramienta para comprobar la velocidad de carga de una web desarrollada por Google y gratuita.

Al introducir la URL de tu página, te da una puntuación del 0 al 100 para dispositivos móviles como para ordenador.

Al igual que GTmetrix, esta prueba de velocidad te da unos indicadores para mejorar la puntuación obtenida. Cuanto más cerca del 100 estés más rápida será tu web y menos elementos tendrás que arreglar.

Para saber c√≥mo medir la velocidad de carga de un sitio web, tambi√©n usamos esta herramienta. Cuando introduces la p√°gina en Pingdom webiste speed test, genera una puntuaci√≥n de rendimiento, el tiempo de carga total, el peso total de tu p√°gina y el n√ļmero de solicitudes que tiene.

Adem√°s, mide la velocidad de la p√°gina web desde diferentes partes del mundo y te hace unas recomendaciones de mejoras

Ya sabes cómo mejorar la velocidad de carga de una página o sitio web, así que pon todo lo aprendido en práctica para aumentar el posicionamiento de tu web.

Salir de la versión móvil