Este es el segundo de 3 artículos que he dedicado sobre banners publicitarios, en el que te enseñaré a obtener el código HTML de un banner. Aquí te dejo los demás artículos.
- Hacer banners animados con Photoshop.
- Como conseguir el código HTML de tu banner.
- Colocar tus banners en tu blog de WordPress (usando el codigo HTML).
Aclaro que no son necesarios grandes conocimientos en html para llevar a cabo lo que aquí enseñaré. Creo que hasta un simio podría hacerlo.. 🙂
Como Conseguir el Codigo HTML de un Banner
Los elementos que debe contener el código HTML de tu banner son básicamente 3:
- Código URL de tu banner.
- Código URL de la pagina de destino (es la pagina a la que quieres que dirija cada persona que da click en tu banner).
- Tamaño de banner (en pixeles).
Tanto el código URL de tu página de destino como el tamaño vos no tendrás ningún problema con conseguirlo. No podes publicitar con un banner si no sabes a que dirección quieres llevar tu trafico y tampoco podes tener un banner sin saber su tamaño (parece algo obvio.. jaja).
Como Obtener URL de Un Banner
Ahora te voy a contar dos formas para obtener la URL de un banner. La primera cargando el banner en alguna red social, en mi caso lo cargo en G+, una vez cargado das click derecho sobre el banner y luego click en copiar dirección de imagen
Otra forma es cargar dicha imagen del banner en los servidores de tu web. Por ejemplo si tienes tu web en WordPress, debes buscar la imagen en la biblioteca. Luego obtener la URL haciendo click derecho (igual que vimos antes).
Ya tenes todo el material para armar tu código HTML!!… Pero dirás.. Y como creo el código???
Creando El Código HTML del Banner
Como soy muy bueno acá te dejo dos códigos HTMl de banners, uno para que al hacer click tu página de destino se habra en la misma pestaña y otro para que se abra en una pestaña nueva (siempre mas recomendable)
CODIGO HTML DE BANNER – Abrir en misma pestaña…. <a href=”COLOCA AQUI URL DE PAGINA DE DESTINO”><img src=”COLOCA AQUI URL DE BANNER” width=468 height=60 /></a>
CODIGO HTML DE BANNER -Abrir en nueva pestaña.. <a href=”COLOCA AQUI URL DE PAGINA DE DESTINO” target=”_blank”><img style=”opacity: 1;” src=”COLOCA AQUI URL DE BANNER” width=”468″ height=”60″ /></a>
Lo único que tendrán que hacer es reemplazar los datos, y colocar en su lugar los datos correspondientes (cuando coloque cada dato, URL de banner, URL de pagina de destino, y dimensiones de su banner no borren las comillas). Por si no saben width es ancho de su banner y heigth es el alto (en el ejemplo el banner es de 468×60 pixeles).
Bueno si no entendieron lago de que les escribí en este artículo lo pueden repasar en este vídeo de mi canal donde explico lo mismo. Y si pueden suscribanse a mi canal.. no cuesta nada.. jaja
En el próximo artículo les enseñaré a insertar los banners en su blog.. estén atentos!!.
Espero les haya sido de mucha utilidad esta info. Nos leemos en el próximo articulo!!.
Saludos!!
me ha entancado este artículo, soy community manager en redes sociales y la verdad que tiene gran información lo que nos está ofreciendo el autor de esta entrada… yo también escribo para mi blog como tu en http://www.creapublicidadonline.es por si quieres echarle un vistazo a mis articulos, también añado información muy util acerca del mismo tema. ¡muchas gracias por tu ayuda!
Hola Ranae. Estoy muy contento de que encuentres de utilidad esta info. La verdad que la primera vez que necesite el código HTML de un Banner me costo saber como hacerlo. Es por ello que fue sobre lo primero que escribí cuando cree mi blog. Aprecio mucho tu comentario. Ahora mismo paso por tu Blog, seguro encontrare artículos de mi interés. Saludos!!
Pingback: Como Diseñar Banners Con Photoshop - LuisForgiariniBlog
Pingback: Como insertar banners en tu blog (wordpress) - LuisForgiariniBlog
Muy util y muy bien explicado.Muchas gracias!!!
Me alegra que te haya servido Andrea, saludos! 🙂