UNIDAD 1

El Marketing Digital. Introducción al Diseño Digital.

Formatos

 El Marketing Digital. La publicidad en Redes Sociales.

Características generales.

 Introducción al Diseño de una imagen digital.

Modo de Color para una imagen digital. Vectores y Bitmaps.

 Los 3 formatos básicos de área de diseño adaptables a Redes

Sociales. Diseño vertical, cuadrado y horizontal.

 Tipo de formatos de imágenes necesarios para lograr una

imagen efectiva. JPG, PNG, GIF y WEBP.

Infografías, Glosario y Links relacionados

Introducción al Diseño Gráfico Publicitario
Características Generales. MKT digital, conceptos
Si bien este curso va a estar orientado al diseño gráfico en redes Sociales,
debemos tener siempre en cuenta el estudio de diversas acciones previas que
nos llevarán posteriormente al diseño publicitario para anunciar un producto.

Esto nos conecta directamente al Marketing digital que es el conjunto de

actividades que una empresa (o persona) ejecuta en línea con el objetivo
de atraer nuevos negocios, crear relaciones y desarrollar una identidad de
marca.

Dentro de los planes de Marketing Digital, la publicidad en redes sociales o

Social Ads es uno de los recursos más poderosos para conseguir nuestros
resultados de negocio. Hoy en día, esta solución publicitaria se adapta a todo
tipo de empresas, de presupuestos y de necesidades. Las empresas cada vez
tienen más presencia en este canal, gracias a sus buenos resultados y a que
las audiencias potenciales se encuentran allí. El Diseño Gráfico Publicitario
en el Marketing Digital es una pata fundamental para dar a conocer un
producto o un servicio de manera precisa y eficiente.
Marketing Digital
Internet y las redes sociales se han convertido en el portal más utilizado en la
actualidad para dar a conocer un producto o servicio y para viralizar contenido.
La página web, el perfil de Instagram o la Fanpage de Facebook son excelentes
ventanas y canales comerciales. Para difundir mensajes, contenidos digitales,
catálogos y demás contenido que esté potenciado a través del diseño gráfico
publicitario para que cumpla su objetivo.

Es decir, en las acciones de marketing digital convergen la mayoría del diseño

gráfico publicitario. La publicidad en medios digitales está en auge y permite
mucha innovación. Cada vez más se ha ido convirtiendo en la apuesta segura
de las nuevas y viejas empresas.

Tipos de publicidad online

Internet es un escenario donde existen mil y una posibilidades en las que hacerse
visible. La publicidad online lo aprovecha y consigue estar presente de muchas
maneras: imagen, texto, vídeo, infografías… y en muchos lugares: buscadores,
blogs, webs o redes sociales.

Los tipos de publicidad en Internet que escojamos para llevar a cabo nuestra
campaña dependerán de factores como el target, el presupuesto y los KPI
(Indicador del desempeño o rendimiento de una campaña) A continuación te
enumeramos los tipos que se utilizan en cualquier agencia de publicidad online.

Email marketing

Se trata de uno de los tipos de publicidad online más utilizamos. Sus campañas
se apoyan en base de datos por lo que la segmentación da lugar a campañas
muy concretas y efectivas. Se trata de un método que permite enviar mensajes
personalizados a cada uno de tus clientes a las horas y los días en los que las
que las probabilidades de lectura son más altas.

Igualmente el bombardeo de newsletters y todo tipo de informaciones al correo

ha producido que la marca amabilice su mensaje de venta y haga más atractivo
el contenido. Una vez que una persona abre un mail, entra en juego el diseño y
el mensaje para captar rápidamente la atención y conseguir una conversión
(acercar más al cliente a la compra).

Banner

El banner se remonta a los inicios de la publicidad online apareciendo por

primera vez en 1994. Ha acompañado a la historia de Internet durante estos años
y a día de hoy continúa siendo uno de los métodos más utilizados.

Dentro de los tipos de publicidad online, se trata de una publicidad insertada

en un espacio destinado para este fin dentro de una web. El objetivo del mismo
es llevar al usuario a una Landing Page. Este tipo de publicidad ha ido
evolucionando y sobre todo adaptándose al usuario, quien ya lo percibe como
algo intrínseco a la web y al que en muchas ocasiones hace caso omiso. A pesar
de ello las marcas conocen el potencial del banner y continúan con este formato
siempre adaptándolo al tipo de consumo. Comenzó con un estilo estático con
una imagen y ahora es cada vez más interactiva: animación, sonido y vídeo.

Una evolución del banner es el pop-up. Cuando los usuarios se empezaban a

sentir incómodos con la publicidad y sabían cómo evitar el banner, surgió el pop-
up: ventanas emergentes al entrar en una web. Este tipo de publicidad debe
realizarse con medida ya que resulta muy agresiva y molesta para el usuario.
Puede estar presente tanto cuando abrimos como cuando cerramos la web,
incluso cuando hacemos scroll (desplazamiento por la página).

