Cómo agregar fácilmente imágenes a tu blog como un profesional

Has escrito la mejor publicación de tu blog.

En serio, este es un gran material que se está volviendo viral con montones de lectores hambrientos.

¡Vaya plata! Primero, necesitas llamar su atención.

Antes de que alguien lea su brillante artículo, primero deben detenerse y prestar atención.

Ahí es donde entran las imágenes..

Las imágenes, videos, capturas de pantalla, diagramas e ilustraciones son una excelente manera de evitar que su lector haga clic. Agregar imágenes a su blog ayuda a los lectores a comprender su información e ideas, y a recordar su publicación.

El truco consiste en crear y agregar esas imágenes de blog de forma rápida y eficaz.

En esta publicación, lo guiaremos a través de todos los pasos, herramientas y trucos para agregar imágenes a su blog sin tener que pasar horas haciéndolo.

POR QUÉ FUNCIONAN LAS IMÁGENES

“Nuestro cerebro es principalmente un procesador de imágenes, no un procesador de textos”. - Psicología Hoy

Estamos (literalmente) conectados para las imágenes. El neuroanatomista RS Fixot estimó que dos tercios de la actividad de nuestro cerebro se dedica a la actividad visual. Y tiene sentido...

Históricamente, usábamos nuestra vista para advertirnos contra ataques desagradables de depredadores o para detectar alimentos que podíamos cazar y matar o recoger y cosechar.

No es diferente en línea...

Sus lectores buscan inconscientemente contenido relevante o entretenido, o ambos. De hecho, los artículos que contienen imágenes relevantes tienen un 94 % más de visualizaciones totales que los artículos sin imágenes.

Los artículos que contienen imágenes relevantes tienen un 94 % más de vistas totales que los artículos sin imágenes . Haz clic para twittear .

Ahí es donde las imágenes ayudan. Cualquier cosa, desde una imagen simple hasta un gif creado a medida, hará que la experiencia de lectura sea más interesante y mantendrá a su lector desplazándose hacia abajo.

Nuestro cerebro puede procesar imágenes 60.000 veces más rápido que un texto

De hecho, el 65 % de los altos ejecutivos de marketing dice que las fotos, los videos, las ilustraciones y las infografías son fundamentales para comunicar la historia de su marca.

Entonces, si las imágenes son tan geniales, ¿cómo debería agregar imágenes a su blog para obtener más tráfico y mejores resultados?

Comencemos con los tamaños de imagen.

PÍXELES, FORMATO, TAMAÑO Y TODO ESTO

Tratar de comprender las diferentes opciones de tamaño de imagen puede ser bastante complicado. Las dos cosas básicas que debe saber son la orientación y el tamaño/compresión .

Orientación

Para la mayoría de los blogs, una orientación horizontal (más ancho que alto) funciona mejor. Las imágenes horizontales/horizontales ocupan menos espacio en la pantalla, lo que permite que su contenido llame la atención de sus lectores. Las imágenes horizontales también son perfectas para compartir tu blog en Facebook, Twitter y LinkedIn.

Pero las imágenes verticales o cuadradas funcionan mejor en Instagram y es más probable que se fijen en Pinterest. Nuevamente, la razón es simple: Instagram y Pinterest tienen que ver con las imágenes. Una imagen vertical/retrato ocupa más espacio en la pantalla, lo que las hace más llamativas.

La orientación que elija se reduce a sus usuarios y qué plataformas sociales utilizan.

Sprout Social mantiene una lista actualizada de los mejores tamaños de imagen para los distintos canales de redes sociales en esta publicación.

Es útil conocer los conceptos básicos de los tamaños de imagen para cada plataforma que utilice.

Tamaño/Compresión

El tamaño de la imagen puede significar dos cosas: el tamaño físico de la imagen (largo x ancho) y el tamaño del archivo (bytes).

La mayoría de las imágenes directamente de su cámara o de un sitio web de fotos de archivo tienen una resolución (tamaño de archivo) y un tamaño físico más altos de lo que necesitan para la web. El problema con los archivos de imágenes grandes es que ralentizan su sitio.

