6 maneras de acelerar tu sitio Elementor Pro

Actualizado: agosto 13, 2024

6 Ways To Boost Your Elementor Pro Site for Speed

👁 Respuesta rápida:

Haz esto para acelerar tu sitio Elementor Pro: selecciona el proveedor de alojamiento óptimo, configura los ajustes correctos de WordPress y Elementor Pro, sube tus activos en WEBP (para imágenes) y WOFF2 (para fuentes), sube unos cuantos fragmentos de código, utiliza un plugin de caché y una CDN para tiempos de carga más rápidos en todo el mundo, y mantén el recuento de plugins sólo en lo esencial.

Lo que aprenderás

Para contrarrestar la voluminosidad por la que Elementor Pro es famoso, hay 6 cosas que puedes (y debes) hacer para acelerar tu sitio Elementor Pro y el rendimiento de éste:

Velocidad del sitio Elementor antes
Información sobre la velocidad de la página móvil: Antes
A casi x2:
Velocidad del sitio Elementor después
Información sobre la velocidad de la página móvil: Después

Puntos clave:

  • Elige un proveedor de alojamiento fiable para garantizar un rendimiento óptimo del sitio web.
  • Configura WordPress, Elementor Pro y fragmentos de código.
  • Sube imágenes en formatos de última generación y añade caché y plugin CDN.

Acerca de Elementor

Elementor es un popular constructor de páginas que te permite crear y gestionar sitios web fácilmente. Impulsa millones de sitios web en todo el mundo, desde blogs personales hasta sitios de comercio electrónico. Desgraciadamente, Elementor es famoso por su voluminosidad y lentitud. Pero, Elementor ha hecho muchas mejoras a lo largo de los años para este problema específico. Ahora, conseguir una buena velocidad del sitio web con Elementor Pro modificando algunas características y ajustes clave, además de añadir algunas otras cosas puede ayudarte a conseguir buenos tiempos de carga.

1. El proveedor de alojamiento adecuado para Elementor (Esencial)

El primer paso y el más importante para construir cualquier sitio Elementor Pro es seleccionar el proveedor de alojamiento adecuado (y optimizado). Aunque hay muchos entre los que elegir, es importante seleccionar uno que cumpla los requisitos de Elementor. Un requisito clave es la memoria de WordPress y PHP. Elementor recomienda una memoria PHP de mínimo 256MB, pero se recomiendan 768MB o más.

Alojamiento de Elementor

Elementor ofrece sus propios planes de alojamiento personalizados para sitios Elementor.

Alojamiento de Elementor
Alojamiento de Elementor

Ventajas del alojamiento de Elementor:

  • Hecho específicamente para sitios Elementor.
  • El constructor de páginas Elementor Pro está incluido en los planes «Básicos» (te ahorras 99 $/año).
  • El plan básico cuesta a partir de 120 $/año (se renueva a 180 $/año).
  • Incluye una CDN gratuita (todos los planes).

Aspectos negativos de Elementor Hosting:

  • Es relativamente nuevo en el mercado del alojamiento.

Se recomienda encarecidamente el alojamiento de Elementor si se crea un sitio de WordPress con Elementor Pro. Te ahorra dinero a largo plazo (eligiendo el plan «Básico» o superior), y está totalmente optimizado para el constructor de páginas Elementor Pro.

Alojamiento SiteGround

SiteGround es un alojamiento popular elegido para Elementor, ya que cumple los requisitos de Elementor. SiteGround - Planes de alojamiento web

Ventajas de Siteground:

  • Ofrece precios de 2,99 $/mes durante el primer año (17,99 $ después).
  • Nombre de dominio gratuito durante el primer año.
  • CDN gratuito en todos los planes.
  • 768 MB de memoria PHP desde el principio.
  • Reconocido por su gran apoyo.

Aspectos negativos de SiteGround:

  • Un poco caro después del primer periodo de 12 meses.

 

Ver una lista de alternativas de proveedores de alojamiento ⇒

2. Ajustes de WordPress y Elementor para optimizar la velocidad (Principiante)

Antes de iniciar cualquier sitio de WordPress o Elementor, lo primero que hay que hacer es configurar los ajustes correctos.

Para WordPress

