¬ŅTu instalaci√≥n WordPress va muy lenta? ¬ŅEst√°s buscando la manera de mejorar el rendimiento de tu pagina web, blog¬†o tienda online? Internet est√° lleno de trucos y consejos sobre c√≥mo optimizar el tiempo de carga de las¬†instalaciones WordPress. Desafortunadamente, aunque algunos son buenos, muchas veces, por desconocimiento o falta de tiempo, caen en saco roto. Por ello, en esta gu√≠a quiero explicarte, paso a paso, como mejorar el rendimiento de tu WordPress, para que tu mismo puedas hacerlo (sin temer a fallar) y que tu sitio web sea mucho m√°s r√°pido y tenga una mejor experiencia de usuario (uno de los factores de posicionamiento que m√°s importancia da Google a una web).

como mejorar rendimiento wordpress

Durante varios a√Īos, he tenido la oportunidad de alojar cientos de proyectos de WordPress, d√°ndome la oportunidad de recolectar mucha informaci√≥n y poder aconsejarte en consecuencia sobre c√≥mo mejorar el rendimiento de este CMS. Entre otras muchas cosas, la solicitud de optimizar el rendimiento de WordPress se presenta una y otra vez, concentr√°ndose una y otra vez sobre la velocidad de carga del sitio web.¬†Hay una cosa que se repite a menudo y que no deja de sorprenderme, y es que algunos de esos clientes son influenciados (mucho) por herramientas como Google PageSpeed Insights.

Como herramienta sugerida (por el propio motor de b√ļsqueda y por muchos profesionales del posicionamiento web) para hacer el¬†test de velocidad¬†del sitio web, es una herramienta que, aunque te ayuda a reconocer cuales son los puntos flacos de tu sitio web, no es la √ļnica y te recomiendo usarla de gu√≠a. Te digo esto porque hay herramientas mucho mejores (y m√°s recomendables) como Pingdom o¬†GTmetrix¬†(y muchas m√°s) que analizan de arriba a abajo tu sitio web y te dan detalles m√°s fiables de los tiempos de carga de los distintos archivos de tu p√°gina, de manera que sepas, de primera mano, qu√© pasa en tu sitio web y qu√© problemas de rendimiento tienes que solucionar.

¬ŅTe imaginas? Est√°s tan tranquilo y, de repente, recibes un mensaje que dice ¬ęLos recursos de JavaScript, CSS y sus Rendering han sido bloqueados y el archivo ‚ÄúAbove the Fold‚ÄĚ (Scroll no visible) debe ser reparado¬ę. ¬°Buff! ¬°Vaya tela! Seguro que me han insultado y ni me he enterado. Mira, ni yo me entero a veces, y eso que veo este tipo de mensajes a diario. Realmente pocos usuarios est√°n preparados para enfrentarse a algo as√≠ (solos me refiero) y saber cual es la manera de proceder es clave, ya que, aunque¬†la optimizaci√≥n del tiempo de carga es el objetivo final, mejorar el rendimiento de WordPress trae otras ventajas, como mejorar tu posicionamiento en Google en los resultados de b√ļsqueda.

Por esta raz√≥n, quiero explicarte las modificaciones m√°s importantes que debes realizar para conseguir esa optimizaci√≥n del funcionamiento¬†de tu WordPress. Adem√°s, te las voy a explicar por orden de relevancia, por lo que las primeras siempre ser√°n m√°s importantes que las √ļltimas. Dentro de cada punto te voy a describir cuales son los pasos para realizar la optimizaci√≥n t√ļ mismo. Estos consejos y trucos est√°n basados, por completo, en el conocimiento y pr√°ctica obtenida trabajando mis proyectos personas y de mis clientes. Por ello, te pido paciencia y que revises muy bien cada punto para aplicarlo a tu proyecto WordPress.

La velocidad y el rendimiento web no es lo √ļnico ni lo m√°s importante

Aunque el rendimiento de la instalaci√≥n WordPress es importante, no hay que olvidar que hay m√°s cosas, como el dise√Īo de tu sitio web, la estructura y los contenidos (sean del tipo que sean). Todo unido crea la experiencia de usuario (la usabilidad web) que deber√≠as revisar de vez en cuando. Aunque una web que carga r√°pido ¬ęmola¬Ľ, si esa web no es atractiva o tiene una estructura que l√≠a al lector pierde la ¬ęmagia¬Ľ.

Hay vida más allá de la velocidad de carga. No te obsesiones con el rendimiento de tu instalación WordPress.

Por el contrario, un sitio web que carga menos rápido (sin pasarse) pero que tiene las cosas donde tiene que estar, creará una experiencia mucho más beneficiosa para el usuario y mejorará la conversión de cualquier tipo de producto o servicio. Por ello, no quiero que te obsesiones con el rendimiento de tu instalación, tan solo que lo tomes en serio y que tengas una buena nota en cualquiera de las herramientas que te vamos a recomendar, pero no persigas el 100% porque es innecesario y no tiene sentido.

Checklist para Optimizar el Rendimiento de WordPress