Una foto digital se compone de píxeles (px), pequeños mosaicos cuadrados de color. Generalmente hablamos de píxeles de dos maneras: número de píxeles y densidad de píxeles. El recuento de píxeles es la cantidad de píxeles que componen su foto. Entonces, una foto de 800 px por 600 px simplemente significa que tu foto tiene 800 píxeles de ancho y 600 píxeles de alto.

La imagen de la izquierda es 3456 × 5184px y 2.7Meg. La imagen de la derecha se redujo a 800 x 1200 y 193kb.

La densidad de píxeles, o ppp, es el número de píxeles por pulgada cuadrada. Cuantos más píxeles por pulgada cuadrada, mayor será la resolución de la imagen y más clara será.

Para imprimir fotografías, lo ideal es 300 ppp o más. Pero, para la web, un buen rango es de 72 a 150 ppp.

Los mejores tamaños para su sitio web

El objetivo de su sitio web es una buena resolución (no borrosa) y velocidad (no grande).

Tus imágenes solo deben ser tan grandes como el ancho del contenido de tu blog. Todos los sitios modernos están construidos con un diseño receptivo (cambia automáticamente el tamaño de la página para teléfonos inteligentes, computadoras portátiles, tabletas y pantallas de escritorio), configure su imagen para el ancho máximo.

Encuentre un equilibrio entre el tamaño y la calidad del archivo

Cuanto menor sea el tamaño del archivo de su imagen, más rápido se cargará para su lector. Pero reducir demasiado el tamaño puede crear una imagen borrosa. Su objetivo es encontrar el equilibrio entre el tamaño de archivo más bajo y una calidad aceptable.

Trate de mantener el tamaño de su imagen entre 150 KB y 300 KB. Eche un vistazo al ejemplo a continuación. La imagen original tenía 7,6 MB y 5000 px de ancho. La imagen de la izquierda se redimensionó a 860 px de ancho y se guardó como jpeg de alta calidad, lo que produjo un archivo de 250 KB.

Apenas se puede notar la diferencia entre esta imagen y la original cuando se ve en línea. Es perfecto para la web.

La imagen de la derecha se redimensionó para tener 860 px de ancho, pero se guardó como un jpeg de 30 KB de baja calidad. Claro, se cargará rápidamente, pero es confuso y se verá como un aficionado.

El tamaño de imagen óptimo es de 150-300 kb. Más pequeño y su imagen será demasiado borrosa.

Por supuesto, al agregar imágenes a su blog, no siempre es posible mantener sus imágenes por debajo de los 300 KB. En las pantallas de retina, una fotografía compleja probablemente se vea borrosa a 300 KB.

La idea clave para llevar a casa es mantener el tamaño de los archivos lo más pequeño posible, ¡especialmente si está utilizando muchas imágenes en su publicación! Los tiempos de carga de la página afectan sus clasificaciones de Google y es probable que los lectores se desconecten de una página que tarda años en cargarse.

Hay una serie de servicios gratuitos para reducir el tamaño de la imagen, como Pic Resize y Tiny PNG. O puede usar sitios de diseño gratuitos como Canva o PicMonkey para obtener el tamaño y la resolución correctos para cualquier sitio de redes sociales o para su sitio web (más información sobre el uso de esas herramientas a continuación).

Herramientas como Pic Resize facilitan la reducción de la resolución de su imagen sin sacrificar la calidad.

¿Utilizo JPG, GIF, PNG, SVG?

Si alguna vez te has confundido con todos los tipos de imágenes (jpeg, gif...) esto te ayudará.

Al agregar imágenes a tu blog, ¿cuál es el mejor formato?

• • JPG/JPEG : ofrece imágenes de gran calidad con un tamaño de archivo pequeño. Es la mejor opción para fotos a menos que necesiten ser transparentes, animadas o que tengan mucho texto.
• • GIF : perfecto para gráficos y animaciones pequeños, y pueden tener fondos transparentes.
• • PNG : ideal para gráficos detallados, imágenes con mucho texto o imágenes transparentes. Los archivos PNG tienden a ser más grandes que los archivos JPG.
• • SVG : este es un formato vectorial escalable, lo que significa que se mantiene nítido y claro en cualquier resolución. Tienden a ser grandes en términos de tamaño de archivo, pero si tiene un gráfico complicado que necesita cambiar de tamaño automáticamente y/o tiene efectos de rollover o animaciones, SVG es una opción perfecta.

En la mayoría de los casos, use jpeg para todas las imágenes a menos que desee un fondo transparente.

NOTA: No todos los sitios web están configurados para manejar automáticamente archivos SVG. WordPress tiene complementos que te ayudarán. Para los sitios que no son de WordPress, pruébalo y si tu archivo SVG no se muestra, consulta con tu desarrollador web.

Pon a prueba tus imágenes

¿No está seguro de cómo se mostrará su imagen en línea? La mayoría de los sistemas de administración de contenido (como WordPress) le permiten obtener una vista previa del borrador de la publicación del blog antes de publicarlo.

IMÁGENES DESTACADAS

Cada publicación de blog necesita una imagen destacada.

Su imagen destacada es lo primero que ve su lector y es la imagen que muestran sus canales de redes sociales. En este artículo, te explicamos qué hacer si tus canales sociales no muestran correctamente tu imagen.

Su imagen destacada podría ser una fotografía o, con un poco de trabajo adicional, superponer su título en la imagen. De cualquier manera, debe crear algo de curiosidad y hacer que el lector quiera seguir leyendo.

En WordPress, encontrará el enlace para elegir su imagen destacada en el lado derecho de su menú de WordPress.

HACIENDO TU PROPIA IMAGEN

Las imágenes de archivo son geniales, pero las originales son mejores, incluso si solo está agregando un giro a una imagen de archivo.

No tiene que ser un artista gráfico o poseer un software costoso para crear sus propias imágenes. Las herramientas gratuitas como Canva y Picmonkey tienen una amplia gama de plantillas, imágenes y fuentes y gráficos listos para usar. Con un poco de práctica, puede agregar su toque único a sus imágenes o crear imágenes de citas, memes, diagramas e infografías.

Aquí hay una imagen que hice en Canva en solo 5 minutos.

Con un poco de esfuerzo adicional, puede superponer su título en su imagen.

Una vez que se sienta cómodo con estas herramientas, puede ser creativo con sus resultados. Técnicas simples como cambiar el tamaño de las imágenes, agregar pantallas, recortar, incluso elegir fuentes más interesantes harán que su imagen se destaque.

Aprenda más técnicas simples para hacer que sus imágenes destaquen en esta publicación.

[No tienes que ser un diseñador gráfico para vestir tus imágenes para que se destaquen.]

EVITAR LA LEY

Has buscado en Internet, has encontrado la imagen perfecta y la has añadido a tu blog.

Avance rápido dos meses y recibe una carta de 'cese y desista' exigiendo dinero por daños y perjuicios.

¿QUÉ?

Las imágenes tienen propiedad, al igual que las obras de arte. Y no puedes usar algunas imágenes sin el permiso del propietario. En esta publicación, explicamos cómo funciona creative commons con imágenes.

La buena noticia es que hay más sitios que nunca para proporcionarle imágenes brillantes para las que puede comprar derechos de usuario o usar acreditando al artista.

Crédito al artista

Si está utilizando una imagen bajo una licencia Creative Commons, es una buena práctica dar crédito al fotógrafo y la fuente. La mayoría de los sitios web de fotografías de archivo le proporcionarán el enlace cuando descargue la imagen.

Con sitios como Unsplash, facilitan copiar el crédito del artista para que puedas pegarlo en la parte inferior de tu publicación.

