Reducir el tamaño de la página para un proceso de carga más rápido

Acelera el tiempo de carga de la página.

Última actualización: 22 de agosto de 2024

Si bien Squarespace tiene una serie de medidas para garantizar tiempos de carga rápidos, el contenido agregado al sitio influye en esto. Por ejemplo, las páginas con muchas imágenes pueden cargarse lento, especialmente en dispositivos móviles y con conexiones más lentas.

Siempre que sea posible, mantén cada página del sitio en 5 MB o menos.

Utiliza esta guía para verificar el tamaño de las páginas individuales y que tu página esté dentro de este intervalo ideal. Esto ayuda a disminuir el tiempo de carga en tu sitio. Para conocer los problemas comunes relacionados con el tiempo de carga del sitio, consulta Mi sitio se está cargando lento.

Verificar la velocidad de carga de la página

Para tener una idea del tiempo de carga de tu sitio, usa herramientas como Pingdom, GTMetrix, PageSpeed Insights de Google o la herramienta de inspección integrada de tu navegador. Por ejemplo, puedes seguir los siguientes pasos con Google Chrome:

  1. Abre Herramientas de desarrollo.
  2. Haz clic en la pestaña Red.
  3. Actualiza la página para mostrar el tiempo de carga.

Ten en cuenta que estas herramientas son ideales para sitios programados desde cero, en lugar de sitios creados con un CMS. Dado que los sitios de Squarespace usan un CMS, algunas herramientas pueden indicar falsos negativos. Si ves un error o velocidades más lentas que el promedio mientras usas estas herramientas, esto no significa necesariamente que haya un problema con tu sitio.

Comprobar el tamaño de la página

Si una página tarda más en cargarse de lo previsto, verifica el tamaño.

Una forma de hacerlo es con Chrome Developer Tools:

  1. Abre Google Chrome. Si iniciaste sesión en Squarespace, cierra sesión o abre una ventana privada del navegador.
  2. Abre una nueva pestaña.
  3. Abre Chrome Developer Tools. Atajos:
  • Mac: + Opción + J
  • Windows - Ctrl + Mayús + J
  1. En la misma pestaña, abre la página que quieras controlar. Las Herramientas del desarrollador deberían permanecer abiertas.
  2. En Herramientas de desarrollo, haz clic en la pestaña Red. Si la información no aparece en esta pestaña, actualiza la página.
  3. Revisa el tamaño total de la página en la parte inferior de la pantalla. En el siguiente ejemplo, se muestra como “1.0MB transferido”.
  4. Haz clic en la columna Tamaño para ordenar el contenido de la página por tamaño. Esto muestra las partes de la página que ocupan más memoria y que posiblemente están reduciendo la velocidad, especialmente en dispositivos móviles. El contenido más grande probablemente serán las imágenes. Haz clic en el nombre del archivo para ver la imagen.

El tamaño de la página debe ser de 5 MB o menos. El tamaño más seguro para las conexiones celulares es de 1 MB. Si la página es más grande, consulta nuestros consejos a continuación para reducir el tamaño.

Chrome_Dev.png

Reducir el tamaño de la página

Dado que el contenido en la mayoría de las páginas se carga simultáneamente, las páginas con mucho contenido tardan más en cargarse. Si una página tiene más de 5 MB, eliminar contenido o reducir el tamaño de las imágenes puede ayudar a que se cargue más rápido.

Para reducir el contenido de una página:

  • Verifica que no haya más de 60 bloques por página. Para eliminar un bloque de una página, consulta Eliminar bloques.
  • Si la página tiene más de un tema, divide en varias páginas. Esto también puede facilitar a los visitantes encontrar la información que necesitan y ayudar a mejorar el SEO de tu sitio.
  • Reduce el número de videos. El contenido insertado, como los videos de YouTube o Vimeo, puede aumentar los tiempos de carga, especialmente en dispositivos móviles. En su lugar, distribuye los videos en varias páginas usando enlaces para ayudar a los visitantes a navegar de una página a otra.
  • Si la página de aterrizaje de tu blog se está cargando lento, usa extractos de blog para agregar anticipos para cada entrada, en lugar de mostrar el texto completo. También puedes habilitar páginas aceleradas para móviles para que las entradas posteriores se carguen más rápido en dispositivos móviles.
  • Si tu sitio utiliza páginas de índice apiladas (versión 7.0), reduce el número de secciones, especialmente las secciones con galerías.

Ayudar a que las imágenes se carguen rápido

Las imágenes grandes y las páginas con muchas imágenes pueden tardar bastante en cargarse. Al seguir algunas de las mejores prácticas, puedes acelerar la velocidad de las páginas con muchas imágenes.

Reducir el tamaño de la imagen

Mantén las imágenes por debajo de 500 KB con un ancho de 1500 px a 2500 px. Para subir un archivo de imagen más pequeño, cambia el tamaño con cualquier software de edición de imágenes de terceros antes de subirlo. Un compresor de imágenes, como JPEGmini, puede ayudar a reducir el tamaño del archivo sin sacrificar la calidad. Para obtener más consejos sobre imágenes, consulta Cambiar el formato de imágenes para que se visualicen en la web.

Consejo

optimiza los tamaños de imágenes conectando la extensión TinyIMG. TinyIMG reemplaza las imágenes de tamaño excesivo por versiones comprimidas, asegurando una carga más rápida de las páginas sin perder la calidad de la imagen. Si bien trabajamos con servicios de terceros para garantizar que Squarespace Extensions funcionen correctamente, las extensiones quedan fuera de nuestro alcance de atención al cliente. Podemos ayudarte a conectar o desconectar tus extensiones. Si tienes cualquier otra pregunta, ponte en contacto directamente con el proveedor de las extensiones.

No sobrecargar las galerías

Limita las galerías a 50 imágenes cada una. Piensa en las secciones, bloques y páginas de galería como vitrinas, no como inventario total.

Usa imágenes en .jpg

Siempre que sea posible, utiliza el tipo de archivo de imagen .jpg. Limita los archivos .gifs o animaciones.

Habilitar carga de Ajax (versión 7.0)

Si tu sitio está en la versión 7.0 y la plantilla lo admite, habilita la carga de Ajax. Con Ajax, la carga de páginas es más rápida y fluida. Es ideal para páginas con mucho contenido, como entradas de blog y páginas de galería.

Footer Image
  • Recibe ayuda de nuestra comunidad

  • Recibe la ayuda de nuestra comunidad para personalizaciones avanzadas.

  • Contrata a un Squarespace Expert

  • Destácate en línea con la ayuda de un diseñador o desarrollador con experiencia.

Reducir el tamaño de la página para un proceso de carga más rápido