Ya paso a explicarte los pasos para mejorar el rendimiento de WordPress por orden de relevancia, por lo que las primeras siempre ser√°n m√°s importantes que las √ļltimas. Dentro de cada punto te voy a describir cuales son los pasos para realizar la optimizaci√≥n t√ļ mismo. Mi top 10 est√° realizado generalmente por la pr√°ctica obtenida de mi experiencia del a√Īo anterior.

#1 Elige y contrata un hosting capaz de mover tu instalación

Un excelente hosting¬†es un¬†elemento b√°sico¬†que¬†interviene en el rendimiento de un sitio web.¬†Por un lado tienes a los que crean su primer sitio web. Empiezan con un hosting m√°s ‚Äúbarato‚ÄĚ, tipo¬†Hostgator, porque en ese momento no disponen de demasiado dinero y prefieren ‚Äúahorrar‚ÄĚ en ese aspecto (hablo de mi experiencia). Realmente no le dan la importancia que tiene al hosting o alojamiento (normalmente por¬†desconocimiento) y, a veces, por¬†avaricia¬†(tiene que sobrar para comprar tabaco). Ya te adelanto que no pagar un buen servicio de alojamiento es un¬†error¬†garrafal que¬†afectar√° a todo el proyecto web de WordPress.

No puedes pretender optimizar tu instalación WordPress y mejorar su tiempo de carga sin un hosting que lo soporte. Puedes haber hecho la mejor configuración del mundo, que cuando llega el momento de la verdad, vas a seguir igual. Por esto debes prestar atención a ciertos requisitos del hardware que debe tener el alojamiento de WordPress que elijas. Como regla general, tu hosting debe disponer en su sistema de:

  • Discos duros¬†SSD, ya que disponen de una velocidad de operaciones de lectura/escritura muy superior y un consumo energ√©tico menor.
  • PHP Memory-Limit, para poder aumentar la memoria,¬†siendo la recomendaci√≥n m√≠nima de 64MB (aunque tes mejor la de¬†128MB).
  • PHP 7, ya que la mayor√≠a de estudios publicados indican que mejora el rendimiento respecto a PHP 5.6 en un 100%, es decir, que WordPress se ejecuta en casi la mitad del tiempo.
  • HTTP/2¬†, ya que es m√°s seguro, transmite datos binarios en lugar de texto y crea s√≥lo 1 conexi√≥n, por lo que el rendimiento de WordPress aumenta enormemente.
  • HTTPS o¬†Certificado SSL¬†gratuito, ya que, aunque no est√© probado que mejore el rendimiento, si que puede mejorar tu posicionamiento web.

Adem√°s, otro de los puntos a tener en cuenta, es tener clara la diferencia entre un hosting compartido, un VPS, un servidor dedicado y un cloud hosting. En un hosting compartido compartes tu espacio web y el rendimiento del mismo con otras p√°ginas web (puede ser entre unas pocas decenas hasta cientos). Su √ļnica ventaja es el precio (entre 4‚ā¨ y 8‚ā¨), pero lo recomiendo para proyectos (peque√Īos) que empiezan desde cero (al principio no necesitas m√°s y siempre puedes mejorarlo), ya que no es necesario recurrir a grandes inversiones en tecnolog√≠a punta mientras no suba el tr√°fico web.

Nota: Debido a su naturaleza, el alojamiento compartido es la opción más barata y asequible para hospedar una página web. Sin embargo, también es una forma de hosting muy poco potente en comparación con el resto, ya que todas las páginas que se alojan en el servidor hacen uso de la misma memoria, disco duro y procesador.

En un hosting compartido¬†compartes tu espacio web y el rendimiento del mismo con otras p√°ginas web¬†(puede ser entre unas pocas decenas hasta cientos). Su √ļnica ventaja es el precio (entre 4‚ā¨ y 8‚ā¨), pero lo recomiendo para proyectos (peque√Īos) que empiezan desde cero (al principio no necesitas m√°s y siempre puedes mejorarlo), ya que no es necesario recurrir a grandes inversiones en tecnolog√≠a punta mientras no suba el tr√°fico web.

El siguiente paso en la categor√≠a de alojamientos es la contrataci√≥n de un¬†servidor VPS, tambi√©n conocido como servidor virtual. Si bien el alojamiento compartido consiste en alquilar una peque√Īa habitaci√≥n, un servidor VPS es el equivalente de alquilar un local dentro del edificio. As√≠, tienes¬†mucha m√°s capacidad y espacio disponible¬†para hospedar una o m√°s p√°ginas web al mismo tiempo,¬†por lo que¬†el rendimiento aumenta.

Nota:
Los servidores VPS son más caros, pero te dan la seguridad de que tendrás siempre tanto espacio como necesites. Además, se pueden ampliar fácilmente ya que son virtuales, es decir, la cantidad de memoria reservada para tí se puede controlar fácilmente. Además, un servidor VPS está pensado para hospedar varias páginas en lugar de una, de forma que puedes agrupar todos tus proyectos en un solo lugar.

La categoría más alta de hosting, y también la más cara, es la contratación de un servidor dedicado. Si bien con un alojamiento compartido tenemos una habitación y con un servidor VPS tenemos un local, con un servidor dedicado alquilamos todo el edificio al completo. Un servidor dedicado quiere decir que tendrás a tu disposición una máquina entera para tu uso exclusivo, y podrás hacer con ella todo lo que quieras.

