checklist como mejorar rendimiento wordpress

+11 Puntos para Optimizar el Rendimiento de WordPress ūü§Ė

Ignacio Santiago WordPress 0 comentarios

Internet está lleno de trucos y consejos sobre cómo optimizar el tiempo de carga de tu instalación WordPress. Desafortunadamente, aunque algunos son buenos, muchas veces, por desconocimiento o falta de tiempo, caen en saco roto. Por ello, queremos explicarte, paso a paso, cómo mejorar el rendimiento de tu WordPress, para que tu mismo puedas hacerlo (sin temer a fallar) y que tu sitio web de WordPress sea mucho más rápido, uno de los factores de posicionamiento que más importancia da Google a una pagina web, blog o tienda online.

checklist como mejorar rendimiento wordpress

¬ŅPor qu√© sabemos que te podemos ayudar? Durante m√°s de 1 a√Īo hemos tenido la oportunidad de alojar miles de proyectos de WordPress, d√°ndonos la oportunidad de recolectar mucha informaci√≥n y poder aconsejarte en consecuencia. Entre otras muchas cosas, la solicitud de optimizar el rendimiento de WordPress se presenta una y otra vez, con la¬†velocidad de carga como bandera.

¬°Hay cosas que nos han sorprendido! Algunos de nuestros clientes son influenciados 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 recomendamos usarla de gu√≠a (no es bueno “volverse loco” con estos temas). Te decimos esto porque hay herramientas mucho mejores (y m√°s recomendables) como Pingdom¬†y GTmetrix¬†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.

¬Ņ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 nosotros nos enteramos a veces, y eso que vemos cosas de estas a diario. Realmente pocos usuarios est√°n preparados para enfrentarse a algo as√≠ (sobre todo si est√°n soloso) y saber cual es la manera de proceder.

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 y la experiencia de usuario de tus usuarios.¬†Por esta raz√≥n, queremos explicarte las modificaciones m√°s importantes que debes realizar para conseguir esa optimizaci√≥n del funcionamiento¬†de tu WordPress.

Lo que vas a aprender en esta guía


  • Elementos cr√≠ticos para tener una buena base para optimizar

  • T√©cnicas avanzadas para mejorar la velocidad de carga de tu WordPress

  • C√≥mo combinar, reducir y comprimir los recursos de tu WordPress

  • Configuraci√≥n del panel de WordPress para mejorar el rendimiento

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.Ignacio Santiago

Por el contrario, una 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 queremos 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 pasamos 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 vamos a describir cuales son los pasos para realizar la optimizaci√≥n t√ļ mismo. Nuestro top 10 est√° realizado generalmente por la pr√°ctica obtenida de nuestras experiencias del a√Īo anterior.

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


El hosting¬†es otro elemento b√°sico que interviene en el rendimiento de un sitio web.¬†Por un lado tenemos 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 adelantamos 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. El primero, el shared hosting o alojamiento compartido,¬†es la forma m√°s barata y sencilla de hosting y la m√°s com√ļn.¬†Imagina por un momento que el servidor donde se hospeda tu p√°gina es un hotel, con un n√ļmero determinado de habitaciones. Cuando contratas un servicio de alojamiento compartido, tu p√°gina pasar√≠a a estar hospedada en una de las habitaciones de ese hotel, al igual que muchas otras pertenecientes a otros clientes de la empresa de hosting.

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.

Bluehost

mejor hosting wordpress bluehost
Hosting Web desde 3,95‚ā¨/mes
Ir a Bluehost

ProfesionalHosting

mejor hosting wordpress profesionalhosting
Hosting Web desde 2,4‚ā¨/mes
Ir a ProfesionalHosting

RaidBoxes

mejor hosting wordpress raidboxes
Hosting Web desde 15‚ā¨/mes
Ir a RaidBoxes

Raiola Networks

mejor hosting wordpress raiolanetworks
Hosting Web desde 4,4‚ā¨/mes
Ir a Raiola Networks