A día de hoy se utiliza como aviso, por ejemplo, cuando insertamos un pop-up
para inscribirse en un blog mientras lo están leyendo.

Publicidad en móviles

Con esta tendencia, las marcas con la publicidad también quieren estar presente
en este formato, no solo en Internet sino también con SMS Marketing y en las
apps.
El teléfono es inmediato, por lo que el envío de este tipo de mensajes tiene una
tasa de apertura muy alta. Las marcas no solo deben trasladar los anuncios que
tienen en web a móvil, deben adaptarlo por completo para que el diseño sea
exclusivo de móvil y estar al día en uno de los tipos de publicidad online al alza.

Publicidad en redes sociales

Las redes sociales han perfeccionado de forma exponencial tanto las formas
de introducir la publicidad online como de medirla. Las marcas, gracias a las
redes, consiguen crear una publicidad más cercana. De este modo el usuario
quiere participar, cosa que en otros tipos de publicidad es muy difícil de
conseguir.

La publicidad está muy personalizada y concretamente este dentro de los tipos

de publicidad online mucho más. Por ejemplo en el muro de Facebook aparecen
anuncios que tienen que ver con los gustos del usuario por lo que este no la
considera tan agresiva. Además, las redes han abierto un tipo de publicidad que
ha marcado un antes y un después: la colaboración con influencers. Esto tiene
que ver también con el auge de reseñas, recomendaciones y foros que se crean
entorno a servicios y productos.

Publicidad en vídeo

El vídeo es el formato a la cabeza de las tendencias en Marketing. Los usuarios

buscan la publicidad, no como venta, sino como entretenimiento, por ello el vídeo
está muy presente en las campañas. Lo podemos comprobar ya que cada vez
vemos banners, publicidad en redes o en emails que optan por este formato.

El vídeo permite llegar de forma más directa y cercana, además se sale de la

publicidad convencional estática.

SEO y SEM

Ambas son estrategias de posicionamiento en buscadores. Tanto el orgánico

como el de pago son tipos de publicidad online ya que el objetivo de ambos es
la visibilidad y la conversión. Por lo que entrarían dentro de los tipos de
publicidad online.

Si queremos que nuestra campaña llegue a la primera página de búsqueda de

Google deberemos tanto invertir dinero como tiempo en la selección
herramientas para posicionamiento orgánico (SEO).

Por su parte el SEM es un método de pago por el cual podemos estar presentes
en forma de anuncio (pago) en los primeros puestos de los buscadores.

¿Qué es la publicidad en Redes Sociales?

La publicidad en redes sociales consiste en mostrar anuncios pagados por
marcas a los usuarios de una red social, ya sea entremezclados en el
contenido o en forma de display (pantalla).
Por regla general, estos anuncios siguen un modelo de Coste por Clic o CPC,
esto es, que el anunciante solo paga si un usuario hace clic en el anuncio.

Como es lógico, existen tipos diferentes en función de la red donde se ubiquen.

A día de hoy, estas son las principales plataformas con las que contamos:

 Facebook Ads. La red más popular a nivel mundial no se queda

atrás a la hora de ofrecer servicios a los anunciantes. Facebook
cuenta con una amplísima interfaz publicitaria, en la que los
anunciantes disponen de todo tipo de opciones para promocionar
sus contenidos o presentar sus productos y servicios.

 Instagram Ads. Instagram y Facebook comparten una misma

solución publicitaria, por lo que es muy sencillo organizar campañas
orquestadas. En esta red lo que mejor funciona son las campañas
con un elevado componente visual (Lo que nos interesa ;)

Dentro de esta estructura, dos de las decisiones más importantes que debemos
tomar son: la forma de facturación y la segmentación de usuarios a los que
se entregarán nuestros anuncios.
Contenido Orgánico vs. Contenido Promocional

A medida que las redes sociales siguen evolucionando, llegan nuevas

plataformas y las ya existentes hacen mejoras a ciertas funcionalidades, es
necesario entender que también cambia el tipo de atención que la audiencia
dedica a las publicaciones.

Lo que no cambia es el hecho de que cada vez es más el tráfico de empresas

publicando en redes sociales. Por tal razón, se vuelve esencial que se tome en
consideración el aspecto conversacional de estas plataformas, si se quiere
destacar en ellas.

Por el hecho de que las personas utilizan las redes sociales en esencia para
conversar, lo último que quieren encontrarse cada vez que le dan “me gusta” a
una página de negocios es con contenido “orgánico” con un tono promocional.

Tengan en cuenta que para hacer publicidad ya existen herramientas en las

diferentes plataformas sociales. Es bien importante entender la diferencia entre
el contenido orgánico y promocional antes de establecer la estrategia de
comunicación en las redes sociales.