Esta forma de hosting es la m√°s potente con diferencia, ya que evita que tengas que compartir los recursos con otros clientes de tu proveedor de hosting.¬†Sin embargo, se trata de una opci√≥n muy costosa (a partir de los 60‚ā¨) y, adem√°s, no es tan flexible como un servidor VPS. Esto es porque est√°s contratando un ordenador f√≠sico, y si necesitas ampliar o reducir tus prestaciones un t√©cnico tendr√° que abrirlo y cambiar las piezas de hardware. Lo recomiendo para proyectos grandes y con mucho tr√°fico, en donde se quiera controlar todo el espectro.

Nota: Aunque un servidor dedicado no es sinónimo de más rendimiento la experiencia demuestra, sin embargo, que los planes de hosting barato que cuestan sólo unos pocos euros al mes no pueden competir con el rendimiento de los servidores virtuales desde la vista técnica.

También existe una forma alternativa de alojamiento que está apareciendo de forma gradual, llamada cloud hosting. A diferencia de las anteriores formas de hosting, en las que se contrata un espacio dentro de un servidor (o en el caso de los servidores dedicados, la máquina entera), el cloud hosting consiste en distribuir tu página web a través de una red de servidores. Tu página estará hospedada en una o muchas máquinas diferentes, y utilizará los recursos de toda una red de servidores para funcionar. Como resultado, se te cobrará en función del uso real que hagas de dicha red, en lugar de pagar una cuota fija mensual.

¬ŅC√≥mo saber¬†cu√°l es el mejor hosting para tu WordPress? El valor real del servicio¬†lo empiezas a conocer¬†cuando tienes¬†problemas, como una velocidad de¬†carga de la p√°gina web muy lenta o que directamente no se muestre¬†la p√°gina porque el servidor¬†ha dejado de funcionar. Imagina tu¬†cara cuando, despu√©s de compartir el art√≠culo que acababa de publicar en las redes sociales, tus lectores te avisan de que no funciona el enlace. Esto significa visitas y tiempo¬†perdido. Escribes al soporte t√©cnico y te¬†responden que est√°n intentando solucionar el problema, pero cuando te responden lo mismo varias veces al mes es cuando te das cuenta:¬†lo barato sale caro.

También te puede interesar esta guía
como elegir hosting web

Un hosting o alojamiento web es un servicio proporcionado por un proveedor, que ofrece un lugar físico para el almacenamiento de tu sitio web (para que las puedan ver el resto del mundo).

En el mercado hay miles de opciones, y sueles acabar sumergido en una mara√Īa de datos (sin sentido alguno). Por ello, esta gu√≠a te¬†explica todos los puntos clave a la hora de elegir y contratar¬†el hosting web.

Ir a la guía

#2 Ten preparado y configurado un buen sistema de almacenamiento en caché

¬ŅSabes a lo que me refiero con cache? Con¬†caching o almacenamiento en cach√©¬†quiero decir que tu sitio web, despu√©s de la primera vez que se haya cargado al completo, no va a volver a hacer m√°s solicitudes¬†al servidor web (desde el navegador del usuario). Si se hace, la p√°gina se renderiza paso paso desde la¬†memoria interna del navegador en el que te encuentres.¬†Es obvia la ventaja de este almacenamiento en cach√© porque de esta manera WordPress no tiene que recalcular tu p√°gina cada vez que sea llamada, sino que puede cargar una variaci√≥n completamente calculada desde la cach√© de tu navegador reduciendo las peticiones al servidor y mejorando tu tiempo de carga.

Puesto que WordPress se basa en PHP, un lenguaje de programación que no brilla por su rendimiento (es algo lento aunque ha mejorado mucho con su nueva versión PHP 7), tener una memoria caché se vuelve un asunto elemental, ya que evita que PHP sea leído nuevamente. Básicamente, y para que conozcas todas las opciones en lo que a este tipo de PHP se refiere, hay dos opciones de implementación:

  • A trav√©s de plugins que te permiten realizar caching: La mayor√≠a de los usuarios utilizan plugins para implementar un sistema de cacheo, tales como W3 Total Cache o WP Super Cache. Estos tienen una doble cara, ya que a veces son f√°ciles de instalar y otras muy complicados (por la complejidad de la instalaci√≥n WordPress). En cualquier caso, algo muy cierto es que se necesita bastante trabajo manual. Lo mejor es que revises este¬†tutorial¬†de Marketing and Web donde puedes ver la configuraci√≥n del W3 Total Cache.
  • A trav√©s del panel de control de tu hosting: Algunos hostings ofrecen almacenamiento en cach√© desde el servidor. Contacta con tu proveedor e inf√≥rmate (el hosting configura la memoria cach√© por ti), porque as√≠ te ahorrar√°s instalar y configurar muchos plugins.
Nota: Si ya has implementado un sistema de cacheo, ya sea a través de plugins o desde el propio servidor, has logrado uno de los pasos más importantes para obtener un mejor rendimiento de WordPress.

