CriisDark
Apenas empiezo
- Registrado
- 12 Abr 2009
- Mensajes
- 16
bueno este tutorial By criisDark
Que es un Banner?
Pues bien, un banner nos es mas que un archivo grafico por lo general en formato .GIF ó
. JPG, y además .SWF, de un tamaño por lo general de 468 x 60 / 468x80.
Estos tamaños son de lo mas variado que hay, aquí los doy como ejemplo, pero en si, hablo de banner no tanto por el tamaño, sino por su fin, el cual es darle publicidad a un sitio, producto o servicios ya sea en la red o en la vida común.
Por ejemplo, hace poco estaba interesado en pautar un sitio en un portal de Formula1, sucede que el webmaster me dijo que habían diferentes tipos de banners, entre ellos:
Banner Standard : El tipo de banner que mas vemos en las paginas web, de un tamaño promedio de 468x60 / 468x80, que por lo general va en la parte superior de las paginas web, como por ejemplo, la molesta publicidad de Netfirms en sus sitios hospedados gratuitamente (Agradezco a Creature por mandar un post solucionando aquel problema de la publicidad en varios servidores gratuitos).
Estos banner son estáticos o animados, permiten por lo general un peso máximo de 20 Kb
( Para que la pagina no se tueste en mi MODEM de 56, 6 Kbps ).
Hablando en la parte $$$, este tipo me cobraba 20 EUROS, equivalente a mucho dinero aquí en Sudamérica, por colocar mi banner en su sitio.
Banner Rascacielos : Es un tipo de publicidad relativamente nuevo, tiene un tamaño promedio de 100x600 a 120x700, y se coloca en un lado de la pagina.
Tamaño promedio de 24 Kb, repito, si quieren hacer un banner de 50 Kb, OK, háganlo pero acuérdense que aquí hay mucha gente con conexiones realmente podridas (33,6 Kbps y mucho menos ).
Bueno, el tipo también me dijo que el otro tipo de banner era la maldita y odiada ventana que nos fastidia bastante la vida: el pop-up.
De acuerdo, nosotros conocemos pop-up como una cosa totalmente diferente en cuanto formato que el banner, pero en si, la palabra inglesa banner significa pancarta, es decir, que nuestro amigo el banner no se limita a un grafico de 468x60, sino que también llega a ser un pop-up. Cada uno de ustedes sabrá como definen al banner, pero me centrare en el de 468x60.
Como se hace un banner?
Pues bien, después de tanto preámbulo y webadas de estas, aquí esta el centro de este post: como se hace un banner.
Bien, explicare esto a mi modo, es decir, con programas que no se si unos se les harán conocidos ( el Photoshop es de lo mas conocido en el planeta ...), o no.
Usaremos:
Photoshop 6/7
Swish 2.0
Si alguno de ustedes es amigo del Paint Shop Pro, pues sabrán que este programa viene con el animation shop que tiene un wizard para hacer banners en dos minutos, en formato .GIF o .JPG.
Utilizaremos el camino largo aunque fácil, para hacer un banner.
Es bastante sencillo, nos tomara 5 minutos, es solo ser creativos y manejar los programas de arriba.
Bien, usen cualquier imagen que tengan en sus HD, y comencemos...
1. Abran Photoshop.
2. Hagan un archivo nuevo de 460x60, fondo transparente o blanco, o del color que quieran.
3. Ya con nuestro lienzo listo, es hora de que comiencen con la creatividad, si desean coloquen una imagen dentro de nuestro banner, no saben como ??, pues si tienen maximizada la imagen restáurenla, al igual que nuestro lienzo, coloquen la imagen al lado del lienzo, hagan clic sobre la fotografía y arrastren esta hasta el lienzo, si salió bien, se nos habrá creado una capa nueva, la cual contiene la fotografía.
4. la fotografía es bastante grande como para caber en nuestro lienzo?, entonces opriman CTRL + T, esto es para modificar el tamaño de la imagen, en la parte superior de la pantalla, justo debajo de los menús, hay un Boston parecido a una trenza, hagan clic en el y comiencen a disminuir el tamaño de la imagen, lo del botón de la trenza lo hacemos para que la imagen guarde sus proporciones.
5. OK...ahora que tenemos una imagen ajustada, ahora decoren a su gusto el banner... allá ustedes ....
6. cuando ya estén satisfechos con esto...vayan a archivo>guardar... guarden el archivo en el sitio que quieran, coloquen nombre y díganle que lo quieren como un archivo tipo .JPG con calidad 7 ú 8, ustedes verán...
7. después de tener listo nuestro nuevo JPG, abran swish...
8. espero que este explicando bien esto....
9. en la pestaña película, la cual se encuentra en la parte derecha de sus pantallas, cambien el tamaño de esta a 460x60 o por el tamaño que tenga el JPG antes creado.
10. Inserten el jpg dentro de nuestra escena....
11. inserten texto....una frase cualquiera....
12. animen este texto....
13. después de haber quedado satisfechos....vamos a exportar esta vaina.... hagan clic en archivo>exportar>exportar como SWF.
14. bueno...guarden ese SWF en donde quieran, y listo.
15. si tienen el flashplayer en su PC, pues miren el archivo....
16. si el banner para una pagina... habrán el dreamweaver o frontpage y coloquen el nuevo banner dentro de la pagina.
Wikipedia dice....
Un banner es un formato publicitario en Internet. Esta forma de publicidad online consiste en incluir una pieza publicitaria dentro de una página web. Prácticamente en la totalidad de los casos, su objetivo es atraer tráfico hacia el sitio web del anunciante que paga por su inclusión.
Los banners se crean a partir de imágenes (GIF o JPEG), o de animaciones creadas a partir de tecnologías como Java, Adobe Shockwave y, fundamentalmente, Flash, diseñadas con la intención de atraer la atención, resultar notorias y comunicar el mensaje deseado. Por lo tanto, estos banners no necesariamente mantienen la línea gráfica del sitio.
Todo tipo de sitios web son susceptibles de incluir toda clase de banners y otros formatos publicitarios, aunque en la mayoría de los casos, son los sitios con contenidos de mayor interés o con grandes volúmenes de tráfico los que atraen las mayores inversiones de los anunciantes.
Cada vez que un usuario accede a una página web concreta en la que se ha previsto la inclusión de un banner, éste es mostrado. Esto se conoce como "impresión". En los formatos habituales, cuando el usuario clica sobre el banner, automáticamente es redirigido a otro sitio web, decidido por el anunciante, lo que se conoce como "click through".
Cuando se pone el click through en relación con las impresiones se obtiene una tasa denominada ratio de click through (CTR en sus siglas en inglés) que mide el número de veces que alguien ha hecho click sobre el banner en relación al número de veces que se ha mostrado dicho banner -número total de impresiones-. Esta tasa puede variar muchísimo en función de cada campaña de publicidad pero se puede considerar situada en términos normales si ronda entre el 0,1% y el 1%.
Habitualmente, el CTR es el principal indicador que se emplea para medir la eficacia de una campaña de publicidad online. En ocasiones sirve también para determinar el coste que el anunciante pagará por la campaña, aunque fundamentalmente este coste viene determinado por el número de impresiones.
TIPS PARA BUENOS BANNERS
1. Un banner solo nos da unos cuantos segundos para capturar la atención del usuario, por lo que es vital que nuestros banners tengan un mensaje que implique "MIRAME A MI". Para esto, es necesario el uso adecuado de texto, colores y gráficas, tomando en cuenta el orden mencionado. Es bueno practicar con diferentes combinaciones de texto, hasta que se sienta que tiene un buen mensaje.
2. Según varios estudios, buen porcentaje de navegantes automáticamente ignoran los banners en sitios web a menos que mencionen un tema de su agrado. No podemos capturar la atención de todos los usuarios, pero si de visitantes que podrían familiarizarse con nuestros contenidos. Por esta razón, enfatizar en el tema de nuestro sitio es muy importante.
3. Los banners GIF animados tienen mayor facilidad para capturar la atención sobre banners estáticos, además que son casi el estándar impuesto debido a que los estáticos tienen muy poca efectividad en el medio.
4. Siempre en la primera escena de nuestros banners se debe enfatizar en una fase introductoria que haga énfasis en el beneficio de nuestros sitios. Que tenemos que valga la pena visitar? Que nos hace diferentes a los demás?
5. El uso de frases que impliquen curiosidad, humor, miedo o preguntas es recomendado para la primera escena de nuestros banners. Algunos ejemplos de lo anterior podría ser. "Sabía usted que ...", "Es usted de las personas que ...", "No se preocupe nunca más por el uso de ...", "Precaución, usted podría ...", etc.
6. A continuación de la frase introductoria, tomando en cuenta que de esta dependerá la atención del navegante en nuestro banner, se deben incluir varias escenas que expandan la información de nuestro sitio.
7. Es recomendable incluir algún logo, dirección web o identificación gráfica de nuestro sitio en todas las escenas. Lo anterior nos ayudará a mostrar una identificación de nuestro sitio ante los navegantes aunque no lo pulsen. Podría ser que eventualmente lo hagan luego de varias visualizaciones.
8. Aparte de los banners GIF animados, existen otras formas de crear banners como lo es la combinación de tablas y formularios (Banners HTML), banners en Flash o de Java. Estos tienen varios inconvenientes pues no pueden ser publicados en todos lados y en el caso de Flash y Java, no todos los usuarios tienen acceso. A pesar de esto se ha comprobado que son más efectivos pues permiten más variedad de animaciones e interactividad con el usuario.
9. En cuanto a tamaño, en pixeles los banners estándares son de 468x60 pixeles, existiendo también minibanners y banners de otras dimensiones, dependiendo del sitio que los exponga. En Kb, los banners no deben tener más de 10 kb de tamaño. A pesar que la mayoría de límites es de 15kb, tenemos que tomar muy cuenta que un banner demasiado grande tardará mucho en cargarse y entonces no será visualizado por el visitante. Estar por debajo de los 10 kb podría ser beneficioso si queremos mayores exposiciones efectivas. El uso de múltiples escenas con diferentes contenidos en banners animados puede aumentar el tamaño por lo que hay que considerar rehusar el contenido de otras escenas.
10. El uso de colores brillantes es más apropiado que colores oscuros como el negro que ha demostrado ser menos efectivo.
Entre los más efectivos puede mencionarse al Azul, amarillo, naranja y verde. También hay que aplicar colores que contrasten para que pueda leerse nuestro mensaje. El Amarillo en fondo rojo por ejemplo es más efectivo que el verde sobre fondo azul.
Otro color que puede beneficiarnos es el blanco, debido a que la mayoría de sitios de contenidos tienen este color de fondo. Crear un banner que aparente ser enlaces o alguna información dentro de otro sitio nos garantiza mayor posibilidad de que lo pulsen.
10. A todos nos gusta lo gratuito en Internet, por lo que la palabra GRATIS de de ser aplicable a nuestro sitio es una palabra efectiva y clave en la efectividad de los banners. Si existe algo que pueda considerarse gratis en nuestro sitio como un boletín, noticias, contenidos, evaluaciones de software o archivos, etc., hay que comentarlo.
11. Crear confusión en el banner anunciando algo que no verán en nuestro sitio podrá ser efectivo para ganar visualizaciones de nuestra página, pero no visitantes efectivos, por lo que no se deben hacer falsas promesas en los banners, pues al no encontrar lo anunciado, ganaremos un visitante enojado que difícilmente recomendará nuestro sitio.
12. A pesar de que los banners son conocidos como un medio publicitario, muchos navegantes no saben que hacer al ver un banner de su agrado. Se ha comprobado que incluir algun texto que implique pulsar el banner aumenta su cantidad de clicks, pues es una nota explicatoria: "Pulse Aquí", "Click Aquí", "Pulse para continuar", etc. son opciones que debemos tomar en cuenta para finalizar el banner.
13. La creación de varios banners con distintos conceptos nos da mayores opciones para promocionarnos y además nos permite evaluar su efectividad. Esto además nos permitirá tener una galería de nuestros banners en nuestro sitio para los visitantes que deseen tomarlos para sus sitio.
Algunos sitios para generar Banners Online
http://www.foroplus.net/hazban/
http://www.coder.com/creations/banner/
http://www.bannersketch.com/
http://www.thebannerpeople.com/
-----------------------------------------------------------------------------------------
Fuentes:
http://foro.elhacker.net/diseno_gra...nner_y_no_fracasar_en_el_intento-t6727.0.html
Wikipedia
http://www.webtaller.com/promocion/articulos/bannersefec.php
[mod] Tema movido a Tutorial de Diseño[/mod]
Que es un Banner?
Pues bien, un banner nos es mas que un archivo grafico por lo general en formato .GIF ó
. JPG, y además .SWF, de un tamaño por lo general de 468 x 60 / 468x80.
Estos tamaños son de lo mas variado que hay, aquí los doy como ejemplo, pero en si, hablo de banner no tanto por el tamaño, sino por su fin, el cual es darle publicidad a un sitio, producto o servicios ya sea en la red o en la vida común.
Por ejemplo, hace poco estaba interesado en pautar un sitio en un portal de Formula1, sucede que el webmaster me dijo que habían diferentes tipos de banners, entre ellos:
Banner Standard : El tipo de banner que mas vemos en las paginas web, de un tamaño promedio de 468x60 / 468x80, que por lo general va en la parte superior de las paginas web, como por ejemplo, la molesta publicidad de Netfirms en sus sitios hospedados gratuitamente (Agradezco a Creature por mandar un post solucionando aquel problema de la publicidad en varios servidores gratuitos).
Estos banner son estáticos o animados, permiten por lo general un peso máximo de 20 Kb
( Para que la pagina no se tueste en mi MODEM de 56, 6 Kbps ).
Hablando en la parte $$$, este tipo me cobraba 20 EUROS, equivalente a mucho dinero aquí en Sudamérica, por colocar mi banner en su sitio.
Banner Rascacielos : Es un tipo de publicidad relativamente nuevo, tiene un tamaño promedio de 100x600 a 120x700, y se coloca en un lado de la pagina.
Tamaño promedio de 24 Kb, repito, si quieren hacer un banner de 50 Kb, OK, háganlo pero acuérdense que aquí hay mucha gente con conexiones realmente podridas (33,6 Kbps y mucho menos ).
Bueno, el tipo también me dijo que el otro tipo de banner era la maldita y odiada ventana que nos fastidia bastante la vida: el pop-up.
De acuerdo, nosotros conocemos pop-up como una cosa totalmente diferente en cuanto formato que el banner, pero en si, la palabra inglesa banner significa pancarta, es decir, que nuestro amigo el banner no se limita a un grafico de 468x60, sino que también llega a ser un pop-up. Cada uno de ustedes sabrá como definen al banner, pero me centrare en el de 468x60.
Como se hace un banner?
Pues bien, después de tanto preámbulo y webadas de estas, aquí esta el centro de este post: como se hace un banner.
Bien, explicare esto a mi modo, es decir, con programas que no se si unos se les harán conocidos ( el Photoshop es de lo mas conocido en el planeta ...), o no.
Usaremos:
Photoshop 6/7
Swish 2.0
Si alguno de ustedes es amigo del Paint Shop Pro, pues sabrán que este programa viene con el animation shop que tiene un wizard para hacer banners en dos minutos, en formato .GIF o .JPG.
Utilizaremos el camino largo aunque fácil, para hacer un banner.
Es bastante sencillo, nos tomara 5 minutos, es solo ser creativos y manejar los programas de arriba.
Bien, usen cualquier imagen que tengan en sus HD, y comencemos...
1. Abran Photoshop.
2. Hagan un archivo nuevo de 460x60, fondo transparente o blanco, o del color que quieran.
3. Ya con nuestro lienzo listo, es hora de que comiencen con la creatividad, si desean coloquen una imagen dentro de nuestro banner, no saben como ??, pues si tienen maximizada la imagen restáurenla, al igual que nuestro lienzo, coloquen la imagen al lado del lienzo, hagan clic sobre la fotografía y arrastren esta hasta el lienzo, si salió bien, se nos habrá creado una capa nueva, la cual contiene la fotografía.
4. la fotografía es bastante grande como para caber en nuestro lienzo?, entonces opriman CTRL + T, esto es para modificar el tamaño de la imagen, en la parte superior de la pantalla, justo debajo de los menús, hay un Boston parecido a una trenza, hagan clic en el y comiencen a disminuir el tamaño de la imagen, lo del botón de la trenza lo hacemos para que la imagen guarde sus proporciones.
5. OK...ahora que tenemos una imagen ajustada, ahora decoren a su gusto el banner... allá ustedes ....
6. cuando ya estén satisfechos con esto...vayan a archivo>guardar... guarden el archivo en el sitio que quieran, coloquen nombre y díganle que lo quieren como un archivo tipo .JPG con calidad 7 ú 8, ustedes verán...
7. después de tener listo nuestro nuevo JPG, abran swish...
8. espero que este explicando bien esto....
9. en la pestaña película, la cual se encuentra en la parte derecha de sus pantallas, cambien el tamaño de esta a 460x60 o por el tamaño que tenga el JPG antes creado.
10. Inserten el jpg dentro de nuestra escena....
11. inserten texto....una frase cualquiera....
12. animen este texto....
13. después de haber quedado satisfechos....vamos a exportar esta vaina.... hagan clic en archivo>exportar>exportar como SWF.
14. bueno...guarden ese SWF en donde quieran, y listo.
15. si tienen el flashplayer en su PC, pues miren el archivo....
16. si el banner para una pagina... habrán el dreamweaver o frontpage y coloquen el nuevo banner dentro de la pagina.
Wikipedia dice....
Un banner es un formato publicitario en Internet. Esta forma de publicidad online consiste en incluir una pieza publicitaria dentro de una página web. Prácticamente en la totalidad de los casos, su objetivo es atraer tráfico hacia el sitio web del anunciante que paga por su inclusión.
Los banners se crean a partir de imágenes (GIF o JPEG), o de animaciones creadas a partir de tecnologías como Java, Adobe Shockwave y, fundamentalmente, Flash, diseñadas con la intención de atraer la atención, resultar notorias y comunicar el mensaje deseado. Por lo tanto, estos banners no necesariamente mantienen la línea gráfica del sitio.
Todo tipo de sitios web son susceptibles de incluir toda clase de banners y otros formatos publicitarios, aunque en la mayoría de los casos, son los sitios con contenidos de mayor interés o con grandes volúmenes de tráfico los que atraen las mayores inversiones de los anunciantes.
Cada vez que un usuario accede a una página web concreta en la que se ha previsto la inclusión de un banner, éste es mostrado. Esto se conoce como "impresión". En los formatos habituales, cuando el usuario clica sobre el banner, automáticamente es redirigido a otro sitio web, decidido por el anunciante, lo que se conoce como "click through".
Cuando se pone el click through en relación con las impresiones se obtiene una tasa denominada ratio de click through (CTR en sus siglas en inglés) que mide el número de veces que alguien ha hecho click sobre el banner en relación al número de veces que se ha mostrado dicho banner -número total de impresiones-. Esta tasa puede variar muchísimo en función de cada campaña de publicidad pero se puede considerar situada en términos normales si ronda entre el 0,1% y el 1%.
Habitualmente, el CTR es el principal indicador que se emplea para medir la eficacia de una campaña de publicidad online. En ocasiones sirve también para determinar el coste que el anunciante pagará por la campaña, aunque fundamentalmente este coste viene determinado por el número de impresiones.
TIPS PARA BUENOS BANNERS
1. Un banner solo nos da unos cuantos segundos para capturar la atención del usuario, por lo que es vital que nuestros banners tengan un mensaje que implique "MIRAME A MI". Para esto, es necesario el uso adecuado de texto, colores y gráficas, tomando en cuenta el orden mencionado. Es bueno practicar con diferentes combinaciones de texto, hasta que se sienta que tiene un buen mensaje.
2. Según varios estudios, buen porcentaje de navegantes automáticamente ignoran los banners en sitios web a menos que mencionen un tema de su agrado. No podemos capturar la atención de todos los usuarios, pero si de visitantes que podrían familiarizarse con nuestros contenidos. Por esta razón, enfatizar en el tema de nuestro sitio es muy importante.
3. Los banners GIF animados tienen mayor facilidad para capturar la atención sobre banners estáticos, además que son casi el estándar impuesto debido a que los estáticos tienen muy poca efectividad en el medio.
4. Siempre en la primera escena de nuestros banners se debe enfatizar en una fase introductoria que haga énfasis en el beneficio de nuestros sitios. Que tenemos que valga la pena visitar? Que nos hace diferentes a los demás?
5. El uso de frases que impliquen curiosidad, humor, miedo o preguntas es recomendado para la primera escena de nuestros banners. Algunos ejemplos de lo anterior podría ser. "Sabía usted que ...", "Es usted de las personas que ...", "No se preocupe nunca más por el uso de ...", "Precaución, usted podría ...", etc.
6. A continuación de la frase introductoria, tomando en cuenta que de esta dependerá la atención del navegante en nuestro banner, se deben incluir varias escenas que expandan la información de nuestro sitio.
7. Es recomendable incluir algún logo, dirección web o identificación gráfica de nuestro sitio en todas las escenas. Lo anterior nos ayudará a mostrar una identificación de nuestro sitio ante los navegantes aunque no lo pulsen. Podría ser que eventualmente lo hagan luego de varias visualizaciones.
8. Aparte de los banners GIF animados, existen otras formas de crear banners como lo es la combinación de tablas y formularios (Banners HTML), banners en Flash o de Java. Estos tienen varios inconvenientes pues no pueden ser publicados en todos lados y en el caso de Flash y Java, no todos los usuarios tienen acceso. A pesar de esto se ha comprobado que son más efectivos pues permiten más variedad de animaciones e interactividad con el usuario.
9. En cuanto a tamaño, en pixeles los banners estándares son de 468x60 pixeles, existiendo también minibanners y banners de otras dimensiones, dependiendo del sitio que los exponga. En Kb, los banners no deben tener más de 10 kb de tamaño. A pesar que la mayoría de límites es de 15kb, tenemos que tomar muy cuenta que un banner demasiado grande tardará mucho en cargarse y entonces no será visualizado por el visitante. Estar por debajo de los 10 kb podría ser beneficioso si queremos mayores exposiciones efectivas. El uso de múltiples escenas con diferentes contenidos en banners animados puede aumentar el tamaño por lo que hay que considerar rehusar el contenido de otras escenas.
10. El uso de colores brillantes es más apropiado que colores oscuros como el negro que ha demostrado ser menos efectivo.
Entre los más efectivos puede mencionarse al Azul, amarillo, naranja y verde. También hay que aplicar colores que contrasten para que pueda leerse nuestro mensaje. El Amarillo en fondo rojo por ejemplo es más efectivo que el verde sobre fondo azul.
Otro color que puede beneficiarnos es el blanco, debido a que la mayoría de sitios de contenidos tienen este color de fondo. Crear un banner que aparente ser enlaces o alguna información dentro de otro sitio nos garantiza mayor posibilidad de que lo pulsen.
10. A todos nos gusta lo gratuito en Internet, por lo que la palabra GRATIS de de ser aplicable a nuestro sitio es una palabra efectiva y clave en la efectividad de los banners. Si existe algo que pueda considerarse gratis en nuestro sitio como un boletín, noticias, contenidos, evaluaciones de software o archivos, etc., hay que comentarlo.
11. Crear confusión en el banner anunciando algo que no verán en nuestro sitio podrá ser efectivo para ganar visualizaciones de nuestra página, pero no visitantes efectivos, por lo que no se deben hacer falsas promesas en los banners, pues al no encontrar lo anunciado, ganaremos un visitante enojado que difícilmente recomendará nuestro sitio.
12. A pesar de que los banners son conocidos como un medio publicitario, muchos navegantes no saben que hacer al ver un banner de su agrado. Se ha comprobado que incluir algun texto que implique pulsar el banner aumenta su cantidad de clicks, pues es una nota explicatoria: "Pulse Aquí", "Click Aquí", "Pulse para continuar", etc. son opciones que debemos tomar en cuenta para finalizar el banner.
13. La creación de varios banners con distintos conceptos nos da mayores opciones para promocionarnos y además nos permite evaluar su efectividad. Esto además nos permitirá tener una galería de nuestros banners en nuestro sitio para los visitantes que deseen tomarlos para sus sitio.
Algunos sitios para generar Banners Online
http://www.foroplus.net/hazban/
http://www.coder.com/creations/banner/
http://www.bannersketch.com/
http://www.thebannerpeople.com/
-----------------------------------------------------------------------------------------
Fuentes:
http://foro.elhacker.net/diseno_gra...nner_y_no_fracasar_en_el_intento-t6727.0.html
Wikipedia
http://www.webtaller.com/promocion/articulos/bannersefec.php
[mod] Tema movido a Tutorial de Diseño[/mod]