Vamos a configurar los ajustes de WordPress para optimizar al máximo la velocidad. Sólo hay que configurar unos pocos ajustes… Ajustes de los medios:

Ve a «Configuración» y selecciona «Medios». Asegúrate de establecer todos los valores en «0»

Configura los ajustes de los medios
Configuración de los medios
Esto garantiza que no se almacenen copias de tus imágenes en estos tamaños diferentes dentro de tu base de datos.

Enlaces permanentes:

Ve a «Configuración» y selecciona «Enlaces permanentes». Asegúrate de que está seleccionado «Nombre de la entrada».

Configurar los enlaces permanentes
Esta es la mejor práctica para mejorar el rendimiento y la optimización para motores de búsqueda (SEO).

En cuanto a la configuración de WordPress, ya está todo hecho. Fácil…

Borrar temas no utilizados

Elimina cualquier tema de WordPress que no estés utilizando. Si utilizas Elementor Pro como constructor de páginas, sólo deberías tener el tema Hello en la carpeta de temas de WordPress.

Ve a «Apariencia», selecciona «Temas» y elimina cualquier tema que no estés utilizando. Hola tema

Para Elementor Pro

Nota: necesitarás Elementor Pro para configurar algunos de estos ajustes.Fuentes personalizadas: Elementor Pro te permite subir tus propias fuentes personalizadas. Esto te ahorrará tiempo de carga. Esto funciona especialmente bien cuando se desactivan las fuentes de Google (más adelante veremos cómo).

Ve a Elementor y selecciona «Fuentes personalizadas» y «Añadir nuevas». Nota: puedes descargar fácilmente fuentes de Fonts.Google.

Añadir fuentes personalizadas a Elementor Pro
Añadir fuentes personalizadas

Como puedes ver, tienes la opción de subir diferentes tipos de fuentes (peso y estilo), y diferentes formatos.
Deberías subir todos tus tipos de letra en formato WOFF2, ya que es el más ligero.

Para convertir todos tus tipos de letra a WOFF2, dirígete a este conversor de TTF a WOFF2 y sube tus fuentes seleccionándolas y convirtiéndolas.

Convierte tus fuentes a WOFF2 (1)
Convertir a WOFF2

Ahora, ya estás listo para añadir todas tus variaciones de fuentes (o sólo las que necesites) a Elementor. Sólo tienes que asegurarte de que el peso y el estilo de la fuente son los correctos al subirla. Estas son las asignaciones comunes de nombres de pesos de fuentes:

ValueCommon weight name
100Thin (Hairline)
200Extra Light (Ultra Light)
300Light
400Normal (Regular)
500Medium
600Semi Bold (Demi Bold)
700Bold
800Extra Bold (Ultra Bold)
900Black (Heavy)
950Extra Black (Ultra Black)
Configuración avanzada:

En tu panel de WordPress. Ve a Elementor, selecciona «Configuración» y ve a la pestaña «Avanzado». Aquí, asegúrate de que todos estos ajustes están «Desactivados»:

  1. Google Fonts (no lo necesitas siempre que hayas subido tus fuentes personalizadas como arriba).
  2. Optimiza la carga de imágenes.
  3. Cargar fuente Soporte Awsome 4.

Y asegúrate de que están configurados como «Activado»:

  1. Carga optimizada de Gutenberg.
  2. Activa la carga de archivos sin filtrar (para subir archivos Lottie y SVG).
Configuración avanzada de Elementor
Configuración avanzada de Elementor

Ajustes de las características:

Ahora, dirígete a la pestaña «Características». Asegúrate de que SÓLO activas las funciones que tienes previsto utilizar o que utilizas actualmente. Nota: esto depende totalmente del tipo de sitio que estés construyendo.

Gestor de elementos: Elementor Pro ahora te permite desactivar cualquier widget o elemento que no estés utilizando. Esto aumenta aún más el rendimiento de la velocidad de tu sitio Elementor. Advertencia: Si aún estás construyendo tu sitio con Elementor, deja este paso para el final.

Ve a Elementor y selecciona «Gestor de elementos». «Escanear uso de elementos» y «Desactivar elementos no utilizados». Golpea Guardar.

Desactivar elementos de Elementor no utilizados
Desactivar elementos no utilizados