#3 Limpia al 100% los plugins inactivos o que no uses

Una de las causas m√°s comunes de una velocidad de carga lenta o poca √≥ptima, desde mi experiencia, es tener una¬†instalaci√≥n de WordPress sobrecargada. Esta sobrecarga se debe, en gran medida, a que hay demasiados plugins instalados¬†(los plugins molan mucho, pero a√Īaden peso a la p√°gina y hacen que su rendimiento baje). En resumen, cuantos menos plugins tengas instalados m√°s r√°pida ser√° tu sitio web.

¡Pero tranquilo! Esto no quiere decir que te pongas a borrar a diestro y siniestro (hace poco un lector lo hizo y se cargo su blog). Todos los plugins son piezas de código que ayudan a realizar funciones que, de otra manera, sería difícil y costoso de hacer. Pero a veces complican más que ayudan y se convierten en contraproducentes. Ya sea porque no hacen su trabajo correctamente, porque entran en conflicto con otros plugins, porque sobrecargan el servidor o por lo que sea, es importante mantener a raya este tipo de plugins.

como mejorar rendimiento wordpress p3 plugin performance profiler

P3- Plugin Performance Profiler es el plugin de Worpdress perfecto para detectar plugins que afecten a la velocidad de carga de tu sitio web

Aqu√≠ es cuando¬†entra en juego el plugin¬†P3- Plugin Performance Profiler, que te permite¬†detectar cu√°l de tus plugins est√°n impactando en los¬†tiempos de carga del sitio web. Con el informe que genera, ser√°s capaz de identificar qu√© plugins est√°n ralentizado¬†la velocidad de carga de tu p√°gina web o blog. Si existe alg√ļn¬†plugin que afecte al rendimiento de tu sitio web en exceso, es un buen momento de buscar y¬†encontrar plugins alternativos.

como mejorar rendimiento wordpress p3 plugin performance profiler

En ‚ÄúHerramientas > P3 Plugin Profiler‚ÄĚ haz click en ‚ÄúStart Scan‚ÄĚ y ver√°s un informe con los tiempos de carga de los plugins de tu instalaci√≥n WordPress

Otra opci√≥n es desactivar cualquier cosa que tengas instalada, pero que no¬†utilices. Por ejemplo, yo uso a menudo plugins como¬†Thumbnail Regenerator, Theme Check¬†o P3. Si bien estos ofrecen un¬†valor a√Īadido cuando los usas, s√≥lo los necesito en momentos puntuales. Cuando no los utilizo, los¬†desactivo (de hecho, en muchas ocasiones los llega a eliminar por completo), para asegurarme de que no tienen impacto en el rendimiento del sitio web.

El background de tu página (lo que sucede detrás de las cámaras) funciona de la siguiente manera: cada plugin y plantilla genera código PHP extra a tu sitio web. Esto también se aplica a los plugins desactivados o no borrados, lo cual hará que tu página sea más voluminosa, lenta e insegura. Por ello, cuantos menos tengas mejor. Te dejo una breve explicación de cómo eliminar los plugins:

  • Dir√≠gete a la secci√≥n ¬ęPlugins¬Ľ del men√ļ lateral de tu instalaci√≥n WordPress para ver la lista de plugins que tienes instalados.
  • Mira bien qu√© plugins tienes activos (y los inactivos) y utiliza¬†P3- Plugin Performance Profiler¬†para ver cuales son los que m√°s recursos consumen.
  • Una vez decidido los plugins con los que te quedas, elimina los que no vayas a usar (recuerda que tienes que desactivarlos antes) y actualizalos a la √ļltima versi√≥n.

Pero no todo son plugins, ya que, muchas veces, dejamos las plantillas que trae por defecto WordPress en el servidor. Estos temas ocupan espacio y, en ocasiones, también recursos. Como son plantillas que no vas a usar, lo mejor es eliminarlas y quedarte con el theme que realmente vas a usar. Por ello, te dejo una breve explicación de cómo eliminar los temas que no usas:

  • Dir√≠gete a la secci√≥n ¬ęApariencia > Temas¬Ľ del men√ļ lateral de tu instalaci√≥n WordPress para ver la lista de plantillas que tienes instaladas.
  • Mira bien qu√© theme tiene activo (y los inactivos), elimina los que no vayas a usar y actualizalo a la √ļltima versi√≥n para evitar problemas.
Nota: El rendimiento de muchas instalaciones WordPress es malo¬†por este motivo. Son webmasters que se dedican a instalar un plugin para todo, y no se paran a pensar en s√≠ esos plugins realmente son¬†√ļtiles¬†o est√°n¬†afectando a la velocidad de carga del sitio web. Por ello, revisa bien que tienes instalado y¬†deshazte de todos los plugins lo que no utilices¬†(y, si puedes, sustituye los que m√°s recursos utilicen).

También te puede interesar esta guía

mejores plugins wordpress

Exiten miles de plugins para WordPress. En mi¬†blog ya he probado cientos de ellos, porque es la √ļnica manera de ver si realmente te facilitan la vida o te ayudan, y he descubierto plugins¬†realmente brillantes.