En BlogWorks utilizamos varios sitios para nuestras imágenes. Tenemos una cuenta con Adobe Stock en la que confiamos para los blogs de nuestros clientes, además, a menudo usamos Pixabay, Unsplash, Refe y Magdeleine.

Adobe proporciona una fuente de imágenes de alta calidad, junto con otros paquetes de software creativo. Si está buscando una nueva forma fácil de encontrar o crear imágenes, puede consultar sus productos aquí.

Si aún no puede encontrar lo que desea, vaya a Librestock, donde se agregan imágenes de más de 40 sitios para que pueda buscar. En esta publicación, enumeramos 7 sitios para encontrar excelentes imágenes.

Incluso puede usar Google para agregar imágenes a su blog; solo asegúrese de elegir 'Etiquetado para reutilizar' en Herramientas.

Si usa Google para buscar imágenes, siempre busque 'Etiquetado para reutilizar'

Consejo rápido sobre la búsqueda de esa imagen "perfecta": encontrar una imagen un poco mejor que la que encontraste en los primeros 5 minutos no hará que tu publicación se vuelva viral. Limítese a 5 minutos para encontrar una imagen lo suficientemente buena; siempre puede cambiarla más tarde si encuentra una mejor.

USA IMÁGENES DE PERSONAS REALES

Las imágenes de personas son una de las formas de contenido más atractivas en Internet.

Las caras son únicas y los humanos tienen una preferencia visual programada para mirar las caras. Las imágenes de rostros y personas captarán la atención del lector.

Pero su imagen debe relacionarse con el contenido o ayudar a explicar un concepto o punto: los estudios han encontrado que los lectores pasan por alto las imágenes de personas cuando son imágenes genéricas y decorativas.

Cuando se trata de redes sociales, las caras nos atraen. Las fotos con caras atraen más comentarios y me gusta.

Si estoy agregando imágenes a nuestro blog, trato de evitar imágenes de archivo cursis, como la imagen de la izquierda y busco algo más original como la imagen de la derecha.

La fotografía de archivo puede ser sencilla, poco original y algo aburrida (izquierda) o más interesante y original (derecha)

AGREGAR PANTALLAS Y DIAGRAMAS

Supongamos que está tratando de explicar cómo usar un motor de búsqueda en línea o dónde ir en su sitio para encontrar su último libro, o incluso cómo asegurarse de que su correo electrónico de suscripción no haya ingresado en la carpeta de "promoción" de esa persona en Gmail.

Un poco difícil de explicar con palabras, ¿verdad?

Ahí es donde las capturas de pantalla son muy útiles. En un par de minutos, ha capturado la imagen, ha agregado un par de flechas y ahora su imagen vale más que mil palabras, ¡además, hace que más personas vayan al lugar correcto!

Una herramienta como Snagit es una inversión invaluable. Por solo $ 50, tiene un caballo de batalla listo para usar para capturas de pantalla, videos e incluso gifs (todas las capturas de pantalla utilizadas en esta publicación se crearon con Snagit).

Aquí hay un video que creé en Snagit de usar Snagit para editar una captura de pantalla (¡ahora eso es meta!).

Los gráficos y diagramas personalizados son otra excelente manera de explicar conceptos complejos o simplemente agregar algo de diversión a su publicación. OmniGraffle y Lucidchart ofrecen herramientas de diagramas de flujo que puede usar para crear diagramas divertidos. Piktochart tiene una versión gratuita para crear infografías y gráficos basados ​​en datos.

¿Necesita un gráfico para ayudar a ilustrar alguna información? Puede tomarlos directamente desde Excel, Hojas de cálculo de Google o Word. Simplemente copie su gráfico y péguelo en su editor de texto, o tome una captura de pantalla.

¡Y no tengas miedo de tomar un lápiz o un bolígrafo! Esboza tu idea y toma una foto. No importa si no eres un artista: ¡tus lectores disfrutarán al ver que eres como ellos!

AÑADIR VIDEO Y GIF'S

A veces, el texto por sí solo no es suficiente. Ahí es donde pueden entrar el video y las animaciones.

