Optimizar el tiempo de carga de su sitio web es un enfoque de ganar-ganar para mantener contentos a los visitantes de su sitio y aumentar los ingresos generados por su negocio en línea.

Para arrojar luz sobre todos esos problemas que ralentizan su sitio web, invitamos a Stavros Papadakis a exponer su proceso para acelerar los sitios web lentos.

¿Qué hace que su sitio web sea lento?

Definitivamente debería consultar mi publicación anterior con 16 formas de acelerar su sitio web de WordPress.

Aunque esta publicación proporcionó una lista de verificación rápida con los mejores ajustes para optimizar el tiempo de carga de su sitio web de WordPress, todavía hay muchos problemas que pueden ralentizar su sitio web.

Si habilitó la compresión en su archivo htaccess, combinó archivos CSS, movió archivos Javascript al pie de página pero aún no está satisfecho con el tiempo de carga de su sitio, verifique estos 18 problemas comunes que ralentizan su sitio web.

1. Sitios web súper pesados

No hay duda de que una página de 3 MB que realiza 180 solicitudes HTTP será más lenta que un sitio de 1 MB con 60 solicitudes HTTP.

¿Quieres optimizar el tiempo de carga de tu sitio?

Una de las mejores maneras de hacerlo es minimizando el tamaño de cada página de su sitio.

Aunque puede optimizar sus imágenes, combinar archivos CSS, minimizar archivos Javascript y aplicar muchos ajustes de optimización front-end, tener un sitio de 3 MB hará que su sitio sea lento y que los usuarios de su sitio no estén contentos.

21 MB son una carga enorme para su servidor y su navegador.

Mientras diseña o rediseña su sitio, debe hacer todo lo posible para cargar solo lo que necesita y nada más.

En otras palabras, siempre debes preguntarte:

¿Realmente necesito 8 imágenes grandes en mi presentación de diapositivas en la página de inicio?

¿Tengo que mostrar 20 artículos de cartera en la página de inicio?

¿Debo mostrar 12 testimonios de usuarios felices en la página de inicio o 3 testimonios también funcionarán?

Cargar todos estos datos hace que su sitio se vea bien, pero su sitio también será más lento debido a todos estos datos.

¿Quieres tener un sitio de carga lenta? De lo contrario, minimice los datos cargados por página de su sitio web.

2. Imágenes no optimizadas

¿Sabes que el 80% del tiempo que se tarda en cargar un sitio web está controlado por la estructura del front-end?

Este es un hecho sorprendente de la optimización del rendimiento web.

El 80 % del tiempo de respuesta del usuario final se dedica al front-end. Concéntrate en eso.

Puede intentar optimizar su base de datos o código PHP, pero si ignora este hecho de suma importancia, su sitio web será lento.

Un archivo PNG de 460 KB puede convertirse en 90 KB al optimizarlo.

Si tiene 10 imágenes no optimizadas en su sitio, puede agregar 2-3 MB de carga de página adicional.

Si no optimiza sus imágenes, el tiempo de carga de su sitio puede verse gravemente afectado.

La buena noticia es que la mayoría de las imágenes JPG y PNG pueden volverse un 40 % o incluso un 80 % más pequeñas sin perder calidad de imagen al optimizarlas con Photoshop, ImageOptim o una herramienta de terceros como Kraken.

3. Uso excesivo de anuncios

Google Adsense y otros servicios similares pueden ser una fuente adicional de ingresos para usted, pero también pueden ralentizar su sitio.

Un sitio web que carga anuncios en el encabezado, en la barra lateral derecha, en el cuerpo de la publicación y en la parte inferior de la página utilizando 2 o 3 servicios de anuncios diferentes, será mucho más lento que un sitio web con solo 1 anuncio. en la barra lateral derecha o en el cuerpo de la publicación.

Los anuncios no solo son molestos para la mayoría de los usuarios, sino que también ralentizarán su sitio.

Consulte la siguiente captura de pantalla del sitio web de un cliente.

¿Realmente necesitas todos estos molestos anuncios?

Lo crea o no, hay 4 anuncios diferentes, un anuncio en la parte superior de la captura de pantalla, el video que es un anuncio, un anuncio en la barra lateral derecha y otro anuncio en la parte inferior de la página. No hace falta decir que esos anuncios son molestos para la mayoría de los usuarios y también ralentizan el tiempo de carga de su sitio.

En resumen, los anuncios siempre deben usarse con precaución. Siempre que un anuncio no genere dinero, debe eliminarse.

4. Dimensiones incorrectas para tus imágenes