Por ello, he hecho una lista con mis plugins favoritos, esos que instalo en mis páginas, pero también en la de mis clientes. Algunos de ellos son gratis y otros de pago, pero te aseguro que te encantarán.

Ir a la guía

#4 A√Īade la compresi√≥n de im√°genes a tu lista de tareas

Una de las medidas m√°s f√°ciles y efectivas para¬†mejorar el tiempo de carga de tu sitio web¬†es el simple hecho de¬†comprimir las im√°genes que subes. Esta peque√Īa acci√≥n puede ayudar a ahorrar gran cantidad de espacio en tu servidor. En lo que llamamos ¬ęcompresi√≥n de im√°genes sin p√©rdida¬Ľ, el tama√Īo del archivo se reduce, pero¬†sin perder su calidad. Esto permite que no exista gran diferencia en la calidad de la imagen pero, al mismo tiempo, se reduzca significativamente el peso del sitio web, logrando una mejor optimizaci√≥n.¬†Existen 3 decisiones que un dise√Īador web tiene que¬†tomar en cuanto a¬†la elecci√≥n de un formato de imagen:¬†transparencia,¬†animaci√≥n¬†o¬†datos de alta calidad. Te lo explico por partes:

  • PNG:¬†PNG¬†es un formato simple que soporta¬†transparencia¬†y¬†compresi√≥n sin p√©rdidas. Permite definir un canal alfa para la imagen, para enmascarar las √°reas transparentes, as√≠ como una opci√≥n para habilitar un compresor¬†Deflate¬†sin p√©rdidas de datos (Deflate es una combinaci√≥n de dos compresores sin p√©rdidas:¬†LZ77¬†y¬†Huffman). Dado que la compresi√≥n es sin p√©rdidas,¬†la calidad de imagen sigue siendo id√©ntica a la imagen de origen. Sin embargo, esto causa algunos problemas, ya que el tama√Īo del archivo tiende a subir¬†y no tan peque√Īo como deber√≠a¬†ser.
  • GIF:¬†GIF¬†es otro formato que soporta transparencias, adem√°s de¬†animaciones.¬†El formato GIF contiene dos etapas de compresi√≥n, un paso de paletizaci√≥n con p√©rdidas (restringiendo toda la imagen a s√≥lo 256 colores), seguido por un compresor¬†LZW¬†sin p√©rdidas. El proceso de cuantificaci√≥n de los colores de la imagen a s√≥lo 256 proporciona una reducci√≥n de calidad muy alta¬†en beneficio de un mejor¬†tama√Īo de compresi√≥n, que tiende a producir una mejor compresi√≥n LZW.
  • JPG o JPEG: Si no necesitas ni¬†transparencia ni animaci√≥n, entonces¬†JPG¬†es el¬†formato de imagen ideal. Fue dise√Īado para¬†manejar la compresi√≥n de datos de fotos de alta calidad, pero proporciona un¬†conjunto configurable de opciones de compresi√≥n con p√©rdidas, lo que te permite intercambiar¬†calidad de compresi√≥n o¬†tama√Īo de la imagen, dependiendo de las necesidades.

Por estimaciones de la organización HTTP-Archive, las imágenes suelen ser las culpables de la porción de datos más grande en muchos sitios web. Por lo tanto, la reducción y optimización de las mismas debería ser el primer paso para cualquier tipo de optimización. Plugins como WP-SmushIT te ayudan a generar un gran impacto en el tiempo de carga de tu sitio web siendo muy fácil de utilizar y generando muy poco esfuerzo para ti. Es importante optimizar tanto las imágenes que vayas a subir nuevas como las ya existentes. Para poder instalar el plugin, te dejamos un video de Byron Fabrizio con el que aprenderás a instalar y utilizar este plugin.

Nota: Mi equipo y yo utilizamos diariamente Jpegmini (para jpeg y jpg) y Tinypng (para png). Unidos al plugin que comentaba antes, podrás reducir casi a la mitad el peso de las imágenes.
También te puede interesar esta guía
guia optimizacion imagenes consejos herramientas

¬ŅTe hayas parado a pensar la enorme cantidad de¬†tr√°fico¬†que te pueden traer las¬†im√°genes¬†desde los buscadores? Alguien busca un producto, un lugar, una receta, o una infograf√≠a en¬†Google¬†y ah√≠¬†deber√≠an aparecer¬†tus im√°genes.

Estoy seguro de que ahora te estar√°s preguntando ¬ŅOptimizo correctamente mis im√°genes?¬†, o de que incluso ya das por hecho de que no las optimizas (no te preocupes, es com√ļn). Por eso mismo te voy a mostrar en esta gu√≠a.

Ir a la guía

#5 Combina, reduce y comprime los recursos CSS y JavaScript