Esto eliminará todos los widgets y elementos de Elementor que tu sitio no esté utilizando y liberará algo de espacio, por lo que deberías dejar este paso para el final.

Aprende a crear tu propio sitio web desde cero

WordPress + Elementor Pro

3. Aumenta la velocidad de Elementor Pro con fragmentos de código (principiante)

El uso de algunos fragmentos de código específicos que te proporcionamos a continuación te ayudará a aumentar la velocidad de tu sitio Elementor proporcionando un impulso adicional a los pasos que hemos configurado anteriormente. Nota: Tendrás que descargar el plugin GRATUITO Code Snippets antes de continuar.

Una vez que hayas descargado el plugin gratuito. Añadir un nuevo fragmento de código es fácil. Ve a «Fragmentos» y «Añadir nuevo». A continuación, sólo tienes que copiar y pegar los fragmentos de código que se indican a continuación. Asegúrate de pulsar «Guardar» y «Activar» cuando hayas terminado.

Fragmentos de código:

FunctionCopy-paste this code
Remove Google Fontsadd_filter( 'elementor/frontend/print_google_fonts', '__return_false' );
Ensure Custom Font Loadsadd_filter( 'elementor_pro/custom_fonts/font_display', function( $current_value, $font_family, $data ) {
return 'swap';
}, 10, 3 );
Remove Unused JS/**
* We will Dequeue the jQuery UI script as example.
*
* Hooked to the wp_print_scripts action, with a late priority (99),
* so that it is after the script was enqueued.
*/
function wp_remove_scripts() {
// check if user is admina
if (current_user_can( 'update_core' )) {
return;
}
else {
// Check for the page you want to target
if ( is_page( 'homepage' ) ) {
// Remove Scripts
wp_dequeue_style( 'jquery-ui-core' );
}
}
}
add_action( 'wp_enqueue_scripts', 'wp_remove_scripts', 99 );
Remove Unused CSSfunction exclude_specific_css_files($src, $handle) {
// List of CSS file URLs to exclude from minification
$excluded_css_files = array(
'/wp-content/plugins/elementor/assets/css/frontend-lite.min.css',
'/wp-content/plugins/elementor-pro/assets/css/frontend-lite.min.css',
);

// Check if the current CSS file URL matches any of the excluded URLs
foreach ($excluded_css_files as $excluded_css_file) {
if (strpos($src, $excluded_css_file) !== false) {
return $src; // Return the original unminified CSS file
}
}

// If the CSS file is not in the excluded list, proceed with minification
return minify_css_content($src);
}

function minify_css_content($content) {
$content = preg_replace('/\s+/', ' ', $content); // Remove extra whitespaces
$content = str_replace(array("\r\n", "\r", "\n", "\t"), '', $content); // Remove newlines and tabs

return $content;
}

add_filter('style_loader_src', 'exclude_specific_css_files', 10, 2);
Remove the Gutenberg Editor//Remove Gutenberg Block Library CSS from loading on the frontend
function smartwp_remove_wp_block_library_css(){
wp_dequeue_style( 'wp-block-library' );
wp_dequeue_style( 'wp-block-library-theme' );
}
add_action( 'wp_enqueue_scripts', 'smartwp_remove_wp_block_library_css' );
Reduce Post Revisionsdefine('WP_POST_REVISIONS', 3);
Prevent Lazy Load Imagesadd_filter( 'wp_lazy_loading_enabled', '__return_false' );

Fragmentos cedidos a websquadron.co.uk

4. Comprimir y optimizar imágenes antes de subirlas (principiante)

Optimizar las imágenes comprimiéndolas y convirtiéndolas al formato de última generación (WEBp) puede reducir significativamente los tiempos de carga de la página y mejorar el rendimiento del sitio. Utiliza una herramienta de conversión de imágenes para convertir tus imágenes JPG o PNG en WEBp. Para ello, utilizaremos mi propia creación. En primer lugar, asegúrate de que tus imágenes no tengan unas dimensiones excesivas. Por ejemplo, si tu imagen tiene 4992 × 3328 píxeles (esto es muy típico, sobre todo si la descargas de directorios de imágenes gratuitos como Unsplash), primero debes ajustar el tamaño de la imagen para que se adapte a una aplicación web.