Contenido orgánico
El contenido orgánico es aquel que se publica en las redes sociales y no
involucra coste alguno. Es el tipo de contenido que se busca que ayude a
mantener la presencia de la marca en las redes, a establecer relaciones con
clientes potenciales, y ofrecerle información valiosa a la audiencia. Por tal razón,
cuando se implementa considerando estos aspectos, el resultado es
precisamente la conversación. Si se logra conversación, la empresa está más
cerca de desarrollar y mantener una relación con su público.

El contenido orgánico, como sugiere la palabra, debe ser lo más natural posible.
En esta área muchas empresas cometen el error de establecer como prioridad
hablarle a su audiencia en las publicaciones orgánicas como si estuvieran
redactando un anuncio en una revista impresa. Es decir, hacen protagonista de
ese contenido al producto, el busca vender o anunciar directamente el producto
y predomina un tono promocional.

Contenido publicitario/promocional
Si, en cambio, se quiere vender un producto o servicio, así como promoverlo, se
puede optar por contenido publicitario. Existen opciones sumamente efectivas
para además aumentar nuestro alcance en las redes sociales como Facebook,
Instagram, a través de la vía publicitaria.

Como el alcance orgánico sigue en descenso en las redes sociales, es necesario

que la estrategia de contenido contemple publicidad, especialmente para
aumentar el alcance. La importancia de dedicar tiempo al desarrollo de contenido
orgánico apropiado para la audiencia es crucial, ya que cada vez competimos
con mayor cantidad de páginas de negocios y usuarios de las plataformas.

Presupuesto y Puja
El presupuesto es el total que vas a gastar en un anuncio. La puja, lo
que estás dispuesto a pagar por una acción determinada.

A la hora de definir una puja para tus anuncios en redes sociales, tienes la
posibilidad de hacerlo de forma automática (fijas fechas y presupuesto para
que el administrador distribuya tu dinero de forma uniforme a lo largo del
tiempo) o definiendo una puja máxima de forma manual. En este caso
tienes tres opciones:
  Puja por CPC (coste por clic). Solo pagarías cuando un usuario hace
clic en el anuncio. Recomendadas para campañas de tráfico a un sitio
web.

 Puja por CPM (coste por mil impresiones). Pagarías X cantidad cada
1.000 personas alcanzadas. Recomendable, por ejemplo, para campañas
de branding que configuraríamos con el objetivo “alcance”.

 Puja por CPA (coste por acción). Disponible en campañas con el

objetivo de incrementar seguidores o descargar apps. Definirías la
cantidad máxima que estás dispuesto a pagar por cada nuevo seguidor o
por cada descarga.

En cuanto a la segmentación, podrás hacerlo con mayor o menor exhaustividad

según la red social, pero siempre teniendo en cuenta que aquí está la clave para
obtener resultados reales.

Dependiendo de cómo segmentes tus anuncios, conseguirás que los usuarios

actúen o no y, sobre todo, que quieran seguir conociéndote hasta convertirse
en clientes.

Con una campaña de publicidad en redes sociales pagarás para que tu anuncio
se muestre solo a personas que realmente encajan con tu marca: si
optimizas, ahorras. Y esto puedes definirlo en función de sus características
demográficas, su dispositivo, sus intereses, qué otros perfiles siguen o, en el
caso de Facebook, también las acciones que hayan realizado en tu web.

Alcance e impresión
Alcance: El número de personas que ven tu contenido. El alcance mide qué
tanto se expande tu contenido a través de varias plataformas de redes sociales.
Puedes pensar en el alcance como el número de personas únicas que ven tu
contenido. En un mundo perfecto, cada uno de tus seguidores vería cada uno de
los contenidos que publicas.
Desafortunadamente, ese no es el mundo en el que vivimos y no todos tus fans
verán cada publicación que hagas. Así que el alcance es la medida de tu
audiencia efectiva.

Impresión: El número de veces que tu contenido se muestra. Una impresión

significa que el contenido apareció en la sección de noticias de alguien. Un
espectador no tiene que interactuar con la publicación para que esto cuente
como una impresión. Lo engañoso de las impresiones es que una persona puede
tener varias impresiones del mismo contenido.

Entre los social ads, probablemente Facebook sea el canal que cuenta con la
herramienta más desarrollada para que las empresas puedan gestionar la
publicidad de diferentes fanpages: Business Manager. Además, es
imprescindible en los tiempos que corren, donde su famoso algoritmo ya nos
obliga a promocionar contenido para tener visibilidad.

“Business Manager de Facebook está muy por encima de otras

plataformas de publicidad. Desde aquí, también se crean y gestionan
las campañas de Instagram.”
Los beneficios de Facebook Ads.

Ventajas que realmente te pueden proporcionar las campañas publicitarias en

redes sociales, aquí tienes una lista muy clara.

 Es más rentable que otros canales digitales como Google Adwords. Y

si lo comparamos con la publicidad en medios offline, ya ni te cuento.
 Puedes llegar a una amplia audiencia potencial e incrementar
rápidamente tu visibilidad.
 Las opciones de segmentación son incontables, así que llegar a tu