Otra de las demandas más altas de recursos en un sitio web suelen ser los archivos JavaScript y CSS. Aquí es donde muchos usuarios temen realizar cualquier acción. Pero incluso con pocos conocimientos de programación se puede entender fácilmente lo que se debe hacer para optimizar los archivos CSS y JavaScript y, por ende, el rendimiento de WordPress. Principalmente hay tres cosas que puedes hacer:

  • Combinar: Normalmente, los archivos CSS y JavaScript hacen solicitudes desde el navegador hacia el servidor por separado. Esto crea solicitudes HTTP individuales, lo que genera un aumento en el tiempo de carga de tu sitio web. Sin embargo, si reduces estos archivos, el n√ļmero de solicitudes que se deben realizar se reduce dr√°sticamente. Por ejemplo, de 53 solicitudes se pueden reducir sin mucho problema a 12. Para esto existe Autoptimize,¬†un plugin que te ayuda a realizar este trabajo. Es muy f√°cil de utilizar y te permite concatenar (unir) todos los archivos, scripts y CSS. Los minimiza y los comprime, guard√°ndolos en la memoria cache y permitiendo que tu p√°gina cargue mucho m√°s r√°pido.
  • Reducir: Los archivos CSS y JavaScript son l√≠neas de c√≥digo que le permiten a tu sitio web tener su propio dise√Īo y funcionalidad. Es un c√≥digo escrito por personas, pero que es interpretado por maquinas. ¬ŅPor qu√© es esto importante saberlo? Porque normalmente lo que necesita una persona para entender un c√≥digo una computadora no lo necesita. Por lo tanto, espacios, comentarios, etc., no son obligatorios para el correcto funcionamiento de tu sitio web. En este punto es donde plugins como Autoptimize y Better WordPress Minify te ayudan a convertir los archivos CSS y JavaScript a c√≥digo legible para m√°quinas. Esto te ayuda a ahorrar muchos bytes de espacio y hace que cada paquete de datos individual m√°s peque√Īo, por lo que habr√° un mejor rendimiento.
  • Comprimir: Despu√©s de combinar y reducir viene el √ļltimo paso: comprimir. Se trata de comprimir los paquetes de datos que se env√≠an del servidor web al navegador. Esto significa que el servidor reduce al m√≠nimo el tama√Īo de cada archivo de cada¬†solicitud y el navegador se encarga de descomprimir y calcular cada uno de ellos. De esta manera es m√°s r√°pido que enviar paquetes de datos sin comprimir. Puedes establecer una compresi√≥n con un plugin de cacheo (como los he comentado m√°s arriba), cambiando manualmente la configuraci√≥n en el .htaccess o activando esta opci√≥n en el servidor (o contactando con tu proveedor para que lo haga el por ti).

Como he mencionado hace un momento, existe la posibilidad de comprimir las solicitudes a trav√©s de la modificaci√≥n del archivo .htaccess. Para conseguirlo, tienes que a√Īadir el siguiente c√≥digo a dicho archivo. Si no sabes c√≥mo hacerlo, lo mejor es que aprendas a manejar este archivo antes, si no quieres ver un error en tu sitio web. Veamos el c√≥digo:

Activar GZIP

<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>

Activar GZIP on Apache

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

Activar GZIP con NGINX

gzip on;
gzip_comp_level 2;
gzip_http_version 1.0;
gzip_proxied any;
gzip_min_length 1100;
gzip_buffers 16 8k;
gzip_types text/plain text/html text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript;

# Disable for IE < 6 because there are some known problems
gzip_disable ¬ęMSIE [1-6].(?!.*SV1)¬Ľ;

# Add a vary header for downstream proxies to avoid sending cached gzipped files to IE6
gzip_vary on;

Nota: Si quieres saber si has activado correctamente la compresión en tu sitio web, dirígete a esta herramienta y escribe tu url. Si te dice que no, lo primero comprueba que sabes cómo funciona tu servidor. Incluso sin conocimientos de programación es fácil entender que beneficios traen estas medidas.

#6 Ten cuidado con el orden de carga de los ‚ÄúRendering‚ÄĚ

Un punto que cubren y detectan herramientas Google Speed Insights es la secuencia de carga que bloquea el rendering. Con un ejemplo seguro que te queda mucho más claro: un slider consiste en imágenes y un comando de animación, que permite que estas imágenes roten, y si el JavaScript encargado del movimiento del slider carga primero y las fotos al final, entonces tu página tendrá la función del slider funcionando antes que las imágenes se hayan cargado por completo (por ello, la carga del sitio web lleva tiempo).

De todas maneras esto se puede prevenir con la secuencia de carga correcta.¬†A decir verdad, hay plugins que te ayudan a obtener a optimizar la secuencia de carga de la p√°gina. Aun as√≠, mi experiencia me demuestra que estos plugins no siempre son capaces de optimizar tu sitio web completamente. Obtendr√°s mucho mejor resultado hablando con el dise√Īador web que te desarroll√≥ la p√°gina, ya que est√° m√°s familiarizado con tu sitio web y sus funciones.

Nota: Este aspecto, al ser m√°s t√©cnico, es mejor¬†dejarlo en manos de la agencia o dise√Īador web freelance¬†que te hizo el sitio web.

#7 Optimiza al m√°ximo la zona visible de tu sitio web

Además del tiempo total de carga de tu sitio web, la sensación de carga es especialmente importante. Con esto me refiero al tiempo en el que el usuario percibe que la carga de tu página Web está completa. Esa sensación del tiempo de carga se puede acortar con algunos trucos. Así, el usuario tiene la impresión de que la página web ya está cargada por completo, aunque todavía siga trabajando en el background.

