Cómo mejorar la velocidad en WordPress

velocidad en WordPress


Enhorabuena, ya tienes realizado el primer punto de la mini guía de optimización de tu web. ¿Por qué decimos esto?

Si ya eres usuario de optimizador.io en tu web seguro que estas disfrutando ¡a tope! de la mejora en los tiempos de carga de tu página al tener las imágenes más optimizadas.

Por eso queremos darte las GRACIAS por confiar a optimizador.io la mejora de las imágenes de tu WordPress, y te seguimos animando a usarlo y a que lo difundas entre tus amig@s y compañer@s para que más personas disfruten de velocidad en sus web y que Google los quiera un poco más. 

Revisa los siguientes 10 puntos que puedes considerar para que tu web cargue más rápida y mejores tu puntuación en PageSpeed y otras herramientas de medición.

     

 Optimiza imágenes de la web


La optimización de las imágenes es un punto a considerar siempre en cualquier web que quiera tener imágenes de calidad con perdida tras aplicar un algoritmo de compresión pero que sean correctamente visibles por los usuarios evitando en la medida de lo posible formatos poco acertados para sitios web.

Es por ello que el uso de herramientas como Image Optimizer, para clientes de Webempresa, disponible desde el Área de Cliente, que además optimiza TODAS las imágenes del Hosting, no solo de /uploads en el caso de WordPress, sino del resto de carpetas, y de otros CMS como PrestaShop o Joomla.

Para quienes no son clientes de Webempresa existe el plugin optimizador.io que instalado en WordPress se encarga de optimizar en segundo plano las nuevas imágenes que subas a la Biblioteca de Medios aportándote tranquilidad al no tener que hacer esta tarea repetidas veces y de forma manual.


Optimización al vuelo de imágenes

Haz clic en la imagen para ampliarla  

Optimizar imágenes es una tarea que se encuentra a camino entre el arte y la ciencia, pero con las herramientas adecuadas puedes conseguir arañar unos cuantos puntos a PageSpeed y demás herramientas de medición y mejorar los tiempos de carga de tu web.

 

 Utiliza formatos de imágenes para Internet


¿Sabes que por defecto WordPress comprime las imágenes .jpg/jpeg un 90% con respecto al original subido?

Es por eso que si experimentas artefactos en tus imágenes subidas en formato JPG/JPEG tendrás que plantearte trabajar con PNG para evitarlos.

Los artefactos son distorsiones en imágenes causados por algoritmos de compresión con pérdida de calidad.

¿Cómo saber si tus imágenes contienen artefactos de compresión? ..pues para muestra un botón, mira la siguiente imagen.


Imagen JPG con artefactos

Haz clic en la imagen para ampliarla  

Sin embargo si la misma imagen la generas en formato PNG y la subes a tu web WordPress, a Medios y la insertas en una Entrada o Página, al visualizarla no verás esos molestos y feos artefactos de compresión que dan la sensación de imágenes de pésima calidad.


Imagen PNG sin artefactos

Haz clic en la imagen para ampliarla  

Al final el formato, al igual que el tamaño de las imágenes "es muy importante" pues el resultado visible en la web difiere dependiendo del formato que tenga la imagen utilizada.

Por regla general los artefactos de compresión se dan en imágenes con formato JPEG, por lo que este formato no es recomendable utilizarlo para imágenes en las que necesites mostrar detalles o una calidad alta, como pro ejemplo "vistas de detalles de productos en WooCommerce", por citar un caso.

Los formatos habituales en Internet, para sitios web son:

  • JPG: Uno de los formatos por excelencia en Internet que soporta millones de colores y muy apreciado por los fotógrafos profesionales junto con RAW. Se trata de un formato con pérdida que soporta niveles de compresión altos y en consecuencia puede acabar presentando "artefactos" en la representación de imágenes tratadas por algoritmos de compresión por encima del 75%.
  • PNG: O Portable Network Graphics es una alternativa a los archivos GIF basado en un algoritmo de compresión sin pérdida y cuya mayor cualidad es que soporta la transparencia.
  • GIF: Un formato sin pérdida que solo soporta 8 bits y 256 colores, de ahí su limitación para imágenes de mucha calidad y con transparencia.

Existen otras alternativas y nuevos formatos como:

  • webP: Excelente para suplir a JPG o PNG. Proporciona compresión alta sin pérdida, siendo hasta un 30% menor que una imagen en PNG.
  • SVG: Ideal para ilustraciones e imágenes de concepto simple. Las siglas en inglés significan Scalable Vector Graphics, y se trata de un tipo de archivo vectorial basado en XML. El mayor problema es su reducida compatibilidad en algunos navegadores.