target es más sencillo.
 Puedes controlar el presupuesto y adaptarlo a medida que avanza la
campaña.
 Puedes volver a impactar a usuarios que ya han estado en tu web. Lo
que se conoce como campañas de remarketing.
 Dispones de diferentes objetivos y formatos para crear anuncios a
medida.
 Obtienes reportes muy detallados con los resultados de tus
campañas.

Los usuarios pasan gran cantidad de tiempo en las Redes Sociales

Tipo de anuncios
Podríamos clasificar los anuncios en redes sociales según diferentes
parámetros: objetivos, red social y formatos dentro de cada una.

Según los objetivos de las campañas

No en todas las plataformas encontramos los mismos objetivos y no todos se

denominan igual, pero son muy similares y con nombres intuitivos para que
puedas identificarlos. Podemos dividirlos en tres grandes grupos:

 Reconocimiento

Notoriedad de marca. Alcance.

 Prestigio/Consideración

Tráfico al sitio web. Interacción. Reproducciones de vídeo.

 Conversión

Conversiones, visitas en el negocio.

Anuncio en Instagram a través de Facebook Ads.

Cómo hacer publicidad en Redes Sociales (RRSS)

Antes de nada, plantea una estrategia sólida

Tu estrategia de social ads debe ir de la mano del resto del plan de RRSS que
hayas definido para tu marca. Esto te ayudará a definir tiempos, tipo de
contenido a promocionar y target al que apuntar.

Igualmente, es importante que en este punto definas tu presupuesto y

objetivos a conseguir.

Cuida absolutamente todos los detalles

Si las plataformas de publicidad te ofrecen tantas opciones, es por algo. Presta

atención a todas ellas y párate a pensar lo que te puede aportar cada una de
ellas: desde la puja manual o automática hasta la frecuencia de impresión,
las ubicaciones, las fechas o las horas de inicio y fin.

No te olvides de la campaña cuando llegue la fecha final

Una vez ha finalizado la campaña, toca revisar los resultados. Comprueba si se

han cumplido los KPI (Indicador de recursos y desempeño) de la estrategia
publicitaria.

Fórmate y evoluciona continuamente

Las RRSS cambian segundo tras segundo y las plataformas publicitarias de las
mismas, también. Por eso, es importante que te mantengas al día, que
investigues todas las opciones que se te ofrecen y que no dejes de poner en
práctica cada nuevo aprendizaje.

https://www.facebook.com/business/ads
El Diseño Gráfico Publicitario
El diseño gráfico publicitario es la herramienta donde converge la máxima
creatividad de dos mundos: el diseño y la publicidad.

Esta rama del diseño se encarga de crear contenido visual con intención. Es
decir, además de diseñar, inserta en sus artes signos y símbolos que transmiten
ideas, mensajes, emociones y hasta sensaciones.

El diseño publicitario es un canal de comunicación con nuestra audiencia. Si lo

usamos de forma correcta, nos permitirá conectar y generar
conversación, empatía, deseo de compra o cualquier otro propósito que
tengamos como marca. La clave del éxito, entonces, está en planificar una
estrategia de comunicación y vigilar que el diseño publicitario cumpla con dichos
planteamientos y transmita, por supuesto, el mensaje correcto.

El diseño publicitario es el medio y el fin de la comunicación visual de una

marca.

El Diseño Gráfico y la Publicidad Digital

Son muchos los recursos donde podemos hacer uso del diseño gráfico
publicitario, tales como vallas, empaques, catálogos, folletos, logotipos, etc.
Sin embargo, en la actualidad, el diseño gráfico publicitario está teniendo un
gran auge en el mundo del Marketing Digital. Está siendo utilizado como una
herramienta para captar la atención del público objetivo a través de blogs,
webs, aplicaciones y, por supuesto, Redes Sociales.

Puede que a diario nos tropecemos con una publicidad en Internet, un sorteo en
Instagram o una sencilla encuesta en Twitter y no notemos nada relevante en
ello. Sin embargo, detrás de cada color, tipografía, signo o símbolo que
conforman una publicación están insertados los mensajes claves que recibimos
del diseño publicitario.
Debemos subrayar que se trata de una herramienta visual, que crea un efecto
cognitivo para que nuestro público objetivo recuerde, conozca, perciba y reciba
un determinado mensaje y que, a su vez, genere una acción.

Aunque no solo se usa para la comunicación externa de una marca o empresa.

Este tipo de diseño también puede relacionarse con otras áreas de una empresa
para incentivar una campaña interna, mejorar la comunicación empresarial,
fidelizar a los empleados y mejorar el sentido de pertenencia. Para que el
diseño publicitario sea efectivo debe existir un trabajo previo de análisis de la
comunicación visual. Los colores y la forma no son tan importantes como el
mensaje que estos deben transmitir. Un análisis efectivo es sinónimo de un
diseño exitoso.

“La publicidad de un producto siempre debe ir ligada a la imagen e identidad

