Cómo elegir y optimizar imágenes para tu web

Bienvenid@ a un nuevo post de Coach2Coach.

Cómo elegir y optimizar imágenes para tu web

Cuando en diseño web nos referimos al contenido, no estamos hablando solamente de los textos. El contenido web es todo aquello que un usuario puede ver en una página e identificar. El contenido web, por tanto, incluye imágenes, vídeo e infografías (al fin y al cabo, imágenes).

Como ya sabrás, el contenido web tiene una gran importancia a la hora de posicionar tu página o blog. El contenido consta, principalmente, de texto e imagen. Para Google es fácil leer el texto en HTML, no así las imágenes. Los robots de Google no son persona, son programas diseñados para leer sólo texto.

Por eso es importante optimizar las imágenes de cara al SEO. Pero vamos primero a ver cómo elegir las imágenes para tu web y después de cómo optimizarlas.

Cómo elegir las imágenes para tu web

Elegir las imágenes para una web no es tan fácil. En mi opinión, es algo muy subjetivo y personal. Pero, por otra parte, un diseñador web tiene la ventaja de contar con un montón de conocimientos al respecto que le convierten en una mejor opción a la hora de elegir las imágenes para una web.

No tengas prisa en elegir las imágenes.
Para un diseñador, al empezar a diseñar una web en WordPress, la elección de imágenes pasa a segundo plano y es, prácticamente, lo último que hace. La apariencia de la web en términos de layout (o sea, la elección del tema a configurar) seguramente ya está elegido. Sin embargo, para quien no sabe diseño web, elegir las imágenes para su web, es uno de los primeros pasos.

Lo anterior es un error. Si elegimos las imágenes antes de crear una buena estructura web, antes de pensar en la usabilidad web para crear una buena experiencia para el usuario, antes de realizar la redacción de textos o al menos los borradores, etc., es como elegir los muebles de nuestra nueva casa antes de tener los planos o saber las medidas.

Cuando tengas encaminada tu web (en los sentidos que acabo de indicar), entonces quizá ya puedas empezar a buscar imágenes para tu web.

Decide entre imágenes gratuitas y de pago.
Que las imágenes sean de pago no es sinónimo de

mejor calidad

mejor estética

exclusividad
Sí es cierto que, por lo general, es así. Si te decides por las gratuitas, ten en cuenta que muchas tienen derechos y no puedes usar cualquier imagen que encuentres en Google por el morro.

Para elegir imágenes de pago para tu web, mis bancos de imágenes favoritos son:

Photolia

iStock
Para elegir imágenes para tu web de forma gratuita, hay muchas opciones. Desde buscar en Google hasta bancos de imágenes gratis. Si las buscas en Google, recuerda que has de mencionar en la web de dónde has sacado la imagen, o elegir en la búsqueda la opción “Etiquetadas para reutilización”. Bancos de imágenes gratis que yo uso:

Freepik. Vectores, fotos, iconos…

Pixabay. Fotos, vectores, ilustraciones…

Unsplash. Tiene una pega. No puedes buscar imágenes por palabras clave.

Elige imágenes acordes con el contenido del sitio
Hay que darle la importancia que se merece a los criterios de búsqueda. Por ejemplo, por mucho que, a mí, una imagen de una mariposa me sugiera la idea “ir de flor en flor”, no he de pensar en mis propios marcos mentales, sino en los de mi audiencia objetivo.

Por otro lado, tratemos de realizar una búsqueda que sea lo menos genérica posible (“volar”) si no queremos obtener imágenes que también lo sean. Esto puede resultar en la elección de imágenes que no aportan el énfasis necesario.

Y, en tercer lugar, busquemos imágenes para la web que vayan algo más allá de lo que la propia imagen expresa, desde el punto de vista emocional o contextual. La intención con esto es crear un vínculo con el usuario. En el caso del ejemplo de “ir de flor en flor”, la imagen puede ir desde una persona rodeada de otras que se lo están pasando muy bien, hasta una abeja polinizando, etc.