Las dimensiones de la imagen son demasiado grandes
Demasiado grandes
Yo suelo ajustar mis imágenes a 1280 x 720 píxeles o menos antes de convertirlas a WEBp.

Para conseguirlo, utiliza una herramienta gratuita como Figma o Canva y reduce la dimensión. En este caso, las reduje a 900 de ancho x 600 de alto. Asegúrate de exportar tus imágenes en JPG (o PNG si tu imagen tiene un fondo transparente).

Reducir las dimensiones de la imagen en Figma
Reducir las dimensiones de la imagen en Figma
Ahora, todo lo que tienes que hacer es ir al conversor de imágenes de tu elección, subir tu imagen (o imágenes), asegurarte de convertirlas a WEBp, seleccionar una calidad entre 80% y 100%, y convertir.
Conversor de imágenes a WEBp
Convierte tus imágenes en masa a WEBp

La optimización de las imágenes es un aspecto vital del desarrollo de un sitio web, ya que no sólo mejora el rendimiento, sino que también reduce el consumo de ancho de banda, haciendo que tu sitio sea más rentable. Nota al margen: Al optimizar las imágenes, no olvides cambiar su tamaño a las dimensiones correctas para su visualización en la web y utilizar nombres de archivo descriptivos y etiquetas alt para mejorar el SEO.

Consejo extra: Uso de la anchura completa frente a la anchura en caja en Elementor

Elementor menciona que el uso de ancho completo en comparación con el ancho en caja, podría ser beneficioso para ayudar a reducir el tamaño de tu DOM y, evidentemente, ayudar a aumentar el rendimiento de la velocidad del sitio.
Antes de continuar, debes saber que esto sólo funciona si tienes activada la función de contenedor Flexbox (no las secciones).
Si estás en la última versión de Elementor Pro, esta función debería estar activada por defecto.
Ahora que sabemos que usar ancho completo frente a ancho en caja en Elementor puede ayudar a aumentar el rendimiento de la velocidad de la página, ¿cómo aplicarlo?
Bueno, esto es lo que yo hago… Aplico un sencillo código CSS personalizado a todo mi sitio web en la sección de código personalizado de Elementor (en tu panel de control de WordPress).
Este es el código:

<style>.wrapper { max-width: 1080px; (cámbialo al tamaño que desees) } </estilo>

Código personalizado Wrapper

Esta es la anchura que tomarán tus contenedores envolventes (los contenedores que contienen tu contenido).
Esto tendrá sentido en los próximos pasos. Por si no lo sabes
En diseño web tienes: Tus secciones (las partes de tu página web que lo contienen todo), tus contenedores envolventes (estos están dentro de tu sección y contendrán los contenidos como encabezados, texto e imágenes), y luego los contenedores hijos (estos contienen el contenido).

Para maximizar el potencial de rendimiento del uso de ancho completo, configuro todos los contenedores (sección, envoltorio, contenedor hijo) a ancho completo.

Todos los contenedores y secciones están ajustados a ancho completo Ahora que ya lo sabes, cuando diseñes tu sitio web con Elementor, deberías tener algo que se parezca un poco a esto: Sección principal > contenedor envoltorio > contenedores hijos internos (copia, imágenes, etc.).
Cada contenedor debe estar configurado a ancho completo.

A continuación, añade a tu contenedor envoltorio el nombre de clase «envoltorio» en la configuración avanzada.
Tu contenedor envoltorio adaptará ahora la anchura máxima que estableciste anteriormente en tu código personalizado. Añadir clase personalizada envolvente al contenedor envolvente

Esta técnica no sólo ayuda a crear un diseño coherente en todo el sitio, sino que también ayuda a mejorar tu Velocidad del sitio web de Elementor.

5. Añadir un plugin de caché (y CDN) para tiempos de carga más rápidos (Avanzado)

El siguiente y último paso es utilizar un plugin de caché. Para ello, utilizaremos el plugin de caché LiteSpeed. Su uso es gratuito. Importante: sólo deberías activar y trabajar en un plugin de caché DESPUÉS de haber terminado de construir tu sitio.

Dirígete a «Plugins», selecciona «Añadir nuevo plugin» y busca «LiteSpeed Cache». Ahora, «Instala» y «Activa» el plugin.  