SiteGround

mejor hosting wordpress siteground
Hosting Web desde 3,95‚ā¨/mes
Ir a SiteGround

Webempresa

mejor hosting wordpress webempresa
Hosting Web desde 5,27‚ā¨/mes
Ir a Webempresa

En caso de que quieras empezar por algo econ√≥mico te recomendamos¬†Webempresa y Raiola Networks, ya que tienen un servicio de soporte en espa√Īol 24X7 bastante bueno.

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.

El precio estar√≠a entre 15‚ā¨ y 40‚ā¨, dependiendo del proveedor y de sus “extras”. Este tipo de servidor lo recomiendo para sitios web que ya tengan ¬†cierto tr√°fico (a partir de 100.000 visitas/mes) y quieran mejorar su WPO.¬†Los servidores VPS consisten en reservar una parte considerable de los recursos de un servidor para que los utilices cuando quieras. A diferencia del shared hosting, en donde una p√°gina vecina puede consumir m√°s recursos de la cuenta (como el inquilino del hotel que acapara la comida del buffet), aqu√≠ tendr√°s una cantidad de memoria y procesamiento asignados.

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.
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.

Gigas

mejor hosting wordpress gigas
Hosting Web desde 15,8‚ā¨/mes
Ir a Gigas

GoDaddy Pro

mejor hosting wordpress godaddy pro
Hosting Web desde 36‚ā¨/mes
Ir a GoDaddy

SiteGround

mejor hosting wordpress siteground
Hosting Web desde 29‚ā¨/mes
Ir a SiteGround

Si estás buscando un servicio de alojamiento para WordPress de calidad, Gigas y Raiola Networks son una opción perfecta y muy buen de precio para lo que ofrece.

Como sabemos que muchos de nuestros lectores usan WordPress, y esta guía se centra en este CMS, hemos querido hacer una lista con los que proveedores de hosting especializado en WordPress. En resumen, son una mezcla de los dos anteriores, ya que depende del proveedor y su solución. Lo que si que te aseguramos es que son alojamientos web en lo que WordPress tiene un mejor rendimiento, tanto SEO y de WPO.

Factoría Digital

mejor hosting wordpress factoriadigital
Hosting Web desde 14,95‚ā¨/mes
Ir a Factoría Digital

Media Temple

mejor hosting wordpress mediatemple
Hosting Web desde 20‚ā¨/mes
Ir a Media Temple

WP Engine

mejor hosting wordpress wpengine
Hosting Web desde 29‚ā¨/mes
Ir a WP Engine

En este √ļltimo caso te recomendamos el servicio de Factor√≠a Digital. Aunque son nuevos, ofrecen un servicio a medida para WordPress que har√° las delicias de cualquier instalaci√≥n.

Podr√≠amos seguir con los¬†servidores dedicados, pero creemos que ese ya es un tema que hay que tratar con cuidado, porque es la opci√≥n m√°s cara, pudiendo llegar (y superar) los 300‚ā¨ al mes. 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.

El servidor dedicado es perfecto para sitios web ya establecidos y con un tr√°fico en ascenso. Tambi√©n est√° pensado para proyectos grandes que requieren un¬†servidor m√°s “dedicado” al sitio web, ya que muchas veces sus funcionalidades lo requieren.Ignacio Santiago

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.¬†no es tan flexible como un servidor VPS. Esto es porque est√°s contratando un ordenador f√≠sico y, sino “controlas” y necesitas ampliar o reducir tus prestaciones, necesitar√°s un t√©cnico para abrirlo y cambiar las piezas de hardware.

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? 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.

Hemos hecho una comparativa de hosting¬†que te puede ser muy √ļtil. Actualizada constantemente, podr√°s encontrar los mejores precios para tu alojamiento web,¬†desde un simple hosting compartido, hasta un avanzada servidor dedicado.

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


