Mejorar la velocidad de carga web con un hosting r√°pido

La velocidad de carga web es hoy en día uno de los factores más importantes en el SEO. Es por ello que estamos obligados a que nuestro blog cargue en pocos segundos y para ello tenemos que tener en cuenta una serie de consejos, entre los cuales, el más importante es contar con un hosting rápido.

Comprimir las im√°genes, habilitar la compresi√≥n gzip, un plugin de cach√©, actualizar a la √ļltima versi√≥n de PHP… Sigue leyendo para saber todo lo que necesitas para mejorar la velocidad de carga de tu sitio web y enamorar a Google.

Hosting r√°pido

Un hosting r√°pido mejoral la velocidad de la web.

¬ŅC√≥mo hacer un test para medir la velocidad web?

Lo primero de todo es saber en qué condiciones se encuentra nuestro sitio web o blog. Es decir, necesitamos conocer qué factores debemos mejorar y cuáles son aquellos que ya tenemos optimizados. Pare ello utilizaremos las herramientas online más conocidas y fiables.

Para obtener datos más precisos, haremos un test de velocidad en al menos estas tres herramientas: Google Page Speed, Pingdom Website Speed Test y Web Page Test.

Una vez conozcamos cu√°les son nuestras debilidades, vamos a ver c√≥mo podemos mejorar esos tiempos de carga que nos traen de cabeza. Al menos a m√≠ es una de las cosas que m√°s dolores de cabeza me han dado y m√°s desde que Google lo tiene tanto en cuenta a la hora de posicionar una p√°gina en los primeros resultados de las b√ļsquedas.

Google Page Speed Test

Mención especial merece Google Page Speed Test. Se trata de la herramienta que pone Google a disposición de sus usuarios para que comprueben qué aspectos o factores deben mejorar en su website para optimizar la velocidad. Aunque hay que decir que una buena puntuación en Google Page Speed no siempre está relacionada con una buena carga de la página web.

No hay que confundir la puntuación de Google Insights y la velocidad de carga. Al medir la velocidad en esta herramienta, Google nos mostrará varios aspectos que debemos mejorar.

Asimismo, separa estas recomendaciones en dos apartados: dispositivos móviles y ordenadores. Cada vez Google le da más importancia a los dispositivos móviles. Buena muestra de ello son las páginas AMP. Se trata de un proyecto de Google llamado Acelerated Mobile Pages para que las páginas carguen muy rápido en dispositivos móviles.

Si hacemos la prueba del test de velocidad de Google veremos que siempre, o casi siempre, la velocidad en ordenadores es mejor que en dispositivos móviles. Es por eso que surgen las AMP y se cree, aunque no está confirmado, que Google posiciona mejor este tipo de páginas en dispositivos móviles.

Tanto en Joomla como en WordPress se puede utilizar las AMP instalando un módulo o plugin. Aunque es mucho más fácil la integración en WordPress, como en la mayoría de casos.

Consejos para mejorar la velocidad de carga para cualquier web

  • Escoger¬†una plantilla ligera y sin errores. Una plantilla que cargue r√°pidamente nos va a solucionar muchos de los problemas con los que nos podemos encontrar. Utiliza solo lo necesario seg√ļn tus intereses. De nada sirve elegir una plantilla con muchas funcionalidades si despu√©s no vas a utilizarlas.
  • Comprimir las im√°genes:¬†Junto con contratar un hosting r√°pido, comprimir las im√°genes es lo m√°s importante.¬†De verdad, es un error que mucha gente comete, colgar las fotos con tama√Īos mucho m√°s grandes de los necesarios y, adem√°s, sin comprimir. Si guardamos las im√°genes con las medidas adecuadas y las comprimimos vamos a mejorar la carga much√≠simo. Pod√©is hacer la prueba. Para comprimir las im√°genes recomiendo usar la siguiente herramienta online:

¬Ľ¬†https://compressor.io/compress

  • Contar con la √ļltima tecnolog√≠a PHP:¬†Aplicando un simple c√≥digo al principio de tu archivo .htaccess haremos que se aplique PHP 7, lo que har√° que tu web vuele. Este archivo se encuentra en la ra√≠z de vuestro sitio web. Si no sab√©is c√≥mo hacerlo, mejor preguntar al personal de vuestro hosting. Antes de hacer cualquier modificaci√≥n, siempre es aconsejable hacer una copia de seguridad. Este es el c√≥digo que deb√©is colocar al principio del archivo .htaccess:

¬Ľ AddHandler application/x-httpd-php7 .php

  • Javascript y CSS:¬†Uno de los aspectos m√°s complicados de solucionar es eliminar el Javascript que bloquea la visualizaci√≥n y el CSS del contenido que tenemos en la parte superior de nuestra p√°gina. Este es el primer tip que encontramos cuando analizamos nuestro blog o web en¬†Google Page Speed¬†(para medir la velocidad de carga web esta es la aplicaci√≥n que nos brinda Google).¬†Lo que s√≠ podemos hacer aqu√≠ es¬†conseguir que el contenido est√°tico se cargue al final, en lugar de en la parte superior de la p√°gina. Esto har√° que el primer momento de carga sea m√°s r√°pido. Para solucionar esto podemos valernos de un plugin.

¬Ľ¬†Este plugin se llama¬†Javascript to Footer, en el caso de WordPress. Mientras que en Joomla utilizaremos su equivalente.¬†Javascript to Footer¬†permite que el contenido est√°tico de tu p√°gina se cargue al final, en lugar de en el head de la misma. Esto hace, como hemos dicho anteriormente, que el primer momento de carga sea m√°s veloz, aunque el tiempo total de carga ser√° exactamente igual.¬†Adem√°s, influye cu√°nto contenido Javascript carga tu sitio para que resulte realmente efectivo. Normalmente, en peque√Īos proyectos el impacto en el rendimiento general de esta acci√≥n es m√≠nimo. En proyectos m√°s ambiciosos, es totalmente recomendable activar este plugin.

 Lo que vamos a conseguir con estos y los siguientes consejos es una puntuación de A en Web Page Test:
Test velocidad web

Imagen del resultado de la carga de la web tras los ajustes.

¬ŅC√≥mo mejorar la velocidad de carga web en Joomla?

  • Vamos a separar los consejos para webs Joomla y WordPress. Si bien coinciden en algunos aspectos, en otros hay ciertas diferencias. Para¬†especificar la cache del navegador en Joomla¬†puedes incluir estas l√≠neas al comienzo del archivo .htaccess:

## ESPECIFICAR LA CACHE DEL NAVEGADOR ##
ExpiresActive On
ExpiresByType image/jpg ¬ęaccess 1 month¬Ľ
ExpiresByType image/jpeg ¬ęaccess 1 month¬Ľ
ExpiresByType image/gif ¬ęaccess 1 month¬Ľ
ExpiresByType image/png ¬ęaccess 1 month¬Ľ
ExpiresByType text/css ¬ęaccess 1 month¬Ľ
ExpiresByType text/html ¬ęaccess 1 month¬Ľ
ExpiresByType application/pdf ¬ęaccess 1 month¬Ľ
ExpiresByType text/x-javascript ¬ęaccess 1 month¬Ľ
ExpiresByType application/x-shockwave-flash ¬ęaccess 1 month¬Ľ
ExpiresByType image/x-icon ¬ęaccess 1 year¬Ľ
ExpiresDefault ¬ęaccess plus 1 month¬Ľ
## ESPECIFICAR LA CACH√Č DEL NAVEGADOR ##

  • Como ya se hemos comentado se pueden optimizar las im√°genes comprimi√©ndolas. Hay muchos sitios web d√≥nde puedes hacerlo online. No obstante, en algunos hostings, como el de Webempresa, de forma gratuita proporcionan un optimizador de im√°genes llamado¬†Imgoptimizer. Este servicio est√° automatizado y tan solo tienes que pedirlo desde tu √°rea de cliente.¬†Es pocos minutos los resultados te llegan al correo electr√≥nico. Aplicando esta herramienta mejorar√°s varios puntos en Google Page Speed y/o Pingdom Tools. De media los resultados mejoran en un 19%. La optimizaci√≥n de las im√°genes es global en toda la web. Sin embargo, tienes que tener en cuenta que la calidad de las im√°genes ser√° mucho peor. Yo mismo he utilizado esta herramienta, por lo que puedes observar que la p√©rdida de calidad en las fotograf√≠as que utilizo es evidente. Tuya es la¬†elecci√≥n entre calidad de imagen y mejora de la velocidad de carga web.
  • Para solucionar el contenido est√°tico se puede¬†habilitar http2¬†mediante el protocolo ALPN que utilizan las versiones de los navegadores m√°s recientes como Google Chrome. Esto tambi√©n lo pod√©is preguntar en el hosting que est√©is utilizando, como hemos indicado al principio del art√≠culo. Los chicos de Webempresa lo activan sin problemas. Para esto debes tener¬†instalado un certificado SLL, como el Let’s Encrypt que¬†ofrece este alojamiento totalmente gratis. En WordPress veremos m√°s adelante que se puede solucionar desde un plugin y creando un subdominio.
  • Por lo que respecta a la carga del¬†JavaScript y el CSS¬†que bloquea la visualizaci√≥n del contenido de la mitad superior de la p√°gina, hay que tener en cuenta que la sugerencia que apunta la herramienta de¬†Google Page Speed¬†es muy estricta. La mayor√≠a de plantillas (templates en Joomla) actualmente no lo contemplan. Google propone tener un archivo css o javascript peque√Īo al inicio y el resto de CSS o javascript cargarlo al final. Hay m√°s informaci√≥n sobe esto en las mismas p√°ginas de Google para desarrolladores:

–¬†https://developers.google.com/speed/docs/insights/OptimizeCSSDelivery
–¬†https://developers.google.com/speed/docs/insights/BlockingJS

No te olvides de hacer esto para mejorar la carga de la web

  • Instala¬†JPH Optimize: Este plugin comprime los archivos CSS y Javascript ubicados en la secci√≥n principal del blog. Esto hace que las peticiones al servidor se reduzcan de una manera considerable.
  • Activa la comprensi√≥n Gzip¬†desde la configuraci√≥n global de tu Joomla. Una vez en Configuraci√≥n global, pulsa sobre Servidor y desde ah√≠ activar√°s la casilla de comprensi√≥n Gzip de las p√°ginas.
  • No sobrecargar Joomla de extensiones. Al igual que ocurre en WordPress con los plugins, en Joomla debes utilizar solamente las extensiones y componentes necesarios. Aquellos que no utilizamos o no sean realmente necesarios para el funcionamiento de nuestro Joomla ser√° mejor que los eliminemos.
  • Habilita las urls amigables¬†en nuestro Joomla. Para habilitarlo tendremos que seguir la siguiente ruta: Sistema-Configuraci√≥n global-Sitio. Ya en el apartado Configuraci√≥n SEO seleccionaremos las Urls amigables y¬†Usar la reescritura de Urls. Es entonces cuando iremos al achivo .htaccess y pegaremos las siguientes l√≠neas al principio:

<FilesMatch ¬ę\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$¬Ľ>

Header set Expires ¬ęWed, 15 Apr 2020 20:00:00 GMT¬Ľ

Header set Cache-Control ¬ępublic¬Ľ

</FilesMatch>

<ifModule mod_deflate.c>

<filesMatch ¬ę\.(js|css|html|php)$¬Ľ>

SetOutputFilter DEFLATE

</filesMatch>

</ifModule>

  • La¬†cach√© de Joomla¬†se activa desde Configuraci√≥n global-Sistema. Desde all√≠ seleccionamos la Cach√© Conservacional. Para mejorar a√ļn m√°s la cach√© de Joomla te recomendamos usar el¬†plugin JotCache. En el siguiente art√≠culo est√° muy bien explicado c√≥mo instalar y configurar este plugin.

–¬†https://www.webempresa.com/blog/mejorar-la-velocidad-de-carga-de-tu-joomla3.html

Ajustes en una web de prieba

‚ô• Tras aplicar estos consejos en Publicidadparaweb.com vamos a ver los resultados en Google Page Speed.

Publicidadparaweb-Google-Page-Speed

Resultado velocidad de cargas tras los ajustes.

89 puntos de 100. Esto está muy bien, teniendo en cuenta la cantidad de módulos, extensiones e imágenes que estoy utilizando. Os recuerdo que son peticiones que hacemos al servidor, por lo que aumenta el tiempo de carga de la web.

Voy a mostrar ahora el test de velocidad web en Pingdom Tools Speed, antes y después de aplicar estos consejos.

ANTES:

publicidadparaweb_Pingdom_antes

Resultados de la carga web antes los ajustes en Pingdom.

AHORA:

publicidadparaweb_Pingdom

Resultados de la carga web en Pingdom tras los ajustes.

Como podéis ver la diferencia es brutal. Hemos pasado de 73 a 93 puntos. Nada más y nada menos que 20 puntos de diferencia. Las peticiones al servidor se han reducido de 96 a 78. Y lo más importante, la velocidad web ha pasado de ser de 1,72 a 1,29. Unos datos magníficos, que sin duda han ayudado en el posicionamiento de este blog. Aunque os recuerdo que este es solo un aspecto más de los más de 200 que afectan al SEO.

En este artículo podéis ver los principales aspectos a tener en cuenta en el posicionamiento SEO de vuestro blog o sitio web:

¬Ľ¬†https://joancasan.com/posicionamiento-seo-trucos-consejos-alternativas

Nota: Utilizar anuncios de publicidad siempre va a ir en contra de la velocidad de carga del sitio web.