Activar el plugin Litespeed Cache
Activar el plugin Litespeed Cache

Hay muchas cosas que puedes hacer con este plugin y a veces puede ser un caso de ensayo y error. Muy importante: crea una copia de seguridad de tu sitio antes de configurar ningún ajuste en LiteSpeed Cache (o en cualquier plugin de almacenamiento en caché). Así que, antes de empezar, abre tu sitio en una ventana nueva, tanto en el escritorio como en el móvil (para asegurarte de que no rompes nada al modificar la configuración). Sin embargo, si sigues este paso a paso, no deberías tener problemas.

Caché LightSpeed: Configuración General

Aquí es donde configuras las cosas importantes, como la conexión a sus servidores QUIC.cloud. Este paso es necesario para utilizar eficazmente la CDN QUIC.cloud y LiteSpeed Cache.

Deberías ver una opción para «Solicitar una Clave de Dominio«. Haz clic en ella, espera unos segundos, actualiza la página y debería estar hecho. Ahora, te recomiendo que hagas clic en el botón «Conectar a QUIC.cloud» y conectes tu nombre de dominio a los servicios de QUIC.cloud y crees una cuenta.

Solicita la clave y conéctate a quic.cloud
Solicita la clave y conéctate a quic.cloud

Sigue los pasos para crear tu cuenta y conectar tu nombre de dominio. Esto te permitirá

  • Ver el uso detallado, las estadísticas e incluso los errores de todos los servicios
  • Compra cuota adicional si se te acaba
  • Configura y gestiona todas las opciones de CDN de QUIC.cloud
  • Abre fácilmente un ticket de soporte de QUIC.cloud
  • Gestiona varios dominios en un solo lugar

Una vez que hayas terminado de conectarte a QUIC.cloud, vuelve a la configuración general del plugin de caché de LiteSpeed, y continuemos.

Para el Modo Invitado y la Optimización de Invitado, los tengo desactivados (prueba tú mismo las opciones seleccionándolas una a una, guardando los ajustes y comprobando tu sitio en vivo tanto en el escritorio como en el móvil).

Si tu sitio está bien, puedes mantenerlos activados. Si no, déjalos fuera. En mi caso, estos dos ajustes causaban problemas…

Selecciona la opción «Comprobar mi IP pública desde DoAPI.us». Esto mostrará tu dirección IP actual. Cópialo y pégalo.

Configura el resto de ajustes generales
Configura el resto de ajustes generales

Asegúrate de guardar los cambios y ya está.

Caché LiteSpeed: Configuración de caché:

Normalmente, todos estos ajustes deberían estar activos nada más sacarlos de la caja y listos para funcionar. Sólo tenemos que cambiar unos pocos.

Caché LiteSpeed: Configuración de la caché
Caché de LiteSpeed: Configuración de la cachéCaché
: Asegúrate de que la opción «Caché móvil» está activada. TTL: no tocar. Purgar: debería estar todo bien. Excluir: aquí es donde puedes añadir URL específicas que deseas que NO se almacenen en caché.
Generalmente, deberías dejarlo como está. ESI: Asegúrate de que la «Barra de administración de caché» está desactivada (no es necesario). Objeto: Asegúrate de que «Caché de objetos» está activada. Y desactiva «Caché WP-Admin» (de nuevo, no es necesario). Navegador: «Caché del navegador» activado. Avanzado: Déjalo como está.

Caché LiteSpeed: CDN

En primer lugar, ¿qué es una CDN?

Una red de distribución de contenidos (CDN ) es como un montón de «ayudantes» repartidos por todo el mundo, cada uno con copias de tu sitio web. Cosas como imágenes, vídeos y páginas. De esta forma, cuando alguien quiera visitar un sitio web, podrá obtenerlo rápidamente de un «ayudante» cercano, haciendo que todo en tu sitio se cargue más rápido.

Nota: Si has seleccionado uno de los proveedores de alojamiento de Elementor recomendados anteriormente, cada uno de ellos tiene sus propios CDN, por lo que no tienes que preocuparte por esta configuración. Pero, en caso de que tu proveedor de alojamiento no ofrezca una CDN, sigue estos pasos.

1. Configuración CDN: Activa la CDN de QUIC.cloud.