¬ŅSabes a lo que nos referimos con cache? Con¬†caching o almacenamiento en cach√©¬†queremos 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, 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.

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 nuestra 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 uno de nuestros lectores 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.

checklist 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.

checklist 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, nosotros usamos a menudo plugins como¬†Thumbnail Regenerator, Theme Check¬†o P3. Si bien estos ofrecen un¬†valor a√Īadido cuando los usas, s√≥lo los necesitamos en momentos puntuales. Cuando no los utilizamos, los¬†desactivamos¬†(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 dejamos 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 en tu instalaci√≥n.

  • 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,¬†actual√≠zalos a la √ļltima versi√≥n y elimina los que no vayas a usar (recuerda que tienes que desactivarlos antes).

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 dejamos 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 en tu instalaci√≥n.

  • Mira bien qu√© theme tiene activo (y los inactivos), actual√≠zalo a la √ļltima versi√≥n para evitar problemas y elimina los que no vayas a usar.

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).

#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 desarrollador web tiene que¬†tomar en cuanto a¬†la elecci√≥n de un formato de imagen: transparencia, animaci√≥n¬†o datos de alta calidad. Te las explicamos 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.

Nosotros usamos diariamente Jpegmini (para jpeg y jpg) y Tinypng (para png). Unidos al plugin que comentábamos antes, podrás reducir casi a la mitad el peso de las imágenes.

#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 que hemos puesto 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 hemos 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;


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√≠, nuestra experiencia nos 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.

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 nos 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).

Puedes ir cargando las im√°genes del sitio web cuando se visualizan, y no todas a la vez.

#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.

checklist como mejorar rendimiento wordpress optimizar base de datos

Instala y activa el plugin y acuérdate de que la opción de los comentarios sin aprobar se quede sin seleccionar

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 recomendamos, 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.

Limpia y optimiza de forma habitual la base de datos para mejorar el rendimiento de tu WordPress.

#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).

checklist como mejorar rendimiento wordpress desactivar trackbacks pingbacks

En el men√ļ lateral, selecciona “Ajustes > Comentarios” y desactiva los pingbacks y trackbacks

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, ya 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]

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 .htccess para manipular).

#11 Implementa un CDN


Desde nuestra 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).

Recomendamos que alojes las imágenes fuera del servidor de la instalación de WordPress (sobre todo si son muchas), ya que libera el espacio web. Puedes cambiar eldominio o pasar de un hosting a otro, que tus 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. Nuestra p√°gina web se encuentra alojada en alg√ļn lugar de Par√≠s, y usamos¬†Amazon CloudFront (aunque tambi√©n te recomendamos¬†MaxCDN) como un CDN. Esto significa que, si alguien accede a nuestro 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.

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 hemos 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 recomendamos acudir a expertos que te pueden ayudar con esos t√≥picos un poco m√°s ‚Äúcomplicados‚ÄĚ. Eso s√≠, te recordamos que los temas abordados en esta gu√≠a son muy sencillos de realizar y no te llevar√°n¬†mucho tiempo.

‚úÖ Checklist WordPress: 11 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?¬†¬ŅCrees que¬†me he dejado algo? ¬ŅTienes alguna experiencia que quieres contar? ¬ŅTe has quedado con alguna duda o pregunta? Entonces te¬†pedimos es que dejes un¬†comentario. Da igual que sea o una duda o un simple gracias, pero nos alegraremos mucho de leerlo y responderlo.

Otros artículos que te recomendamos


Si te interesa este tipo de informaci√≥n, hemos hecho un listado de otros art√≠culos y gu√≠as de inter√©s con los que estamos seguros de que podr√°s profundizar a√ļn m√°s en en este tema. Como siempre, nuestro principal objetivo es ayudarte y asesorarte, por lo que echa un vistazo a estos contenidos, que estamos seguros que ser√°n perfectos para seguir ahondando sobre el tema. Estos son los m√°s destacados:

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *