20 formas de acelerar un sitio web

20 formas de acelerar un sitio web

Hay menos cosas más frustrantes que un sitio web que toma tiempo en cargarse. No es una sorpresa entonces que no sólo la gente, sino también los motores de búsqueda traten de mantenerse alejados de los sitios lentos. Con eso en mente, aquí hay algunos de los mejores consejos que puedes implementar para evitar molestar a los visitantes y rechazarlos en su primera visita a tu sitio web.

Los constructores de sitios web hacen que sea bastante sencillo poner un sitio web. Mientras que su rico conjunto de plantillas te ayudan a estilizar tu sitio web con facilidad, tienen un inconveniente. Muchas de las plantillas tienen un código desordenado que puede ralentizar tu sitio web.

Para superar el problema puedes eliminar todo el código innecesario, y el formato en tus archivos HTML, CSS y JavaScript. Este proceso de eliminación del exceso se llama minificación y puedes usar herramientas online sencillas como el minificador de Will Peavy para ayudarte a empezar. Los usuarios de WordPress pueden usar el plugin Autoptimize para que el proceso sea bastante sencillo.

No toma mucho tiempo para que los sitios web se vuelvan grandes y pesados. Todas las imágenes e incluso los archivos de texto plano HTML, CSS y JavaScript se hinchan rápidamente. Uno de los mejores mecanismos para acelerar un sitio web es permitir la compresión con Gzip. Esto reducirá el tamaño de la respuesta HTTP, reduciendo así los tiempos de respuesta.

Necesitarás habilitar el módulo de compresión apropiado en tu servidor web antes de habilitarlo para tu sitio web editando el archivo .htaccess. Los pasos exactos varían y dependen de tu servidor web, pero así es como se hace en Apache.

Las imágenes son una de las partes más gruesas de un sitio web y normalmente el elemento de carga más lento de cualquier página web. Para dominar el comportamiento, en lugar de escalar imágenes grandes a través de HTML, comience por redimensionar todas las imágenes de su sitio web al tamaño exacto en el que las quiere.

De hecho, deberías mantener una lista de los diferentes tamaños de imagen para los distintos elementos de tu sitio web para asegurarte de que nunca subas más píxeles de los que necesitas. Si tienes un sitio web con muchas imágenes, también deberías considerar la posibilidad de comprimirlas. Una de las herramientas más comunes para este propósito es reSmush.

Funciona con todos los sistemas de gestión de contenidos (CMS) populares y también tiene un cliente Linux CLI para comprimir imágenes para su uso en sitios estáticos. También puedes usar Compressor.io para comprimir múltiples imágenes en un instante.

La carga perezosa significa que las imágenes, los vídeos y los iframes sólo se cargan una vez que los usuarios se desplazan por la página y los ven realmente. Esto puede mejorar significativamente los tiempos de carga inicial de sus páginas.

Antes esto era algo que se implementaba con la ayuda de JavaScript pero no la carga perezosa está incorporada en los navegadores web. Los usuarios de WordPress tienen varias opciones y dos de nuestras favoritas son Lazy Load de WP Rocket y a3 Lazy Load, que está diseñado para dispositivos móviles.

En estos tiempos, querrías que la gente compartiera tu contenido en los medios sociales. En sitios web HTML sencillos puedes usar una herramienta generadora de enlaces como el Generador de Enlaces de Compartición gratuito que te ayuda a crear enlaces de compartición social para Facebook, Twitter, LinkedIn y Pinterest sin depender de iframes o JavaScript. Como de costumbre, los usuarios de WordPress no tienen escasez de plugins que puedan usar para este propósito, incluyendo Social Warfare y Grow.

Un CMS como WordPress puede tener un montón de plugins que pueden añadir una funcionalidad realmente útil a su sitio web. Sin embargo, tener demasiados plugins puede ralentizar su sitio web hasta el rastreo, por lo que sólo debe ejecutar los plugins que realmente necesita.

Dicho esto, no todos los plugins están diseñados igual de bien y puedes acelerar tu sitio web sustituyendo un plugin por una alternativa más rápida. La herramienta online GTmetrix analizará tu sitio web de forma gratuita y te mostrará una lista de plugins que tienen tiempos de carga altos. Considera reemplazar esos plugins, especialmente si están siendo llamados varias veces con una alternativa más ligera.

