Enlace a facebook.
digitalDot diseño webLogo Diseño Web digitalDot

Anatomía del banner web 100% efectivo

Estructura de los Banners en diseño web
Escrito por Digitaldot
27 de septiembre de 2021
Tiempo de lectura 5 min
Estructura de los Banners en diseño web

Los banners forman parte de la experiencia de cualquier usuario de internet. Están en cada rincón, acechando tras cualquier click para llamar tu atención e intentar persuadirte de que necesitas lo que sea que estén publicitando.

Y es que este formato no es nuevo. Tiene su origen en la publicidad del siglo XX, cuando los banners comenzaron a poblar la prensa escrita y las vallas publicitarias en carreteras de todo el mundo.

Si ha sobrevivido la prueba del tiempo es porque funciona, pero, ¿cómo funcionan exactamente?

Un banner siempre es más extrovertido que tú

No es ningún secreto que el éxito de un banner se mide únicamente por la cantidad de atención que atrae. Pero igual que una habitación llena de gente luchando por tu atención, una web plagada de banners luchando entre sí puede resultar confusa y desagradable.

Componentes del banner

  1. El banner está delimitado por un espacio normalmente cuadrangular que contiene la información. Su color tiene que contrastar con el lugar en que se emplaza o su efectividad será bastante baja.
  2. Elementos visuales que te transmiten la idea básica. Aunque tú no lo sepas el color, la composición y el estilo empleado ya te están comunicando lo que ellos quieren que sepas.
  3. El texto tiene que ser corto y muy específico. Recuerda que la naturaleza del banner es visual, así que la tipografía elegida tiene que ser legible y bonita.
  4. Todo esto está muy bien pero sin una llamada a la acción es posible que nunca interacciones con el banner. ¿No te ha pasado que te apetece meterte a la piscina pero necesitas que alguien te empuje? En este caso un botón, un link o un icono invitando a clicar realmente te empuja a clicar.
Elementos de un banner en el diseño web

Tipos de banner

Fundamentalmente en internet encontramos de dos tipos: accionables e informativos.

Un banner es accionable cuando te permite interaccionar con él. Por tanto, llevará sí o sí una llamada a la acción. Dentro de los banners accionables encontramos:

  • Temporales: te informan de que el tiempo para realizar la acción es limitado. Se basan en transmitir FOMO (Fear Of Missing Out, en castellano, “miedo a perder la oportunidad”). ¿Quién no ha sentido prisa por comprar un producto cuando te dicen que la oferta se acaba en los próximos minutos? ¡Imposible resistirse!
  • Inspiracionales: gracias a las cookies de los usuarios se pueden conocer sus intereses y ofrecer una experiencia personalizada. Cuanto más te conozca tu navegador de internet más difícil será no comprar lo que te ofrezca.
  • Ofertas: uno de los trucos más antiguos en publicidad es ofrecer descuentos. Recuerda: ¡Nadie es inmune a un buen descuento!
  • Persuasión al login: a las páginas les interesa que te registres y para ello te ofrecerán beneficios como descuentos, puntos, cupones… la lista es interminable.

En cambio, un banner es informativo cuando no trata de llevarte a otra página sino persuadirte de algo en ese momento y ese lugar.

  • Status: te explican si el proceso que estás siguiendo ha tenido éxito o ha fallado. Es el clásico “Tu pedido ha sido enviado” o “No ha completado todos los campos”.
  • USPs: las Unique Selling Propositions, en pocas palabras, te explican (te intentan persuadir) de que este vendedor es el mejor que te puedes encontrar en todo internet.
Cómo crear un banner para una web

Ya sabes cómo te intentan convencer, pero en caso de que necesites convencer tú a alguien, debes tener en cuenta también:

  1. Los banners son bastante disruptivos los pongas donde los pongas, pero su nivel de interrupción debe igualarse a su nivel de importancia. Deben llamar la atención, no gastar toda la atención que el usuario tenga para dar. ¡Colócalos donde no molesten, por favor y gracias!
  2. El diseño debe tener un alto grado de contraste con sus alrededores. Explora las infinitas posibilidades estéticas que se te abren en cuanto a colores, texturas, tipografías…
  3. Recuerda que en la actualidad el usuario navega en muchos dispositivos, desde su móvil a su televisor pasando por su tablet, su portátil y su ordenador de escritorio. Debes adaptar el banner para que funcione sin importar el dispositivo.
  4. Un banner aislado tiene un gran impacto, dos banners cercanos se reparten esa atención, y si tenemos catorce… es como si no tuvieras ninguno. Nunca permitas que los banners se peleen entre sí.
  5. Los banners son para información transitoria. Si tu web tiene un banner de forma permanente, ¿por qué no incluyes esa información en la web y dejas ese espacio para algo que realmente necesite ser visto?