No necesitas hacer nada más en la ficha.

2. Configuración de QUIC.cloud CDN: Haz clic en «Iniciar configuración de CDN de QUIC.cloud».

Caché LiteSpeed: Configuración automática de CDN
Configuración automática de CDN

Sigue los pasos necesarios para conectarte a tu cuenta QUIC.cloud existente (la que creaste anteriormente al solicitar la clave de dominio).

3. Enlace automático: Tu sitio enlazará automáticamente con QUIC.cloud y te devolverá a la página de configuración, mostrando«Listo para ejecutar la configuración CDN«.

Listo para ejecutar CDN
Listo para ejecutar CDN

4. Inicia la Configuración CDN: Haz clic en el botón «Ejecutar la configuración CDN». El estado cambiará a «En curso». Más tarde, cuando la configuración esté casi completa, haz clic en «Actualizar estado de configuración CDN». Recibirás una confirmación por correo electrónico. Soluciona los errores (si los hay): Si hay algún error, arréglalo si puedes y vuelve a hacer clic en «Ejecutar instalación CDN». Si no puedes solucionarlo, ponte en contacto con el servicio de asistencia de QUIC.cloud para que te ayuden.

5. Verifica los servidores de nombres: Asegúrate de que los servidores de nombres de tu registrador de dominios coinciden con los servidores de nombres de QUIC.cloud. Esto puede requerir que te conectes a tu registrador de dominios y actualices algunos registros.

Añade servidores de nombres a tus registros DNS
Añade servidores de nombres a tus registros DNS

Tienes que actualizar tus servidores DNS en el registrador de dominios. Puede ser Godaddy, Namecheap, tu proveedor de alojamiento o donde esté tu nombre de dominio. Ten en cuenta que la interfaz de usuario tendrá un aspecto diferente para ti. Estoy utilizando DinaHosting como proveedor de alojamiento (aquí es donde se encuentra mi dominio).

Sustituye tus nombres DNS 1 y DNS 2 actuales por los que te proporciona QUIC.cloud. Elimina cualquier otro registro DNS que no sea el tuyo de QUIC.cloud.

Sustituye tus registros DNS
Sustituye tus registros DNS

Importante: Si no estás seguro de lo que estás haciendo, ponte en contacto con el servicio de asistencia de la empresa a través del chat o por teléfono. Esto garantizará un proceso fluido, ya que deben saber exactamente lo que intentas conseguir y, por tanto, guiarte a lo largo del proceso.</span>

6. Completa la configuración: Una vez que QUIC.cloud detecte los servidores de nombres, el estado de la configuración cambiará a «Hecho». Esto puede tardar hasta 48 horas.

QUIC.cloud CDN está Hecho y conectado
QUIC.cloud CDN está Hecho y conectado

7. Gestiona tu configuración: Tras la configuración, utiliza los enlaces proporcionados para gestionar tus ajustes de CDN y DNS desde tu Panel de Control de QUIC.cloud. 8. Certificado SSL: QUIC.cloud creará un certificado SSL para tu sitio, lo que puede tardar entre 15 y 20 minutos. Puede que tu sitio muestre una advertencia sobre contenido inseguro hasta que esto se complete, pero desaparecerá una vez que el certificado SSL esté listo.

Caché LiteSpeed: Optimización de imágenes

Si has seguido los pasos anteriores y estás subiendo tus imágenes a tu sitio WordPress ya en WEBp y con las dimensiones optimizadas, aquí hay poco que hacer.

Ve directamente a Ajustes de Optimización de Imagen.

Como subo todas mis imágenes en WEBp y como tienen muy poco peso (100kB o menos de media), aquí sólo configuraré unos pocos ajustes.

Activa todo EXCEPTO: Optimizar imagen original Y Optimizar sin pérdidas

Caché LiteSpeed: Optimización de imágenes
Caché de LiteSpeed: Optimización de Imagen

Caché LiteSpeed: Optimización de página

Aquí es donde ocurre la verdadera magia y donde más verás aumentar la velocidad de tu página Elementor Pro. Advertencia: Estos son los ajustes que a veces tienden a romper los sitios web. Por lo tanto, asegúrate de que compruebas constantemente tu sitio en vivo, tanto en el escritorio como en el móvil, para detectar cualquier cosa extraña.

