<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Maison De L&#039;Art</title>
	<atom:link href="http://blog.maisondelart.net/feed" rel="self" type="application/rss+xml" />
	<link>http://blog.maisondelart.net</link>
	<description>Blog de CSS, Jquery, Wordpress y diseño</description>
	<lastBuildDate>Mon, 28 Sep 2009 19:50:53 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.4</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Inudge: cuando Flash es realmente útil</title>
		<link>http://blog.maisondelart.net/noticias/inudge-cuando-flash-es-realmente-util</link>
		<comments>http://blog.maisondelart.net/noticias/inudge-cuando-flash-es-realmente-util#comments</comments>
		<pubDate>Mon, 28 Sep 2009 19:50:53 +0000</pubDate>
		<dc:creator>Hans</dc:creator>
				<category><![CDATA[Noticias]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[Inudge]]></category>

		<guid isPermaLink="false">http://blog.maisondelart.net/?p=43</guid>
		<description><![CDATA[Vía Menéame, descubrimos la fantástica aplicación Inudge, una aplicación en Flash con la que podemos realizar melodías polifónicas de forma muy visual:


Contiene 8 pistas de un color cada una. En cada pista, &#8220;pintamos&#8221; cada bloque, entendiendo que cada bloque, en cada línea y a cada altura, representa un golpe de sonido diferente. Además, podemos elegir [...]]]></description>
			<content:encoded><![CDATA[<p>Vía <a href="http://meneame.net/story/inudge-sequenciador-8-instrumentos-online">Menéame</a>, descubrimos la fantástica aplicación <a href="http://inudge.net">Inudge</a>, una aplicación en Flash con la que podemos realizar melodías polifónicas de forma muy visual:</p>
<p><a href="http://blog.maisondelart.net/img/2009/09/inudge.jpg"><img class="aligncenter size-medium wp-image-44" title="Inudge" src="http://blog.maisondelart.net/img/2009/09/inudge-500x227.jpg" alt="Inudge" width="500" height="227" /></a><br />
<a href="http://blog.maisondelart.net/img/2009/09/inudge1.jpg"><img class="aligncenter size-full wp-image-45" title="Inudge" src="http://blog.maisondelart.net/img/2009/09/inudge1.jpg" alt="Inudge" width="412" height="418" /></a></p>
<p>Contiene 8 pistas de un color cada una. En cada pista, &#8220;pintamos&#8221; cada bloque, entendiendo que cada bloque, en cada línea y a cada altura, representa un golpe de sonido diferente. Además, podemos elegir la longitud, volumen y velocidad de cada patrón.</p>
<p>Una herramienta que representa uno de esos pocos casos donde Flash resulta útil y cumple su función. Cabe advertir que esta aplicación es <strong>muy adictiva</strong>.</p>
<p>Si os gusta, no os perdáis su versión &#8220;pro&#8221;, <a href="http://www.hobnox.com/index.1056.de.html">Hobnox</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.maisondelart.net/noticias/inudge-cuando-flash-es-realmente-util/feed</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Web trend map 4: el póster de la web 2.0 para geeks</title>
		<link>http://blog.maisondelart.net/noticias/web-trend-map-4-el-poster-de-la-web-2-0-para-geeks</link>
		<comments>http://blog.maisondelart.net/noticias/web-trend-map-4-el-poster-de-la-web-2-0-para-geeks#comments</comments>
		<pubDate>Sat, 05 Sep 2009 13:10:47 +0000</pubDate>
		<dc:creator>Hans</dc:creator>
				<category><![CDATA[Noticias]]></category>
		<category><![CDATA[geek]]></category>
		<category><![CDATA[Web 2.0]]></category>

		<guid isPermaLink="false">http://blog.maisondelart.net/?p=38</guid>
		<description><![CDATA[El Web Trend Map 4 es el mapa de la red de metro de Tokyo, orientado a la web 2.0, donde verás gráficamente las empresas y servicios más destacados de la red en forma de línea de metro.]]></description>
			<content:encoded><![CDATA[<p>En <strong><a href="http://informationarchitects.jp/wtm4/">Information Architects</a></strong> han elaborado un curiosísimo mapa, bastante interesante, que describe la situación de la web 2.0 a nivel mundial, ofreciendo una conexión gráfica entre servicios y medios de información en Internet más destacados.</p>
<p>Se trata de un mapa similar a la red de metro de Tokyo, donde vemos de forma gráfica cuáles son los medios y servicios del &#8220;centro&#8221; de Internet, y cuáles son también importantes, pero que pertenecen al &#8220;extrarradio&#8221; cibernético, como sería el caso de <a href="http://www.elpais.com">El País</a> o <a href="http://www.elmundo.es">El Mundo</a> (que ya es un detalle que los consideren importantes).</p>
<p><a href="http://blog.maisondelart.net/img/2009/09/wtm4-final.jpg"><img class="aligncenter size-medium wp-image-39" title="Web trend map 4" src="http://blog.maisondelart.net/img/2009/09/wtm4-final-500x353.jpg" alt="Web trend map 4" width="500" height="353" /></a></p>
<p>Cada color de cada línea, representa un sector de Internet: noticias, economía, entretenimiento, aplicaciones&#8230; Y, justo debajo, vemos un trayecto plano de las 50 &#8220;paradas&#8221; más importantes de la red (de metro).</p>
<p>Toda una obra de arte que merece ser impresa. Porque, si te ha gustado el invento, tienes la posibilidad de <strong>comprarlo</strong> en formato póster por 68.50 dólares (<strong>48,17 euros</strong> a día de hoy) en un formato de 0,8&#215;1,2 metros:</p>
<form id="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post"><fieldset></p>
<input name="cmd" type="hidden" value="_s-xclick" />
<input name="hosted_button_id" type="hidden" value="5674432" />
<input alt="PayPal" name="submit" src="https://www.paypal.com/en_US/i/btn/btn_buynow_LG.gif" type="image" /><img src="https://www.paypal.com/en_US/i/scr/pixel.gif" alt="" width="1" height="1" /></fieldset></form>
<p>El mapa está impreso en <strong>la  empresa que imprime la publicidad de Apple en Japón</strong>. Puedes ver el proceso de realización e impresión en su <a href="http://www.flickr.com/photos/formforce/sets/72157618763429973/">galería en Flickr</a>:</p>
<p><a href="http://blog.maisondelart.net/img/2009/09/3569168244_835ec5f3b3_b.jpg"><img class="aligncenter size-medium wp-image-41" title="Imprimiendo el Web Trend Map 4 - WTM4" src="http://blog.maisondelart.net/img/2009/09/3569168244_835ec5f3b3_b-500x334.jpg" alt="Imprimiendo el Web Trend Map 4 - WTM4" width="500" height="334" /></a></p>
<p><strong>Descargar PNG original</strong> (2,9 mb):</p>
<ul>
<li><a href="http://informationarchitects.jp/wp-content/uploads/2009/07/wtm4-final.png">Fuente original</a>.</li>
<li><a href="http://www.photolizer.com/Photo%20Studies/Graphic/Data%20Visualization/wtm4-final.png">Photolizer</a> (descarga alternativa).</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://blog.maisondelart.net/noticias/web-trend-map-4-el-poster-de-la-web-2-0-para-geeks/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Desinstalar Safari 4 para volver a Safari 3.2.3 en Mac Os X</title>
		<link>http://blog.maisondelart.net/trucos/desinstalar-safari-4-para-volver-a-safari-3-2-3-en-mac-os-x</link>
		<comments>http://blog.maisondelart.net/trucos/desinstalar-safari-4-para-volver-a-safari-3-2-3-en-mac-os-x#comments</comments>
		<pubDate>Tue, 01 Sep 2009 14:00:22 +0000</pubDate>
		<dc:creator>Hans</dc:creator>
				<category><![CDATA[Trucos]]></category>
		<category><![CDATA[Mac Os X]]></category>
		<category><![CDATA[Safari]]></category>

		<guid isPermaLink="false">http://blog.maisondelart.net/?p=34</guid>
		<description><![CDATA[A muchos usuarios de Mac Os X, nos está dando muchos problemas Safari 4. Por desgracia, Apple ha seguido, últimamente, una muy restrictiva política que hace sea altamente complicado deshacerse de las últimas versiones de Itunes o Safari.]]></description>
			<content:encoded><![CDATA[<p>La solución más rápida a tal drástico problema, sería formatear nuestro sistema, pero hay una solución menos dolorosa. Vamos a ofrecer una solución para Tiger y Leopard, ambas diferentes.</p>
<p>Antes de comenzar, debemos desinstalar <strong>Safari 4</strong> con <strong><a href="http://freemacsoft.net/AppCleaner/">Appcleaner</a></strong>. Por defecto, Appcleaner impide desinstalarlo porque lo considera una aplicación protegida. Para que se desbloquee esta opción, elegimos las preferencias de Appcleaner, y desmarcamos la casilla <em>Protect default apps</em>:</p>
<p><a href="http://blog.maisondelart.net/img/2009/08/Appcleaner.jpg"><img class="aligncenter size-full wp-image-36" title="Appcleaner" src="http://blog.maisondelart.net/img/2009/08/Appcleaner.jpg" alt="Appcleaner" width="319" height="403" /></a></p>
<p>Ahora, puedes desinstalar <strong>Safari 4</strong> sin problemas. Una vez lo hayas arrastrado a <strong>Appcleaner</strong>, se guardará en la papelera, así que es necesario que la vacíes. A continuación, vamos a <strong>instalar Safari 3.2.3</strong>:</p>
<h3>Solución para Leopard</h3>
<ol>
<li>Descargar <strong><a href="http://www.charlessoft.com/">Pacifist</a></strong>.</li>
<li>Descarga <strong>Safari 3.2.3</strong> para <a href="http://support.apple.com/downloads/Safari_3_2_3_for_Leopard">Leopard/ Snow Leopard</a> (10.5/ 10.6).</li>
<li>Abre el instalador (.pkg) con <strong>Pacifist</strong>.</li>
<li>Selecciona la pestaña Resources y despliega el paquete de Safari 3.2.3.</li>
<li>Selecciona el archivo &#8220;Payload&#8221; y extráelo en el escritorio pulsando en Extract to (<strong><a href="http://blog.maisondelart.net/img/2009/08/Pacifist.jpg">ver imagen</a></strong>).</li>
<li>Haz doble clic en el archivo descargado, que se debería duplicar en forma de archivo .ZIP.</li>
<li>Abre ese ZIP y se extraerá una nueva carpeta. Dentro de ella, existe otra carpeta llamada Applications.</li>
<li>Dentro de la carpeta Applications, está el icono de Safari 3.2.3.</li>
<li><strong>Arrástralo a Aplicaciones y todo habrá terminado</strong>.</li>
</ol>
<h3>Solución para Tiger</h3>
<ol>
<li>Descargar <strong><a href="http://www.charlessoft.com/">Pacifist</a></strong>.</li>
<li>Descarga <strong>Safari 3.2.3</strong> para <a href="http://support.apple.com/downloads/Safari_3_2_3_for_Leopard"></a><a href="http://support.apple.com/downloads/Safari_3_2_3_for_Tiger">Tiger</a> (10.4).</li>
<li>Abre el instalador (.pkg) con <strong>Pacifist</strong>.</li>
<li>Despliega el paquete (.dmg) y, dentro de él, el instalador (.pkg), y luego la carpeta Applications.</li>
<li>La carpeta Applications contiene la aplicación Safari.app que deseamos. Hacemos <strong>un clic</strong> sobre ella y pulsamos en &#8220;Extract to&#8230;&#8221; (<strong><a href="http://blog.maisondelart.net/img/2009/08/Pacifist-Tiger.jpg">ver esta imagen</a></strong>).</li>
<li>Elegimos la carpeta Aplicaciones como destino, y ahí <strong>se extraerá la versión 3.2.3 de Safari</strong>.</li>
</ol>
<p>Esta es la solución para Tiger, algo más sencilla que para Leopard. Si alguien tiene problemas para deshacerse de Safari 4 en Windows y quiere volver a la versión anterior, podéis usar los comentarios para ofrecer soluciones en Windows.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.maisondelart.net/trucos/desinstalar-safari-4-para-volver-a-safari-3-2-3-en-mac-os-x/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Cufón: usando nuestros propios tipos de letra en la web</title>
		<link>http://blog.maisondelart.net/javascript/cufon-usando-nuestros-propios-tipos-de-letra-en-la-web</link>
		<comments>http://blog.maisondelart.net/javascript/cufon-usando-nuestros-propios-tipos-de-letra-en-la-web#comments</comments>
		<pubDate>Fri, 07 Aug 2009 19:20:29 +0000</pubDate>
		<dc:creator>Hans</dc:creator>
				<category><![CDATA[Javascript]]></category>
		<category><![CDATA[Cufón]]></category>
		<category><![CDATA[Jquery]]></category>

		<guid isPermaLink="false">http://blog.maisondelart.net/?p=29</guid>
		<description><![CDATA[Desde hace tiempo, los desarrolladores web hemos buscado muchas maneras de mostrar nuestros propios tipos de letra en pantalla. Aunque existen nuevos métodos para hacerlo posible de forma "legal" en CSS3, vamos a explicar cómo hacerlo de forma sencilla en Javascript gracias a Cufón.]]></description>
			<content:encoded><![CDATA[<p>Existen diferentes métodos para utilizar nuestras propias tipografías más allá de las estandarizadas (Times, Tahoma, Trebuchet, Arial y Verdana).</p>
<p>Las más utilizadas son las siguientes:</p>
<ul>
<li>Exportar el texto en forma de imagen, y <a href="http://www.google.es/search?q=reemplazar+texto+imagenes+css">usar CSS para reemplazarlo</a>.</li>
<li>Utilizar imágenes, de forma directa (con la etiqueta <em>img</em>), con el contenido dentro del texto alternativo (poco recomendado).</li>
<li>Utilizar <strong>Flash</strong> (no recomendado).</li>
</ul>
<h3>Instrucciones para comenzar</h3>
<p>Desde hace tiempo, tenemos disponible el método <a href="http://cufon.shoqolate.com"><strong>Cufón</strong></a>. Este método consiste en transformar texto en imágenes de forma automática, con un fantástico método <strong>Javascript</strong>, en 3 pasos:</p>
<ol>
<li>Ve al <a href="http://cufon.shoqolate.com/generate/">generador</a> y sube una fuente en formato <strong>TrueType</strong> (TTF), <strong>OpenType</strong> (OTF), <strong>Printer Font Binary</strong> (PFB) o <strong>PostScript</strong>. Procura, además, que la fuente esté abierta, ya que no todas las fuentes de los formatos admitidos, serán aceptadas. Si es posible, sube las 4 variantes: regular, negrita, cursiva y negrita cursiva.</li>
<li>En el apartado &#8220;<strong><em>Include the following glyphs (if available)</em></strong>&#8220;, marca la casilla <em>All</em>.</li>
<li>No es imprescindible personalizar ningún campo más, así que acepta las condiciones de uso. Se descargará un fichero .js que contendrá la fuente &#8220;transformada&#8221; en <strong>Javascript</strong>.</li>
<li>Descarga, <a href="http://cufon.shoqolate.com/generate/">en la página del generador</a>, el archivo de <strong>Cufón</strong> en &#8220;Download&#8221;.</li>
</ol>
<p>Una vez tenemos el archivo de nuestro tipo de letra y el archivo de Cufón (<em>cufon-yui.js</em>), vamos a implementarlos en nuestra web:</p>
<pre id="line1">&lt;<span>script</span><span> src</span><span>="</span>/js/cufon.js<span>" </span><span>type</span>=<span>"text/javascript"</span>&gt;&lt;/<span>script</span>&gt;
&lt;<span>script</span><span> src</span><span>="</span>/js/fuente.js<span>" </span><span>type</span>=<span>"text/javascript"</span>&gt;&lt;/<span>script</span>&gt;
&lt;<span>script</span><span> src</span><span>="/js/</span>jquery.min.js<span>" </span><span>type</span>=<span>"text/javascript"</span>&gt;&lt;/<span>script</span>&gt;</pre>
<p>Como veréis, hemos introducido, también, a <strong>Jquery</strong>. <strong>Jquery es imprescindible para que </strong><strong>Cufón funcione en algunos navegadores</strong>, como <strong>Firefox 3.0</strong> u <strong>Opera</strong>, ya que necesitan la ayuda de un selector como <strong>Jquery</strong> para funcionar.</p>
<h3>Ejemplos de uso</h3>
<p>A continuación, añadimos el primer código:</p>
<pre>&lt;script type="text/javascript"&gt;
 Cufon.replace('h1, h2');
&lt;/script&gt;</pre>
<p>En este ejemplo, estamos transformando los encabezamientos <em>h1</em> y <em>h2</em>. Ahora, vamos a rizar el rizo:</p>
<pre>&lt;script type="text/javascript"&gt;
 Cufon.replace('h2 a',{hover:true,hoverables:{a:true}});
 Cufon.replace('h3', {textShadow: '#37241d 1px 1px 1px', color: '-linear-gradient(#c1a681, #5e472f, #5e472f)'});
&lt;/script&gt;</pre>
<p>En este ejemplo, estamos transformando un enlace dentro de un encabezado de segundo nivel (<em>h2 a</em>) y que funcione la propiedad <em>a:hover</em>. Además, a todos los encabezados de tercer nivel (h3), estamos diciéndoles que <strong>usen una sombra</strong>, con los siguientes datos: <em>#37241d</em> (color) y <em>1px 1px 1px</em> (dispersión de la sombra, píxeles de posición horizontal y píxeles de posición vertical). También estamos añadiéndole, además, un <strong>degradado de color</strong>, introduciendo tantos valores como colores de degradado queramos (en nuestro ejemplo, 3 colores). <strong>Este es el ejemplo para el H3</strong>:</p>
<p><a href="http://blog.maisondelart.net/img/2009/08/h3.png"><img class="aligncenter size-full wp-image-30" title="Cufón on H3 with linear gradient and shadow" src="http://blog.maisondelart.net/img/2009/08/h3.png" alt="Cufón on H3 with linear gradient and shadow" width="167" height="46" /></a></p>
<p>En principio, las propiedades como la negrita, subrayado, cursiva, versalitas y otras, se pueden modificar directamente desde el CSS.</p>
<p><a href="http://wiki.github.com/sorccu/cufon/styling">En este enlace</a> tienes explicadas todas las posibilidades para darle estilo a tus fuentes <strong>Cufón</strong>. Como último consejo, es preferible que utilices un HTML con declaración estricta o, mejor aún, HTML5 para evitar posibles errores a la hora de dar estilos.</p>
<p>Más información:</p>
<ul>
<li><a href="http://wiki.github.com/sorccu/cufon"><strong>Cufón</strong></a></li>
<li><a href="http://cufon.shoqolate.com/generate/"><strong>Cufón generator</strong></a></li>
<li><strong><a href="http://wiki.github.com/sorccu/cufon/demos">Demos</a><br />
</strong></li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://blog.maisondelart.net/javascript/cufon-usando-nuestros-propios-tipos-de-letra-en-la-web/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Wordpress, JQuery y Cross Slide: soluciones</title>
		<link>http://blog.maisondelart.net/wordpress/wordpress-jquery-y-cross-slide-soluciones</link>
		<comments>http://blog.maisondelart.net/wordpress/wordpress-jquery-y-cross-slide-soluciones#comments</comments>
		<pubDate>Wed, 22 Jul 2009 00:07:44 +0000</pubDate>
		<dc:creator>Hans</dc:creator>
				<category><![CDATA[Javascript]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[Cross Slide]]></category>
		<category><![CDATA[plugins]]></category>

		<guid isPermaLink="false">http://blog.maisondelart.net/?p=28</guid>
		<description><![CDATA[Muchos somos habituales a plugins de JQuery tan útiles como Cross Slide, un impecable sistema de presentación de imágenes sin necesidad de usar Flash, pero no es tan sencillo implementarlo en Wordpress.]]></description>
			<content:encoded><![CDATA[<p><strong>Wordpress</strong>, desde hace varias versiones, viene de serie con su propia versión de <strong>JQuery</strong>, una versión mejorada del original con mejoras en CSS y otras modificaciones. Si sois usuarios del <em>plugin</em> <strong>Cross Slide</strong> sobre un tema en <strong>Wordpress</strong>, habréis visto que no funciona, debido a que no se llega a entender con el <strong>JQuery</strong> modificado de <strong>Wordpress</strong>.</p>
<p>Existen dos soluciones a este problema:</p>
<ol>
<li>Descargarse el original desde la web oficial de <strong>Jquery</strong> y sobreescribirlo en la carpeta <em>wp-includes/js/jquery/</em> en cada actualización de <strong>Wordpress</strong> (en caso de que uséis la actualización automática).</li>
<li>Usar una solución temporal más sencilla, sólo tocando el archivo wp-config.php, añadiendo una de las siguientes dos opciones:
<ul>
<li>
<pre>define('CONCATENATE_SCRIPTS', false );</pre>
</li>
<li>
<pre>define('SCRIPT_DEBUG', true);</pre>
</li>
</ul>
</li>
</ol>
<p>Cualquiera de las dos opciones es válida, aunque la segunda es mucho más cómoda. Seguramente, existirán incompatibilidades con otros <em>plugin</em> de <strong>Jquery</strong>, así que es conveniente, mientras llega una solución, usar el método del <em>wp-config.php</em>.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.maisondelart.net/wordpress/wordpress-jquery-y-cross-slide-soluciones/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>¿Qué es el atributo rel? Nofollow y otros valores</title>
		<link>http://blog.maisondelart.net/xhtml/%c2%bfque-es-el-atributo-rel-nofollow-y-otros-valores</link>
		<comments>http://blog.maisondelart.net/xhtml/%c2%bfque-es-el-atributo-rel-nofollow-y-otros-valores#comments</comments>
		<pubDate>Tue, 05 May 2009 13:36:52 +0000</pubDate>
		<dc:creator>Hans</dc:creator>
				<category><![CDATA[XHTML]]></category>
		<category><![CDATA[Atributos]]></category>
		<category><![CDATA[enlaces]]></category>
		<category><![CDATA[nofollow]]></category>

		<guid isPermaLink="false">http://blog.maisondelart.net/?p=26</guid>
		<description><![CDATA[Es una de las opciones más utilizadas y menos explicadas, ya que no existe demasiado control ni estándar sobre el atributo "rel". Vamos a introducir de forma ordenada y fácil una explicación de un puñado de opciones que ofrece este atributo.]]></description>
			<content:encoded><![CDATA[<p>Existe poca información bien explicada en español acerca del atributo <em>rel</em>, y vamos a explicar qué es ese atributo que tanto uso tiene y que se empezó a poner de moda cuando el XHTML se deshizo del atributo <em>target</em>.</p>
<p>El atributo rel da información sobre la relación que tiene el enlace que lo contiene con tu sitio. Veamos un ejemplo:</p>
<p><code>&lt;a href="http://www.technorati.com" rel="follow"&gt;Technorati&lt;/a&gt;</code></p>
<p>Aquí le estamos diciendo al buscador que siga el enlace externo a nuestra página. Veamos una lista de valores para el atributo rel, y qué significan para los robots de los buscadores:</p>
<ul>
<li><strong><em>Follow</em></strong>: se usa para enlaces ajenos a nuestra página e indica que queremos que ese enlace sea tenido en cuenta y ayude a posicionar su contenido en un buscador.</li>
<li><strong><em>Nofollow</em></strong>: el más popular de los valores para rel, también se usa para enlaces ajenos, pero con él indicamos que no queremos que el robot lo tenga en cuenta, es decir, el contenido del enlace no será relevante a la hora de posicionar ese texto en un buscador. Viene por defecto en el cajón de comentarios de Wordpress, cuando implementamos el <em>comment_author_link</em> en el <em>comments.php</em>.</li>
<li><strong><em>Tag</em></strong>: se usa para determinar que estamos apuntando a una página que contiene información sobre una etiqueta o palabra, tanto de nuestra propia página como de una página ajena. Por ejemplo:
<ul>
<li><code>&lt;a href="/tag/css" rel="tag"&gt;CSS&lt;/a&gt;</code></li>
</ul>
</li>
<li><em><strong>Next</strong></em>: este valor se usa para paginación de contenidos. Por ejemplo, cuando estamos en la página 3 de una lista de archivos o una búsqueda, el enlace a la página 4 se mostraría de la siguiente manera:
<ul>
<li> <code>&lt;a href="page/4/" rel="next"&gt;Página 4&lt;/a&gt;</code></li>
</ul>
</li>
<li><strong><em>Previous</em></strong>: es el mismo valor que <em><strong>next</strong></em>, pero a la inversa. Indica que estamos apuntando a la página anterior.</li>
<li><strong><em>Index</em></strong>: muy parecido al valor <em><strong>follow</strong></em>, pero aquí no se trata de pedir que ese enlace sea o no tenido en cuenta, sino que estamos diciéndole al robot que lo publique en el buscador, que es diferente.</li>
<li><em><strong>Noindex</strong></em>: lógicamente, es lo contrario de <em><strong>index</strong></em>. Con este valor, estamos pidiendo al robot que no incluya ese enlace en su buscador, aunque sólo es una petición, lo cual no quiere decir que ese enlace no vaya a estar en el buscador, ya que otras páginas pueden apuntar a ese enlace. Si eres el dueño de una página que no quieres que se  publique en buscadores, debes poner este código en el <em>head</em>:
<ul>
<li> <code>&lt;meta name="Robots" content="noindex" /&gt;</code></li>
</ul>
</li>
<li><strong><em>Alternate</em></strong>: indica una disponibilidad de nuestro documento en otra versión. Por ejemplo, si nuestro artículo también está en PDF, lo enlazamos así:
<ul>
<li> <code>&lt;a href="articulo.pdf" rel="alternate"&gt;Versión en PDF&lt;/a&gt;</code></li>
</ul>
</li>
</ul>
<p>Después, existe una lista de atributos menores, aunque todavía hay muchos más:</p>
<ul>
<li><em><strong>Copyright</strong></em>: el enlace apunta a una página que contiene los derechos de autor del artículo o de nuestra página.</li>
<li><em><strong>Glossary</strong></em>: indica que el enlace consiste en un glosario de términos.</li>
<li><em><strong>Help</strong></em>: indica que el enlace apunta a una página de ayuda.</li>
<li><em><strong>Search</strong></em>: indica que el enlace apunta a una página de búsqueda o de resultados de búsqueda.</li>
<li><em><strong>Index</strong></em>: indica que el enlace apunta a la portada de nuestra página.</li>
</ul>
<p><strong>Información adicional</strong>:</p>
<ul>
<li><a href="http://manual-xhtml.blogspot.com/2006/05/enlaces-vnculos-y-anchor.html">Enlaces, vínculos y anchor (Manual XHTML)</a></li>
<li><a href="http://www.minid.net/2005/06/16/rel-aciona/">Rel-aciona (Minid.net)</a></li>
<li><a href="http://www.htmlquick.com/es/reference/tags/link.html">Tag HTML link (HTMLquick.com)</a></li>
<li><a href="http://www.ojomicroformatos.com/microformatos/">Microformatos en OJOmicroformatos</a></li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://blog.maisondelart.net/xhtml/%c2%bfque-es-el-atributo-rel-nofollow-y-otros-valores/feed</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Douglas Bowman se marcha de Google</title>
		<link>http://blog.maisondelart.net/noticias/douglas-bowman-se-marcha-de-google</link>
		<comments>http://blog.maisondelart.net/noticias/douglas-bowman-se-marcha-de-google#comments</comments>
		<pubDate>Wed, 25 Mar 2009 22:19:16 +0000</pubDate>
		<dc:creator>Hans</dc:creator>
				<category><![CDATA[Noticias]]></category>
		<category><![CDATA[Blogger]]></category>
		<category><![CDATA[Douglas Bowman]]></category>
		<category><![CDATA[Google]]></category>

		<guid isPermaLink="false">http://blog.maisondelart.net/?p=15</guid>
		<description><![CDATA[Uno de los grandes responsables de la línea gráfica de Google, Douglas Bowman, ha dejado la compañía de Mountain View con una nota explicativa en su blog personal, donde muestra la letra pequeña que supone trabajar para el lema "Don't be evil".]]></description>
			<content:encoded><![CDATA[<p><a href="http://stopdesign.com/">Douglas Bowman</a>. Probablemente, no conozcas su nombre, pero ¿y si ves estas capturas?</p>
<p><a href="http://blog.maisondelart.net/img/2009/03/web_blogger1.jpg"><img class="aligncenter size-full wp-image-16" title="Blogger" src="http://blog.maisondelart.net/img/2009/03/web_blogger1.jpg" alt="Blogger" width="380" height="284" /></a></p>
<p><a href="http://blog.maisondelart.net/img/2009/03/web_blogger_temps2.jpg"><img class="aligncenter size-full wp-image-16" title="Blogger" src="http://blog.maisondelart.net/img/2009/03/web_blogger_temps2.jpg" alt="Blogger" width="380" height="284" /></a></p>
<p><a href="http://blog.maisondelart.net/img/2009/03/web_blogger_temps3.jpg"><img class="aligncenter size-full wp-image-16" title="Blogger" src="http://blog.maisondelart.net/img/2009/03/web_blogger_temps3.jpg" alt="Blogger" width="380" height="284" /></a></p>
<p>En efecto, Douglas ha sido la persona encargada de transformar diferentes áreas de <a href="/etiqueta/google">Google</a>, entre ellas, <a href="http://www.blogger.com/">Blogger</a>, tanto su aspecto principal como sus plantillas predefinidas. Además, ha trabajado en las interfaces de otras aplicaciones, como Google Calendar. Es decir, se ha marchado una pieza importante de <a href="/etiqueta/google">Google</a>, a pesar de que llevaba pocos años en la empresa.</p>
<p>Su motivo para abandonar la empresa, lo intentaremos explicar con <a href="http://stopdesign.com/archive/2009/03/20/goodbye-google.html">sus propias palabras</a> que nos ha contado en su blog:</p>
<blockquote><p>Sí, es cierto que todo un departamento de  <a href="/etiqueta/google">Google</a> va a decidir entre dos tonos de azul, así que se hacen 41 pruebas con 41 tonos de azul y se decide cuál de los tonos funciona mejor. <strong>Hace poco, tuve un debate sobre si un borde tenía que ser de 3, 4 o 5 píxeles de ancho</strong>. No puedo trabajar en un ambiente así. Estoy cansado de decidir cada minúsculo detalle sobre el diseño. Hay retos en el mundo del diseño mucho más interesantes que decidir.</p></blockquote>
<p>Se deduce que la tensión debe ser alta, ya que tener a todo un equipo de personas para decidir algo de tan escasa relevancia debe ser algo frustrante. ¿Alguno sigue interesado en trabajar en <a href="/etiqueta/google">Google</a>?</p>
<ul>
<li>Enlace: <a href="http://stopdesign.com/archive/2009/03/20/goodbye-google.html">Goodbye Google</a></li>
<li>Vía: <a href="http://www.maxvoltar.com/">Maxvoltar</a></li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://blog.maisondelart.net/noticias/douglas-bowman-se-marcha-de-google/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Averiguar la ID de un autor</title>
		<link>http://blog.maisondelart.net/wordpress/averiguar-la-id-de-un-autor</link>
		<comments>http://blog.maisondelart.net/wordpress/averiguar-la-id-de-un-autor#comments</comments>
		<pubDate>Sun, 08 Mar 2009 01:29:11 +0000</pubDate>
		<dc:creator>Hans</dc:creator>
				<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[autores]]></category>

		<guid isPermaLink="false">http://blog.maisondelart.net/?p=7</guid>
		<description><![CDATA[Una acción que debería ser tan sencilla como conocer el número de ID asignado a un autor, no siempre es fácil de encontrar en el cada vez más complejo sistema de Wordpress.]]></description>
			<content:encoded><![CDATA[<p>Para conocer la ID de un autor en <strong>Wordpress</strong>, tenemos que irnos al panel y seleccionar la opción <em>Usuarios</em>.</p>
<p>Tendremos una tabla con las siguientes columnas:</p>
<ul>
<li>Nombre de usuario</li>
<li>Nombre</li>
<li>Correo electrónico</li>
<li>Rol</li>
<li>Entradas</li>
</ul>
<p>En la columna Entradas, aparece el número de artículos escritos por ese autor. Pasamos el puntero del ratón sobre ese número, y nos fijamos en la barra de estado de nuestro navegador, o pulsamos sobre ese número y nos fijamos en la URL a la que hemos llegado:</p>
<p><img class="alignnone size-full wp-image-8" title="ID de autor en Wordpress" src="http://blog.maisondelart.net/img/2009/03/ver-autor.png" alt="ID de autor en Wordpress" /></p>
<p>Vemos que la URL acaba en <em>?author=2</em>, donde 2 es, lógicamente, la ID que andamos buscando.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.maisondelart.net/wordpress/averiguar-la-id-de-un-autor/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Distribuir ganancias de Adsense en un blog con diferentes autores</title>
		<link>http://blog.maisondelart.net/wordpress/distribuir-ganancias-de-adsense-en-un-blog-con-diferentes-autores</link>
		<comments>http://blog.maisondelart.net/wordpress/distribuir-ganancias-de-adsense-en-un-blog-con-diferentes-autores#comments</comments>
		<pubDate>Sun, 08 Mar 2009 01:19:01 +0000</pubDate>
		<dc:creator>Hans</dc:creator>
				<category><![CDATA[Programación]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[Adsense]]></category>
		<category><![CDATA[autores]]></category>
		<category><![CDATA[blog]]></category>
		<category><![CDATA[multiusuario]]></category>

		<guid isPermaLink="false">http://blog.maisondelart.net/?p=3</guid>
		<description><![CDATA[Si administras un blog donde escriben más autores, probablemente te interese compartir las ganancias de Adsense, en caso de que incluyas publicidad. Existen diferentes plugin para que cada autor publique publicidad en sus artículos, pero no siempre son fáciles de entender o, directamente, no funcionan como deberían con nuevas versiones de Wordpress.]]></description>
			<content:encoded><![CDATA[<p>Muchas veces, queremos personalizar determinados aspectos que un plugin no nos permite. Es el caso de mostrar publicidad sólo a los lectores que llegan a través de buscadores. Ahora tenemos una tarea nueva: no sólo tenemos que distribuir las ganancias de <strong>Adsense</strong>, sino que, además, queremos mostrar esa publicidad sólo a las búsquedas de Google.</p>
<p>El siguiente es un remedio manual, que he aprendido con mi escasa idea de PHP. Observando el funcionamiento de distintos ficheros .php y con el modo ensayo-error, he llegado a crear el siguiente método.</p>
<h3>1. Creamos el archivo donde se incluirán los códigos Adsense de cada autor</h3>
<p>Dentro de nuestra plantilla de <strong>Wordpress</strong>, creamos una carpeta llamada, por ejemplo, <em>adsense</em>. Dentro de esa carpeta, creamos el fichero <em>adsense.php</em>, que contendrá el siguiente código:</p>
<p><code>&lt;?php  if ($post-&gt;post_author == 13) {<br />
include (TEMPLATEPATH . '/adsense/andres.php'); }<br />
elseif ($post-&gt;post_author == 15) {<br />
include (TEMPLATEPATH . '/adsense/miguel.php'); }<br />
elseif ($post-&gt;post_author == 17) {<br />
include (TEMPLATEPATH . '/adsense/clara.php'); }<br />
elseif ($post-&gt;post_author == 19) {<br />
include (TEMPLATEPATH . '/adsense/elena.php'); }<br />
elseif ($post-&gt;post_author == 20) {<br />
include (TEMPLATEPATH . '/adsense/juan.php'); }<br />
?&gt;</code></p>
<p>Vemos que tenemos 5 autores. <a href="http://blog.maisondelart.net/wordpress/averiguar-la-id-de-un-autor">Cada autor en <strong>Wordpress</strong> tiene su propia ID</a> y a cada uno le hemos creado su archivo .php donde incluiremos el código de <strong>Adsense</strong> de ese autor. Para agregar más autores, tendremos que agregar el código siguiente, después del cierre de corchete <em>}</em></p>
<p><code>elseif ($post-&gt;post_author == 20) {<br />
include (TEMPLATEPATH . '/adsense/juan.php'); }</code></p>
<p>Donde &#8220;20&#8243; es el ID del autor, y <em>juan.php</em> es el archivo que contiene el código <strong>Adsense</strong> de ese autor.</p>
<h3>2. Creando el archivo Adsense de cada autor</h3>
<p>Como hemos visto antes, hemos pedido al fichero <em>adsense.php</em> que incluya un fichero .php según su autor (juan.php, elena.php, etc.). En cada fichero incluiremos el siguiente código:</p>
<p><code>&lt;?php<br />
if (preg_match('/q=|search/', $_SERVER['HTTP_REFERER']) ) {<br />
print '&lt;div class="adsense"&gt;&lt;script type="text/javascript"&gt;&lt;!--<br />
google_ad_client = "pub-1654710281231454";<br />
/* 250x250, creado 3/03/01 */<br />
google_ad_slot = "4994361947";<br />
google_ad_width = 250;<br />
google_ad_height = 250;<br />
//--&gt;<br />
&lt;/script&gt;<br />
&lt;script type="text/javascript"<br />
src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;<br />
&lt;/script&gt;&lt;/div&gt;';<br />
}<br />
?&gt;</code></p>
<p>Con ese código estamos diciendo que, si (<em>if</em>) la consulta llega de un buscador (<em>q=|search/</em>), se muestre (<em>print</em>) el código de <strong>Adsense</strong> de ese autor. Crearemos un fichero distinto para cada autor con el código que nos proporcione.</p>
<p>De esta forma, tendremos el directorio construido de esta forma:</p>
<ul>
<li>plantilla/
<ul>
<li>adsense/
<ul>
<li>adsense.php</li>
<li>andres.php</li>
<li>clara.php</li>
<li>elena.php</li>
<li>miguel.php</li>
<li>juan.php</li>
</ul>
</li>
</ul>
</li>
</ul>
<p>Añadimos tantos ficheros de autor como autores tengamos, lógicamente.</p>
<h3>3. Colocamos el anuncio en el artículo</h3>
<p>Ahora tenemos que llamar a ese archivo en la parte del archivo <em>single.php</em> que deseemos. En la mayoría de los casos, suele ser colocado debajo del título del artículo, quedando de la siguiente manera:</p>
<p><code>&lt;h2&gt;&lt;?php the_title(); ?&gt;&lt;/h2&gt;<br />
&lt;!-- Adsense --&gt;<br />
&lt;?php include_once(ABSPATH . 'wp-content/themes/plantilla/adsense/adsense.php'); ?&gt;<br />
&lt;!-- END Adsense --&gt;</code></p>
<p>Ahí estamos llamando al archivo <em>adsense.php</em> y éste, a su vez, llamará al archivo que contenga el código <strong>Adsense</strong> según el autor que haya escrito el artículo.</p>
<p>Muy seguramente, habrá una manera algo menos complicada, pero ésta, al menos, funciona, y es más cómoda para quienes quieran hacer las cosas a mano, que es como mejor se aprende.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.maisondelart.net/wordpress/distribuir-ganancias-de-adsense-en-un-blog-con-diferentes-autores/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>