En nuestra Agencia de diseño web nos dedicamos a encontrar la efectividad completa en cada parte de nuestro diseños web y como puedes comprobar los banners son como la sal en la comida: no son necesarios, pero ayudan bastante y su función es hacerte sentir como si no se pudiera vivir sin ellos. ¡Y lo lamentarás si te pasas de la justa medida!

Cómo hacer un banner web

Noticias relacionadas sobre Actualidad web

Qué es UCP y cómo funciona técnicamente

Qué es UCP y cómo funciona técnicamente

El comercio online ya no es lo que solía ser. Ahora, no solo tienes que preocuparte de que tu tienda funcione bien, sino que también debes estar listo para que agentes de inteligencia artificial hagan el trabajo por ti. Esto es posible gracias a UCP (Universal Commerce Protocol), un protocolo…

Canal de denuncias obligatorio para empresas

Canal de denuncias obligatorio para empresas

El cumplimiento normativo ya no es algo que las empresas puedan dejar de lado en España. Desde la entrada en vigor de la Ley 2/2023 de protección de informantes, muchas organizaciones han tenido que adaptarse e implantar un canal de denuncias que permita comunicar irregularidades de forma segura y confidencial.…

AI Overviews y AI mode

AI Overviews y AI Mode: por qué tu web puede seguir posicionando pero recibir menos clics

Hubo un tiempo en el que mirar el posicionamiento en Google y mirar los clics era casi la misma película. Si subías posiciones, subían las visitas. Si entrabas en primera página, había premio. No era un sistema perfecto, pero al menos la lógica general se entendía. Ahora la cosa se…

Ley de consumidores tienda online

En qué afecta la nueva Ley de consumidores para tu tienda online

Si vendes online a consumidor final, esta ley te afecta directamente. El Real Decreto Legislativo 1/2007, que aprueba la Ley General para la Defensa de los Consumidores y Usuarios, es la norma que regula las ventas B2C en España. No depende del sector, ni del tamaño de tu empresa, ni…

Vulnerabilidades encontradas en Prestashop

Vulnerabilidades de seguridad detectadas en el módulo PrestaShop "gsnippetsreviews"

A comienzos de enero de 2026, nuestro equipo de seguridad web de digitalDot identificó dos vulnerabilidades relevantes en el módulo gsnippetsreviews para PrestaShop, un módulo verificado y ampliamente utilizado en tiendas online basadas en esta plataforma. La detección se produjo a raíz de una incidencia real en un cliente nuestro,…

Elige el dominio para tu web. digitalDot

La importancia de elegir un buen dominio

Cuando nos planteamos tener una web enseguida nos salta la duda de cómo se va a llamar. El dominio, es ese nombre, único y exclusivo, que vamos a otorgar a nuestra página, ecommerce o blog y que permitirá a los usuarios acceder a nuestra web. La elección de un dominio…

Parámetro srsltid de Google

¿Qué es el parámetro "srsltid" y por qué aparece en las URLs de mi sitio web?

Si tienes una tienda online y has estado monitoreando tu tráfico en los últimos meses, es posible que hayas notado la aparición de un nuevo parámetro en tus URLs: ?srsltid. Esto ha comenzado a generar confusión entre dueños de tiendas y expertos en SEO, debido a cómo afecta la atribución…

digitalDot Partner de Klaviyo

Klaviyo: Plataforma para automatización de marketing digital

Si tienes una tienda online, seguro que te suena esta película: inviertes en tráfico, la gente entra, mira, añade al carrito… y desaparece. O compra una vez y no vuelve. Y mientras tanto, tú mandas algún newsletter suelto de vez en cuando, con un cupón y “a ver si cuela”.…

Google Core Update: todas las novedades de SEO

Google Core Update 2025: Todas las novedades en SEO en detalle

Google ha vuelto a poner en marcha su maquinaria de actualizaciones de algoritmo, y la comunidad SEO está atenta a los cambios que esto implica. En el año 2023, Google ha lanzado cuatro actualizaciones de núcleo, en marzo, agosto, octubre y noviembre. Aunque Google no proporciona detalles específicos sobre los…

1 2 3 20
crossmenuchevron-down