Mantén la coherencia en las imágenes a lo largo de la web
Quizá si hablamos de un blog que no cuenta con una web propiamente dicha, esta “regla” puede ser algo más laxa. Pero si estamos hablando de elegir imágenes para una web, hacerlo de forma coherente y homogénea se convierte en algo serio.

Cuando hablo de mantener la coherencia me refiero al tipo de imágenes (fotos reales, vectores, iconos…), al tamaño y a la ubicación.

Las imágenes de la página de inicio, contacto y quiénes somos, pueden saltarse esta regla. Pero el resto debe ser homogéneo. Si mi página consta de 6 páginas, además de las citadas, todas las imágenes deberían ser del mismo tipo, tener el mismo tamaño y estar colocadas en el mismo lugar o mismos lugares. De lo que se trata es de dar una impresión de consistencia, no de un barullo desordenado e incluso caótico.

elegir imágenes web
Elegir imágenes para tu web de forma adecuada requiere análisis y creatividad.

Cómo optimizar las imágenes de tu web

También forma parte de la elección, pero aquí además hablaremos de la optimización de imágenes de cara al SEO.

Google se fija en todo. Hay miles de factores dentro de tu web que suman o restan puntos de cara a tu posicionamiento web. Varios de ellos tienen que ver con las imágenes.

En primer lugar, el peso de las imágenes afecta al posicionamiento ya que pueden hacer tu web más lenta. En segundo lugar, la calidad de la imagen en una web puede ser determinante en la usabilidad de la misma. Es decir, si el usuario al entrar ve caos, imágenes de baja calidad o feas estéticamente, etc., el usuario abandonará y casi con toda seguridad no volverá. Esos abandonos son tenidos en cuenta por Google y perjudican tu posicionamiento. En tercer lugar, y como decía al principio, los robots de los motores de búsqueda no saben leer más que texto.

Elige imágenes de calidad y de poco peso
¿Cómo juzgar la calidad de una imagen? Bueno, es una pregunta algo difícil de contestar. Lo primero, se tiene que ver a la perfección. Creo que todo el mundo puede distinguir entre una imagen demasiado pixelada y otra nítida.

Respecto a la calidad y tamaño

Si eliges imágenes de poco tamaño, tienes dos inconvenientes: uno, quedan horribles. Y dos, si quieres hacerlas más grandes, pierden calidad, se ven pixeladas y feas.

Pero ojo, elegir imágenes grandísimas de tamaño no garantiza buen visionado en nuestra web. Al hacerlas o mostrarlas más pequeñas, también pierden calidad.

El mejor “truco” para elegir imágenes de calidad para nuestra web es saber el ancho de las páginas y escoger imágenes iguales a esa medida o un poco mayores. Si utilizas WordPress, como espero que sea tu caso, los temas difieren en el ancho e incluso en muchos puedes elegirlo, con lo que no voy a adentrarme más en eso. Cuando averigües el ancho de tus páginas, intenta que las imágenes sean de un ancho similar, si no exacto.

[Por ejemplo, yo cambié recientemente el tema de WordPress de esta web. Ahora las páginas son más anchas que antes, con lo que las imágenes destacadas de los posts, ahora quedan demasiado pequeñas. Puedes comprobarlo en casi todos los posts previos a noviembre 2015].

Elige imágenes de calidad
Elige imágenes de calidad, coherentes, de poco peso y de la medida adecuada.

Respecto al peso de las imágenes

Si tu web no cuenta con un blog, cosa que desaconsejo, entonces no importa mucho que tus imágenes sean grandes y pesadas. Al fin y al cabo, es un número limitado. Pueden tener hasta 1 mega, si no tienes demasiadas páginas estáticas y si no pones más de dos o tres imágenes en cada una.

Sin embargo, este no suele ser el caso. Lo normal es que la web tenga un blog, y que éste sea actualizado con nuevas entradas de forma regular y frecuente. Dentro de esos posts es bueno que pongas tres o cuatro imágenes, además de la imagen destacada (como si fuese la portada del artículo).