Para la optimización de la secuencia de carga es particularmente importante la optimización del área conocida como Above the Fold (no es más que la zona que se ve al cargar la página web, antes de hacer scroll). Esto quiere decir que el contenido y las funciones de esa zona se priorizan, lo que hará que se muestre más rápido al usuario (y que tenga una sensación de que ya está cargada). La parte principal de mi página web, por ejemplo, es lo primera se carga y se muestra a cualquier visita, sin que haya la necesidad de desplazarse (sin scroll).

Esto se logra, por ejemplo, optimizando la secuencia de carga. Lazy Load es un plugin que te ayudará a que tu sitio web cargue el contenido sólo cuando el visitante se desplaza al área respectiva de la página. De esta manera el usuario siempre tiene el contenido que necesita, y el tiempo de carga de la página se ve beneficiado (incluso si se trata de una página web con imágenes pesadas como la mía).

Nota: El objetivo es ir cargando las imágenes del sitio web cuando se visualizan y no todas a la vez. Esto mejora mucho el rendimiento de WordPress, sobretodo si tienes muchas imágenes que mostrar en las entradas, portfolio o productos.

#8 Limpia y optimiza de forma habitual la base de datos

Además de las imágenes y la encriptación, tu base de datos puede ser demasiado grande. No te preocupes, también existen herramientas prácticas que mantienen tu base de datos optimizada (y ocupando el menor espacio posible). En cuanto a plugins, es WP-Optimize es que manda (y te recomiendo). La base de datos se va haciendo más grande con el paso de tiempo, con información que, a veces, no es muy importante (revisiones, borradores, pingbacks, trackbags y muchas otras cosas). Esto hace que tu sitio web cargue mucho más lento.

como mejorar rendimiento wordpress optimizar base de datos

Gracias a este plugin puedes configurar la ¬ęauto-limpieza¬Ľ de tu base de datos, pudiendo decirle cu√°ndo y c√≥mo se debe hacer. De todas maneras te recomiendo, para reducir al m√≠nimo el n√ļmero de plugins activos, que lo instales, optimices la base de datos y despu√©s lo desactives y elimines. Haz esto una vez a la semana como m√≠nimo, sobre todo si tienes un sitio web donde tengas muchos cambios diarios. Si no es as√≠, puedes hacerlo 1 vez al mes. Por √ļltimo, un truco para mejorar todav√≠a m√°s el rendimiento de tu WordPress:

Es muy normal instalar y desinstalar muchos plugins a lo largo de la vida de una instalación WordPress (imáginate alguien que se dedica a probarlos). En este tema hay algo a lo que no se suele prestar atención, pero que hace disminuir el rendimiento del sitio web. Se trata de las tablas que crean esos plugins que has instalado y desinstalado en la base de datos. Cuando los eliminas, estas no se eliminan (error grave de WordPress). Por ello, te recomiendo usar el plugin Plugins Garbage Collector, para detectar esas tablas que no utilizas y eliminarlas.

Nota: Limpia y optimiza de forma habitual la base de datos para mejorar el rendimiento de tu WordPress. Si lo haces (basta con hacer click en un botón),  notarás una mejoría considerable.

#9 Desactiva y elimina los pingbacks y trackbacks

De forma predeterminada, WordPress interact√ļa con otras p√°ginas¬†a trav√©s de pingbacks y trackbacks. Siempre que tu p√°gina web sea mencionada en otras p√°ginas, se notificar√° autom√°ticamente a tu instalaci√≥n y se a√Īadir√° a tu base de datos.¬†Si no necesitas esta caracter√≠stica que, en mi opini√≥n, no tiene valor agregado (y hace que sufra mucho tu base de datos si tienes muchas menciones), debes desactivar esta opci√≥n en ¬ęAjustes > Comentarios¬Ľ y limpiar los pingbacks y trackbacks (para esto utiliza, de nuevo, WP-Optimize).

como mejorar rendimiento wordpress desactivar trackbacks pingbacks

Desactiva los pingbacks y trackbacks de WordPress en ¬ęAjustes > Comentarios¬Ľ

Nota: Elimina los pingbacks y trackbacks de tu sitio web. Además de que no tienen sentido, estás permitiendo enlaces salientes que, a veces, son dofollow.

#10 Evita el ¬ęHotlinking¬Ľ cap√°ndolo desde tu instalaci√≥n WordPress

¬ŅQue es eso del hotlinking? ¬°Es f√°cil! Significa que alguien enlaza directamente una imagen desde tu servidor a uno externo (aprovech√°ndose de tu trabajo y servidor). Esto, aparte de que hay que tener morro para hacer, hace que tu ancho de banda se ‚Äúpierda‚ÄĚ. Pero tranquilo, y que es relativamente f√°cil de prevenir. Para ello, debes insertar el siguiente c√≥digo dentro del archivo .htaccess:

RewriteEngine on

RewriteCond %{HTTP_REFERER} !^$

RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?deineseite.de [NC]

RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.de [NC]

RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com [NC]

RewriteRule \.(jpg|jpeg|png|gif)$ ‚Äď [NC,F,L]