¬ŅC√≥mo mejorar la velocidad web en WordPress con un hosting r√°pido?

  • En cuanto a¬†WordPress, recomiendo¬†revisar qu√© plugins no son necesarios¬†y te est√°n consumiendo m√°s tiempo de ejecuci√≥n.¬†Si deseas detectar qu√© plugins est√°n consumiendo en exceso puedes utilizar el siguiente plugin:¬†P3 (Plugin Performance Profiler). Este plugin mide el impacto que tiene cada plugin que utiliza tu blog en el tiempo de carga. Podr√°s detectar aquellos que te est√°n ralentizando la carga y decidir si realmente merece la pena tenerlos. De no ser as√≠, es mejor desinstalarlos.
  • Con respecto a¬†habilitar la comprensi√≥n gzip,¬†desde los servidores de Webempresa¬†(el alojamiento que yo uso) se consigue accediendo a la siguiente ruta: cPanel-Software-Optimizar mi sitio Web.
  • Crear un subdominio est√°tico. Por ejemplo se crear√≠a un subdominio llamado estaticos.levantemedia.com. Si lo creamos y estamos usando https no os olvid√©is instalar un certificado para el subdominio que acabamos de crear. Adem√°s, el subdominio creado debe apuntar a la misma carpeta del dominio ra√≠z. Plugins como WP Super Cache llevan integrado la opci√≥n de utilizar un subdominio est√°tico desde la pesta√Īa¬†CDN. Si no ten√©is suficiente con esto pod√©is¬†a√Īadir un CDN a vuestro hosting¬†como CloudFlare. No obstante, http2 soluciona este problema.
  • Optimiza la base de datos. Es totalmente recomendable de vez en cuando borrar la datos innecesarios que se han ido creando por el uso de nuestro WordPress. Por ejemplo, cada vez que actualizamos una entrada o se crea un comentario. Para mantener limpia la base de datos puedes utilizar el¬†plugin WP-Optimize.
  • Valora el¬†plugin Autoptimize. Este plugin lo que hace es comprimir los ficheros Javascript, CSS y html. Puedes probar y ver si realmente mejora la carga de tu sitio web. Yo uso este plugin junto con Super Cache y los resultados son buenos.

Todo esto es posible con un buen hosting como el de Webempresa.

Conseguir una puntuación de 87 en dispositivos móviles en un sitio web con bastantes plugins y publicidad no es nada fácil. Pero aquí tenéis una muestra de que con estas optimizaciones en WordPress, es posible.

Velocidad web cineseries

Resultados de la carga web en Page Speed de Google.

La guinda del pastel para que tu web vuele: Magic Cache

Y la guinda del pastel del hosting rápido Webempresa para que tu web sea ultrarápida llega con Magic Cache. Se trata de un sistema de caché, a nivel de servidor, que se basa en el acelerador Varnish. Estamos hablando de un sistema generado por el propio equipo de Administradores de Sistemas de Webempresa, en el cual se agrupan varias herramientas como OPCache, Varnish, Nginx, MemCache o Apache para conseguir tiempos de carga de menos de 1 segundo para páginas web estándar.

Magic Cache cachea todo el contenido de la página en la memoria RAM del servidor. Acceder a la memoria RAM es mucho más veloz que acceder al disco. Al no tener que entrar a los ficheros y bases de datos, se logra que los sitios web carguen mucho más veloces, con tiempos de respuesta de entre 60 y 140 milisegundos para páginas web de menos de 5 megas. En el siguiente vídeo queda muy bien explicado.

Los servicios y el soporte que dan los servidores de Webempresa son de lo mejor que se puede encontrar en Internet. Algunos buscan que un servidor de hosting sea VPS, SSD… Pero tambi√©n es muy importante que el alojamiento est√© optimizado para que nuestra web carga lo m√°s r√°pido posible.

Los plugins de carga web imprescindibles

Existen otros plugins en WordPress como¬†W3 Total Cache¬†o¬†WP Super Cache¬†que consiguen mejorar la carga pero, en cambio, tienen que leer datos del disco. W3 Total Cache puede reducir el tiempo de carga a la mitad, pero con Magic Cache se reduce hasta diez veces el Time to First Byte.¬†Al estar todo el contenido cacheado en la memoria RAM, las p√°ginas web pueden tener un n√ļmero de visitas mucho m√°s alto.
A continuación os muestro un test de velocidad de Levantemedia.com, un sitio web WordPress que no utiliza muchos recursos, con pocos plugins (solo los necesarios para su optimización) y sin anuncios de publicidad. 96 puntos de 100.
levantemedia_Google_Page_Speed

Resultados en la antigua web de Levantemedia, previa a Joancasan.com.

NOTA MUY IMPORTANTE: Cuando se actualicen los sistemas de gestión de contenidos a una nueva versión, tienes que verificar si todo esto sigue funcionando correctamente, sobre todo los códigos.

Como habéis podido comprobar, disponer de un hosting rápido es muy importante para mejorar la velocidad de carga web. Si seguís al pie de la letra estos consejos seguro que a Google le va a gustar mucho más vuestro blog y, por ende, os premiará con un aumento de posiciones en las SERP.

Share

Puede que también te guste...