de la marca, por lo tanto, debe respetar colores, logos y tipografías
preestablecidos en un manual de identidad comercial.”

El diseño gráfico publicitario de una marca debe ser lineal en cualquier

medio de difusión, ya sea redes sociales, televisión, folletos, catálogos o la
actual cartelería digital. Tener distintas artes en cada medio sería un error de
comunicación visual porque la marca perdería identidad.

Ejemplo de Banner Publicitario

La Imagen Digital
Ya hemos visto algunos conceptos básicos en la relación MKT Digital/ Publicidad
y Diseño Gráfico para medios digitales, pero… ¿Cómo nace una imagen digital?
La palabra pixel proviene de la unión de las palabras inglesas picture y element
(elemento de imagen). Un pixel es la menor unidad de color que conforma una
imagen digital, ya sea una fotografía, video o fotograma.

En una imagen o mapa de bits cada pixel es codificado con un conjunto de bits,
esto se llama profundidad del color. Un bit es un dígito del sistema de
numeración binario. La capacidad de almacenamiento de una memoria digital
también se mide en bits, cada pixel puede codificarse con un byte (que consta
de 8 bits) esto da un número de 256 variaciones.

En una imagen de color verdadero (true color) se usan tres

bytes para definir un color, equivalentes a un valor tonal de
224 colores, cuyo resultado es 16.777.216 opciones de
colores diferentes. Pero la mejor manera de comprender el
concepto, es acercando la imagen lo máximo posible
mediante un software de edición, hasta ver una cuadricula
en donde cada pequeño cuadro tiene un color determinado. Cuantos más pixeles
tenga una imagen, mayor será su resolución y por consiguiente su tamaño.

En los monitores, el número de bits utilizados para representar cada píxel

determina cuántos colores o gamas de grises pueden representar. Cada píxel
está compuesto por tres celdas, una roja, otra azul y otra verde. Cada uno de
éstas coinciden en el mismo punto. La calidad de la imagen depende de su
resolución, a mayor cantidad de pixeles, mayor es la calidad y el tamaño de la
imagen, lo que permite mostrar más detalles y colores.
Modo de Color

En este curso vamos a ver teoría del color y a profundizar en los dos modos de
color más utilizados: RGB y CMYK. ¿Qué es el modo de color RGB? ¿Qué es el
modo de color CMYK?

A partir de la luz blanca del sol y los diferentes colores en los que se
descompone, podemos conseguir una gran variedad de tonalidades de dos
maneras diferentes, que se corresponden con los modos de color que vamos a
ver en este post: a partir de luz (RGB) y a partir de pigmentos (CMYK).

Modo RGB

Como ya hemos dicho, el modo de color RGB es el que se corresponde con

los colores luz. Es el modo de color que utilizan todas las pantallas, desde
la de tu televisión hasta la de tu celular. Cada píxel de cada pantalla es capaz de
emitir los tres colores primarios de los colores luz: Rojo, Verde y Azul. De hecho,
“RGB” son las siglas de estos tres colores en inglés: Red, Green, Blue. De la
mezcla en diferentes proporciones de estos tres colores se obtienen todos los
demás.
El modo RGB es el modo con el que nosotros en este curso trabajaremos
nuestras imágenes, desde su concepción hasta su presentación, es decir, las
creamos de manera digital y las publicamos de manera digital. Toda pieza
de diseño publicada en un medio digital estará en modo RGB.

Modo CMYK

A diferencia del modo RGB, el modo de color CMYK se corresponde con los
colores pigmento. CMYK son unas siglas que significan Cyan, Magenta,
Yellow, Black (cian, magenta, amarillo y negro), que son los tres colores
primarios cuando estamos tratando con pigmentos, más el negro. Estos son los
colores a través de lo que se componen imágenes analógicas, ya sean cuadros
hechos con pintura, las que imprimes desde tu impresora en casa o en una
imprenta profesional. Este modo de color también se llama cuatricromía. Cada
pieza de diseño en este modo de color, pudo haber sido creada de manera
digital, pero su publicación será impresa, por ejemplo, un folleto, una tarjeta
personal, una revista o un cartel.

Claramente no es el modo de color que nosotros utilizaremos para publicar

imágenes en una red social o en un medio digital, por lo tanto configuraremos
nuestro software de diseño (Illustrator, Corel o Photoshop) en modo RBG. En
una App de tu celular no tendrás que preocuparte por eso, ya vienen
configuradas en modo RGB.

Escala de Grises

Escala de grises es el término con el que se designa a todos los valores

cromáticos, con base en su capacidad de luminancia, en el camino que
transcurre entre entre el negro y el blanco. Así, es posible ver diferentes
tonalidades que son capaces de cubrir diferentes necesidades de iluminación,
oscuridad y si pudiéramos llamarle así de color.
Transitar entre el negro y blanco por medio de la escala de grises es una misma
acción que pueden desarrollar todos los colores de la escala cromática y así es
que pueden trasladar entre distintos colores y tonalidades que propician la gran
variedad cromática que casi todos los ojos humanos pueden percibir.

Imagen Vectorial y Mapa de Bits

Las imágenes de mapa de bits, también llamadas imágenes rasterizadas o

bitmaps, están formadas por una cuadrícula de puntos llamados píxeles, que se
organizan en una rejilla. Cada uno de esos píxeles tiene un color definido por un
valor. Si hacemos zoom sobre ellas veremos esos pixeles. Cuantos más píxeles
tenga una imagen mayor será su calidad.

Las imágenes vectoriales se basan en coordenadas matemáticas que definen

su posición, su forma, su color y otros atributos. Están formadas por vectores,
que son elementos geométricos como puntos, líneas, polígonos o segmentos.
En este caso si hacemos zoom sobre ellas veremos líneas y manchas de color
definidas.
Usos

Los bitmaps se utilizan para fotografías, imágenes con mucho detalle o imágenes
escaneadas.
Las imágenes vectoriales se utilizan para logotipos, iconos, ilustraciones,
infografías, tipografías o elementos para webs.

Formatos

Los formatos más utilizados para cada una de ellas son, en el caso de
las imágenes de mapa de bits JPG, PNG, GIF (casi en desuso) y en el caso de
las imágenes vectoriales EPS, AI, CDR y SVG. (Más adelante veremos en detalle
los tipos de formato de un archivo de imagen digital).

Diferencias

Las imágenes de mapa de bits tienen una retícula definida y por tanto su calidad
es fija. Si se amplían o disminuyen, los píxeles que componen la imagen y que
tienen un color fijo asignado se ven obligados a multiplicarse o dividirse
provocando una pérdida de la calidad de la imagen.

Las imágenes vectoriales, gracias a que están basadas en fórmulas

matemáticas, tienen una resolución infinita. Se pueden ampliar o reducir sin que
su calidad se vea afectada.

En algunos casos es muy difícil distinguir a simple vista si una imagen es de

mapa de bits o vectorial. La forma más sencilla de comprobarlo es haciendo
zoom sobre la imagen. Si ves una retícula de pixeles es de mapa de bits y si no
cambia la definición es vectorial.

Ventajas y desventajas

Cada uno de estos tipos de imágenes tienen sus pro y sus contras. En el caso
de las imágenes de mapa de bits las ventajas son:
Ventajas:

 Consiguen representar fielmente la realidad.

 Son la mejor opción para fotografías debido al alto nivel de detalle que
pueden tener.

Y las desventajas:

 A la hora de reducirlas o sobre todo aumentarlas pierden demasiada

calidad y se pixelan.
 Pueden no tener calidad suficiente para ser impresas.
 Si tienen mucha calidad pueden ocupar excesivo espacio.

Si pasamos a las imágenes vectoriales las ventajas son estas:

 Pueden escalarse sin perder nada de calidad.

 No pierden calidad al ser impresas.
 Gracias a que se basan en fórmulas y no en píxeles, consiguen almacenar
información compleja ocupando poco espacio.

Y la desventaja más importante:

 Es imposible reproducir una fotografía a partir de vectores, por lo tanto no se

ven como imágenes reales.

Vectorización y Rasterización
Una imagen de mapa de bits puede convertirse en una imagen vectorial en un
proceso que se llama vectorización. Dependiendo de la complejidad de la imagen
puede hacerse con la ayuda de un programa especial o, si se trata de una imagen
compleja, manualmente. Las imágenes vectoriales también pueden convertirse
en mapa de bits. Este proceso se llama rasterización.
En el proceso de diseño puedes combinar vectores y bitmaps pero finalmente
rasterizarás la imagen final a bitmap para publicarla en Redes Sociales o en
cualquier medio digital. Normalmente en formato JPG o PNG.
Tamaño y peso de las imágenes. Optimización
Un concepto y expresión que usamos al hablar de imágenes es el de tamaño. Este
término puede ocasionar confusión ya que solemos emplearlo para cosas
diferentes: normalmente decimos que una imagen tiene un tamaño de 1024 x 768
píxeles, pero también decimos que una imagen tiene un tamaño de 3 Mbytes. Este
uso impreciso de la palabra no suele causar mayores problemas, pero para los
objetivos del curso es importante matizar, ya que son dos características
diferentes de una imagen.

De esta forma, en este tema, cuando hablemos del tamaño nos referiremos sólo a
las dimensiones de la imagen: 1024 x 768 píxeles; y cuando se hable del peso de
la imagen nos referiremos a la memoria que ocupa la imagen. De esta manera,
podemos decir relativamente que una imagen es:

 Grande cuando tiene un tamaño igual o mayor a 1024x768 píxeles

 Mediana cuando el tamaño va de 320x240 a 1024x768 píxeles
 Pequeña cuando el tamaño es menor a 320x240 píxeles
 Muy pequeña cuando es menor a 100x100 píxeles