Al final tendrás que inclinarte por JPG o PNG dependiendo del tipo de imágenes a utilizar y el fin de las mismas, si bien que puedes valorar como alternativa el formato webP que es la fusión de estos dos.

Además de los citados hay otros formatos como por ejemplo JPEG XR que soporta transparencia y animación pero su compatibilidad se limita a IE/Edge (navegadores), y otros formatos como TIFF, BMP de los que mejor no vamos a hablar en esta mini guía. ;)

 

 Minifica CSS y JavaScript


Los archivos de hojas de estilos en cascada CSS y los archivos JavaScript son uno de los clásicos en la optimización de la carga de cualquier sitio web.

La mayoría de temas para WordPress utilizan archivos CSS y JS para representar elementos de los layouts y dependiendo de la calidad de la programación del tema, y también de plugins utilizados que muestran información en el frontal de la web, una página puede cargar más o menos archivos de este tipo, lo que también acaba afectando a la velocidad de carga.

La minificación de archivos CSS y JS no es otra cosa que la compresión, unificación y reducción de los espacios, los saltos de líneas, sangrados, las tabulaciones, los comentarios en el código con el fin de eliminar bytes que no son necesarios para la representación de la página.

Con esta minificación se consigue acelerar el tiempo de descarga de estos recursos en el navegador de destino y con ello además de reducir su tamaño la velocidad de carga aumentará.

Los elementos que son minificables habitualmente son los archivos JavaScript, CSS y HTML.

Existen muchas maneras de hacer esto en WordPress, una de ellas es mediante el uso de plugins como:

  • Cache Enabler - WordPress Cache
  • Fast Velocity Minify
  • W3 Total Cache
  • Autoptimize
  • Page Speed Optimization
  • WP Fastest Cache

Por citar algunos de los habitualmente utilizados en sitios web WordPress.

Sea cual sea la solución que adoptes, es importante aplicar compresión a este tipo de archivos para robar unas décimas importantes a los tiempos de carga de la web.

 

 Cachea los contenidos estáticos


Obtener tiempos de carga rápida de WordPress es posible si haces uso de las herramientas adecuadas y si además pones empeño en las tareas relacionadas con los ajustes de tu tema, plugins y el núcleo de WordPress y con ello conseguir buenas puntuaciones por parte de PageSpeed, GTMetrix o Pingdom.

Como siempre, hay formas de hacerlo, y la más recurrida suele ser el uso de plugins para que los contenidos estáticos carguen de forma paralela mientras se descarga la página en el navegador del usuario.

Por ejemplo Wp Super Cache se encarga de generar archivos HTML estáticos de los contenidos de tu web para que sean servidos y evitar que con cada consulta se tengan que procesar los scripts de PHP, lo que aumenta considerablemente los tiempos de carga.

 

Lectura recomendada:
Mejora la carga de WordPress con WP Super Cache

 

 Elimina temas instalados que no utilices


¿Cuantos temas utilizas en tu sitio web? ...1 verdad!! ¿entonces para qué tienes 7 temas instalados?, no tiene sentido alguno y además ocupan espacio en tu Hosting.

Cada vez que hagas un backups de WordPress estarás añadiendo a esa copia de seguridad los temas instalados "que no utilizas" y con ello generando archivos de copias mayores.

Entonces si no los utilizas, si no los necesitas ¿porque tenerlos instalados?, pregúntate a ti mismo cuando fue la última vez que tuviste que activar uno de esos temas y seguro que ya tendrás la respuesta adecuada que acabe justificando el porque tienes que desinstalarlos completamente.

Con que mantengas el último tema oficial estable disponible en tu versión de WordPress, el resto puedes mandarlos a paseo porque estamos plenamente convencidos que nunca llegarás a activarlos.

Ve a Apariencia, Temas, haz clic en "detalles del tema" por ejemplo Twenty Twelve ¡que es de 2012! y abajo a la derecha verás un diminuto botón rojo que dice Borrar ¡usalo! y desprendete de lo que no es necesario.


Eliminar temas sin uso en WordPress

Haz clic en la imagen para ampliarla  

Si no lo necesitas, mejor elimínalo

 

 Desinstala plugins sin uso o conflictivos