Nota: Si tu proveedor de hosting no dispone de Apache, pero si que tiene NGINX, dir√≠gete directamente al soporte (en los servidores NGINX no existe ning√ļn archivo .htaccess para manipular).

#11 Implementa un CDN y aloja tus im√°genes en otro servidor

Desde mi experiencia, el CDN o Content Delivery Network (Red de entrega de contenidos) es una herramienta perfecta para cualquier sitio web, ya que hace que todo sea mucho m√°s sencillo y r√°pido. Hay dos razones principales por las que me encanta usar CDN: la primera es que permiten alojar im√°genes en un servidor aparte y la segunda es que disminuyen los tiempos de carga de las im√°genes. En resumen, te ayudan a mejorar el rendimiento de uno de los elementos que m√°s lata da en una instalaci√≥n web: la carga de las im√°genes (aunque no es lo √ļnico).

Me gusta alojar las imágenes fuera del servidor de la instalación de WordPress, ya que libera el espacio web. Puedo cambiar mi dominio o pasar de un hosting a otro, que mis archivos multimedia siempre estarán en el mismo lugar. Una base de datos y una plantilla que estén en la media pesarían alrededor de 10-25 Mb. Sin embargo, puede haber más de 2 GB de imágenes para transferir también. Si colocas esos 2 GB en otro servidor (u otros servidores), sólo tendrás que preocuparte de 25 Mb.

La idea detr√°s de un CDN es colocar los recursos solicitados lo m√°s cerca del usuario, geogr√°ficamente hablando. Mi p√°gina web se encuentra alojada en alg√ļn lugar de Par√≠s, y uso Amazon CloudFront (aunque tambi√©n te recomiendo MaxCDN) como un CDN. Esto significa que, si alguien accede a mi sitio web desde M√©xico, puede recibir las im√°genes desde un centro de datos de su continente (normalmente EE.UU.). Esto reduce los tiempos de transferencia, hops (n√ļmero de routers /cortafuegos /etc. que los datos tienen que atravesar) y otros par√°metros, lo que se traduce en un sitio web mucho m√°s r√°pido.

Nota: La opción del CDN se suele recomendar para sitios web con mucho contenido multimedia (imágenes, vídeos, etc).

¡Anímate! Optimiza hoy mismo el rendimiento de tu WordPress

Hay muchos webmasters que descuidan el rendimiento de su sitio web. A menudo, es debido al miedo que se tiene a tocar ciertas cosas (a veces fundado). Por eso con esta gu√≠a te he ense√Īado c√≥mo mejorar el rendimiento de WordPress de una manera m√°s pr√°ctica y √ļtil.¬†Con un poco de esfuerzo y sin grandes conocimientos en programaci√≥n, puedes realizar un gran progreso en la optimizaci√≥n del tiempo de carga de tu WordPress.¬†As√≠ que no dejes que los consejos de herramientas como Google PageSpeed Insights te desanimen. En esencia, la optimizaci√≥n del tiempo de la carga de tu sitio web se centra en:

  • Reducir el tama√Īo de tu p√°gina Web.
  • Reducir las peticiones HTTP.
  • Comprimir los paquetes de datos individuales.
  • Optimizar la experiencia del usuario.

Si tienes estos temas en cuenta, podr√°s optimizar el rendimiento de tu sitio web de manera muy r√°pida y f√°cil. Para las optimizaciones m√°s complicadas que no sepas hacer t√ļ mismo, te recomiendo acudir a expertos que te pueden ayudar con esos t√≥picos un poco m√°s ‚Äúcomplicados‚ÄĚ. Eso s√≠, te recuerdo que los temas abordados en esta gu√≠a son muy sencillos de realizar y no te llevar√°n¬†mucho tiempo.

¬°‚úÖ Checklist de WordPress! 1ÔłŹ‚É£1ÔłŹ‚É£ Puntos para ūüöÄ Optimizar el Rendimiento de Tu Instalaci√≥n T√ļ Mismo ¬°Haz que P√°gina #Web, #Blog o #TiendaOnline Vuele! Haga clic para Tweet

¬ŅQu√© te ha parecido esta gu√≠a para mejorar el funcionamiento y rendimiento de tu WordPress? ¬ŅHas probado algunos de estos consejos o trucos de optimizaci√≥n de WordPress? ¬ŅCrees que¬†me he dejado algo? ¬ŅTienes alguna experiencia que quieres contar? ¬ŅTe has quedado con alguna duda o pregunta? Entonces te¬†pido es que dejes un¬†comentario. Da igual que sea o una duda o un simple gracias, pero me alegrar√© mucho de leerlo y responderlo.

También te puede interesar esta guía
tutorial wordpress

WordPress es, sin duda, una de las mejores plataformas para crear una o página web o blog. Es fácil de usar, flexible y con muchas opciones para personalizarla de acuerdo a lo que necesites y más te guste.

Sin embargo, para muchos usuarios que recién comienzan, puede ser un poco abrumador o confuso. Hosting, temas, plugins, SEO, mantenimiento, etc. Son muchas las cosas que implica usar WordPress correctamente.

Ir a la guía