No debe escalar imágenes en HTML, debe cambiar el tamaño de una imagen grande y usar la imagen redimensionada en su lugar.

Por ejemplo, supongamos que tiene una imagen de 1200 px x 600 px y desea usar una versión "más pequeña", por ejemplo, 400 px x 200 px.

En ese caso, no use la imagen original y reduzca su escala cambiando las dimensiones de ancho y alto en HTML.

Debe crear una nueva imagen en miniatura cambiando el tamaño de la imagen original de 1200 px x 600 px a 400 px x 200 px y usar la nueva imagen que es más pequeña y se cargará más rápido.

¡Me he encontrado con muchos sitios que solían cargar una imagen de Facebook de 256 x 256 de 150 KB en lugar de un icono de Facebook de 32 x 32 de 2 KB!

5. Redireccionamientos sin sentido

Tengo una prueba rápida para ti.

¿Cuál de las siguientes imágenes carga más rápido, A, B, C o D?

A. http://www.dominio.com/imagen.jpg
B. http://dominio.com/imagen.jpg
C. https://www.dominio.com/imagen.jpg
D. https://dominio.com/imagen.jpg

¿Elegiste A? Equivocado.
¿Elegiste B? Equivocado.
¿Elegiste C? Equivocado.
¿Elegiste D? ¡Nuevamente incorrecto!

¡La respuesta correcta es que depende de tu sitio!

Si su sitio es https://www.domain.com, al llamar a la versión no HTTPS de la imagen (http://www.domain.com/image.jpg), habrá una redirección adicional desde http: //www.domain.com/image.jpg a https://www.domain.com/image.jpg por el navegador para cargar la imagen.