A los plugins les pasa lo mismo que a los temas, o peor, ya que generan el síndrome del instalador compulsivo, como las Apps de los móviles, hasta que empiezas a quedarte sin espacio en tu dispositivos y acabas desinstalando una docena de Apps después de haberte llevado por delante la carpeta /DCIM de imágenes de la Galería, pensando que era la causa principal.

Los plugins ocupan espacio, eso es obvio, además si generan datos y escriben en la base de datos, añaden contenido a esta aumentando el tamaño de ciertas tablas.

Si tienes una web donde te dedicas a publicar contenidos en tu Blog, un formulario de contacto, la página donde ofreces servicios y poco más ¿para que quieres un WooCommerce, o un plugin de gestión de base documental si no lo vas a usar por muy chulo que te haya parecido?

Mantenemos la misma premisa...

Si no lo necesitas, mejor elimínalo

En ocasiones hasta es posible que hayas instalado plugins que hacen la misma tarea, o similar, a la de otros que ya tienes instalados, y además de generar duplicidad de procesos sobrecargas WordPress sin necesidad y esto afecta a su desempeño y acaba viéndose afectada también la velocidad de carga.

Seguro que has oído muchas veces eso de que "tienes muchos plugins instalados y eso afecta a la carga de tu web", bueno pues se trata de una verdad a medias, que no siempre es fácil de demostrar y que solo puede argumentarse analizando el funcionamiento de un sitio con más o menos plugins instalados.

Es posible tener un sitio con 60 plugins instalados, bien optimizados y con tiempos de carga de 1.04 segundos..


Test Pingdom gnumax.org

Haz clic en la imagen para ampliarla  

O un sitio con apenas 10 plugins instalados y activos y que arroje tiempos de 2 segundos o más de carga por falta de optimización...


Test Pingdom wpseguro.com

Haz clic en la imagen para ampliarla  

En consecuencia, tener más plugins de los normal instalados no es sinónimo de problemas y a la inversa, menos plugins activos no garantizan que tu web vaya a volar, la resolución de esta ecuación pasa necesariamente por una correcta optimización.

 

 Depura el archivo .htaccess


El archivo .htaccess es necesario para que WordPress funcione con normalidad, y debe tener una configuración básica establecida. Si tienes Enlaces Permanentes configurados como Nombre de entrada que es lo correcto, entonces para que los enlaces internos de la web funcionen al menos en el archivo .htaccess debes tener el siguiente código insertado.

# BEGIN WordPress

    <IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    RewriteRule ^index\.php$ - [L]
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
	RewriteRule . /index.php [L]
    </IfModule>

# END WordPress

No olvides que al instalar wordpress por defecto los "Enlaces Permanentes" suelen venir configurados como Simple, de ahí la importancia de comprobar que están correctamente establecidos.

Si pones orden en el archivo .htaccess estarás evitando que el rendimiento de tu web se vea afectado.

 

Lectura recomendada:
Códigos útiles .htaccess para sitios web

 

 Establece tiempos de expiración


Utilizar la caché del navegador permite que tus visitantes puedan guardar elementos de tu web de forma desasistida (en segundo plano), tales como archivos CSS o imágenes y otros elementos multimedia sin tener que recurrir al servidor nuevamente cada vez que visiten tu página.

Naturalmente el servidor se encargará de actualizar aquellos elementos que hayan cambiado para que siempre veas la última versión de la página servida y no la cacheada, pero sin necesidad de descargar una y otra vez los mismos elementos.

Además de ayudar a reducir el ancho de banda consumido a los visitantes reduce los tiempos de carga de la página visitada y mejora la experiencia de los visitantes.

Puedes establecer los tiempos de vida de la caché en tu navegador añadiendo las siguientes reglas en tu archivo .htaccess

## EXPIRACIÓN DE CACHÉ ##
<IfModule mod_expires.c>
    ExpiresActive On
    ExpiresByType image/jpg "access 1 year"
    ExpiresByType image/jpeg "access 1 year"
    ExpiresByType image/gif "access 1 year"
    ExpiresByType image/png "access 1 year"
    ExpiresByType text/css "access 1 year"
    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 2 days"
</IfModule>

Para cosas más sofisticadas te recomiendo revisar guías avanzadas para añadir tipos MIME diferentes o que uses en tu web.

 

 Optimiza la base de datos


Revisiones, autoguardados, comentarios spam y sin aprobar, opciones transitorias, post de la papelera, trackbacks, pingbacks, son algunas de las cosas que WordPress almacena en tu base de datos, cada vez que editas repetidas veces un Entrata o Página, o cuando recibes comentarios.