En este caso, ya son palabras mayores. Mi blog, en este momento, cuenta con más de 120 posts, y solamente publico uno a la semana de media. Imagina si pongo una imagen destacada y otra dentro del post, de 1 mega cada una. Se me hunde la web.

Para estos casos, recomiendo que las imágenes no tengan más de 50kbs. Las jpeg suelen ser menos pesadas que las png. Tenlo en cuenta. Si de vez en cuando no puedes convertirlas en un tamaño alrededor de 50, ok, sube hasta 100, pero no te acostumbres.

Una vez has elegido imágenes para tu web que son coherentes etc., si alguna no tiene las medidas idóneas, puedes usar una herramienta gratuita de image resizing. Yo utilizo Webresizer.com el 90% del tiempo. También a veces no me da para lo que necesito y lo intento con Resizeimage.net.

Estas herramientas te permiten subir una imagen y cambiar su tamaño y peso, cortarlas etc. Son muy fáciles de usar.

Recuerda que la calidad de las imágenes repercute en la usabilidad y el peso repercute en la velocidad de carga. Ambas cosas repercuten a su vez en el posicionamiento. Por ello, a la hora de elegir imágenes para tu web, ten en cuenta también el SEO.

Respecto a la optimización SEO (además de quitarles peso)

Cuando ya tengas la imagen exacta que quieres subir a tu post o página, tienes que optimizarla para SEO. Es decir, tienes que hacer todo lo posible para que Google no se la pase de largo, añadir texto.

Cómo optimizar imagenes para web
Cómo optimizar imagenes para web

En tu ordenador o Mac, renombra el archivo, es decir, no dejes el nombre original de la imagen. Ponle un nombre relacionado con la palabra clave del post. Por ejemplo, si la imagen origina se llamaba “abeja amarilla con flores alrededor”, renombrala con algo que incluya la palabra clave de tu post: “xxxxx de flor en flor”.

Al subir la imagen a tu web, rellena los campos Título, Texto Alternativo y Descripción. Recuerda, para optimizar la imagen para SEO, ha de contener la palabra clave.

A continuación, pincha en la imagen para editarla y añade el “alt text”. No repitas la misma descripción, alt text etc., para diferentes imágenes.

Si quieres optimizar incluso más la imagen, puedes añadir también la leyenda, siempre que incluya diferentes variantes de la palabra clave.

Utiliza entre 2 y 5 imágenes en cada post, recordando siempre no usar la misma palabra clave exacta, sino distintas variaciones.
Créditos imágenes: Diseñada por Freepik | Diseñada por Vecteezy

La entrada Cómo elegir y optimizar imágenes para tu web es un artículo original de Diseño Web Coaching.

Fuente: este post proviene de este blog, donde puedes consultar el contenido original.
¿Vulnera este post tus derechos? Pincha aquí.
Creado:
¿Qué te ha parecido esta idea?

Esta idea proviene de:

Y estas son sus últimas ideas publicadas:

Actualizar Temas de WordPress Tal vez ya te has enfrentado alguna vez a ello, actualizar temas de WordPress, cada vez que recibes el aviso de que hay una actualización disponible. Actualizar tu tema ...

Qué son los child themes o temas hijo de WordPress Al principio de usar WordPress, recuerdo que el tema de los child themes o temas hijo me volvía loca. No había mucha información sobre ello y la que ...

Recomendamos

Relacionado

Seo y plugins etiqueta alt optimizar imagenes pasa seo ...

Última modificación: 06-05-2022 1.- La importancia de las imágenes en el posicionamiento SEO En este artículo, se explica todo sobre los atributos alt y los atributos title de una imagen y por qué debería optimizarlas. La optimización de imágenes en tu wordpress te ayudarán a posicionar mejor. Mira este video de una web real y como posiciona únicamente por la etiqueta alt de la imagen: 2.- SEO: e ...