Los usuarios de WordPress también pueden utilizar el plugin Query Monitor para un análisis detallado de los plugins utilizados en su sitio web. Por supuesto, recuerde quitar el plugin Query Monitor cuando haya cumplido su propósito.

Las redirecciones son a menudo necesarias cuando se mueven y borran páginas, y son la mejor manera de eliminar los problemas con los enlaces rotos. Pero aunque las redirecciones 301 son preferibles a los errores 404, no son ideales ya que reducen el tiempo que tarda el navegador en llegar a la versión correcta de una página. Puedes usar el verificador de redirecciones de Screaming Frog para analizar las redirecciones de tu sitio web y tratar de minimizar su uso.

Reducir las peticiones HTTP es una buena manera de optimizar su sitio web. Cada elemento que añades a una página se traduce en una petición HTTP. Cuanto más tenga que hacer el navegador estas peticiones, más tiempo tardará su página en cargarse completamente. Por eso, aunque se tarda un poco en hacerlo, los resultados de la reducción del número de solicitudes son muy impresionantes.

Puede utilizar las Herramientas de Desarrollo en el navegador y cambiar a la pestaña de Red para ver las solicitudes HTTP en detalle. Una vez que tengas una idea de qué archivos están tardando más en cargarse, puedes buscar los que puedes combinar (especialmente los archivos CSS) y los que puedes eliminar por completo.

Colocar correctamente las hojas de estilo y los guiones influirá en la carga de su sitio. Siempre debes colocar tu CSS en la parte superior de la sección. Esto permite que el navegador cargue tu CSS primero, para que los usuarios puedan ver que el contenido de tu sitio se carga.

Javascript, por otro lado, debería estar lo más cerca posible del fondo. Esto se debe a que los navegadores necesitan analizar el Javascript primero antes de que pueda pasar a la siguiente etiqueta. Si se colocan los scripts antes del contenido real, los usuarios se quedarán mirando una página en blanco mientras el navegador cruje el Javascript.

Usando un lenguaje de scripts como PHP puedes hacer cosas que no son posibles con HTML simple. Sin embargo, procesar PHP lleva más tiempo que analizar HTML, así que evita solicitar información a través de PHP, si puede ser obtenida con HTML estático.

Del mismo modo, no siempre es una buena idea utilizar el mecanismo @import CSS para incluir hojas de estilo externas en sus páginas web en lugar de la etiqueta HTML. Mientras que ambos logran el mismo propósito, @import utiliza más recursos que el enlace directo a tus hojas de estilo.

Cuando visitas un sitio web, todos los elementos de la página se almacenan en tu disco duro en un área de almacenamiento temporal llamada caché. Esto es muy útil ya que en visitas posteriores, su navegador mostrará la página sin tener que enviar otra solicitud HTTP al servidor.

Si diriges un sitio de WordPress, puedes usar un plugin como el plugin W3 Total Cache para habilitar fácilmente el cacheo. Por otro lado, si tienes un sitio HTML estático, puedes habilitar el cacheo usando lo que se conoce como un encabezado Expires en tu archivo .htaccess. Una vez habilitado, los encabezados Expires no sólo ahorrarán el tiempo que lleva descargar los archivos ya almacenados en la caché, sino que también ayudarán a reducir el número de solicitudes HTTP.

Lo más probable es que estés usando un CMS como WordPress o Joomla para alojar tu sitio web. A medida que juegas con tu instalación (añadir y quitar plugins, crear y actualizar posts, instalar actualizaciones, etc.), la base de datos que alimenta el CMS se hinchará bastante y será lenta. Para evitar esto, deberías usar el plugin WP-Optimize para limpiar la base de datos regularmente.

El "hotlinking" se produce cuando alguien muestra una imagen de su sitio web usando su enlace web directamente. Cada vez que se carga, la imagen se extrae del servidor del sitio web de origen.

Tienes varias opciones para evitar el hotlinking. Muchos anfitriones conocidos ofrecen un conmutador en la interfaz de administración para evitar el hotlinking. También hay plugins de WordPress como All In One Security & Firewall que ofrecen protección contra los hotlinking. Por último, puede agregar instrucciones en su archivo .htaccess.