Configuración CSS: Configurar los ajustes CSS es principalmente donde tiendo a encontrar problemas con la ruptura del sitio Elementor. Por ensayo y error, estos son los ajustes CSS que mejor funcionan en la mayoría de mis sitios:

Deja todo desactivado EXCEPTO CSS Minify, Load CSS Asynchronously, y Inline CSS Async Lib. Todo lo demás está en OFF.

Caché LiteSpeed: Optimización de página Ajustes CSS
Ajustes CSS

Configuración JS: Aquí es donde veo los resultados que más aumentan la velocidad.
Suelo activar todos los ajustes de Javascript.

Activa todos los ajustes de Minificar JS, Combinar JS y Combinar JS Externo e Inline.

En cuanto a Cargar JS diferido, esto depende realmente de ti. Si se establece en «Diferido», proporcionará un pequeño impulso, pero todo tu JS se cargará normalmente. Si se establece en «Retrasado», todo el JS sólo se cargará cuando el visitante inicie una acción (desplazarse, por ejemplo). Me parece que esto proporciona el mayor potencial de refuerzo.

Así que lo configuro como «Retrasado».

Caché LiteSpeed: Optimización de página Ajustes JS
Configuración JSLa minificación de

archivosCSS y JavaScript puede agilizar el código, reducir el tamaño de los archivos y mejorar el rendimiento del sitio.
La minificación implica el proceso de eliminar caracteres innecesarios, espacios en blanco y comentarios del código sin afectar a la funcionalidad, lo que da como resultado archivos más pequeños que se cargan más rápido. Configuración HTML: Los problemas con la configuración de los ajustes HTML son menos frecuentes, pero siguen siendo posibles. Por tanto, sigue comprobando tu sitio web cuando cambies alguno de estos ajustes.

Minificar HTML: ON Prefetch DNS: ON Eliminar Google Fonts: ON – Como antes hemos subido nuestras propias fuentes personalizadas localmente, no necesitamos Google Fonts.
Eliminar Emoji de WordPress: ON Todo lo demás debería estar en OFF.

Configuración HTML
Configuración HTML

Configuración de Medios: Aquí sólo tenemos que configurar un único ajuste. Como estamos impidiendo la carga perezosa de todas las imágenes de los fragmentos de código mencionados anteriormente, ignoraremos todas las pestañas siguientes… Todo lo que tienes que activar en la Configuración de Medios es:

Carga perezosa de iFrames: Activar.

Ajustes de los medios
Configuración de los medios

Caché LiteSpeed: Base de datos

La optimización de la base de datos en la caché de LiteSpeed es una forma estupenda y sencilla de limpiar tu base de datos de cualquier pelusa o espacio no deseados. La «X» roja significa que la limpieza de la base de datos puede aumentar la velocidad. La marca de verificación verde te indica que ya se ha limpiado.

En la mayoría de los casos, puedes seguir adelante y seleccionar la sección «Limpiar todo» para liberar espacio en la memoria.

Caché LiteSpeed: Limpiador de Bases de Datos
Limpiador de bases de datos

Optimizar tu base de datos de WordPress implica limpiar los datos innecesarios, optimizar las tablas y reducir la hinchazón para ayudar a aumentar la velocidad del sitio. Comprobar y limpiar regularmente la sección Base de datos caché de LiteSpeed puede mejorar la velocidad y la eficacia. Otra técnica clave para limpiar y optimizar la base de datos de WordPress es eliminar los plugins y temas no utilizados que puedan contribuir a la sobrecarga de datos. Una base de datos bien optimizada no sólo acelera el rendimiento del sitio, sino que también garantiza que éste funcione sin problemas, lo que se traduce en una mejor experiencia del usuario y en una mejora de la clasificación SEO al mejorar los tiempos de carga de las páginas y disminuir la carga del servidor. La optimización de la base de datos es esencial para mantener un sitio Elementor y WordPress de alto rendimiento.

6. Limitar el número de plugins

