<?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>Francisco Rosales &#187; CSS</title>
	<atom:link href="http://www.nessy.com.ar/blog/category/css/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.nessy.com.ar/blog</link>
	<description>All you need is code</description>
	<lastBuildDate>Wed, 27 Apr 2011 20:17:04 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.1.2</generator>
		<item>
		<title>Receta de Web 2.0</title>
		<link>http://www.nessy.com.ar/blog/2007/07/31/receta-de-web-20/</link>
		<comments>http://www.nessy.com.ar/blog/2007/07/31/receta-de-web-20/#comments</comments>
		<pubDate>Tue, 31 Jul 2007 14:20:38 +0000</pubDate>
		<dc:creator>Nessy</dc:creator>
				<category><![CDATA[Ajax]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Javascript]]></category>

		<guid isPermaLink="false">http://nessy4flash.wordpress.com/2007/07/31/receta-de-web-20/</guid>
		<description><![CDATA[Para hacer una Web 2.0 sacado del sitio http://www.anieto2k.com/ &#62; 1. Una degradados, una web sin degradados no es una web, y menos 2.0. 2. Usa.un.nombre.con.puntos,si el nombre de tu web no tiene puntos, no se como te atreves a publicarla. 3. Fondos diagonales, eso es lo que denota la originalidad de los diseÃ±adores, usa [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://nessy.com.ar" target="_blank"><img src="http://www.nessy.com.ar/blog/wp-content/uploads/2007/07/web2.gif" alt="Web 2.0" border="0" /></a></p>
<p><strong>Para hacer una Web 2.0</strong> sacado del sitio <a href="http://www.anieto2k.com/2007/07/31/12-formas-para-migrar-de-la-web-10-a-la-20/">http://www.anieto2k.com/</a> &gt;<a href="http://www.anieto2k.com/2007/07/31/12-formas-para-migrar-de-la-web-10-a-la-20/"><br />
</a></p>
<p>1. Una degradados, una web sin degradados no es una web, y menos 2.0.<br />
2. Usa.un.nombre.con.puntos,si el nombre de tu web no tiene puntos, no se como te atreves a publicarla.<br />
3. Fondos diagonales, eso es lo que denota la originalidad de los diseÃ±adores, usa diagonales para darle un efecto mÃ¡s 2.0 a tus creaciones.<br />
4. Fuentes grandes, importante piensa que con esas pantallas tan modernas quizas las vean pequeÃ±as, los de 800Ã—600 que hagan scroll o cambien de monitor.<br />
5. Fondos claros, tambien es realmente importante, fondo claros sin hacer mucho contraste con  las fuentes.<br />
6. Efecto suelo mojado, para que tus usuarios patienen y se queden.<br />
7. Fuentes pixeladas, esto es lo Ãºltimo de lo Ãºltimo, un toque retro siempre te hace mÃ¡s autÃ©nticoâ€¦<br />
8. Folksonomias (tags), estÃ¡n de moda y aunque nadie las use como toca (yo por ejemplo), demuestras que estÃ¡s a la Ãºltima.</p>
<p>(Copia textual de: <a href="http://www.anieto2k.com/2006/08/07/8-trucos-para-hacerte-con-la-web-20/">http://www.anieto2k.com/2006/08/07/8-trucos-para-hacerte-con-la-web-20/)</a></p>
<p><strong>Para migrar de la Web 1.0 a la 2.0</strong> &gt;</p>
<p>1. Reemplaza e-loquesea.com por my-loquesea.com<br />
2. Incrementa el tamaÃ±o de la fuente a 12-16px (1em).<br />
3. Cambia las categorÃ­as por tags<br />
4. Cambia la secciÃ³n de noticias por un blog<br />
5. Cambia el â€œEnviar a un amigoâ€ por una suscripciÃ³n RSS.<br />
6. Cambia el â€œGuardar en Marcadoresâ€ por enlaces a redes sociales.<br />
7. Cambia la â€œCuenta de usuarioâ€ por â€œPerfil de usuarioâ€<br />
8. Cambia tu cutre cÃ³digo HTML por un semÃ¡ntico xHTML con CSS<br />
9. Son visitantes, no peticiones.<br />
10. AÃ±ade comentarios<br />
11. Cambia e-site.com?id=1234&amp;sort=desc&amp;parametros=inventados por my-site.com/a-que-molo-mazo<br />
12. Cambia tu sitio personalizado por un CMS Open Source.</p>
<p>(Copia textual de: <a href="http://www.anieto2k.com/2007/07/31/12-formas-para-migrar-de-la-web-10-a-la-20/">http://www.anieto2k.com/2007/07/31/12-formas-para-migrar-de-la-web-10-a-la-20/)</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.nessy.com.ar/blog/2007/07/31/receta-de-web-20/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Centrar un div con CSS</title>
		<link>http://www.nessy.com.ar/blog/2007/06/08/centrar-un-div-con-css/</link>
		<comments>http://www.nessy.com.ar/blog/2007/06/08/centrar-un-div-con-css/#comments</comments>
		<pubDate>Fri, 08 Jun 2007 15:51:01 +0000</pubDate>
		<dc:creator>Nessy</dc:creator>
				<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://nessy4flash.wordpress.com/2007/06/08/centrar-un-div-con-css/</guid>
		<description><![CDATA[En este link, nos explica como centrar un DIV con CSS. Ese metodo nos evita hacer uso de tablas y asi optimizamos el renderizado final del HTML (tal como lo hemos visto en un articulo citado en este blog). Como ejemplo, pude mejorar mi "Espere por favor" o "Cargando..." mandandolo al pie de la pagina. [...]]]></description>
			<content:encoded><![CDATA[<p>En este <a href="http://www.dezinerfolio.com/2007/05/02/the-simplest-way-to-horizontally-and-vertically-center-a-div/">link</a>, nos explica como centrar un DIV con CSS.</p>
<p>Ese metodo nos evita hacer uso de tablas y asi optimizamos el renderizado final del HTML (tal como lo hemos visto en un <a href="http://nessy4flash.wordpress.com/2007/04/20/performance-css-vs-table/">articulo</a> citado en este blog).</p>
<p>Como ejemplo, pude mejorar mi "Espere por favor" o "Cargando..." mandandolo al pie de la pagina. Fijense:</p>
<p><font color="#ff0000">Antes:</font></p>
<pre>
&lt;div id="esperaDIV" style="position:absolute;width:100%;height:100%;display:;z-Index:1500"&gt;
   &lt;table width="100%" height="100%" cellspacing="0" cellpadding="0"&gt;
   &lt;/tr&gt;
      &lt;td valign="bottom"&gt;
         &lt;div style="width:100%;background-color:#CDF821;height:22px;background-image:url(i/indicator_background.green.gif)"&gt;
            &lt;table align="center"&gt;
            &lt;tr&gt;
               &lt;td&gt;&lt;img src="i/indicator.gif" width="16" height="16"&gt;&lt;/td&gt;
               &lt;td&gt;&lt;div style="width:140px;height:16px;text-align:center"&gt;&lt;font face="Verdana" size="2"&gt;&lt;nobr&gt;Espere por favor...&lt;/nobr&gt;&lt;/font&gt;&lt;/div&gt;&lt;/td&gt;
            &lt;/tr&gt;
            &lt;/table&gt;
         &lt;/div&gt;
      &lt;/td&gt;
   &lt;/tr&gt;
   &lt;/table&gt;
&lt;/div&gt;</pre>
<p><font color="#00ff00">Depues:</font></p>
<pre>
&lt;div id="esperaDIV" class="barraStatus espera" align="center"&gt;
   &lt;img src="i/indicator.gif" width="16" height="16"&gt;Espere por favor...
&lt;/div&gt;</pre>
<p>La clase CSS:</p>
<pre>
.barraStatus {
	position: absolute; top: 100%; width: 100%; height: 22px;
	margin-top: -22px;
}
.espera {
	background-image:url(i/indicator_background.green.gif);
	height: 22px; margin-top: -22px;
}
.espera img {
	vertical-align:bottom; margin-right:15px;
}</pre>
<p>Link: <a href="http://www.dezinerfolio.com/2007/05/02/the-simplest-way-to-horizontally-and-vertically-center-a-div/">http://www.dezinerfolio.com/2007...</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.nessy.com.ar/blog/2007/06/08/centrar-un-div-con-css/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Performance CSS vs Table</title>
		<link>http://www.nessy.com.ar/blog/2007/04/20/performance-css-vs-table/</link>
		<comments>http://www.nessy.com.ar/blog/2007/04/20/performance-css-vs-table/#comments</comments>
		<pubDate>Fri, 20 Apr 2007 19:16:58 +0000</pubDate>
		<dc:creator>Nessy</dc:creator>
				<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://nessy4flash.wordpress.com/2007/04/20/performance-css-vs-table/</guid>
		<description><![CDATA[A continuación un articulo del porque de evitar el uso de tabla y si de CSS a traves de DIV: http://www.twoninemedia.com/blog/index.cfm/2007/4/19/TabledLayoutsvsCSSLayouts A mi no me quedaba claro como reemplazar un tag TABLE por DIV, pero lo entendí una vez visto el código fuente de los 2 siguientes ejemplos: CSS Layout: http://www.twoninemedia.com/css%5Fvs%5Fhtml/css/ Table layout: http://www.twoninemedia.com/css%5Fvs%5Fhtml/html/]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.nessy.com.ar/blog/wp-content/uploads/2007/04/css_vs_table.gif" alt="Código CSS vs TABLE" /></p>
<p>A continuación un articulo del porque de evitar el uso de tabla y si de CSS a traves de DIV:</p>
<p><a href="http://www.twoninemedia.com/blog/index.cfm/2007/4/19/TabledLayoutsvsCSSLayouts">http://www.twoninemedia.com/blog/index.cfm/2007/4/19/TabledLayoutsvsCSSLayouts</a></p>
<p>A mi no me quedaba claro como reemplazar un tag TABLE por DIV, pero lo entendí una vez visto el código fuente de los 2 siguientes ejemplos:</p>
<p>CSS Layout: <a href="http://www.twoninemedia.com/css%5Fvs%5Fhtml/css/">http://www.twoninemedia.com/css%5Fvs%5Fhtml/css/</a><br />
Table layout: <a href="http://www.twoninemedia.com/css%5Fvs%5Fhtml/html/">http://www.twoninemedia.com/css%5Fvs%5Fhtml/html/</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.nessy.com.ar/blog/2007/04/20/performance-css-vs-table/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>

