Cómo acelerar una página web al 70% en 7 pasos

Serveis d'allotjament web

No hay duda de que la velocidad del sitio web importa ahora más que nunca. A medida que aumentan las velocidades promedio de conexión a Internet en todo el mundo, los usuarios de la web se están volviendo cada vez menos tolerantes con los tiempos de carga lenta. Al mismo tiempo, Google ha declarado inequívocamente que prefiere recompensar sitios rápidos con posiciones más altas en los resultados de búsqueda naturales.

Para aprovechar estos beneficios es necesario que la velocidad de tu página web sea rápida. Y hoy, queremos ayudarte a cómo acelerar una página web al 70% en 7 pasos.

Lista de pasos sobre cómo acelerar una página web

  1. Comprueba el tamaño de las imágenes existentes en la web

    Si utilizas un sistema de gestión de contenido (CMS) como WordPress o Joomla, probablemente hayas notado que puedes cargar imágenes a tamaño completo y luego ajustar el tamaño de la pantalla en el backend de tu sitio web.

    Sin embargo, esto obliga a los navegadores web a ejecutar varios comandos, sacando las imágenes iniciales y volviéndolas a dimensionar de inmediato, lo que puede ralentizar su sitio.

    Para evitar que esto ocurra, utilice un programa de edición de imágenes para ajustar las imágenes al tamaño correcto antes de agregarlas a su sitio.

    La mayoría de nosotros tiene acceso a una herramienta sencilla como Preview (en Mac), o incluso Microsoft Paint (en Windows). Con estos programas todo lo que tienes que hacer es abrir la imagen y volver a subirla en tu librería de imágenes.

    Una vez hecho esto, puede llevar su edición de imágenes al siguiente nivel con una herramienta de compresión. Incluso después de volver a redimensionar cada imagen, el tamaño total del archivo podría ser bastante grande y esto ralentizará la velocidad de carga de su sitio.

    Una de las mejores herramientas disponibles es una herramienta online llamada TinyPNG. Solo tienes que subir tu imagen redimensionada y esta herramienta reducirá el tamaño del archivo sin reducir la resolución.

    Entonces, lo que tienes que hacer es descargar la imagen y subirla a tu sitio. Con esta herramienta tus imágenes se verán exactamente iguales y se cargarán mucho más rápido.

  2. Elimina plugins innecesarios

    Hoy en día, el tener un enorme número de plugins y scripts disponibles gratis, hace que sea tentador agregar más plugins de los que realmente necesitas. Ten en cuenta que cada plugin que agregas requiere recursos para ejecutarse, y más recursos significan un sitio web más lento.

    Antes de añadir nuevos plugins a tu web, pregúntate a ti mismo si la funcionalidad que ganas vale la pena o si el contenido del plugin podría codificarse.

    Si observas que tu web se está ejecutando lentamente, o si crees que podría estar funcionando mucho más eficazmente, investiga qué está pasando deshabilitando cada plugin de tu web, uno por uno. Después de deshabilitar cada plugin, ejecuta tu web a través de una herramienta como GT Metrix. Esto te mostrará la velocidad de tu sitio web.

    Si encuentras que la velocidad de tu web aumenta mucho después de desactivar un plugin, entonces es que has encontrado al culpable. Si es absolutamente necesario que la funcionalidad del plugin específico funcione, investiga hasta encontrar otro plugin que no afecte a la velocidad de tu web.

    Además, deshacerse de los plugins puede evitar conflictos de plugins que surgen cuando tienes demasiados plugins activos a la vez. Cuantos más plugins tengas activos, es más probable que tu código entre en conflicto y haga que no funcionen correctamente.

  3. Asegúrate de que los scripts de tu web están actualizados

    Dependiendo del CMS o de la plataforma de comercio electrónico que utilices, es posible que tengas que revisar regularmente si hay nuevas versiones de los scripts que estás utilizando.

    Si las hay, actualízalos lo antes posible (asegurándote primero de que tienes una copia de seguridad reciente). Los desarrolladores de scripts siempre están trabajando en mejorar su código para futuras versiones, particularmente cuando se trata de la velocidad del sitio. Actualizar los scripts a las versiones más recientes podría ayudarte mucho a eliminar los bloqueos de código que impiden que tu web se cargue rápidamente.

    Por suerte, esto no es algo que tienes que hacer diariamente. Con una vez al mes es suficiente para instalar cualquier actualización que podría estar disponible.

    Si tu sitio se ejecuta en WordPress, encontrarás estas actualizaciones en la pestaña Actualizaciones de tu panel de WordPress. En tan solo un clic, tu web  instalará las últimas actualizaciones del software.

    Establece un evento recurrente en tu calendario y reserva una hora cada mes para ello. Por lo general, ocupará mucho menos tiempo, pero es importante construir el hábito de asegurar siempre que tu web y los plugins están ejecutándose con la última versión.

  4. Haz uso de las CDNs (Content Delivery Network)

    Las CDNs son redes de servidores que se encuentran en todo el mundo. Normalmente, si no utilizas una CDN, tus usuarios tendrán que acceder al servidor en su ubicación central.

    Esto puede conducir a velocidades lentas de la web, especialmente si tus visitantes se encuentran lejos de la ubicación central de tu servidor. Además, si sólo estás utilizando un único servidor, existe la posibilidad de que se sobrecargue y haga que tu web se bloquee.

    Las CDNs resuelven ambos problemas permitiendo a tus usuarios acceder a una versión en caché de tu web desde el host que está más cerca de ellos. Mejor aún, si una de las ubicaciones de tu servidor está sobrecargada, entonces se pueden cambiar a una nueva ubicación de servidor.

    ¿El resultado? Tiempos de carga más rápidos que harán felices a tus clientes y a los motores de búsqueda.

  5. Habilita el almacenamiento en caché del navegador

    El caché del navegador permite que el navegador de un visitante del sitio web almacene copias de las páginas individuales de tu web para que, cuando el visitante regrese en el futuro, el contenido se pueda llamar desde la caché en lugar de recargar toda la página de nuevo. Esto ahorra el número de recursos utilizados para mostrar tus páginas, lo que resulta en tiempos de carga más rápidos para tu visitante.

    La forma más fácil de habilitar el almacenamiento en caché del navegador es con un plugin como WordPress W3 Total Cache.

  6. Activa la compresión Gzip

    La compresión Gzip es una tecnología que minimiza el tamaño de las respuestas HTTP basadas en navegador, a veces hasta en un 70%. Si no te ha quedado claro este concepto, no te preocupes, puedes contactar con nuestros expertos con cualquier duda.

    Utilizar la compresión Gzip puede acelerar significativamente los tiempos de carga de tu web.

    Existen tres formas de activar la compresión Gzip en tu web. Puedes:

    1. Agregar el siguiente código al archivo .htaccess de tu web:
      # compress text, html, javascript, css, xml:
      AddOutputFilterByType DEFLATE text/plain
      AddOutputFilterByType DEFLATE text/html
      AddOutputFilterByType DEFLATE text/xml
      AddOutputFilterByType DEFLATE text/css
      AddOutputFilterByType DEFLATE application/xml
      AddOutputFilterByType DEFLATE application/xhtml+xml
      AddOutputFilterByType DEFLATE application/rss+xml
      AddOutputFilterByType DEFLATE application/javascript
      AddOutputFilterByType DEFLATE application/x-javascript
    2. Agregar el siguiente código a la parte superior de tu página HTML o PHP:
      <?php if (substr_count($_SERVER[‘HTTP_ACCEPT_ENCODING’], ‘gzip’)) ob_start(“ob_gzhandler”); else ob_start(); ?>
    3. Instalar un plugin de compresión Gzip como la herramienta W3 Total Cache para WordPress.
  7. Mantén los archivos CSS en la parte superior de tu página y el código Javascript en la parte inferior

    Por último, mantén el código de tu web limpio y ordenado mediante la adición de archivos CSS en la parte superior del código de tu página y fragmentos de Javascript en la parte inferior cuando se trabaja con páginas HTML sin procesar.

    La adición de sus archivos CSS en la parte superior de la página prohíbe la renderización progresiva, ahorrando recursos que los navegadores web utilizarían para cargar y volver a dibujar elementos de tus páginas. Añadir JavaScript en la parte inferior evita que tus páginas esperen la ejecución completa del código antes de cargarlo, lo que conduce a una experiencia de navegación más rápida para tus visitantes.

Aunque estas son sólo algunas de las diferentes técnicas que se pueden utilizar para acelerar tu sitio web, son algunos de los más fáciles de implementar. Esta lista es un gran comienzo si notas que tu sitio se está desacelerando. Si quieres ir más allá o necesitas ayuda para saber cómo acelerar una página web, no dudes en ponerte en contacto con nosotros. Te ayudaremos en todos los sentidos para la optimización web.