Etiqueta Canonical URL para combatir el contenido duplicado en Blogger

 Una de las cosas más difíciles de conseguir cuando se administra un blog es evitar el contenido duplicado que nosotros mismos generamos. Para mejorar los resultados de nuestra página en los buscadores, hay que intentar destacar el contenido más importante --los posts-- sobre el contenido duplicado que se genera en las páginas de archivos por fecha, en las de etiquetas, en las de categorías o en las de autores.

 Los buscadores Google, Yahoo y Live ya han incorporado una nueva etiqueta, Canonical URL, que ha sido creada para ayudarnos a combatir el contenido duplicado que se genera de forma automática en nuestros sitios. Más que una etiqueta HTML nueva, en realidad se trata de un atributo de la etiqueta link:

<link rel="canonical" href="http://AQUÍ URL PRINCIPAL/" />

 Esta etiqueta informa a los buscadores de que la página que están rastreando es irrelevante y de que el contenido primordial está en la página a la que hace referencia el atributo href. Para utilizarla en Blogger, hay que implementar el siguiente código condicional en el HEAD de la plantilla, debajo de TITLE:

<b:if cond='data:blog.url != data:blog.homepageUrl'>  
 <b:if cond='data:blog.pageType == "index"'>    
  <link href='http://AQUÍ URL PRINCIPAL/' rel='canonical'/>  
 </b:if>   
 <b:if cond='data:blog.pageType == "archive"'>    
  <link href='http://AQUÍ URL PRINCIPAL/' rel='canonical'/>  
 </b:if>
</b:if>

Asynchronous Tracking, el nuevo script de Google Analytics

 Los scripts del código de seguimiento de Google Analytics que aún se están utilizando son urchin.js y ga.js, pero ya hay que ir pensando en efectuar la migración al nuevo Asynchronous Tracking. No se pueden utilizar dos scripts de seguimiento al mismo tiempo, así que para poder utilizar el nuevo Asynchronous Tracking, previamente se ha de eliminar de la plantilla el viejo urchin.js o el menos viejo ga.js.

 Este es un ejemplo del código del "viejo" script ga.js, que se colocaba antes del elemento resaltado en rojo:

<script type="text/javascript"> 
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); 
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); 
</script> 
<script type="text/javascript"> 
try{ 
var pageTracker = _gat._getTracker("UA-XXXXXXX-Y"); 
pageTracker._trackPageview(); 
} catch(err) {}</script> 
</body>

 Y este es un ejemplo del código del nuevo Asynchronous Tracking, en el que hemos de sustituir UA-XXXXXXX-Y por nuestro número de identificación de la propiedad web asignado en la correspondiente cuenta abierta en Google Analytics (el código ha de insertarse en la plantilla, antes del elemento resaltado en rojo):

<script type="text/javascript"> 
  var _gaq = _gaq || []; 
  _gaq.push(['_setAccount', 'UA-XXXXXXX-Y']); 
  _gaq.push(['_trackPageview']); 
  (function() { 
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; 
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; 
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); 
  })(); 
</script>
 </head>

IE9.js para que Internet Explorer soporte los estándares

 Son varias las alternativas más avanzadas del CSS que aún no han sido implementadas en el navegador Internet Explorer, aunque algunas de ellas llevan ya un tiempo funcionando en la versión más reciente de IE8 y se mejorarán en IE9. Para hacer frente a estas y otras carencias, convirtiendo a IE en un navegador compatible con los estándares, el programador y diseñador de webs Dean Edwards ha creado una serie de scripts que podemos cargar directamente desde nuestra plantilla, sin necesidad de tenerlos que alojar nosotros personalmente. La última versión de la librería JavaScript IE7.js/IE8.js/IE9.js se puede consultar en Google Code. No es necesario incluir en la plantilla los scripts IE7.js/IE8.js cuando se está utilizando IE9.js.

 Para utilizar este script, lo único que hay que hacer es añadir el siguiente código antes del elemento resaltado en rojo:

<!--[if lt IE 9]><script src="http://ie7-js.googlecode.com/svn/version/2.1(beta3)/IE9.js"></script><![endif]--> 
 </head>

Añadir listas largas en un espacio pequeño

 Para mostrar una lista larga en un espacio más reducido del que normalmente ocuparía, lo más sencillo es incluir dicha lista en un bloque contenedor al que se han de aplicar las propiedades overflow, height y width, con sus respectivos valores:

<div style="height: 145px; overflow: auto; width: 300px;"><ul>
<li>AQUÍ TEXTO1.</li>
<li>AQUÍ TEXTO2.</li>
<li>AQUÍ TEXTO3.</li>
<li>AQUÍ TEXTO4.</li>
</ul></div>

• Castillo Santuario de Javier.
• Castillo de Marcilla.
• Castillo Palacio de Olite.
• Colegiata de la Fortaleza de Alquézar.
• Castillo de Íscar.
• Castillo de Loarre.
• Castillo de Monzón, Huesca.
• Torre del Castillo de Samitier.
• Patio de armas del Castillo de Aínsa.
• Castillo de Coca.
• Entrada del Castillo de Mombeltrán.
• Castillo del Condestable Dávalos.
• Castillo de Arévalo.
• Castillo de La Mota.
• Castillo de Turégano.
• Castillo de Cuéllar.
• Castillo de Pedraza.
• Castillo de Monleón.
• Alcázar de Segovia.
• Castillo de Tiedra.
• Castillo de Ucero.

 Lo mismo que hemos hecho con una lista no ordenada lo podemos hacer con imágenes. En este ejemplo, las imágenes utilizadas aparecen centradas:

<div style="text-align: center;"><div style="height: 218px; margin: auto; overflow: auto; text-align: center; width: 200px;"><a href="http://AQUÍ URL1" onclick="this.target='_blank'" rel="nofollow" title="AQUÍ TÍTULO1"><img alt="AQUÍ TÍTULO breve1" src="http://AQUÍ URL de IMAGEN1" title="AQUÍ TÍTULO visible al pasar CURSOR1" /></a> 
<a href="http://AQUÍ URL2" onclick="this.target='_blank'" rel="nofollow" title="AQUÍ TÍTULO2"><img alt="AQUÍ TÍTULO breve2" src="http://AQUÍ URL de IMAGEN2" title="AQUÍ TÍTULO visible al pasar CURSOR2" /></a> 
<a href="http://AQUÍ URL3" onclick="this.target='_blank'" rel="nofollow" title="AQUÍ TÍTULO3"><img alt="AQUÍ TÍTULO breve3" src="http://AQUÍ URL de IMAGEN3" title="AQUÍ TÍTULO visible al pasar CURSOR3" /></a></div></div>