O que es:

 Pesada si tiene 1 MB o más

 De peso mediano si va de 300KB a 1 MB
 Ligera si su peso es menor de 300KB
 Muy ligera si el peso es inferior a 100KB

Al reducir de peso las imágenes (de mapa de bits) hacemos que tengan menos
bytes y, por tanto, que:

 Ocupen menos espacio en un dispositivo de almacenamiento. Por ejemplo,

el disco duro de un servidor de Internet guardará más imágenes en un
mismo espacio, pero con la consiguiente pérdida de calidad.
 La transferencia de datos por una red sea más veloz, acelerando así la
descarga de imágenes y la navegación por internet.
Medidas de Almacenamiento de Información

Aligerar ≠ Optimizar. Relación Peso / tamaño.

Al “aligerar” de peso una foto, le reducimos también la calidad. Al optimizar, lo que

pretendemos es reducir el peso, pero sin que la imagen sufra pérdida de calidad
aparente. Se trata de equilibrar la imagen entre su tamaño y su peso para que en
definitiva se publique de manera eficaz, poder ver calidad en la imagen con menos
peso. Con un software de edición como Photoshop o Apps de tu celular puedes
optimizar imágenes. Veremos ejemplos un par de unidades más adelante.

Ya tengas una red Social o un blog personal, seguro que tiene una gran cantidad de
imágenes para mantener la atención de tus usuarios. Y si además sigues las tendencias
de diseño actuales, cada vez tus imágenes serán más grandes. ¿Por qué tienes que
preocuparte entonces por el tamaño de tus imágenes? por tres sencillas razones:

 La navegación móvil. La navegación móvil supone un 55,6% de la navegación

total, y esta cifra no para de aumentar.

 No perder usuarios. Una web lenta y pesada es sinónimo de un porcentaje de

rebote muy alto, y por supuesto tú no quieres eso. No hagas esperar a tus
usuarios, optimiza el peso de tus imágenes.

 Posicionamiento SEO. Google dispone de un tiempo limitado para

rastrear tu web, por lo que cuanto menos pese, más páginas podrá
rastrear y tendrás más posibilidades de posicionar mejor.
Formatos básicos de diseño

Llamamos formato a una forma, tamaño y modo de presentación de una

publicación. Los formatos para diseñar en Redes Sociales son muy variados y
cada Red Social tiene varias medidas específicas para un posteo, un anuncio
promocionado, imagen de perfil, portada, stories, etc.

Los 3 formatos esenciales para nuestros diseños.

Tomando estos 3 formatos, (Vertical, cuadrado y horizontal) como base

para nuestros diseños, podremos adaptarlos, a la mayoría de los formatos
específicos que exigen las Redes Sociales. 900 x 900px, 735 x1128px y
1280 x 720px serían 3 medidas de imagen que pueden llevarse bien con
varias redes sociales.

El formato vertical es más adaptable a las pantallas de los celulares, mucho

contenido se muestra en ese formato.

El formato cuadrado se usa para posteos por ejemplo en el muro de Facebook

o el feed de instagram, también para anuncios.

El formato horizontal es más para algunos anuncios y se adapta más a un

monitor que a un celular. No lo verás con tanta frecuencia en Redes Sociales.

La Redes Sociales utilizan formatos de tamaño establecidos de manera que

subas las imágenes de manera óptima.

En todas las aplicaciones de diseño por ejemplo Canva, ya tienes

plantillas predeterminadas en su formato aptas para todas la redes
sociales.

Ya veremos más en detalle cuales son las medidas específicas que requieren
Facebook e Instagram para conseguir la calidad ideal para sus posteos y
anuncios.
Ejemplos de Formatos básicos
Formatos de archivo de imágenes para pantalla

Veamos cuáles son los 3 formatos más importantes de imágenes

rasterizadas o de mapa de bits más utilizados en el mundo, ya sea para
fotografías o para guardar imágenes vectorizadas no modificables. Los
necesarios para publicación de en celulares, monitores y otras pantallas.

Tipo de formato de imagen JPG o JPEG (Mejor para Fotografías)

Seguramente la extensión JPG (Joint Photographic Group) sea el formato

más conocido y más utilizado para guardar imágenes. Este formato pierde
calidad debido a su elevada compresión, por lo que es perfecto para cuando no
necesitamos una imagen muy pesada y al detalle.
La mayoría de cámaras y de imágenes que encontramos en internet son
almacenadas en este formato, siendo ideal debido a su peso, ya que si las
incluimos en medios digitales pesarán menos que otras extensiones, mejorando
la velocidad de carga.

El formato JPG o JPEG no admite transparencias, por lo que si pretendes

incluir esta característica en tu imagen, lo mejor es que optes por una extensión
.PNG

Formato de imagen PNG (Mejor para imágenes vectoriales

Rasterizadas)

En PNG (Portable Network Graphics) podrás incluir las transparencias que

necesites sin perder de calidad, por lo que podrás utilizarlo en tus logotipos,
imágenes sin fondos, etc.

