Imágenes óptimas para web

Cómo escoger y preparar imágenes óptimas para una web

 

Imágenes óptimas para web

Antes que nada: Invierte en las imágenes para tu web

Compra imágenes de pago en Internet y contrata a un fotógrafo profesional.
Por muy bueno que sea el diseño de la web, si las imágenes son deficientes el aspecto de la web será malo.

 

Lee esto si sólo estás seleccionando las imágenes para tu web para entregarlas a tu webmaster.

 

1. Tamaño de las imágenes seleccionadas para la web

Es conveniente que selecciones, descargues y trabajes (o entregues a tu webmaster) imágenes en alta resolución, y cuyo tamaño sea de un mínimo de 2000 pixels de ancho. Así estarás seguro de que las imágenes no quedarán borrosas incluso si se colocan ocupando todo el ancho de la pantalla.

Los bancos de imágenes las facilitan a tamaños más que suficientes, pero si estás buscando en internet puedes ver el tamaño de las imágenes así:

  1. Busca las imágenes por palabras clave en Google.
  2. Clicka en “Herramientas” en el menú debajo del buscador.
  3. Clicka en “Más herramientas”
  4. Clicka en “Mostrar tamaños”. Para cada imagen, te indicará el tamaño.

También puedes ver el tamaño de la imagen que has descargado clickando sobre ella con el botón derecho del ratón. Selecciona “Propiedades” y después la pestaña “Detalles”: En “Imagen” te indica el tamaño (en pixels) y la resolución.

 

¿Qué es un “pixel”?

El nombre viene del inglés “picture element”, y es como se miden las imágenes en las pantallas de cualquier tipo.

Para hacerse una idea de su tamaño, la pantalla de un ordenador portátil normal medirá unos 1300 pixels de ancho, y las pantallas de ordenador de sobremesa más grandes medirán unos 1900 pixels de ancho. Puedes aplicarlo con esta lógica:

  • Si tu imagen va a ocupar toda la pantalla a lo ancho, necesitarás una imagen que mida al menos 1900 px.
  • Si ocupa media pantalla, 900 ó 1000 px.
  • Si es un cuarto de pantalla, bastará con unos 500 px.

Selecciona imágenes con una cierta holgura, y así evitarás quedarte corto.

 

2. Nombre de la imagen para web

Para Google, la infomación que facilita la web es clave, y si subes imágenes con nombres como “Fg56Tp000065.jpg” no estás dando ninguna información a Google. Es conveniente que pongas a las imágenes que subes a la web (o que entregas a tu webmaster) nombres que Google pueda comprender. Por ejemplo: “abogados-ruiz-servicios.jpg”.

Para facilitar el trabajo, puedes sistematizar el nombre. Por ejemplo: Nombre de la empresa – Página, sección o detalle – Número de la imagen, si hay varias

Así, una imagen puede llamarse “Ruiz-abogados-Derecho-laboral-01.jpg” y estás complementando la información para Google de lo que hay en esta página.

 

Lee esto si, además de lo anterior, estás creando o modificanto la web por tu cuenta.

 

1. Optimizar el tamaño de las imágenes que se suben a la web

Unas imágenes demasiado grandes perjudican enormemente tu web, ya que cargará con más lentitud y desesperará a los visitantes y provocará que Google no la posicione (Google le tiene mucha manía a las webs lentas).

Por otra parte, la pantalla del ordenador, del móvil y de la tablet es bastante “ciega”, y le basta con imágenes de muy baja resolución para que se vean bien (¡Importante! No confundas esto con el tamaño de las imágenes que seleccionas: Asegúrate trabajando siempre con imágenes de resolución más que holgada).

Para cargar en tu web imágenes al tamaño óptimo tienes dos opciones, aunque lo correcto es aplicarlas las dos:

  1. Trabajar la imagen con Photoshop, y gurdarla al final con la función “Guardar para web”. Normalmente bastará con “Calidad de compresión: Mediana” y un tamaño inferior a 1900 pixels de ancho (1900 pixels es lo que mediría una pantalla de ordenador de las más grandes, de sobremesa).
  2. Utilizar un plugin en tu web (WordPress) que adapte automáticamente la imagen al tamaño web, una vez la has subido. La mayoría de plugins hacen este trabajo sólo parcialmente, esperando que pases a la versión de pago para una optimización completa. Contacta con nosotros para un plugin gratuito que hace este trabajo de forma completa.

 

2. Formatos de imagen que admite una web

Para imágenes visibles en la web puedes utilizar estos formatos:

  • JPG: Es el más común y más recomendable porque la imagen pesa menos.
  • GIF: Normalmente se utiliza para imágenes sin fondo, o para imágenes animadas.
  • PNG: Normalmente se utiliza para imágenes sin fondo.
  • PDF, Word, Power Point, Excel, comprimidos…: Este tipo de archivos no se pueden “ver” en una web, pero sí se pueden cargar en el alojamiento. Si creas un enlace al archivo, el visitante de la web podrá abrirlo y/o descargarlo.

 

En esta página encontrarás herramientas de ayuda para optimizar la búsqueda, selección y carga de tus imágenes.

 

 

Cómo escoger imágenes óptimas para una web