Emprender Negocio On-line bancos de imágenes ...

¿Por qué insertar imágenes en tu Web? Como ya habrás escuchado muchas veces, una imagen vale más que mil palabras. Siempre llama más la atención una página Web con imágenes que vayan acompañando los textos. Si quieres que tu Web y Blog, luzcan profesionales y que atraigan la atención de tus lectores (potenciales clientes), te tendrás que trabajar la parte visual de tus páginas y artículos. Cuando ...

Artículos de diseño web

En el artículo de hoy os hablaremos de la importancia que tiene optimizar imágenes en WordPress para acelerar y mejorar los tiempos de carga, logrando así una experiencia de usuario más positiva. Sabemos la importancia que tienen las imágenes en las páginas webs, y es que gracias a estas se puede crear un contenido más visual y atractivo. Compaginar el texto con imágenes permite que el usuario no ...

rendimiento

Optimizar las imágenes, en términos de rendimiento web consiste en hacer que, sin perder su calidad, ocupen menos espacio en KB para que su descarga desde el servidor al navegador del cliente sea lo más rápida posible. Analizaremos varias formas de optimización de imágenes. En Diarios de la nube vamos a ir ayudándote a resolver distintos puntos importante para mejorar el rendimiento de tu sitio we ...

SEO

Las imágenes que utilizas en tu Blog, en tu web, no son sólo un reclamo o un añadido decorativo para tus contenido. Pueden servir a los buscadores web para comprender mejor la información que proporcionas, estructurar con mayor precisión tus contenidos dentro de su índice y potenciar tu posicionamiento sobre una determinada temática. Hay sitios web que basan la mayor parte de su contenido en imáge ...

informática redes sociales seo ...

Hacer SEO o trabajar el posicionamiento web es una tarea que muchos profesionales no le dan la importancia que se merecen. Y la verdad es una pena. Hoy en día casi todas las parejas buscan sus servicios a través de Google. Yo siempre digo que es importantísimo que San Google te conozca y que te quiere… Existen muchas reglas para hacer una buena estrategia de SEO y me gustaría tocar esa part ...

Herramientas Uncategorized WPO ...

Optimiza las imágenes para que tu blog vaya como un rayo Un enemigo de la velocidad de tu blog son las imágenes, una web que no optimiza las imágenes está perdiendo posicionamiento y visitantes. Además de ocupar más espacio que el texto, las fotografías dependiendo del formato o la compresión pueden ser más o menos complicadas de cargar, siendo un factor que ralentiza mucho a un sitio web por ello ...

general blogs herramientas ...

Comprime las imágenes de tu sitio web y aumenta la velocidad de carga. En notas anteriores, hemos hablado sobre la gran importancia que tiene el manejo de las imágenes en la comunicación de las ideas, a través de nuestro sitio web o blog. El material gráfico es de gran importancia hoy en día y que nos ayuda a crear mensaje más eficientes. Sin embargo el tener muchas imágenes en nuestro sitio web ...

web 2.0 Servicios Web blogs ...

Comprime las imágenes de tu sitio web y aumenta la velocidad de carga. En notas anteriores, hemos hablado sobre la gran importancia que tiene el manejo de las imágenes en la comunicación de las ideas, a través de nuestro sitio web o blog. El material gráfico es de gran importancia hoy en día y que nos ayuda a crear mensaje más eficientes. Sin embargo el tener muchas imágenes en nuestro sitio web ...

Diseño Web (cat) contenidos para web como crear buenos contenidos

Bienvenid@ a un nuevo post de Coach2Coach. Cómo escribir buen contenido web (2) En el post anterior te explicaba cómo escribir un buen contenido para tu web, de forma general. Te explicaba algo sobre el contenido angular y las bases para poder llevarlo a cabo. En este post profundizamos sobre ello. También has de tener en cuenta que, un buen contenido, por muy angular que sea, no sirve de nada si ...