Dentro del formato PNG, encontramos otros en función de la cantidad de

información que almacena: PNG 8 y PNG 24.
PNG 8: Tiene color de 8 bits, por lo que puede llegar a mostrar hasta 256 colores.
Menor tamaño debido a la cantidad de información.
Imágenes con características y peso parecidos al .GIF.

PNG 24:
Tiene color de 24 bits, por lo que puede llegar a mostrar hasta 16 millones de
colores.
Mayor tamaño por la cantidad de información.
Transparencias más limpias. Muy útil para cuando necesites imágenes limpias
y de calidad, aunque sean más pesadas.

En la actualidad PNG 24, es el formato apto para publicar en medios

digitales por su calidad, descartando casi siempre el PNG 8.

La opción de “Archivo más pequeño (8 bits)” es para guardar la imagen con

menos colores, con la consecuente pérdida de color. Eso sí, tu imagen pesará
mucho menos.

Formato GIF

Formato GIF (Graphics Interchange Format). Es un formato que soporta

animaciones mediante la reproducción de imágenes seguidas e
inmediatamente al abrirlo.

Puede tener hasta 256 colores y comprime las imágenes, por lo que el formato
de imagen suele ser pequeño, a no ser que tenga elevadas animaciones.

Además, debemos tener en cuenta que este formato puede no ser

compatible con todos los programas o aplicaciones, por lo que puede que el
receptor del GIF no llegue a verlo. Va quedando obsoleto al día de hoy.
Formato Webp: Un formato nuevo que se empieza a utilizar con más asiduidad
es el Webp. Creado por Google, es un formato más comprimido que mejora la
velocidad de carga de las imágenes. Éstas llegan a ser hasta un 30% más
livianas que un JPG o un PNG, manteniendo una buena calidad.

En general
usaremos PNG
para todas las
imágenes que
componen
nuestra web
(logotipos, iconos,
botones…) y JPG
solo para las
fotografías, sobre
todo las grandes.

Tabla Comparativa
Algunas Infografías de utilidad
Algunos términos utilizados.
Viral: Cuando el contenido se difunde rápidamente de persona a persona.

Fanpage: Página de Fans específica de marcas y empresas .

Newsletter: Un boletín informativo es una publicación distribuida de forma

regular, centrada en un tema principal para proporcionar información de
Interés.

Conversión: En el comercio electrónico, el marketing de conversión es

marketing con la intención de aumentar los visitantes y ponerlos en reacción para
una posible compra. Poner en relación directa a la empresa y al potencial cliente.

Banner: Es un formato publicitario en Internet. Es un tipo de anuncio que

generalmente es empleado en la publicidad llamada display, piezas publicitarias
de contenido gráfico que se encuentran localizadas en diferentes páginas web.

Landing Page: En la mercadotecnia en internet, se denomina página de

aterrizaje a una página web a la que una persona llega tras pulsar en el enlace
o botón en una guía, un portal o algún banner o anuncio de texto situado en otra
página web, aplicación, red social, E-mail o portal de internet.

Pop-up: El término ventana emergente hace referencia a un elemento

publicitario que aparece automáticamente en la pantalla del navegador, en una
ventana superpuesta a la de la página web activa.

Scroll: es un término inglés que se utiliza para hablar del desplazamiento de los
contenidos 2D que se muestran en la ventana de un navegador. Es ese sencillo
gesto que el usuario realiza cuando desliza el dedo por la pantalla o utiliza la
rueda del ratón para subir o bajar mientras observa los contenidos de una página.

App: tipo de programa informático diseñado como herramienta, para permitir a

un usuario realizar diversos tipos de trabajos:

 Por dispositivo:

Aplicación web, la que los usuarios pueden utilizar a través de Internet.

Aplicación móvil, aplicación informática diseñada para teléfonos
móviles inteligentes.
Influencer: Un influencer es una persona que, de algún modo, ha
logrado destacar en los canales digitales, especialmente en las redes sociales,
como Instagram, así como en plataformas de vídeo como YouTube.

Algoritmo: En informática o programación, el algoritmo es la secuencia de

instrucciones mediante la cual podemos resolver un problema o cuestión .

Remarketing: significa, hacer marketing nuevamente para la misma persona. La

intención es generar impacto más de una vez sobre alguien que ya demostró
interés en el producto.

Engagement: Se define como el nivel de compromiso que tienen los

consumidores y usuarios con una marca.

Orgánico: Llamamos posicionamiento orgánico o posicionamiento natural al

lugar que aparece una web entre los resultados de búsqueda no pagados de
Google y otros buscadores cuando un usuario busca una palabra clave en
concreto.

LINKS DE INTERES

Glosario:https://isabelsantiandreu.com/diccionario-de-marketing-digital/

Formato:https://marketing4ecommerce.net/diferencias-png-jpg-tiff-y-gif-webp/

Optimización: https://desafiohosting.com/7-formas-optimizar-imagenes-para-
web/

Fin Unidad 1