Sé que es tentador añadir un montón de plugins para ayudar a mejorar el aspecto, el diseño y la interactividad de tu sitio web, pero en realidad deberías evitar añadir plugins no esenciales. Esto sólo conseguirá ralentizar tu sitio. Una de las grandes ventajas de utilizar Elementor Pro como constructor de sitios web es que tiene casi todo lo que necesitas para crear un sitio de marca totalmente funcional que también puede convertirse en un imán de clientes potenciales. Sólo deberías añadir plugins esenciales que ayuden a mejorar la velocidad, la funcionalidad y las optimizaciones SEO de tu sitio web. Deja que Elementor Pro haga el resto (ventanas emergentes, código personalizado, formularios, conexión a servicios de marketing por correo electrónico, etc.). Limitar el número de plugins de tu sitio WordPress puede reducir los conflictos, mejorar el rendimiento y agilizar el mantenimiento. Utilizando sólo los plugins esenciales y evitando instalaciones excesivas, puedes optimizar la velocidad y la estabilidad del sitio.

Supervisa y optimiza regularmente el rendimiento del sitio web

La supervisión y optimización continuas del rendimiento de tu sitio web WordPress son fundamentales para mantener la velocidad, la estabilidad y la satisfacción de los usuarios. Utiliza continuamente herramientas como PageSpeed Insights de Google o Pingdom de Solarwinds, evalúa las métricas de rendimiento e identifica las áreas de mejora.

Preguntas frecuentes

1. ¿Cómo puedo personalizar la configuración de mi WordPress para optimizarlo?

Para personalizar los ajustes de optimización de WordPress, ve a la sección «Ajustes» de tu panel de control de WordPress. Desde ahí, puedes hacer cambios en la configuración general, de escritura, lectura, discusión, medios y permalinks de tu sitio.

2. ¿Cuáles son los ajustes clave en los que debo centrarme para optimizar mi sitio de WordPress?

Algunos ajustes clave en los que debes centrarte para optimizar tu sitio de WordPress son activar el almacenamiento en caché, comprimir imágenes, configurar una CDN y optimizar el código de tu sitio. Todos ellos pueden mejorar la velocidad y el rendimiento de tu sitio web.

3. ¿Puedo cambiar la configuración de WordPress sin tener conocimientos de programación?

Sí, puedes cambiar la configuración de WordPress sin tener conocimientos de programación. WordPress tiene una interfaz fácil de usar que te permite personalizar fácilmente la configuración de tu sitio. Sin embargo, si tienes conocimientos de programación, puedes hacer cambios más avanzados editando el código de tu sitio.

4. ¿Con qué frecuencia debo revisar y actualizar la configuración de mi WordPress para optimizarlo?

Se recomienda revisar y actualizar la configuración de WordPress para su optimización de forma regular, por ejemplo cada pocos meses. Así te aseguras de que tu sitio funcione siempre de forma óptima y aproveche todas las nuevas técnicas de optimización o plugins.

5. ¿Cuál es el beneficio de personalizar la configuración de mi WordPress para optimizarlo?

Personalizar la configuración de tu WordPress para optimizarlo puede mejorar mucho la velocidad y el rendimiento de tu sitio. Esto puede dar lugar a una mejor experiencia de usuario, una mejor clasificación en los motores de búsqueda y un aumento potencial del tráfico y las conversiones.

6. ¿Existe algún plugin que pueda ayudar a personalizar los ajustes de WordPress para su optimización?

Sí, hay muchos plugins disponibles que pueden ayudar a personalizar la configuración de WordPress para su optimización. Algunas opciones populares son WP Super Cache, Smush Image Compression and Optimization y W3 Total Cache. Asegúrate de investigar y elegir el mejor plugin para las necesidades específicas de tu sitio.

Vistas: 11

Consigue contenido fresco

Únete a una lista de correo de más de 1.000 personas que reciben nuevos contenidos mensualmente.

Lo que aprenderás

Contenido relacionado

Lee más contenido relacionado o visita nuestra base de conocimientos.

pregunta a

Marcus-Aurelius

¿Necesitas ayuda para crear o ampliar tu empresa?

QUIÉN ES

¿Marcus-Aurelius?

ERA el emperador de Roma… Ahora, escala sitios web y negocios electrónicos mediante implacables estrategias SEO.

sigue

Marcus-Aurelius

Started SEO with Marcus-Aurelius digital

¿Quieres los mismos resultados?

Al enviar tu correo electrónico, aceptas mis Condiciones generales