Hablando de Adsense - Parte II

Como ya les había anticipado, en ésta ocasión les mostraré algunos ejemplos de como utilizar a la opción “Anuncios o colores alternativos“.

Bien primero veamos un ejemplo de bloque de enlaces de 468 x 15 pixeles. Para comenzar hay que ver que opciones son las que te brinda adsense para la configuración de tu bloque de enlaces y son las siguientes:

  • Borde
  • Vínculos
  • Fondo

De modo que trataremos de hacer nuestro anuncio lo mas parecido a los que muestra Adsense para que no se note el cambio.

Digamos que el ad que configuraste con Adsense tiene las siguientes características:

Enlaces:

  • 4 enlaces por bloque

Colores:

  • Borde #000000 (negro)
  • Vínculos #3D81EE (azul)
  • Fondo #FFFFFF (blanco)

Lo cual genera un bloque de vinculos como este:

Para generar nuestro anuncio lo mas parecido al de Adsense podemos utilizar 3 diferentes maneras de estilos;

  • En línea (que afectan a una sola etiqueta)
  • Embebidos (todos los estilos en el encabezado)
  • ó

  • Asociados (los estilos en un archivo separado CSS)

Con cualquiera de las 3 opciones funciona, la más recomendable por supuesto es la última ya que puedes generar un solo archivo para todos tus anuncios y asi es mucho mas sencillo, cuando tengas que hacer modificaciones, las haces en un solo archivo.

A diferencia de los anuncios de Adsense, en los tuyos si les puedes incluir imágenes y hasta flash, pero éste último no es muy recomendable por el tema del Page Rank. ¡Si! Tus ads adquieren y generan Page Rank al igual que los de adsense, a menos que les agregues rel=”nofollow”.

Bien, regresándo al tema que nos interesa, el codigo para nuestro anuncio sería algo así para el html:

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>muestra-468x15-azul-negro</title>
<link href="estilo.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<span class="ADS">Ads</span> <a href="http://futbol.la100rra.com.mx/" target="_blank">F&uacute;tbol Mexicano</a> <a href="http://diversiongratis.la100rra.com.mx/archives/category/galilea-montijo" target="_blank">Galilea Montijo</a> <a href="http://la100rra.com.mx/blog/archives/500" target="_blank">Hablando de Adsense I</a> <a href="http://diversiongratis.la100rra.com.mx/horoscopo" target="_blank">Hor&oacute;scopo</a> <a href="http://la100rra.com.mx/blog/archives/540" target="_blank">CSS</a>
</div>
</body>
</html>

Y así para el CSS (en este caso el archivo CSS deberá estar en el mismo directorio que el html):

@charset "utf-8";
/* CSS Document */
*{
	margin: 0;
	padding: 0;
}
 
body{ 
	background: #FFF;
	margin: 0;
	padding: 0;
	border: 0;
	font: 11px Verdana, Arial, Helvetica, sans-serif;
}
 
#container {
	width:468px;
	height:15px;
}
 
.ADS {
	color: #000000;
	font-size:11px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
	margin: 0pt 1px 0px 1pt;
}
 
a {
	color: #3D81EE;
	font-size:11px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight:400;
	margin: 0 2px 0 1px;
}

con éste código, se genera un bloque de vinculos como el siguiente:

Click para verlo en línea

Click para verlo en línea

Puedes descargar de los siguientes enlaces el archivo html y css para que lo utilices en tu blog o sitio web, modificandolo de acuerdo a tus necesidades ;)
Descargar: [ hablando-de-adsenseII | RAR ] | [ hablando-de-adsenseII ZIP ]

En el siguiente artículo les mostraré como hacer un bloque de anuncios de 468 x 60 pixeles y de igual manera dejaré el enlace para descargar el archivo de manera que lo puedas utilizar con hacerle solo unas cuantas modificaciones ;)

Articulos Relacionados:



3 Responses to “Hablando de Adsense - Parte II”

  1. Información Bitacoras.com…

    Valora en Bitacoras.com: Como ya les había anticipado, en ésta ocasión les mostraré algunos ejemplos de como utilizar a la opción ?Anuncios o colores alternativos?. Bien primero veamos un ejemplo de bloque de enlaces de 468 x 15 pixeles. Para come…

  2. FeNtO dice:

    Interesnte de hecho seguire esta secuencia por que esoty teniendo bastante dudas con adsense

Leave a Reply