¿Cuál es el peso ideal de una imagen para web?

Mejor formato de imagen para la web 2022

Y la gente se da cuenta de lo que tarda una página en cargarse. De hecho, según datos de Pingdom, el 24% de los usuarios abandonará un sitio que tarde cuatro segundos en cargarse, y el 38% de los usuarios abandonará la página si tarda cinco segundos.

En última instancia, para mantener una buena posición en el ranking de páginas, su empresa debe centrarse en ofrecer una experiencia de sitio web rápida y optimizada en todos los dispositivos. Para asegurarse de que su sitio web no se vea afectado por el tráfico, este artículo explica todo lo que necesita saber sobre el tamaño de la página y cómo reducirlo.

En 2020, la página web de escritorio promedio pesa 2080 KB, mientras que la página web móvil promedio pesa 1885 KB – esto es una gran diferencia con respecto a 2017, cuando una página web de escritorio promedio pesaba 1532 KB y la página web móvil promedio pesaba 1354 KB.

Por supuesto, es importante tener en cuenta que los datos anteriores muestran el tamaño medio de una página web típica, lo que significa que muchos sitios web probablemente estén muy por debajo de este tamaño, mientras que otros más pesados podrían sesgar los datos en la otra dirección.

En última instancia, depende del sitio. Mientras que algunos sitios pueden incorporar fuentes personalizadas, vídeos a pantalla completa y otros elementos de diseño que “pesan” la página, otros sitios probablemente adopten un enfoque minimalista y se ciñan a un texto simple y un fondo blanco.

Imágenes para la web

Es cierto lo que dicen: la primera impresión es la que cuenta. La cabecera de su sitio web es lo primero que ven los usuarios cuando llegan a él. Múltiples estudios de seguimiento ocular han descubierto que los humanos escanean las pantallas de los ordenadores y los móviles empezando por la parte superior y haciendo un patrón de zig-zag hacia abajo de la pantalla. La función principal de la cabecera del sitio web es la navegación. Pero también desempeña un papel importante a la hora de comunicar el estilo y el aspecto de su marca. En esta guía, exploraremos el mundo de las cabeceras de sitios web y abordaremos la cuestión de cuál debería ser el tamaño ideal de la cabecera de un sitio web.

Empiece por crear una imagen, un gráfico u otros conceptos visuales que muestren la esencia de su producto o servicio. El gráfico debería mostrar la marca de su negocio y tener también un logotipo. Un encabezado artístico tendrá una elección adecuada de estilo y color que coincida con su sitio web y que inspire a los lectores.

La cabecera de Atlassian es grande y atrevida. Quizá sea un guiño a su homónimo, Atlas, el dios griego de los titanes que “llevaba los cielos sobre sus hombros”. La marca azul de Atlassian aparece en los textos con hipervínculos, los botones de llamada a la acción y las imágenes.

El formato de imagen de carga más rápida para la web

Más del 90% de los usuarios de Internet también acceden a la web a través de un dispositivo móvil. Esto significa que es extremadamente importante asegurarse de que las imágenes de tu sitio web y de las redes sociales están optimizadas para los usuarios móviles. Para optimizar sus imágenes correctamente, siga nuestro tutorial de pasos rápidos que aparece a continuación.

Para mantener un aspecto uniforme a lo largo de su línea de productos y en las páginas de sus colecciones, debe mantener la misma relación de aspecto de anchura y altura de todas sus imágenes. Por ejemplo, puede hacerlas todas cuadradas como vemos a continuación.

La imagen principal es la primera imagen de un producto que aparecerá en toda la tienda, en la página de inicio, en la página del carrito, en la página de pago y en varias páginas de colección. Mantenga también todas las miniaturas del mismo tamaño y forma para transmitir un aspecto pulido de la tienda.

Ten en cuenta que muchos de tus clientes navegarán también desde el móvil y que las imágenes cuadradas son más fáciles de reposicionar para pantallas más pequeñas. Además, las imágenes cuadradas y verticales ocupan más espacio en la pantalla del móvil, lo que les permite ver aún más su foto.

Tamaño de imagen mejor optimizado para la web

Conseguir la imagen adecuada, en el tamaño y formato correctos, en el lugar adecuado de su página web es crucial para un gran diseño web y una sólida experiencia del usuario final. Hemos elaborado la Guía definitiva sobre el tamaño de las imágenes para la web, basada en las preguntas más frecuentes.

Existen diferentes recomendaciones sobre las dimensiones que se deben utilizar para las imágenes del sitio web, así que antes de entrar en un debate sobre los píxeles deberíamos llegar a un acuerdo sobre las proporciones. Identificar la forma de la imagen para cada sección de su sitio (qué proporciones deben estar en juego) es un primer paso crítico.

Su imagen principal tendrá probablemente una proporción de 16:9 si pretende utilizar toda la altura del navegador. En esta proporción, el ancho de su imagen probablemente oscilará entre 1500px (mínimo absoluto) y 2560px (máximo recomendado). Recomendamos utilizar 1920px de ancho, ya que es el ancho de navegador más común en Norteamérica.

Si tienes pensado poner más de una imagen en tu página web, el tamaño de cada archivo de imagen se sumará al tamaño total de la página.    Los archivos de gran tamaño, y los archivos múltiples, afectarán al rendimiento del sitio y a los tiempos de carga de la página.

    Comments are closed

    Esta web utiliza cookies propias para su correcto funcionamiento. Contiene enlaces a sitios web de terceros con políticas de privacidad ajenas que podrás aceptar o no cuando accedas a ellos. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Más información
    Privacidad