El mensaje Keep Alive se intercambia entre el servidor web y una máquina cliente para permitir la misma conexión tcp para la conversación HTTP en lugar de abrir una nueva con cada nueva solicitud. También conocido como una conexión persistente, Keep Alive ayuda a reducir la latencia de las solicitudes posteriores. La mayoría de las empresas de hospedaje, especialmente en el hospedaje compartido, deshabilitan esta característica.

La mejor manera de controlar la configuración es ajustando el servidor web. Sin embargo, puedes anular el valor predeterminado del servidor añadiendo las siguientes líneas en tu archivo .htaccess:

Juego de cabezas Conexión de mantenimiento en vivo

WordPress tiene varios plugins para mejorar el rendimiento que ayudarán a optimizar diferentes aspectos del sitio web. Uno de los más completos es perfmatters que rueda muchas de las técnicas de aceleración de rendimiento comúnmente utilizadas. Lo bueno de este plugin premium es que la mayoría de sus técnicas de optimización están expuestas a través de una sencilla interfaz de usuario, lo que lo hace accesible a todo tipo de usuarios.

Google PageSpeed es un conjunto de módulos de código abierto para los servidores web Apache y Nginx. Ayudan a optimizar tu sitio web implementando algunas de las técnicas de mejora del rendimiento más útiles, como las que hemos compartido en este artículo. Puedes descargar e instalar los módulos en tu servidor web si eres el propietario. Si no, tendrás que buscar un proveedor de alojamiento que lo haga. Por lo general, los anfitriones web sólo ofrecen esto con sus planes de alojamiento dedicado de primer nivel, aunque algunos como GoDaddy lo instalan en sus servidores de alojamiento Linux.

Uno de los principales factores que influyen directamente en la rapidez de la carga de su sitio web es la cantidad de tiempo que toma la búsqueda de DNS. Una búsqueda DNS es el proceso de encontrar la dirección IP asociada a una URL.

Una forma de acelerar su sitio web es reducir el número de nombres de host únicos. Un menor número de consultas DNS reducirá el tiempo de respuesta y hará que los sitios web se carguen más rápido. Además, considere el hecho de que la cantidad de tiempo que toma la consulta de los registros DNS depende de la velocidad del proveedor de DNS.

Si no está satisfecho con el rendimiento de su proveedor de DNS, considere la posibilidad de cambiar a otro. DNSperf rastrea la velocidad de consulta de los distintos proveedores de DNS autorizados.

Si has estado tratando de acelerar tu sitio web, pero no has notado mucha diferencia, el problema podría ser tu alojamiento web. Muchos de los alojamientos web más baratos, especialmente los compartidos, están bastante abarrotados y utilizan servidores que carecen de los recursos para asignar lo suficiente a cada sitio web. En lugar de ello, deberías dedicar algo de tiempo a investigar las diversas opciones que se ofrecen, antes de buscar un anfitrión y el plan de alojamiento de tu sitio web.

Además de cambiar a un mejor anfitrión web, también debería considerar el uso de una Red de Entrega de Contenido (CDN). A diferencia de su servidor que está ubicado en un lugar específico, una CDN utiliza una red de servidores que, en cierto sentido, distribuyen su contenido a servidores de todo el mundo, básicamente acercándolo a sus visitantes independientemente de su ubicación. Los CDNs aceleran un sitio web reduciendo la distancia física entre el contenido y los visitantes. Puede alojar todo tipo de contenidos con las CDNs e incluso utilizar varias para dirigirse a lugares específicos.

Un aspecto importante de la puesta a punto de su sitio web es vigilar su rendimiento. Esto no sólo te ayudará a medir el impacto de un ajuste, sino que dependiendo de la herramienta utilizada, también señalará los aspectos del sitio web que necesitan atención. La Prueba de velocidad del sitio web de Pingdom es una popular herramienta en línea que no sólo probará los tiempos de carga de la página, sino que también señalará los problemas.

Del mismo modo, puede utilizar el programa de Google Test My Site para analizar el rendimiento de su sitio web en los dispositivos móviles. Además de ofrecer métricas útiles, la herramienta también compartirá recomendaciones para ayudarle a acelerar su sitio web para dispositivos móviles.