Hacer una limpieza manual en la base de datos es tarea titánica si eres un usuario poco o nada experimentado con phpMyAdmin y ejecutando sentencias SQL para limpiar este tipo de registros que engordan la misma.

Opciones como el plugin WP-Optimize van a permitirte optimizar estos elementos de la base de datos sin que tengas que complicarte la vida.

WP-Optimize

Haz clic en la imagen para ir al enlace del plugin  

Características del plugin:
  • Permite la eliminación de revisiones de post.
  • Permite la eliminación de comentarios no aprobados y de spam.
  • Permite la eliminación de los comentarios en la papelera.
  • Adaptado a su uso desde dispositivos móviles.
  • Permite la eliminación de todos los trackbacks y pingbacks.
  • Limpieza automática de los post guardados como borrador.
  • Eliminación de opciones transitorias.
  • Permite limpiar post de la papelera.
  • Permite la limpieza automática de todas las opciones integradas (también utiliza la retención si está activada).
  • Es posible mantener determinado número de semanas los datos a limpiar.
  • Dispone de la opción para añadir o eliminar enlaces en la barra de dashboard.
  • Es posible Activar/Desactivar la programación semanal de optimización.
  • Aplica comandos nativos de MySQL de WordPress de optimización en las tablas de la base de datos sin phpMyAdmin o cualquier consulta SQL manual.
  • Permite visualizar estadísticas de la tablas de base de datos.
  • Muestra el espacio que se puede optimizar y cuánto espacio se ha liberado.
  • Plugin habilitado sólo para administradores.
  • Las opciones potencialmente peligrosas aparecen marcadas en ROJO para su revisión y corrección.

La próxima vez que tengas que optimizar tu base de datos de WordPress, haz una copia de seguridad de tu sitio y luego prueba este plugin que te ayudará a reducir significativamente contenidos innecesarios de la base de datos.

Mantener las tablas de la base de datos en uso de WordPress es una tarea importante pues esta afecta directamente al rendimiento de tu sitio web y en consecuencia a los tiempos de carga.

 

 Utiliza un CDN para paralelizar la carga


Existen muchas ventajas a la hora de implementar un CDN en tu proyecto WordPress, principalmente porque aceleras la carga de los contenidos gracias a la descarga paralela de los mismos de forma simultánea.

Pero hay otras razones para integrarlo en tu ecuación de velocidad:

  • Velocidad.
  • Mejora del posicionamiento.
  • Mejora de la experiencia del usuario.
  • Carga distribuida de contenidos.

Soluciones cada vez existen más, algunas de las más conocidas son:

  • CloudFlare
  • MaxCDN
  • Incapsula
  • Google Cloud CDN
  • Imgur

Pero la lista es cada vez más extensa y puedes debatirte entre CDNs de pago o gratuitos, todo dependerá de tu presupuesto y de la necesidad que tengas de personalizar su uso.

Pero ojo, lo barato a veces sale caro, sino que se lo pregunten a los miles de usuarios que usaban CDNs como Exabytes de forma grauita hasta que decidieron cambiar su modelo de negocio u otros como CoBlitz que cerraron el servicio dejando colgados miles de sitios web.

Si quieres tener un criterio más claro de porqué debes usar o no un CDN en WordPress, consulta el siguiente artículo donde te lo contamos con mucho detalle.

 

Lectura recomendada:
¿Qué es un CDN y cómo utilizarlo en una Web de WordPress?

 

 Conclusiones


La mejor recomendación que podemos darte es que no bajes nunca la guardia, pues optimizar un sitio web es una tarea dinámica, no se trata solo de poner unos códigos aquí y allá y de mejorar las imágenes de tu web.

Existe un trabajo de campo diario, que requiere ¡revisar, revisar y revisar! de forma constante en el tiempo tus plugins, tu tema, las actualizaciones y cómo afectan a la web, y los cambios que tu apliques en las personalizaciones del tema.

Al final si tienes constancia con el mantenimiento de la web, no solo de los contenidos, conseguirás gustar más a tu público, los motores de búsqueda indexarán mejor tus contenidos y los bots lo tendrán mucho más fácil para rastrear aquellos lugares de tu web que quieras indexar.