Si está utilizando la versión que no es www para su sitio (http://domain.com/), entonces también debe usar siempre la versión que no es www para sus imágenes (por ejemplo, http://domain.com/image. jpg en lugar de http://www.dominio.com/imagen.jpg).

A los navegadores no les gustan este tipo de redireccionamientos sin sentido.

Las redirecciones sin sentido ralentizarán su sitio

Al usar direcciones URL relativas para sus archivos (p. ej., <img src=”//eadn-wc04-1126528.nxedge.io/image.jpg” />), puede deshacerse fácilmente de este problema común que ralentiza el tiempo de carga de Tú sitio.

6. Ubicación del servidor incorrecta

Si el tráfico de su sitio proviene principalmente de EE. UU. o el Reino Unido, entonces su sitio debe estar alojado en una empresa de alojamiento ubicada en EE. UU. o el Reino Unido, respectivamente.

Cuanto más cerca esté el servidor de los visitantes de su sitio, más rápido será su sitio web.

No hace falta decir que si recibe tráfico de todo el mundo, le recomiendo que utilice una red de entrega de contenido o CloudFlare para que las imágenes, los archivos CSS y Javascript se carguen desde un servidor más cercano a la ubicación de cada usuario.

7. Planes de alojamiento compartido dudosos

Nadie quiere pagar $$$ por hospedar un sitio, pero ofrecer un sitio de WooCommerce con 40 complementos activos o un sitio de Magento con 5000 productos a través de un plan de hospedaje compartido que cuesta $5 por mes es una receta para el desastre.

Siempre debe invertir en una buena empresa de alojamiento para obtener el mejor tiempo de carga para su sitio.

Si su sitio no está disponible o es lento, puede ahorrar unos cuantos dólares al mes usando un plan de alojamiento compartido, pero perderá mucho más si pierde a sus clientes (un usuario que visita un sitio de carga lenta no volverá a visitar este sitio).

Si tiene un sitio pesado de WordPress que usa Woocommerce o muchos complementos activos, le recomiendo WP Engine y FlyWheel (enlaces de afiliados).

No debe esperar obtener 200.000 visitas únicas por mes para actualizar a un VPS, esto nunca sucederá mientras esté alojando su sitio en el mismo servidor sobrecargado con cientos de sitios en él.

8. Uso excesivo de scripts de redes sociales

Las secuencias de comandos de las redes sociales (Facebook, Twitter, Pinterest, etc.) agregan una búsqueda de DNS, un conjunto de archivos Javascript y algunas imágenes cada vez que se agregan en una página.

Aunque muchas de esas opciones para compartir deberían estar disponibles al final de sus publicaciones para que sus usuarios puedan compartir fácilmente sus publicaciones, no tiene sentido cargar todas esas opciones para compartir en cada página.

¿Cuál es el punto de cargar esos íconos de redes sociales en cada página, por ejemplo, en la página de contacto o en las páginas de su categoría?

Mostrar 5 recuentos de redes sociales diferentes para cada publicación en la página de inicio o en las páginas de categorías agrega mucha carga a su sitio. ¿Qué importancia tiene mostrar los recuentos en estas páginas? ¿Necesita mostrar también Facebook, Twitter, Pinterest, Google Plus y LinkedIn?

Demasiados scripts de redes sociales pueden matar el rendimiento de su sitio

¿Sería mejor mostrar solo 1 o 2 que funcionen bien para usted? Si no obtiene muchas acciones, ¿tiene sentido mostrar alguna?

Siempre debe pensar dos veces antes de agregar cualquier opción de redes sociales en una página de su sitio.

9. Tipo de archivo incorrecto para sus imágenes

Si necesita transparencia para sus imágenes, no puede evitar el tipo de archivo PNG, PERO si no necesita transparencia, nunca debe guardar sus imágenes como archivos PNG porque son mucho más grandes en tamaño de archivo y mucho más lentas que las imágenes JPG.

Minimice o incluso elimine los archivos GIF pesados ​​porque pueden ralentizar drásticamente el tiempo de carga de su sitio.

También debe intentar evitar guardar imágenes con texto como contenido, ya que editar el texto de las imágenes puede llevar mucho tiempo y las imágenes generadas también son mucho más pesadas.

Utilice JPG como predeterminado. Es el tipo de archivo de carga más pequeño y rápido para la mayoría de los archivos.

10. No aprovechar los servicios dedicados

Hay una gran cantidad de servicios populares que pueden reducir la carga de su servidor.

¿Tienes videos en tu sitio? Debes usar Youtube, Wistia o Vimeo.

¿Tiene muchos comentarios en su sitio? Deberías usar Disqus, IntenseDebate o
Discurso.

¿Utiliza jQuery, jQuery UI, AngularJS o Mootools? Debe cargarlos a través de las bibliotecas alojadas de Google.

¿Utiliza WordPress y muestra publicaciones populares? Debe usar Jetpack, que lo hace automáticamente por usted.

También puede usar una red de entrega de contenido (CDN) para servir sus imágenes desde allí en lugar de su sitio.

Si su sitio recibe un tráfico significativo y carga muchas imágenes y videos, el tiempo de carga de su sitio puede optimizarse drásticamente al equilibrar la carga de trabajo de su sitio con los trucos mencionados anteriormente.

11. Errores 404

Si intenta cargar un archivo que no existe o el navegador no puede encontrarlo, el tiempo de carga de su sitio se verá afectado por este error HTTP 404.

Siempre debe verificar si hay errores 404 durante la representación de sus páginas para lograr el tiempo de carga más rápido. Puede hacerlo verificando la cascada generada de su sitio usando Webpagetest y GTMetrix o usando la pestaña de red de navegadores como Chrome y Firefox.

Si Webpagetest muestra líneas rojas en la cascada, debe solucionar y corregir esos errores 404 de inmediato.

Los errores 404 pueden arruinar el tiempo de carga

Este tipo de errores realmente puede arruinar el tiempo de carga de su sitio web, especialmente si sirve su sitio a través de un plan de alojamiento compartido.

12. No almacenar en caché tu sitio

Todos los sistemas de gestión de contenidos (WordPress, Joomla, Drupal, Magento) utilizan una base de datos para guardar un gran conjunto de datos en ella.

Aunque esto es excelente para administrar su sitio, también significa que agrega una carga adicional en su servidor para generar cada página cada vez que se solicita.

Puede resolver este problema utilizando el almacenamiento en caché.

Si usa WordPress, puede usar un complemento de almacenamiento en caché como
W3 Total Cache o WP Super Cache o ZenCache o use una empresa de alojamiento de servidor administrado como WP Engine y FlyWheel (enlaces afiliados) que se encargan del almacenamiento en caché.

No hace falta decir que Joomla, Drupal y Magento también ofrecen opciones de almacenamiento en caché que pueden ayudar mucho al proporcionar versiones en caché de su sitio para los visitantes posteriores del sitio en lugar de generar cada página una y otra vez.

El almacenamiento en caché de sus páginas puede acelerar drásticamente su sitio

El almacenamiento en caché es una obviedad para cualquier sitio web basado en una base de datos. Incluso un período de almacenamiento en caché de 10 minutos puede optimizar drásticamente el tiempo de carga de su sitio web.

13. Cientos de solicitudes HTTP

Cada archivo CSS, archivo Javascript o imagen cargado en su sitio es una solicitud HTTP. Cuantas más solicitudes HTTP tenga su sitio, más lento será su sitio.

Aunque puede intentar combinar archivos CSS y Javascript, archivos CSS en línea y usar sprites CSS para imágenes pequeñas, si implementa esos ajustes y todavía tiene 150 solicitudes HTTP, obviamente debería intentar ordenar su sitio eliminando contenido de eso.

246 solicitudes HTTP ralentizarán su sitio sin importar cuán optimizado esté

Sé que es tentador mostrar una gran cantidad de contenido en cada página de su sitio, pero tenga en cuenta que "menos es más", así que trate de no cargar tantas imágenes o secuencias de comandos.

14. Mala configuración del servidor

Si tiene un plan de alojamiento compartido, es bastante común que hagan todo lo posible para servir tantos sitios por servidor como sea posible.

Por lo general, lo hacen al deshabilitar funciones como la compresión y KeepAlive, entre otras.

Habilitar HTTP Keep-Alive permite que la misma conexión TCP envíe y reciba múltiples solicitudes HTTP, lo que reduce la latencia para solicitudes posteriores.

La compresión reduce el tamaño de los archivos enviados desde su servidor para aumentar la velocidad a la que se transfieren al navegador.

Si tiene un plan de alojamiento compartido y su empresa de alojamiento ha desactivado la compresión y Keep-Alive, debe cambiar de empresa de alojamiento lo antes posible.

Keep-Alive y la compresión deben estar habilitados en su servidor

15. Importaciones de CSS

Las importaciones de CSS son una buena manera de importar archivos CSS en la parte superior de un nuevo archivo CSS, por ejemplo, importar un archivo de restablecimiento de CSS, pero también agrega demoras adicionales durante la carga de una página web.

Debe evitar las importaciones de CSS, siempre que sea posible.

16. Cargar archivos innecesarios en cada página

Debe cargar archivos CSS y Javascript solo cuando se requieran en una página de su sitio.

Por ejemplo, si se necesita un archivo Javascript específico solo en una sola página, en ese caso, debe cargar ese archivo Javascript solo en esta URL en lugar de cargarlo en cada página de su sitio.

Si no sigue esta regla simple, puede terminar cargando 30 archivos CSS y 40 Javascript en una página que solo necesita 3 CSS y 4 archivos Javascript, por lo que está realizando 63 solicitudes HTTP adicionales y agregando muchos cientos de kilobytes en la página. Talla.

17. Cargar archivos pesados ​​en segundo plano

Muchos sitios solían cargar imágenes de fondo grandes que apenas son visibles.

¿Realmente necesita una imagen de 500 KB cargada en segundo plano? Debe intentar usar CSS3, siempre que sea posible, o usar un color de fondo en su lugar.

También es una mala práctica cargar archivos de sonido en segundo plano mientras se carga el sitio.

La mayoría de esas técnicas están ralentizando su sitio y deben evitarse.

18. No usar un experto

Mi objetivo era brindarle suficiente información para comenzar a corregir las páginas de carga lenta de su sitio.

Optimizar el tiempo de carga de su sitio es una situación beneficiosa para usted y para todos los que visitan su sitio web. Los sitios más rápidos significan conversiones más altas, mejores clasificaciones en los motores de búsqueda y una experiencia de usuario más agradable.

Lo mejor es contratar a un experto cuando desea que un trabajo se haga bien.

Los aficionados pueden seguir las mejores prácticas pero no saben por dónde empezar.

Un experto solucionará los problemas reales que ralentizan su sitio.

Siempre que un aficionado no conozca los problemas reales de su sitio web, recomendará una solución temporal sin sentido, como mover hosts, cambiar el tema, instalar un complemento de almacenamiento en caché diferente o incluso cambiar el CMS.

Muchos de mis clientes han desperdiciado su tiempo y dinero en aficionados que acababan de instalar un complemento de almacenamiento en caché sin solucionar los problemas reales de su sitio.

Siempre debe tener en cuenta que cada sitio web es único, por lo que se deben aplicar diferentes ajustes de optimización de velocidad por sitio.

En resumen, la optimización del tiempo de carga de su sitio siempre debe ser realizada por un experto que realice los ajustes de optimización de velocidad con precisión quirúrgica.

¡Imagínese lo felices que estarán sus usuarios al ver tiempos de carga súper rápidos!

Si quieres contratarme, estaré encantado de ayudarte. ¡Vea mi cartera y contácteme en AwesomeWeb hoy!