A continuación, te muestro el proceso de 5 pasos y herramientas para conseguir imágenes para web, editar y subirlas a tu página web de manera correcta y estratégica, ayudándote a conseguir más clientes.
Video: Imágenes para tu página web ▶︎ Cómo obtener fotos gratis, editar y optimizar
Aquí el mini-curso “Cómo crear una página web para vender más”
Las imágenes de tu sitio web juegan un papel importante en el mercadeo y ventas de tu negocio.
No solo se trata de buscar una imagen en internet, encontrar la que te guste, copiarla y publicarla.
Tampoco es correcto el sacar una foto e inmediatamente subirla a la web.
Contenido:
- Imágenes para web – Errores que se pueden generar por el uso indebido
- El proceso de 5 pasos para seleccionar, editar y publicar imágenes para tu sitio web
- Paso #1 Seleccionar las imágenes para web
- Paso #2 Editar la imagen
- Paso #3 Comprimir la imagen
- Paso #4 Subir la imagen a tu web y optimizarla (SEO)
- Paso #5 Revisar, mejorar y promocionar
Imágenes para web – Errores que se pueden generar por el uso indebido
Problemas técnicos: como la carga lenta de la página web ocasionando frustración en el usuario y con esto afectando el posicionamiento en Google o SEO.
Problemas estratégicos: como desaprovechar el impacto que ocasiona una imagen de calidad para lograr la atención y el interés del cliente potencial y, porque no, creando algo de viralidad (o sea que más personas compartan y conozcan tu negocio).
Además, una imagen de baja calidad despierta una percepción negativa hacia el negocio bajando la confianza y afectando las ventas.
Problemas legales: el publicar una imagen sin conocer la fuente y sin la debida autorización del autor, puede generar una infracción de copyright (o derechos de autor) que pueden costar miles de dólares.
Recuerdo un caso de un amigo, que por más que le advertí, se le hizo fácil usar una imagen que encontró en Google y después tuvo que pagar una multa de $800 dólares a una agencia de imágenes.
¿Cómo evitar estos errores?
Siguiendo el proceso de 5 pasos para seleccionar, editar y publicar imágenes para tu sitio web.
El proceso de 5 pasos para seleccionar, editar y publicar imágenes para tu sitio web
Paso #1 Seleccionar las imágenes para web
Ya sabemos que no debes usar imágenes que desconoces su procedencia o sin el consentimiento escrito del autor.
Para conseguir imágenes para tu sitio web puedes:
Buscar y descargar de bancos de imágenes gratis. En la página de recursos te dejo una lista de algunos Bancos de Imágenes Gratis de Alta Resolución.
Ten en cuenta que para usar algunas de estas imágenes tendrás que mencionar la web o el autor de dicha fotografía si así lo indica la licencia. Te recomiendo leer los términos de uso.
7 bancos de imágenes para web gratis de alta resolución
- https://www.pexels.com/es-es/
- https://pixabay.com/
- https://unsplash.com/
- https://gratisography.com/
- https://www.canva.com/photos/free/
- https://morguefile.com/
- https://picjumbo.com/
- https://freestocks.org/
Comprar la licencia de uso de la imagen. Están las plataformas cuentan con imágenes de mejor calidad y venden la licencia para utilizarlas sin problemas legales.
7 Bancos de Imágenes para web (de pago) de Alta Resolución
- https://www.gettyimages.com/
- https://www.istockphoto.com/
- https://www.shutterstock.com/
- https://www.dreamstime.com/
- https://www.123rf.com/
- https://www.canva.com/photos/
- https://elements.envato.com/
La tercera y mejor opción: Usar tus propias imágenes.
Hoy en día tenemos acceso a cámaras que toman imágenes para web en formato digital y en buena resolución.
Así que solo debes preocuparte por capturar un momento oportuno, un buen ángulo, un buen enmarque y la iluminación apropiada.
Y así puedes tener muchas opciones de imágenes relevantes de tu negocio y que puedas utilizar sin problemas legales en tu sitio web.
Las imágenes de calidad dan confianza, muestran profesionalismo y es más probable que quienes las vean, las compartan.
Muy importante: una vez que conseguiste la imagen adecuada es necesario que la edites.
Paso #2 Editar la imagen
Editar las imágenes para web es una gran oportunidad de mejorar su calidad, garantizar consistencia en el diseño de nuestro sitio web y de la marca y además de hacerla más llamativa y relevante.
Al editar las imágenes de tu sitio web ten en cuenta la consistencia en:
- Tamaño
- Filtros / efectos
- Tipo de letra
Puedes recortar las imágenes para que el tamaño sea consistente.
Las imágenes para web de diferentes tamaños agregadas en una misma página crean incoherencia y hacen que el usuario perciba desorden y sienta ganas de cerrarla.
Lo mismo sucede con el filtro o los efectos que usemos en el editor.
Por ejemplo, si usas un filtro para agregar un efecto de color o una sombra interna, deberías utilizar ese mismo filtro en las otras imágenes.
También tienes la oportunidad de agregar textos descriptivos y hasta el logo o icono de tu negocio.
En este ejemplo utilizo canva.com como herramienta de edición.
Selecciono la plantilla de imagen para YouTube de 1280 píxeles de ancho x 720 píxeles de alto.
Me gusta este tamaño ya que puedo utilizar una misma imagen tanto para los vídeos en YouTube como para mi página web.
Además su proporción permite también utilizarse sin problemas en Facebook y Twitter cuando comparto el enlace en alguna de estas redes.
Después de editar la imagen, la descargo a mi computador en formato JPG. También se recomienda el formato PNG.
Editores de imágenes para web:
Tamaños recomendados de imágenes para cada red social*:
- Youtube: 1280px x 720px
- Facebook: 1200px x 628px
- Twitter: 1024px x 512px
- Instagram: 1080px x 1080px
- Pinterest: 735px x 1102px
* Fuente: https://www.canva.com/create-a-design
Una vez editada la imagen es necesario comprimirla antes de subirla a tu página web.
Paso #3 Comprimir la imagen
Es importante entender que el tamaño en pixeles no es lo mismo que el tamaño o peso en bytes.
Una imagen puede tener un tamaño adecuado para web, por ejemplo 1280 x 720 píxeles.
Pero pesa 1 Mega Byte – un millón de bytes – (que es la unidad de información de base utilizada en computación y en telecomunicaciones)
Cada byte que le agreguemos a una página web, demandará mayor procesamiento en la entrega de la información.
En otras palabras, entre más peso tenga la imagen mayor tiempo se demora en abrir en una página web.
Se recomienda que cada imagen que subamos no pese más de 100 kilo bytes y así evitar frustración en el visitante con páginas lentas.
Recuerda que frustración en el visitante es igual a menos ranking en Google.
Por esta razón es necesario que pases la imagen por un proceso de compresión que es bajar la cantidad de bytes en colores o definición para mantener el mismo tamaño pero con menos peso.
Yo utilizo Photoshop para este proceso.
Una vez editada la imagen me aseguro de guardarla para web, manipulo la resolución para que la imagen reduzca su peso sin perder mucho su calidad.
Hay varias herramientas gratuitas en línea que también utilizo cuando no tengo a mano Photoshop.
Por ejemplo: Optimizilla, en esta herramientas online puedes subir la imagen y manipular la resolución hasta encontrar el peso y resolución adecuados.
Compresor de imágenes para web:
- https://squoosh.app/
- http://imagecompressor.com/es/
- https://compressor.io/
- http://compressjpeg.com/es/
- https://tinypng.com/
Una vez comprimida la imagen ya puedes subirla a tu página web.
Paso #4 Subir la imagen a tu web y optimizarla (SEO)
Antes de subir la imagen a tu página web, previamente has investigado y determinado cuál es la palabra o frase clave con la cual vas a optimizar dicha página.
La idea es que cada una de las páginas dentro del sitio web esté enfocada en posicionar en Google una palabra o frase clave que son determinadas por las búsquedas que los usuarios hacen en la web.
Por ejemplo, tu negocio es de venta de grano de café y creas una entrada o artículo dentro de tu blog con la frase clave “grano de café” y el título “Cómo seleccionar el mejor grano de café”.
Lo anterior con la intención de aparecer dentro de los primeros resultados de Google cuando un cliente potencial haga la búsqueda con dicha frase clave.
Las imágenes también juegan un papel importante en este trabajo de Optimización Para Motores de Búsqueda o SEO (por sus siglas en Inglés “Search Engine Optimization”).
Recomendaciones para optimizar tus imágenes
- Que el nombre del archivo contenga la palabra clave.
- Una vez subas la imagen asegúrate que la palabra clave también aparezca en sus metadatos como:
- El título
- El subtítulo (o leyenda)
- Texto alterno
- Atributo “title”
Los metadatos permiten que la información se transmita de forma que pueda ser entendido por los motores de búsqueda, usuarios finales y usuarios con deficiencia visual.
Así cumples con tener una web accesible para todos los usuarios subiendo las posibilidades de que encuentren tu negocio más fácilmente.
En este ejemplo estoy usando el software WordPress para crear y administrar el sitio web y además uso el plugin (o software adicional) Yoast SEO.
Este plugin me da las indicaciones necesarias para optimizar la página de la mejor manera posible.
Recuerda que en el mini-curso “Cómo crear una página web para vender más” te enseño cómo crear el sitio web de tu negocio en pocos minutos, de manera profesional, segura y económica.
Una vez optimizadas las imágenes dentro de la página web, recuerda guardar los cambios y revisar tu trabajo.
Paso #5 Revisar, mejorar y promocionar
Una herramienta que recomiendo para revisar si las imágenes en la página no están interfiriendo en la velocidad de carga es “PageSpeed Insights”.
Es una herramienta gratuita de Google en donde escribes el enlace o URL de la página especifica que quieres revisar.
Aunque la mejor calificación es 100 sobre 100, procura estar por encima de los 80 ya que es difícil lograr los 100 por factores técnicos de servidores y códigos que sólo un programador o experto en codificación podría ayudarnos.
También recomiendo que uses la herramienta de Rank Math dentro del editor de WordPress para editar la información que quieras que aparezca en los resultados de Google (el Google snippet), tanto el título como la descripción y la imagen destacada.
Con esta misma herramienta puedes modificar la información que aparecerá en facebook y twitter cuando compartas el enlace de tu página.
De este modo llamará más la atención e interés de tus clientes potenciales.
Revisa la vista previa en Facebook con la herramienta Facebook Depurador aquí (se requiere login).
Revisa la vista previa en Twitter con la herramienta Twitter Card Validator aquí (se requiere login).
Puedes compartir estas mismas imágenes en otras redes sociales como Pinterest o Instagram invitando a conocer tu negocio, ver tu experiencia y confiabilidad para así comprarte a ti y no a la competencia.
Recuerda el proceso:
Paso #1 Seleccionar la imagen
Paso #2 Editar la imagen
Paso #3 Comprimir la imagen
Paso #4 Subir la imagen y optimizarla (SEO)
Paso #5 Revisar, mejorar y promocionar
Espero que te sea muy útil esta información y recuerda compartirla con alguien a quien también le pueda ayudar.
Si no lo has hecho, suscríbete a mi canal aquí y activa las notificaciones para que recibas la próxima información.
Recuerda solicitar acceso al mini-curso gratuito “Cómo crear una página web para vender más”.
Muchas gracias. Nos vemos en la próxima.
Luis R. Silva ©
36 Responses
Hola Luis y equipo.
Primero ante todo gracias por su tiempo y energía. Me ha servido mucho para aprender del tema y mejorar los aspetos de mi Web que estoy incorporando tus recomendaciones y la verdad me ayuda mucho porque:
* Aprendo a hacerlo yo mismo sin conocimiento previo del tea.
* Lo enseñas fácil y sencillo para aplicar.
* Ahorro mucho dinero.
* Construyo mi Web como lo deseo.
En esta lección surgió 2 preguntas al respeto:
No tengo claro de ¿Cómo se puede hacer en el caso de Twitter?
Además, para Instagram ¿Hay algo similar?
Saludos.
Hola Pedro gracias por tu mensaje. Por favor describe la situación a la que te refieres para poder encontrar la mejor manera de ayudarte y envíanos un email al mismo del que te estamos haciendo llegar las lecciones. Saludos.
Hola Luis soy una admiradora tuya , me gustan tus videos y me gustaría mucho que me ayudaras en mi página web que yo he creado te dejo mi email y hablamos gracias.
Hola Amparo, gracias por tu mensaje. Por falta de tiempo no doy más asesorías personalizadas pero si tienes dudas puedes consultar en nuestro Centro De Ayuda y si gustas que la revise en una de nuestras sesiones grupales en vivo te invito a participar, son por mi canal de YouTube. Saludos.
Gracias, gracias, mil gracias.
Éste es un tema que me rompe la cabeza desde hace ufff, porque la información esta Toda dispersa, y muy pocos la explican bien y al detalle.
Gracias por ordenarla, darnos tips, y enseñarnos.
Gracias a ti por tu comentario Nere, me alegra mucho que te haya ayudado con este video. Mucho éxito en tu negocio y si no lo sabes también tengo mi canal de YouTube para compartirte nuevos videos que también te pueden ayudar con tu estrategia online.
Muchas Gracias Luis por exelente Aporte a la comunidad de futuros emprendedores como yo!!!
Bendiciones!!!!!!!
Muchas gracias a ti también por tu mensaje Jaime, en verdad lo aprecio. Saludos y mucho éxito en tu proyecto!
Super 🙂 Gracias por tan excelente explicación y compartir para ayudar empaticamente a otros. Debo de corregir algunas cuestiones a las q haces alusión.
Un abrazo.
Hola Liannna, gracias por tu mensaje y qué bueno que este video te ayude a tener mejores resultados. Si en el proceso te encuentras con algunas preguntas, en nuestro Centro de Ayuda puedes encontrar respuestas las 24 horas y desde donde te encuentres. Saludos.
Hola, Mil y mil gracias por estos aportes, soy de colombia y todo este material me an ayudado demaciado solo GRACIAS.
Hola Mauricio, gracias por escribir y compartir tu experiencia. Recuerda que si ya creaste tu web con las lecciones del curso de Luis R. Silva. él mismo la puede revisar en las sesiones en vivo en su canal de YouTube
Luis, el grande deberías llamarte, porque eres genial en las orientaciones en el mundo digital, inspiras mucho a los emprendedores para hacer realidad el sueño de diseñar su propia pagina web desde cero sin conocimiento alguno de programación, soy uno de ellos, eres didáctico, comprensible, motivador y das toda la información necesaria, ósea superas cualquier perjuicio humano. hoy en día pocos poseen esa cualidad, que es, ayudar a otros. Te felicito y gracias por tu apoyo. Un abrazo Profe.
Hola Ignacio, muchas gracias por tu comentario. Soy asistente de Luis R. Silva. Sin duda mensajes como el tuyo son los que le motivan a continuar con su labor. Qué bueno que te ayuda el contenido y si no lo sabías Luis R. puede revisar tu web en las sesiones en vivo por su canal de YouTube, si ya estás inscrito al curso completo para crear tu web, te estamos haciendo llegar las notificaciones a tu email, si no. Suscríbete gratis aquí: https://luisrsilva.com/
Saludos y mucho éxito.
muchas gracias luis! cada vez que me frustro, y no se como hacerlo busco tus videos … gracias infinitas
Hola Angel, soy asistente de Luis R. Silva, muchas gracias por tu comentario y qué bueno que los videos te ayuden porque en verdad lo hace con mucho empeño y compromiso. Felicidades y éxito!
Hola Luis , te tengo una pregunta tengo unas imagenes en las que aparecen marcas de cervezas y quiero subirlas a mi pagina web, cuals es la forma correcta de subirlas para que no tenga problemas por propiedad intelectual y derechos de autor de las marcas, muchas gracias
Hola Camilo, soy asistente de Luis R. Silva. te sugiero que si son de algún banco de imágenes gratis, verifiques en la misma plataforma, en la descripción de las imágenes aparece si debes dar crédito o no, si es un banco de imágenes de pago ya está en el acuerdo de que tienes que pagar por el uso de imágenes sin problema, si son imágenes que tú tomaste pudieras contactar con la empresa (la marca) y verificar qué políticas tienen al respecto.
Espero haberte ayudado.
Saludos y éxito.
Me está ayudando mucho tu enseñanza con mi proyecto,
Mil gracias x tus cursos gratuitos.
Hola Leonardo, gracias por tu comentario, Luis R. en verdad lo aprecia. Saludos cordiales y mucho éxito.
Hola Luis, te felicito por tus tutoriales están muy bien diseñados para personas como yo que no sabemos nada de como crear paginas web en hora buena. Mi pregunta es obligatorio tener un aviso de privacidad en mi pagina web?, espero estés bien, saludos.
Hola Jesús, gracias por tu comentario, te sugiero suscribirte al curso completo para crear tu web pro, hay una lección completa que resolverá tus dudas al respecto y si sigues teniendo dudas puedes consultar el Centro de Ayuda.
Hola luis, yo quiero publicar en mi pagina articulos (fotos) de distintas marcas que es a lo que me dedico, venta de productos masivos de marcas en particular. Todas las competencias utilizan practicamente las mismas fotos publicadas en sus paginas web. Dichas fotos son las que crea la marca que vendemos en sus catalogos, y de esos catalogos son las fotos que subimos todos. la pregunta es la siguiente, como saber si esas fotos la puedo usar sin tener problemas de copyright.
Hola Hernan, puedes consultarlo directamente con los creadores. Es decir, puedes tener un contrato con ellos donde establezcan que puedes usar sus imágenes para fines comerciales de sus mismos productos.
¿Podrás hacer un tutorial de comprimir imágenes desde Photoshop?
Muchas gracias ❤️
Hola Fitz, lo tomaremos en cuenta, gracias por escribirnos.
Hola luis. estoy siguiendo tu cruso gratis para diseñar mi pagina web. pero tengo problemas para subir las imagenes de mis productos. quiero subir otras categorias de mis productos pero no puedo hacer que sevean reflejados. que debo hacer? posees algun tutorial que sea de subir productos y como crear categorias y subelementos que se pueden visualizar. o como usar las herramientas o que herramientas se deben usar. gracias.
Hola Gustabo, en la lección 2 del curso gratuito para crear tu web te digo cómo diseñar tu web incluyendo cómo subir las imágenes. Te inscribes gratis en el curso aquí: https://luisrsilva.com/
Espero haberte ayudado, de lo contrario escríbenos a [email protected] y descríbenos el error.
Hola Luis RSilva. me interesa por favor que me respondas esta pregunta mi marca es Ejecución Creativa. en la misma incluye publicidad, community manager ¿ Esta bien abarcar todo eso en una sola marca
Hola Paola, soy asistente de Luis R. Silva, con respecto a tu mensaje, tal vez es muy poca información para decirte un sí o no, como recomendación, recuerda que tu servicio o servicios son enfocados a tu cliente ideal, es decir, a satisfacer sus necesidades o solucionar sus problemas, si diseñas tu modelo de negocio con esos servicios para ayudar a tu cliente ideal no habría problema. Te dejo aquí el enlace hacia la guía gratuita para identificar a tu cliente ideal esperando te ayude a aclarar el camino. Guía: Cliente ideal
hola Luis, cordial saludo, mi nombre es Jasson, te quiero comentar eh intentado subir las imágenes que tengo en mi laptop y me sale un error Http,eh investigado que podría ser, y en un blog hablan de varios pasos según como vaya solucionando el problema ya lo revise cambiando de explorador, mejorando el nombre del archivo, y hay otra opción que dicen de desactivar plugins pero hasta ahí llego por que no se si lo deba hacer o no, me podrías colaborar con eso. no he podido seguir con las demás clases por que estoy atorado en este paso.
gracias por tu comprensión y tu pronta respuesta, ya que le estoy creando esta pagina a un cliente.
Hola Jasson, sí a veces al seguir ese paso e ir activando uno a uno hace que te des cuenta si hay un plugin que esté interfiriendo y lo desinstalas y buscas otro que también te pueda funcionar. Te puedes apoyar del área de soporte de la plataforma.
Saludos cordiales estimado Luis. Estoy siguiendo tus tutoriales, Soy de Ecuador tengo muchos problemas para construir mi página soy Contratista de interiores realizo trabajos de mantenimiento de casa Pintura Interior Decorativa y quería crear mi página sobre mi negocio, Quisiera pedirte si es posible hacer un tutoriales como hacer una página para servicio como el mio y seguro hay muchas personas esperando algo similar , te lo agradecería mucho ya que no encuentro ningún ejemplo o tutoriales me doy cuenta que eres un na Exelente persona y rogaria me auxilies esta es mi única salida. Quisiera ver el para seguirlo con método de cobro y contacto ágil. Atentamente Jorge Tenezaca
Hola Jorge, recuerda que al utilizar las plantillas puedes editarlas para adecuarlas a tu tipo de negocio. Te sugiero revisar la respuesta a una pregunta similar en el Centro de Ayuda, con seguridad encontrarás claridad.
Muy buena tu informacion Luis me han hecho la responsable de crear la página de Internet de mi trabajo pero solo sé un 20 %… Gracias.
Saludos desde Alemania.
Hola Teresa, te deseo mucho éxito, verás que en mi blog encontrarás lo que necesitas. https://luisrsilva.com/como-crear-una-pagina-web