Si además disfrutas de un buen Hosting que se preocupe por poner a tu disposición hardware moderno, con discos SSD, y aporte tecnologías como Nginx, Varnish, Apache, MemCache, OPCache o plugins de caching como Magic Cache, estarás consiguiendo llevar tu web WordPress a otro nivel de excelencia.

 

 Alojamiento personalizado para WordPress


WordPress Crea, publica y gestiona tu Web de la mano de expertos WordPress.

Súbete a la navegación segura: Traslado Web + Certificado SSL + Configuración HTTPS ¡Gratis!


  Seguridad WordPress

Reglas especiales Anti-Hackeo.
Enjaulado de cuentas para aislar tu Hosting.
Copias de seguridad cada 4 horas.

  Velocidad de Carga

Servicio Gratuito de optimización de imágenes, Caché a nivel Servidor, PHP 7 y HTTP/2.
Pon tu Web en nuestras manos y todo irá bien.

  Expertos WordPress

24 horas disponibles cuidando con cariño de tu WordPress.
99,9% de Tiempo de Actividad Garantizado.


PLAN M

Para lanzar tu proyecto
79 €/1 año
CONTRATAR »
  • Para 1 Dominio
  • 99,9% Uptime Garantizado
    Tu Web siempre Online
  • 5 GB.
    Discos SSD Máxima Velocidad
  • Let's Encrypt
    Certificado SSL Gratis
  • 200 GB. Transferencia Mensual
  • Recomendado para 30.000 visitas mes
  • Optimizador de Imágenes
    Informe de mejora en
    Google PageSpeed
  • Soporte Hosting
    24 horas 365 días
    Chat Online + Tickets
  • Registro Dominio Gratis
    1 Año con Whois privado
  • Direcciones Email
    Ilimitadas
  • Hosting para WordPress españa
    WordPress Español Autoinstalado
    Instala WordPress en 2-Clics
  • Protección Anti-Hackeos
    Personalizada WordPress
  • Copias de Seguridad automáticas
    Diarias y auto-recuperables
  • GARANTÍA 30 DÍAS
    Devolución 100% importe
CONTRATAR »

PLAN L

Para alojar varias Webs
149 €/1 año
CONTRATAR »
  • Instala múltiples dominios
  • 99,9% Uptime Garantizado
    Tu Web siempre Online
  • 10 GB.
    Discos SSD Máxima Velocidad
  • Let's Encrypt
    Certificado SSL Gratis
  • 400 GB. Transferencia Mensual
  • Recomendado para 50.000 visitas mes
  • Optimizador de Imágenes
    Informe de mejora en
    Google PageSpeed
  • Soporte Hosting
    24 horas 365 días
    Chat Online + Tickets
  • Registro Dominio Gratis
    1 Año con Whois privado
  • Direcciones Email
    Ilimitadas
  • Hosting para WordPress españa
    WordPress Español Autoinstalado
    Instala WordPress en 2-Clics
  • Protección Anti-Hackeos
    Personalizada WordPress
  • Copias de Seguridad automáticas
    Diarias y auto-recuperables
  • GARANTÍA 30 DÍAS
    Devolución 100% importe
CONTRATAR »

PLAN XL

Diseñado para desarrolladores
249 €/1 año
CONTRATAR »
  • Instala múltiples dominios
  • 99,9% Uptime Garantizado
    Tu Web siempre Online
  • 20 GB
    Discos SSD Máxima Velocidad
  • Let's Encrypt
    Certificado SSL Gratis
  • 800 GB. Transferencia Mensual
  • Recomendado para 100.000 visitas mes
  • Optimizador de Imágenes
    Informe de mejora en
    Google PageSpeed
  • Soporte Hosting + WordPress
    24 horas 365 días
    Chat Online + Tickets
  • Registro Dominio Gratis
    1 Año con Whois privado
  • Direcciones Email
    Ilimitadas
  • Hosting para WordPress españa
    WordPress Español Autoinstalado
    Instala WordPress en 2-Clics
  • Protección Anti-Hackeos
    Personalizada WordPress
  • Copias de Seguridad automáticas
    Diarias y auto-recuperables
  • GARANTÍA 30 DÍAS
    Devolución 100% importe
CONTRATAR »

Hay muchas más cosas que puedes hacer para mejorar la carga de tu web, optimizar los contenidos y conseguir que tus usuarios/visitantes o lectores te adoren, pero eso mejor lo abordamos en otras guías. ;)

 

Con aplicar todos o algunos de los puntos indicados en esta guía conseguirás en el 90% de los casos aumentar el rendimiento de WordPress y reducir los tiempos de carga.