Giphy y Tenor son buenos recursos para GIF animados. Sitepoint tiene una excelente lista de recursos de lugares para encontrar imágenes, videos y otros medios de creative commons.

Me han preguntado muchas veces cómo agrego videos a mi blog. Ciertamente no soy un experto, pero cuando se trata de algo que huele a técnico, me recuerdo a mí mismo 'hecho es mejor que perfecto' y mantengo las cosas simples. De principio a fin, un video simple no debería llevarme más de 15 minutos.

Aquí hay una ilustración de los pasos que sigo.

Necesita alojar su video en algún lugar. Hemos usado Vimeo durante muchos años y nos encanta el precio y lo rápido y sencillo que es usarlo. También puedes usar YouTube o Wistia.

Los pasos para agregar videos a su blog son bastante simples una vez que los haya practicado varias veces, pero varían según su sitio web y el lugar donde aloja su video.

Aquí se explica cómo insertar un video de YouTube en WordPress:

1. Este proceso se había vuelto súper simple. Comience por ubicar el video que desea en YouTube.
2. Luego, copie la URL de ese video (se verá como https://www.youtube.com/watch?v=JKrPz6JHwYw)
3. Inicie sesión en su sitio web de WordPress, abra la publicación del blog para editar, ubique el cursor donde desea el video, pegue la URL.

Esta herramienta gratuita te permitirá personalizar el aspecto de tu video de YouTube y hacer cosas como desactivar los molestos videos "relacionados".

Aquí se explica cómo insertar un video de Vimeo en WordPress:

1. • Para obtener el código de inserción de su video, vaya a su página en Vimeo y haga clic en el botón 'Compartir'.
2. • Haga clic en el enlace '+Mostrar opciones' y copie el código de inserción.
3. • Inicie sesión en su sitio web de WordPress, abra la publicación del blog para editarla y haga clic en la pestaña 'Texto' en su editor de texto.
4. • Ubica tu cursor donde quieras el video y pega el código de inserción.

Con herramientas como Vimeo, es fácil insertar videos en tu blog como un profesional.

Nota: debe incluir texto en su publicación con su video si desea que su publicación sea recogida por motores de búsqueda como Google. Puedes ver cómo se hace en el vlog de viaje de Gone with the Wynn. Con cada publicación de blog, tienen mucho texto, imágenes y videos para mantenerlo a usted, el lector interesado, y con fines de SEO.

UTILIZAR UN TEMA CONSISTENTE

Cuando elija imágenes o fuentes, es una buena idea ser coherente con el tema de su sitio y su blog.

Podría ser tan simple como usar una fuente consistente (soy fanático de Helvetica Neue, Marker Felt, Yellowtail y Bebas Neue), un esquema de color o un estilo de icono.

La aplicación de servicio al cliente, Help Scout, hace un gran trabajo al usar elementos de diseño consistentes en su blog que son livianos, modernos y extravagantes.

ELEGIR EL NOMBRE DE ARCHIVO CORRECTO

Image SEO comienza con el nombre del archivo. Cuando usa imágenes en publicaciones de blog, desea que Google sepa de qué se trata su imagen sin siquiera mirarla.

Antes de cargar su nueva imagen, eche un vistazo al nombre de la imagen. Su imagen debe tener un nombre que se relacione con la imagen y/o el contenido de su artículo. También debe incluir sus palabras clave siempre que sea posible. Elegir un nombre rico en palabras clave para su imagen facilitará que los motores de búsqueda clasifiquen su página.

Por ejemplo, si está escribiendo un artículo sobre cómo elegir el mejor juguete masticable para cachorros, nombre su imagen "mejor-juguete-masticable-para-cachorros.jpg". Si su imagen muestra una puesta de sol en una playa en Koh Samui, Tailandia, asígnele el nombre 'thailand-koh-samui-beach-sunset.jpg'.

Usa guiones entre palabras, en lugar de espacios, guiones bajos o junta todas las palabras.

Esta recomendación viene directamente de Google. No estamos seguros de la razón exacta de esto, ya que Google protege más de cerca cómo funciona el algoritmo de su motor de búsqueda de lo que un mago protege sus trucos. ¡Pero el webmaster de Google dice que los guiones entre palabras ayudan a Google a encontrar sus imágenes!

TEXTO ALTERNATIVO

Cuando carga su imagen, video u otro medio, tiene la opción de incluir texto ALT. Deberías hacer esto siempre que puedas.

El texto ALT informa a los motores de búsqueda sobre su imagen, lo que ayuda a su clasificación. Además, los lectores de pantalla leen el texto ALT para que ayudes a que tu contenido sea más accesible.

El texto alternativo en sus imágenes explica de qué se trata su imagen

Su texto ALT debería ayudar a explicar su imagen o el punto que está tratando de ilustrar. Al igual que elegir un nombre de archivo, su texto ALT debe estar relacionado con el contenido de su artículo o sus palabras clave.

SUBTÍTULOS Y TÍTULOS

Los pies de foto suelen aparecer debajo de la imagen. Muchos lectores escanean artículos y las leyendas de sus imágenes pueden llamar su atención y hacer que sientan curiosidad por su contenido.

En BlogWorks tratamos de escribir subtítulos que se suman al contenido escrito. La idea es que si el lector solo lee los subtítulos, obtendrá una buena idea de lo que trata el artículo.

BarkPost, los inventores de la suscripción mensual de golosinas para perros Bark Box, atormentan a los amantes de los perros (como yo) con imágenes tontas y divertidas de perritos combinadas con titulares al estilo de los tabloides de Hollywood, como estos:

• • 5 señales de que los mocos en los ojos de su perro son causados ​​por algo peligroso
• • 18 perros que no aprueban esta tortura de agua que llamas "hora del baño"
• • Inscribí a mi perro en una caja de atención dental y esto es lo que sucedió

SU LISTA DE VERIFICACIÓN FINAL

Cualquier imagen que agregues a tu blog debería mejorar la experiencia de tus lectores. Y anímelos a leer el artículo, lo que significa que permanecerán en su sitio por más tiempo.

Como verificación final, hágase estas dos preguntas:

• ¿Esta imagen mantendrá al lector en la página por más tiempo?
• ¿Esta imagen ayuda al lector a comprender mejor mi mensaje?

El esfuerzo adicional que pone en encontrar y agregar imágenes a su blog puede generar grandes recompensas. En lugar de pasarse por alto, su publicación podría compartirse con miles de lectores y cobrar vida propia.

Después de todo, nuestro objetivo es que nuestro blog sea leído, compartido y amado. ¿Derecha?

¿Te gustó este artículo? Aquí hay 3 más sobre imágenes, videos y hacer que tu blog se vuelva viral:

La guía definitiva para agregar videos de YouTube a tu blog.
Imágenes gratis para tu blog: 7 fuentes impresionantes
4 formas de hacer que las imágenes de tu blog resalten

Notas al pie:

1. 1. En un artículo publicado en el American Journal of Ophthalmology, el neuroanatomista RS Fixot estimó que el 50 % de nuestro tejido neural está directa o indirectamente relacionado con la visión y que dos tercios de la actividad eléctrica de nuestro cerebro se utiliza para el procesamiento visual.
2. 2. En un estudio realizado por eMarketer, las fotos representaron el 75 % del contenido publicado en las páginas de Facebook en todo el mundo y generaron una tasa de interacción del 87 % de los fanáticos (en comparación con menos del 10 % de cualquier otro tipo de publicación).
3. 3. Un estudio del Instituto de Tecnología de Georgia y Yahoo Labs analizó 1,1 millones de publicaciones en Instagram y descubrió que las imágenes con rostros humanos tienen un 38 % más de probabilidades de recibir Me gusta que las fotos sin rostros. También tienen un 32 por ciento más de probabilidades de atraer comentarios.

Foto de LinkedIn Sales Navigator en Unsplash