<?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>WebEstudio :: Blog de Diseño Web &#187; GUÍAS</title>
	<atom:link href="http://www.jorgebravo.es/category/guias/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.jorgebravo.es</link>
	<description>Profesionales más creativos XHTML + CSS + PHP + Flash</description>
	<lastBuildDate>Sat, 06 Aug 2011 11:16:29 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.1.1</generator>
		<item>
		<title>GUÍA: Como convertirte en un Freelance iresistible!!!</title>
		<link>http://www.jorgebravo.es/2011/08/como-convertirte-en-un-freelance-iresistible/</link>
		<comments>http://www.jorgebravo.es/2011/08/como-convertirte-en-un-freelance-iresistible/#comments</comments>
		<pubDate>Mon, 01 Aug 2011 08:40:01 +0000</pubDate>
		<dc:creator>Jorge Bravo</dc:creator>
				<category><![CDATA[DESTACADOS]]></category>
		<category><![CDATA[Freelance]]></category>
		<category><![CDATA[GUÍAS]]></category>
		<category><![CDATA[RECURSOS]]></category>
		<category><![CDATA[clientes]]></category>
		<category><![CDATA[diseño grafico]]></category>
		<category><![CDATA[Diseño Web]]></category>
		<category><![CDATA[irresistible]]></category>

		<guid isPermaLink="false">http://www.jorgebravo.es/?p=517</guid>
		<description><![CDATA[¿Alguna vez has pensado en lo &#8220;irresistible&#8221; que eres como freelance? Si eres irresistible tus clientes están encantados de trabajar contigo. Te contratan, aunque eres más caro que tus competidores. Y luego, después de haber trabajado contigo, siguen volviendo nuevamente a por más. Que rara vez se quejan, confían en ti y te dan el [...]]]></description>
			<content:encoded><![CDATA[<p class='fb-like'><iframe src='http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.jorgebravo.es%2F2011%2F08%2Fcomo-convertirte-en-un-freelance-iresistible%2F&amp;layout=box_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=65&amp;font=lucida+grande' scrolling='no' frameborder='0' allowTransparency='true' style='border:none; overflow:hidden; width:450px; height:65px'></iframe></p><p><img class="aligncenter size-full wp-image-518" title="freelance-iresistible-post" src="http://www.jorgebravo.es/wp-content/uploads/2011/07/freelance-iresistible-post.jpg" alt="" width="500" height="242" /></p>
<h2>¿Alguna vez has pensado en lo &#8220;irresistible&#8221; que eres como freelance?</h2>
<p>Si eres irresistible tus clientes están encantados de trabajar contigo. Te contratan, aunque eres más caro que tus competidores. Y luego, después de haber trabajado contigo, siguen volviendo nuevamente a por más. Que rara vez se quejan, confían en ti y te dan el beneficio de la duda, y te dan un montón de comentarios positivos sobre tu trabajo. Es más, los clientes satisfechos envian un montón de referencias a su manera, sin que si quiera se los solicites. Porque estan encantados de la profesionalidad de tu trabajo y la calidad de tus servicios, estas referencias suelen necesitar poca o ninguna intervención para que nuevos clientes te contraten.<span id="more-517"></span></p>
<h2>¿No te gustaría algo de esto en tu experiencia de trabajo como freelance?</h2>
<p>Te vas a sorprender de lo fácil que es conviertete un <a href="http://www.jorgebravo.es/2010/04/ser-freelance-y-no-morir-en-el-intento/" target="_blank">Freelancer</a> irresistible, a continuación te presento algunas de las maneras que pueden hacer casi imposible que tus clientes se te resistan:</p>
<h3>+ Ser confiable.</h3>
<p>Esto te parecerá muy simple, pero te sorprendería cómo algunos freelance cumplen con sus plazos, responden a e-mails y llamadas con prontitud, y simplemente hacen lo que dicen que van a hacer. De hecho, la mayoría de los freelance hacen lo contrario. Los plazos. Se van de la manos o dejan sus clientes abandonados durante días. Dando la sensación de que aparentemente se los ha tragado la tierra, y luego regresan con excusas acerca de situaciones de emergencias personales. Como alguien que contrata a otros freelance, he estado en el extremo opuesto de este comportamiento poco fiable. He oído un montón de historias de terror sin contar las de otros empresarios. Así que la forma más sencilla de hacerse irresistible es ser confiable.</p>
<h3>+ La entrega de calidad, consiste en. Hacer un buen trabajo todo el maldito tiempo.</h3>
<p>No tienes que ser el mejor en tu materia, pero si se le da a cada cliente lo mejor, lo más probable es que sea feliz y si el feliz tu seras feliz. Esto significa que no deberías tomar más clientes de los que puede controlar, no importa lo necesitado que estés de dinero.</p>
<h3>+ No te obligues a aceptar proyectos que no estás realmente interesado.</h3>
<p>Tu falta de pasión se mostrara en el producto final. Y siempre, siempre, invertir en mejorar sus habilidades.<br />
Comunicarse. A menudo, los clientes están apagados por la falta de comunicación. Por ejemplo, cuando algo va mal con un proyecto, ¿tiendes a guardarlo para ti en lugar de hablarlo con el cliente de inmediato? Mantén a tus clientes en el circuito. Si estás trabajando en un proyecto a largo plazo, dar actualizaciones semanales. Informar a los clientes de inmediato si va a haber un retraso, costos adicionales u otros obstáculos, pero siempre ten una solución en mente. Te sorprenderás de cómo los clientes pueden comprender, siempre y cuando se les trata con respeto y honestidad.</p>
<h3>+ Anticípese a las necesidades de tus clientes.</h3>
<p>¿Ha escuchado el consejo de &#8220;siempre sobre-entrega?&#8221; Sobre-entrega significa dar a tus clientes más de lo que pagaron. Yo no estoy diciendo que seas un esclavo o de dar el trabajo de forma gratuita. Pero pensar en el futuro y actuar de manera pro-activa. Digamos, por ejemplo, que un posible cliente le pidió que presentara una propuesta y te dio sus especificaciones. Tómate el tiempo y esfuérzate por comprender verdaderamente lo que estas tratando de lograr, y diseñar una propuesta que trate de eso. Esto podría significar la adición de elementos extra al proyecto, viendo las cosas desde su perspectiva te daras cuenta de cosas que de otro modo no verías.</p>
<h3>+ Ley de gracia.</h3>
<p>Cuida tus modales, si estás enviando un e-mail, llamadas en frío o enviándole SMS&#8217;s a un cliente. &#8220;Por favor&#8221; y &#8220;gracias&#8221; creeme hacen la diferencia! Esto es cierto incluso con los clientes que te pueden haber tratado mal. No quemes tus contactos por un mal entendido o una simple discusión. Y nunca hables mal de tus clientes. Es de mal gusto, por que te aseguro que tarde o temprano esto se vuelve en tu contra.</p>
<h3>+ Mantener una presencia en Internet magnética.</h3>
<p>Incluso si tus clientes no son tus amigos en Facebook, mantener tu presencia en los medios sociales intachable. No publique contenido, fotos y vídeos a menos que dejes que tu propia madre los valla a ver. Nunca se sabe lo que tus posibles clientes pueden terminar de ver sobre ti. No cuentes con los controles de las redes social para proteger tu privacidad. Las políticas de privacidad siempre están cambiando. Es difícil mantenerse al día con ellas.</p>
<h3>+ Saber cómo ayudar a tus clientes VERDADERAMENTE.</h3>
<p>Finalmente, para convertirse en irresistible, debes ser consciente del valor real que llevas a los clientes. Es cierto que puedes diseñar sitios web, crear fantásticos artículos sobre tecnología. Pero, ¿cómo se benefician realmente tus clientes de todo eso? Si no sabes, pregúntale a algunos de tus clientes con los que hayas trabajado en el pasado: ¿qué resultados han obtenido del trabajo que hiciste por ellos? ¿Ha mejorado su sitio web?, ¿tiene el doble de tráfico que el viejo?, ¿Tus esfuerzos generaron oportunidades de aumentar por lo menos en un 30% ó 40%?, ¿Hizo el anuncio que diseñó aumentar las consultas telefónicas sobre su producto?. Documenta esto y utilízalo para hacer que tus clientes potenciales se peleen por trabajar contigo.</p>
<h3>+ ¿Cómo puedes ser más irresistible?</h3>
<p>Espero que este post te haya dado algunas ideas que te hagan ser más deseable para tus clientes actuales y potenciales. Si es así, ¿cuáles son esos cambios que ahora sientes que debes hacer como <a href="http://www.jorgebravo.es/2010/04/ser-freelance-y-no-morir-en-el-intento/" target="_blank">Freelance</a>?</p>
<p>Original en inglés: <a target="_blank" href="http://freelancefolder.com/how-to-become-an-irresistible-freelancer/" target="_blank">http://freelancefolder.com</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jorgebravo.es/2011/08/como-convertirte-en-un-freelance-iresistible/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Optimizar post para el posicionamiento de tu blog</title>
		<link>http://www.jorgebravo.es/2010/08/optimizar-post-para-el-posicionamiento-de-tu-blog/</link>
		<comments>http://www.jorgebravo.es/2010/08/optimizar-post-para-el-posicionamiento-de-tu-blog/#comments</comments>
		<pubDate>Sat, 21 Aug 2010 12:43:38 +0000</pubDate>
		<dc:creator>Jorge Bravo</dc:creator>
				<category><![CDATA[BLOG]]></category>
		<category><![CDATA[Diseño web]]></category>
		<category><![CDATA[GUÍAS]]></category>
		<category><![CDATA[SEO]]></category>
		<category><![CDATA[Análicis]]></category>
		<category><![CDATA[Analitycs]]></category>
		<category><![CDATA[Enlaces]]></category>
		<category><![CDATA[Google]]></category>
		<category><![CDATA[posicionamiento]]></category>

		<guid isPermaLink="false">http://www.jorgebravo.es/?p=484</guid>
		<description><![CDATA[Si bien es importante conocer y practicar los principios básicos de SEO para el posicionamiento en Google en la forma de configurar la estructura de los blogs y en la redacción de sus publicaciones – Me parece que puede ser muy útil volver periódicamente a través de las entradas claves de edad para optimizar aún [...]]]></description>
			<content:encoded><![CDATA[<p class='fb-like'><iframe src='http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.jorgebravo.es%2F2010%2F08%2Foptimizar-post-para-el-posicionamiento-de-tu-blog%2F&amp;layout=box_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=65&amp;font=lucida+grande' scrolling='no' frameborder='0' allowTransparency='true' style='border:none; overflow:hidden; width:450px; height:65px'></iframe></p><p style="text-align: center;"><img class="aligncenter size-full wp-image-485" title="cab-post-seo" src="http://www.jorgebravo.es/wp-content/uploads/2010/08/cab-post-seo.jpg" alt="cab-post-seo" width="500" height="242" /></p>
<p>Si bien es importante conocer y practicar los <strong>principios  básicos de SEO</strong> <strong>para el <a target="_blank" title="posicionamiento en Google" href="http://www.bodeseo.com/">posicionamiento  en Google</a></strong> en la forma de configurar la estructura de los  blogs y en la redacción de sus publicaciones – Me parece que puede ser  muy útil volver periódicamente a través de las entradas claves de edad  para optimizar aún más tu sitio.</p>
<p>He utilizado el siguiente proceso para un tiempo y ahora en la  mayoría de los casos en que lo hago me encuentro capaz de aumentar mi  ranking de los diferentes puestos.<span id="more-484"></span><strong>1. Identificar los post claves para la optimización SEO</strong></p>
<p>La idea es excavar en tu cuenta de <a target="_blank" title="google analytics" href="http://www.google.com/intl/es_ALL/analytics/index.html" target="_blank"><strong>Google Analytics</strong></a> para averiguar qué  entradas ya están teniendo algún éxito con el tráfico de búsqueda –  pero que podrían mejorarse.  La idea es mejorar ese contenido haciendo  referencia al post anterior, creando nuevos temas y debates acerca de  ello.</p>
<p><strong>2. Analice la Competencia</strong></p>
<p>No tienden a profundizar el <strong>SEO</strong> demasiado a menudo,  pero de vez en cuando puede ser útil hacer un pequeño <a target="_blank" title="analisis  de la comptencia" href="http://www.bodeseo.com/empresas-de-posicionamiento-en-google/" target="_blank"><strong>análisis de la competencia</strong></a>, de las  páginas que son de rango superior de una palabra clave que usted está  posicionando.</p>
<p><strong>3. En la página de optimización</strong></p>
<p>El análisis de la competencia anteriormente podría dar algunas pistas  de por donde empezar en la optimización de su página. Por ejemplo, si  usted no tiene palabras clave en “etiquetas de título” o “etiquetas de  cabecera” – usted querrá que arreglar eso. Si su palabra clave no está  en la URL, eso es otra cosa a considerar. Estos tres ajustes por sí  solos podrían marcar un cambio bastante significativo.</p>
<p>Una vez que hayas hecho esto puede que desee examinar también algunos  pequeños ajustes que podrían desempeñar un papel importante. Uso de  palabras clave en negrita, usando palabras clave en etiquetas ALT en las  imágenes, etc Estos son probablemente no va a tener un gran impacto,  pero podría ayudar un poco.</p>
<p><strong>4. SEO off page</strong></p>
<p>El seo off page depende básicamente en conseguir enlaces entrantes a  nuestro sitio, lo mejor seria que todos esos links sean naturales, pero  tardaria mucho para tener un sitio reconocido de esa manera. Por eso hay  que trabajar duro y buscar otras alternativas:</p>
<p>- Enlaces desde otros blogs que usted posee</p>
<p>- <a target="_blank" title="enlaces internos" href="http://www.bodeseo.com/palabras-clave-dentro-de-los-enlaces-de-texto/" target="_blank"><strong>Enlaces internos</strong></a> en nuestro  contenido (no cuentan tanto como un enlace externo que puede ayudar un  poco</p>
<p>- <a target="_blank" title="intercambio de enlaces" href="http://www.bodeseo.com/intercambios-de-enlaces-desde-contenido/"><strong>Intercambio  de enlaces</strong></a> con otros blogs (fundamental que sea de la  misma tematica)</p>
<p>- <a target="_blank" title="enlaces en redes sociales" href="http://www.bodeseo.com/4-tecnicas-positivas-para-el-marketing-en-internet/"><strong>Enlaces  de las </strong></a><strong><a target="_blank" title="redes sociales" href="http://www.bodeseo.com/category/redes-sociales-y-web-2-0/">redes sociales</a></strong><br />
<strong>Visto en: </strong>bodeseo.com<strong><br />
</strong></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jorgebravo.es/2010/08/optimizar-post-para-el-posicionamiento-de-tu-blog/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>USBWebserver 8, Apache + PHP y MySQL todo en uno y portable.</title>
		<link>http://www.jorgebravo.es/2010/08/usbwebserver-8-apache-php-y-mysql-todo-en-uno-y-portable/</link>
		<comments>http://www.jorgebravo.es/2010/08/usbwebserver-8-apache-php-y-mysql-todo-en-uno-y-portable/#comments</comments>
		<pubDate>Mon, 02 Aug 2010 08:40:24 +0000</pubDate>
		<dc:creator>Jorge Bravo</dc:creator>
				<category><![CDATA[APACHE]]></category>
		<category><![CDATA[DESTACADOS]]></category>
		<category><![CDATA[GUÍAS]]></category>
		<category><![CDATA[MySQL]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[RECURSOS]]></category>
		<category><![CDATA[SOFTWARE]]></category>
		<category><![CDATA[PHPAMP para USB]]></category>
		<category><![CDATA[USBAMP]]></category>

		<guid isPermaLink="false">http://www.jorgebravo.es/?p=473</guid>
		<description><![CDATA[Muy interesante la aplicación USBWebServer 8 un pequeño sistema que apenas ocupa 32MB, donde tendrás una solución de Apache-MySQL-PHP listo para usar. Esto se hace ideal para instalarlo en nuestro pendrive o en CD-R para presentaciones de webs, sistemas PHP o cualquier cosa que se te ocurra. Sólo se requiere un pendrive con un mínimo [...]]]></description>
			<content:encoded><![CDATA[<p class='fb-like'><iframe src='http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.jorgebravo.es%2F2010%2F08%2Fusbwebserver-8-apache-php-y-mysql-todo-en-uno-y-portable%2F&amp;layout=box_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=65&amp;font=lucida+grande' scrolling='no' frameborder='0' allowTransparency='true' style='border:none; overflow:hidden; width:450px; height:65px'></iframe></p><p style="text-align: center;"><img class="aligncenter size-full wp-image-475" title="cab-USBWEBSRVER" src="http://www.jorgebravo.es/wp-content/uploads/2010/08/cab-USBWEBSRVER.jpg" alt="cab-USBWEBSRVER" width="500" height="242" /></p>
<p>Muy interesante la aplicación <a target="_blank" href="http://www.usbwebserver.net/en/" target="_blank">USBWebServer 8</a> un pequeño<a target="_blank" href="http://www.madrimasd.org/blogs/softwarelibre/2007/01/26/58170"> </a> sistema que apenas ocupa <tt>32MB</tt>, donde tendrás una solución de   <a target="_blank" title="www.uwamp.com" href="http://www.uwamp.com/" target="_blank">Apache-MySQL-PHP</a> listo para usar.</p>
<p>Esto se hace ideal para instalarlo en nuestro pendrive o en CD-R para  presentaciones de webs, sistemas PHP o cualquier cosa que se te ocurra.  Sólo se requiere un pendrive con un mínimo de <tt>32MB</tt>, <a target="_blank" href="http://es.php.net/">PHP</a> (El autor usa 5.0.3 sin problemas),  <a target="_blank" href="http://httpd.apache.org/">Apache</a> (2.0.50) y <a target="_blank" href="http://www.mysql.com/">MySQL</a>. <a target="_blank" title="Notepad++" href="http://notepad-plus-plus.org/es/node/66" target="_blank">Un buen editor de textos</a>,   preparar los ficheros de configuración y listo.<span id="more-473"></span>No hay que hacer absolutamente nada mas que seguir las instrucciones del  instalador y ya tenemos nuestro servidor listo para llevar a todas partes en nuestros pendrive para realizar presentaciones o demostraciones de nuestros programas sin necesidad de que tengamos una conexión a Internet.</p>
<p>Sin duda una interesante idea para todos aquellos que trabajan con   sistemas <a target="_blank" href="http://www.wampserver.com/">WAMP</a>, <a target="_blank" href="http://www.apachefriends.org/es/xampp.html">XAMPP</a> o <a target="_blank" href="http://www.onlamp.com/">LAMP</a>, que tienen ahora una alternativa  más rápida, <strong>Descarga:</strong> <a target="_blank" href="http://www.usbwebserver.net/en/" target="_blank">USBWebServer 8</a></p>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 0px; width: 1px; height: 1px; overflow: hidden;">愼栠敲㵦栢瑴㩰⼯睷⹷慭牤浩獡⹤牯⽧汢杯⽳潳瑦慷敲楬牢⽥〲㜰〯⼱㘲㔯ㄸ〷㸢慂瑳湡整椠瑮牥獥湡整氠⁡灡楬慣楣돃⁮单䅂偍‬湵瀠煥敵뇃⁯⼼㹡‍楳瑳浥⁡畱⁥灡湥獡漠畣慰㰠瑴㌾䴲㱂琯㹴‬潤摮⁥整摮慲⁳湵⁡潳畬楣돃⁮敤ഠ䄠慰档ⵥ祍兓ⵌ䡐⁐楬瑳⁯慰慲甠慳⹲戼㹲ഊ㰠牢ਾ獅潴猠⁥慨散椠敤污瀠牡⁡湩瑳污牡潬攠⁮畮獥牴⁯数摮楲敶漠攠⁮䑃刭瀠牡ൡ瀠敲敳瑮捡潩敮⁳敤眠扥ⱳ猠獩整慭⁳䡐⁐⁯畣污畱敩⁲潣慳焠敵猠⁥整漠畣牲⹡‍썓河⁯敳爠煥極牥⁥湵瀠湥牤癩⁥潣⁮湵洠귃楮潭搠⁥琼㹴㈳䉍⼼瑴ⰾ㰠⁡牨晥∽瑨灴⼺支⹳桰⹰敮⽴㸢䡐㱐愯‾䔨⁬畡潴⁲獵⁡⸵⸰″楳⁮牰扯敬慭⥳ബ㰠⁡牨晥∽瑨灴⼺栯瑴摰愮慰档⹥牯⽧㸢灁捡敨⼼㹡⠠⸲⸰〵 ⁹愼栠敲㵦栢瑴㩰⼯睷⹷祭煳⹬潣⽭㸢祍兓㱌愯⸾唠⁮畢湥㰠⁡牨晥∽瑨灴⼺眯睷昮潬⵳牦敥慷敲挮⽨潮整慰㉤栮浴≬放楤潴⁲敤琠硥潴㱳愯ⰾഠ瀠敲慰慲⁲潬⁳楦档牥獯搠⁥潣普杩牵捡썩溳礠氠獩潴㰮牢ਾ‍戼㹲䄊畱귃琠湥浥獯氠⁡敤捳牡慧搠汥㰠⁡牨晥∽瑨灴⼺眯睷昮物灥条獥漮杲瀯扵楬⽣桰彰獵⹢楺≰倾偈䵁⁐慰慲唠䉓⼼㹡㰮牢ਾ‍戼㹲䌊敲浡獯甠慮挠牡数慴氠慬慭慤瀠牤癩⁥漭挠浡楢浡獯氠獯映捩敨潲⁳敤ഠ挠湯楦畧慲楣돃⁮灡湵慴摮⁯污渠浯牢⁥畱⁥畱牥浡獯‭潣楰浡獯倠偈‬祍兓⁌⁹‍灁捡敨攠⁮獥慴挠牡数慴礠挠敲浡獯氠獡挠牡数慴⁳戼眾睷⼼㹢礠㰠㹢敳獳⼼㹢‮‍敄敢썲憭焠敵慤⁲污潧愠썳㪭戼㹲ഊ㰠牢ਾ‍甤扳⼺戼㹲ഊⴠⴭⴭⴭⴭⴭⴭ瑳牡⹴慢㱴牢ਾ‍ⴭⴭⴭⴭⴭⴭ瀭牤癩⽥戼㹲ഊⴠⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭ瀭灨椮楮戼㹲ഊⴠⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭ猭慴瑲瀮灨戼㹲ഊⴠⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭ愭慰档ⵥ⸲⸰〵㰯牢ਾ‍ⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭ桰⵰⸵⸰⼳戼㹲ഊⴠⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭ洭獹汱㰯牢ਾ‍ⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭ睷⽷戼㹲ഊⴠⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭⴭ猭獥⽳戼㹲ഊഠ㰠牢ਾ煁썵₭整敮潭⁳潬⁳楦档牥獯搠⁥潣普杩牵捡썩溳搠⁥橥浥汰㩯攠⁬愼栠敲㵦栢瑴㩰⼯睷⹷楦敲慰敧⹳潣⹭畡瀯灨畟扳栮瑴摰挮湯⹦瑨≭栾瑴摰挮湯㱦愯ⰾ‍汥㰠⁡牨晥∽瑨灴⼺眯睷昮物灥条獥挮浯愮⽵桰彰獵⹢桰⹰湩⹩瑨≭瀾灨椮楮⼼㹡ബ㰠⁡牨晥∽瑨灴⼺眯睷昮物灥条獥挮浯愮⽵桰彰獵⹢瑳牡⹴桰⹰瑨≭猾慴瑲瀮灨⼼㹡‍⁹汥㰠⁡牨晥∽瑨灴⼺眯睷昮物灥条獥挮浯愮⽵桰彰獵⹢瑨⍭瑳牡⹴慢≴猾慴瑲戮瑡⼼㹡㰮牢ਾ‍戼㹲匊湩搠摵⁡湵⁡湩整敲慳瑮⁥摩慥瀠牡⁡潴潤⁳煡敵汬獯焠敵琠慲慢慪⁮潣⁮‍楳瑳浥獡㰠⁡牨晥∽瑨灴⼺眯睷眮浡獰牥敶⹲潣⽭㸢䅗偍⼼㹡‬愼栠敲㵦栢瑴㩰⼯睷⹷灡捡敨牦敩摮⹳牯⽧獥砯浡灰栮浴≬堾䵁偐⼼㹡漠㰠⁡牨晥∽瑨灴⼺眯睷漮汮浡⹰潣⽭㸢䅌偍⼼㹡‬畱⁥楴湥湥愠潨慲甠慮愠瑬牥慮楴慶‍썭玡爠ꇃ楰慤‬愼栠敲㵦栢瑴㩰⼯睷⹷楦敲慰敧⹳潣⹭畡瀯灨畟扳栮浴㸢单䅂偍⼼㹡</div>
]]></content:encoded>
			<wfw:commentRss>http://www.jorgebravo.es/2010/08/usbwebserver-8-apache-php-y-mysql-todo-en-uno-y-portable/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>8 secretos para el éxito del posicionamiento SEO</title>
		<link>http://www.jorgebravo.es/2010/05/8-secretos-para-el-exito-del-posicionamiento-seo/</link>
		<comments>http://www.jorgebravo.es/2010/05/8-secretos-para-el-exito-del-posicionamiento-seo/#comments</comments>
		<pubDate>Sun, 16 May 2010 09:54:39 +0000</pubDate>
		<dc:creator>Jorge Bravo</dc:creator>
				<category><![CDATA[DESTACADOS]]></category>
		<category><![CDATA[GUÍAS]]></category>
		<category><![CDATA[SEO]]></category>
		<category><![CDATA[Marketing]]></category>
		<category><![CDATA[posicionamiento SEO]]></category>
		<category><![CDATA[tecnicas]]></category>
		<category><![CDATA[técnicas SEO]]></category>

		<guid isPermaLink="false">http://www.jorgebravo.es/?p=446</guid>
		<description><![CDATA[¿Cómo una persona tiene éxito en el mundo del SEO? Este post me pareció muy interesante sobre todo por que nos puede ayudar a entender algo que muchos necesitamos a la hora de buscar un área donde encajar en todo este mundo nuevo que ha creado la red. Las motivaciones y actitudes frente a un [...]]]></description>
			<content:encoded><![CDATA[<p class='fb-like'><iframe src='http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.jorgebravo.es%2F2010%2F05%2F8-secretos-para-el-exito-del-posicionamiento-seo%2F&amp;layout=box_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=65&amp;font=lucida+grande' scrolling='no' frameborder='0' allowTransparency='true' style='border:none; overflow:hidden; width:450px; height:65px'></iframe></p><h2 style="text-align: center;"><img class="aligncenter size-full wp-image-448" title="cab-post-secreto" src="http://www.jorgebravo.es/wp-content/uploads/2010/05/cab-post-secreto.jpg" alt="cab-post-secreto" width="500" height="242" /></h2>
<h2>¿Cómo una persona tiene éxito en el  mundo  del SEO?</h2>
<p>Este post me pareció muy interesante sobre todo por que nos puede ayudar a entender algo que muchos necesitamos a la hora de buscar un área donde encajar en todo este mundo nuevo que ha creado la red. Las motivaciones y actitudes frente a un problema.</p>
<p>Me gustaría poder decir todos los secretos, pero  si los  conociera, yo estaría sentado en una playa de Tahití, sorbiendo  mai  tais, en lugar de escribir este post. Hace  aproximadamente un año me  encontré con un video de Richard St. John  dando una presentación rápida  de 3 minutos en <a target="_blank" href="http://www.ted.com/talks" target="_blank">TED</a> sobre los 8 secretos  del éxito y empezó a  preguntarse si esos mismos 8 secretos eran ciertos  dentro de la  industria de SEO.<span id="more-446"></span></p>
<p style="text-align: left;"><strong>1.) Pasión</strong><br />
El SEO es la industria está llena de personas  de éxito cuya pasión por  el SEO es increíble. Tome Rea Drysdale por ejemplo, que gastaron  miles  de dólares de su propio dinero para ayudar a proteger la industria  de  alguien que trató de registrar como marca el término “SEO”. que podrían  haber  afectado a toda la industria. Rea no es el único con una intensa  pasión por la  industria de SEO pero ella es el ejemplo más reciente.  ¿Cómo funciona su pasión por la tasa de SEO en comparación con  los  líderes de la industria?</p>
<p style="text-align: left;"><strong>2.) Trabajo</strong><br />
El trabajo duro es un secreto  que todos los SEO que dicen es verdad,  las cosas no salen con facilidad  en esta industria. SEO no  sucede  durante la noche y no es algo que cualquiera puede hacer solo, se   necesita alguien que le gusta bucear en los informes de enlaces,   análisis y redacción de informes a los clientes. SEO son un montón de  trabajos  duros y para tener éxito es necesario poner un poco de sudor  en sus  proyectos. ¿Está gastando su parte justa de tiempo invertido en  las  <a href="http://www.jorgebravo.es/category/seo/" target="_self"><strong>técnicas  de SEO</strong></a>, si no, imagínate si estuviera poniendo su máximo   potencial en todos sus proyectos, los resultados podrían ser infinitas!  Dé prioridad a sus proyectos y poner más  esfuerzo en las que dará el  máximo a cambio.</p>
<p style="text-align: left;"><strong>3.) Practica</strong><br />
Práctica, práctica, práctica – para tener éxito  en SEO que usted  necesita practicar todo lo que lee en situaciones  del mundo real. El  SEO siempre está cambiando, es necesario seguir  practicando las  técnicas que han adquirido y asegúrese de que estas  técnicas siguen  siendo válidas y trabajará con su proyecto actual. Sin la práctica de  las  técnicas de SEO que aún podría ser la preparación de nuestros   meta etiqueta palabras clave, que es un pensamiento aterrador.  Configuración  de un dominio y sitio web donde usted puede probar sus  teorías y  explorar los resultados sin afectar sus sitios web los  clientes.</p>
<p style="text-align: left;"><strong>4.) Ideas</strong><br />
SEO con éxito siempre viene con nuevas  ideas! Richards dio buenos  <a target="_blank" title="consejos seo" href="http://www.bodeseo.com/consejos-seo-para-el-ranking-de-google-por-matt-cutts/">consejos SEO</a> sobre la manera de  llegar a ideas, incluyeron: escuchar,  observar, sentir curiosidad,  hacer preguntas, resolver problemas y hacer  conexiones. Todas esas  cosas se pueden  hacer en las comunidades como la que aquí en SEOmoz,  salir ahí fuera y  empezar a hacer esas conexiones y hacer preguntas.  Hacer comentarios en los blogs es una gran manera de empezar a  hacer  las conexiones.</p>
<p style="text-align: left;"><strong>5.) Foco</strong><br />
Concéntrese en las buenas técnicas que se van a hacer  su clientes a  lograr resultados. Algunos de  nosotros somos dispersarse trabajando en  el diseño web, desarrollo web, y  muchas de las otras cosas que van en  la creación de un sitio web  exitoso. Tener la capacidad de enfocar toda  su  energía en sólo SEO realmente puede ayudarle a tener éxito dentro  de la  industria o de ayudarle a alcanzar sus objetivos de SEO. Esto  podría  ser más fácil para la gente en una gran organización que tienen  los  compañeros de trabajo que puedan centrarse en las otras necesidades  de  los clientes. Si usted no tiene el poder del hombre  para centrarse  en un solo tema de asegurarse de que son parte de una  comunidad que  comparte sus técnicas y consejos.</p>
<p style="text-align: left;"><strong>6.) Empuje</strong><br />
En el video habla acerca de cómo Richard no  siempre es fácil que te  empuje pero por eso inventaron las madres. Personalmente, mi madre no   sabe lo que es SEO y no tienen idea de cómo me obligan a ser mejor en   eso. He encontrado que los clientes siempre van a  ser agresivo cuando  se trata de las clasificaciones y que puede ser lo  que te empuja a  educarse en las nuevas técnicas dentro de la industria  de SEO y le  ayudará a tener éxito y ellos.</p>
<p style="text-align: left;"><strong>7.) Servir</strong><br />
Servir a su clientes algo de valor y no promesas  vacías como algunos de  los mensajes de correo electrónico a sus clientes  reciben la sombra.  Feliz el cliente dará lugar a  grandes remisiones e incrementar sus  ganancias. Junto con grandes  resultados que les presten servicio en los  <a target="_blank" href="http://google.dirson.com/posicionamiento.net/serps/" target="_blank">SERPs</a>, les proporcionará un  conocimiento útil para ayudarles a  entender por qué SEO es importante  seguir haciendo y no sólo una cosa  sola vez. Aumenta la que los clientes  los conocimientos sobre el  proceso de SEO reducirá preguntas y  preocupaciones en el largo plazo.</p>
<p style="text-align: left;"><strong>8.)  Persistir</strong><br />
La persistencia es uno de los más  importantes consejos para tener éxito  como un consultor SEO. Apuesto  a que casi todos los SEO exitosos  tuvieron algunos fracasos en su vida pero siguieron avanzando y no dejar  que aminore su velocidad. Richard hizo un gran acrónimo de  la palabra  “PARE” que le ayudará a persistir a través de algunos de los  CRAP por  ahí.  Nada se siente mejor que ver algo que has  trabajado mucho en  alcanzar las metas establecidas que, a pesar de las  lecciones siempre  se puede aprender de sus fracasos.</p>
<p><strong>¿Qué crees que ayuda a las personas convertirse con éxito en   la industria de SEO? ¿Cuáles son los secretos de su éxito en esta  industria y lo  que un novato puede hacer para empezar con el pie  derecho? Nos gustaría saber qué piensa la gente hace con éxito en esta   industria y lo que se tiene en cuenta cuando se llama a una persona de   éxito en SEO.</strong></p>
<p><strong>Entrada original en: </strong><a target="_blank" href="http://www.bodeseo.com/8-secretos-para-el-exito-del-posicionamiento-seo/" target="_blank">www.bodeseo.com</a><strong><br />
</strong></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jorgebravo.es/2010/05/8-secretos-para-el-exito-del-posicionamiento-seo/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Guía: instertar un editor WYSIWYG con TinyMCE</title>
		<link>http://www.jorgebravo.es/2010/04/guia-instertar-un-editor-wysiwyg-con-tinymce/</link>
		<comments>http://www.jorgebravo.es/2010/04/guia-instertar-un-editor-wysiwyg-con-tinymce/#comments</comments>
		<pubDate>Wed, 28 Apr 2010 08:00:37 +0000</pubDate>
		<dc:creator>Jorge Bravo</dc:creator>
				<category><![CDATA[DESTACADOS]]></category>
		<category><![CDATA[Diseño web]]></category>
		<category><![CDATA[GUÍAS]]></category>
		<category><![CDATA[JAVASCRIPT]]></category>
		<category><![CDATA[PROGRAMACIÓN]]></category>
		<category><![CDATA[RECURSOS]]></category>
		<category><![CDATA[CSS y JavaScript]]></category>
		<category><![CDATA[editor online]]></category>
		<category><![CDATA[TinyMCE]]></category>
		<category><![CDATA[WYSIWYG]]></category>

		<guid isPermaLink="false">http://www.jorgebravo.es/?p=414</guid>
		<description><![CDATA[TinyMCE es un editor HTML On-Line que es capaz de convertir los textarea de un formulario en campos WYSIWYG traspasando todo el trabajo a HTML automáticamente. Características Es sencillo de integrar en las páginas web, ya que solo tiene dos líneas de código. Se puede personalizar a través de temas y plugins. También se pueden [...]]]></description>
			<content:encoded><![CDATA[<p class='fb-like'><iframe src='http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.jorgebravo.es%2F2010%2F04%2Fguia-instertar-un-editor-wysiwyg-con-tinymce%2F&amp;layout=box_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=65&amp;font=lucida+grande' scrolling='no' frameborder='0' allowTransparency='true' style='border:none; overflow:hidden; width:450px; height:65px'></iframe></p><p><img src="http://www.jorgebravo.es/wp-content/uploads/2010/04/cab-post-tiny.jpg" alt="cab-post-tiny" title="cab-post-tiny" width="500" height="242" class="aligncenter size-full wp-image-417" /></p>
<p>TinyMCE es un editor HTML On-Line que es capaz de convertir los textarea de un  formulario en campos WYSIWYG traspasando todo el trabajo a HTML automáticamente.</p>
<p><strong>Características</strong></p>
<ul>
<li>Es sencillo de integrar en las páginas web, ya que solo tiene dos  líneas de código.</li>
<li>Se puede personalizar a través de temas y plugins.</li>
<li>También se pueden instalar paquetes de idiomas.</li>
<li>Es compatible con la mayoría de los navegadores como Firefox,  Internet Explorer,  Opera y Safari, aunque este último esta en fase  experimental.</li>
<li>Con el compresor GZip para PHP/.NET/JSP/Coldfusion, hace  que  TinyMCE  sea un 75% más pequeño y mucho más rápido de cargar.</li>
<li>Se puede utilizar AJAX para guardar y cargar el contenido.</li>
</ul>
<p><span id="more-414"></span><br />
<strong>Integración de TinyMCE</strong></p>
<p>Para poder utilizar TinyMCE es las páginas web, el navegador tiene que  ser compatible y tener Javascript habilitado.</p>
<p>Primero hay de descargar TinyMCE desde la siguiente página de descargas:  <a target="_blank" href="http://tinymce.moxiecode.com/download.php" target="_blank">http://tinymce.moxiecode.com/download.php</a>.  Después hay que descomprimirlo y guardarlo en el servidor de la página  web para poder utilizarlo en los textarea de los formularios.</p>
<p>En la página que se vaya a utilizar, primero hay que incluir la librería  tiny_mce.js incluyendo el archivo externo de código Javascript.</p>
<div class="codecolorer-container javascript dawn" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><table cellspacing="0" cellpadding="0"><tbody><tr><td style="padding:5px;text-align:center;color:#888888;background-color:#EEEEEE;border-right: 1px solid #9F9F9F;font: normal 12px/1.4em Monaco, Lucida Console, monospace;"><div>1<br /></div></td><td><div class="javascript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #339933;">&lt;</span>script language<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;javascript&quot;</span> type<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;text/javascript&quot;</span> src<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;/tinymce/jscripts/tiny_mce/tiny_mce.js&quot;</span><span style="color: #339933;">&gt;&lt;/</span>script<span style="color: #339933;">&gt;</span></div></td></tr></tbody></table></div>
<p>A continuación hay que inicializar TinyMCE para convertir los textarea en campos de texto WYSIWYG editables.</p>
<div class="codecolorer-container javascript dawn" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><table cellspacing="0" cellpadding="0"><tbody><tr><td style="padding:5px;text-align:center;color:#888888;background-color:#EEEEEE;border-right: 1px solid #9F9F9F;font: normal 12px/1.4em Monaco, Lucida Console, monospace;"><div>1<br />2<br />3<br />4<br />5<br />6<br />7<br /></div></td><td><div class="javascript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #339933;">&lt;</span>script language<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;javascript&quot;</span> type<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;text/javascript&quot;</span><span style="color: #339933;">&gt;</span><br />
tinyMCE.<span style="color: #660066;">init</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#123;</span><br />
&nbsp; &nbsp; &nbsp; mode <span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;textareas&quot;</span><span style="color: #339933;">,</span><br />
&nbsp; &nbsp; &nbsp; theme <span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;simple&quot;</span><br />
&nbsp; &nbsp;<span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span><br />
<br />
<span style="color: #339933;">&lt;/</span>script<span style="color: #339933;">&gt;</span></div></td></tr></tbody></table></div>
<p><strong>Ejemplo de integración de TinyMCE</strong></p>
<div class="codecolorer-container html4strict dawn" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><table cellspacing="0" cellpadding="0"><tbody><tr><td style="padding:5px;text-align:center;color:#888888;background-color:#EEEEEE;border-right: 1px solid #9F9F9F;font: normal 12px/1.4em Monaco, Lucida Console, monospace;"><div>1<br />2<br />3<br />4<br />5<br />6<br />7<br />8<br />9<br />10<br />11<br />12<br />13<br />14<br />15<br />16<br />17<br />18<br />19<br /></div></td><td><div class="html4strict codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #009900;">&lt; !DOCTYPE HTML PUBLIC <span style="color: #ff0000;">&quot;-//W3C//DTD HTML 4.01 Transitional//EN&quot;</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">html</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">head</span>&gt;</span><br />
&nbsp; &nbsp;<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">title</span>&gt;</span>Ejemplo TinyMCE<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">title</span>&gt;</span><br />
&nbsp; &nbsp;<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">script</span> <span style="color: #000066;">language</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;javascript&quot;</span> <span style="color: #000066;">type</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;text/javascript&quot;</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;/tinymce/jscripts/tiny_mce/tiny_mce.js&quot;</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">script</span>&gt;</span><br />
&nbsp; &nbsp;<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">script</span> <span style="color: #000066;">language</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;javascript&quot;</span> <span style="color: #000066;">type</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;text/javascript&quot;</span>&gt;</span><br />
&nbsp; &nbsp; &nbsp; tinyMCE.init({<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;mode : &quot;textareas&quot;,<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;theme : &quot;advanced&quot;<br />
&nbsp; &nbsp; &nbsp; });<br />
&nbsp; &nbsp;<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">script</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">head</span>&gt;</span><br />
<br />
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">body</span>&gt;</span><br />
&nbsp; &nbsp;<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">form</span> <span style="color: #000066;">method</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;post&quot;</span> <span style="color: #000066;">name</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;tinymce&quot;</span>&gt;</span><br />
&nbsp; &nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">textarea</span> <span style="color: #000066;">name</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;texto&quot;</span> <span style="color: #000066;">cols</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;50&quot;</span> <span style="color: #000066;">rows</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;15&quot;</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">textarea</span>&gt;</span><br />
&nbsp; &nbsp;<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">form</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">body</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">html</span>&gt;</span></div></td></tr></tbody></table></div>
<p>En este ejemplo primero hemos incluido la librería tiny_mce.js dentro de las etiquetas <head> . También dentro de estas etiquetas también hemos inicializado TinyMCE para que en el textarea del formulario se convierta en un campo de texto WYSIWYG. </p>
<p>Via: <a target="_blank" href="http://www.desarrolloweb.com/articulos/tinymce.html">Desarrolloweb.com</a></head></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jorgebravo.es/2010/04/guia-instertar-un-editor-wysiwyg-con-tinymce/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Analiza el porcentaje de rebotes en tu sitio web.</title>
		<link>http://www.jorgebravo.es/2010/03/analiza-el-porcentaje-de-rebote-en-tu-web/</link>
		<comments>http://www.jorgebravo.es/2010/03/analiza-el-porcentaje-de-rebote-en-tu-web/#comments</comments>
		<pubDate>Sun, 28 Mar 2010 10:53:07 +0000</pubDate>
		<dc:creator>Jorge Bravo</dc:creator>
				<category><![CDATA[DESTACADOS]]></category>
		<category><![CDATA[Diseño web]]></category>
		<category><![CDATA[GUÍAS]]></category>
		<category><![CDATA[SEO]]></category>
		<category><![CDATA[Analitycs]]></category>
		<category><![CDATA[Rebote web]]></category>

		<guid isPermaLink="false">http://www.jorgebravo.es/?p=410</guid>
		<description><![CDATA[Hola amigos he estado nuevamente ausente mucho tiempo, un mes y medio para ser exactos y es que las vacaciones fueron un poco movidas en mi país y a la vuelta me espera una buena cantidad de trabajo como suele ocurrir, después de un retiro largo de nuestras tareas. Pero bueno no nos desviemos de [...]]]></description>
			<content:encoded><![CDATA[<p class='fb-like'><iframe src='http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.jorgebravo.es%2F2010%2F03%2Fanaliza-el-porcentaje-de-rebote-en-tu-web%2F&amp;layout=box_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=65&amp;font=lucida+grande' scrolling='no' frameborder='0' allowTransparency='true' style='border:none; overflow:hidden; width:450px; height:65px'></iframe></p><p style="text-align: center;"><img class="aligncenter size-full wp-image-411" title="rebote-web" src="http://www.jorgebravo.es/wp-content/uploads/2010/03/rebote-web.jpg" alt="rebote-web" width="500" height="242" /></p>
<p>Hola amigos he estado nuevamente ausente mucho tiempo, un mes y medio para ser exactos y es que las vacaciones fueron un poco movidas en mi país y a la vuelta me espera una buena cantidad de trabajo como suele ocurrir, después de un retiro largo de nuestras tareas. Pero bueno no nos desviemos de el tema, que para todos los administradores de sitios webs debería ser algo de radical importancia si queremos posicionar un sitio y obtener una buena audiencia y más que importante que la cantidad en este caso concreto la calidad de nuestra audiencia es lo primordial.</p>
<h3>Ahora veamos ¿que es realmente &#8220;el porcentaje de rebote&#8221;?</h3>
<p><strong>Según Google Analitycs:</strong> El porcentaje de rebote de una página representa el porcentaje de usuarios que visitan una sola página de nuestro sitio web, es decir visitan una página y se van, que igualmente podríamos definir cómo &#8220;<em>visitas basura</em>&#8220;.<span id="more-410"></span></p>
<p>Ahora esto lo tomamos como una referencia por ser uno de los servicios de estadísticas más conocido y el que muchos utilizamos, pero muchos sistemas de estadística fijan el porcentaje de rebote en 30 segundos: un visitante se define como &#8220;<em>desinteresado</em>&#8221; si abandona la página antes de 30 segundos. El límite de 30 segundos, es un valor de referencia que en algunas aplicaciones de software comercial, se esta bajando a 5 segundos para evitar &#8220;<em>la falsificación de los datos</em>&#8220;.</p>
<p><strong>Mito:</strong><em> Mientras más bajo sea el porcentaje de rebote significa que nuestro sitio está mejor optimizado.</em></p>
<p>Esto puede ser verdad para una gran mayoría de sitios pero no podemos generalizar, ya que esto dependera del contexto que se le dé para determinar si está ayudando o no a cumplir nuestros objetivos.</p>
<p>Por ejemplo la Wikipedia debe tener un muy alto <a target="_blank" href="http://es.wikipedia.org/wiki/M%C3%A9trica_de_%25_de_rebote_de_un_sitio_web" target="_blank">porcentaje de rebote</a> ya que cuando uno busca un dato concreto sobre algún tema, tiende a entrar a buscar sólo ese dato y luego salir. Son muy pocas las ocasiones en las que nos quedamos navegando entre los enlaces que pueda contener un artículo a menos que te dedique a bloguear :) claro.</p>
<p>Lo mismo podríamos decir sobre un artículo que hable de un tema muy especifico, ya que es muy probable que el usuario haya estado buscando información puntual y no le interese o no tenga el tiempo de seguir leyendo otros artículos en nuestro sitio.</p>
<p>Donde si debemos preocuparnos es cuando tenemos por ejemplo: Un sitio de ventas y en nuestro catalogo de productos tenemos un elevado porcentaje de rebotes y los usuario no llegan a completar nuestro formulario de pedido ahí es cuando debemos prestar atención y analizar que es lo que ocurre.</p>
<p>En conclusión el rebote en nuestro sitio varía en cada caso y es parte del trabajo de un SEO determinar si nuestro porcentaje de rebote va de acuerdo a nuestro sitio web o blog y qué cambios podríamos realizar para adecuarlo a nuestros objetivos.</p>
<p>Finalmente les dejo para profundizar mas acerca del tema una serie de enlaces que les pueden ayudar a optimizar sus sitios, <a href="http://www.jorgebravo.es/2009/07/100-formas-de-obtener-mas-visitas-para-tu-blog/" target="_self">aumentar nuestra cantidad de visitantes</a> y conseguir un mejor cumplimiento de los objetivos de nuestro sitio.</p>
<p>- <a target="_blank" href="http://www.maestrosdelweb.com/editorial/herramientas-para-medir-las-estadisticas-de-tu-web/" target="_blank">Sistemas de estadísticas para nuestra web.</a><br />
- Plugins para detectar enlaces rotos en su sitio WordPress &#8220;<a target="_blank" href="http://wordpress.org/extend/plugins/broken-link-checker/" target="_blank">Broken Link Checker</a>&#8220;.<br />
- <a target="_blank" href="http://www.bodeseo.com/7-factores-para-aumentar-el-trafico-de-tu-blog/" target="_blank">7 factores para aumentar el trafico de tu blog.</a><br />
- <a target="_blank" href="http://www.bodeseo.com/enlazar-entradas-antiguadas-de-un-blog/" target="_blank">Enlazar entradas antiguadas de un blog</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jorgebravo.es/2010/03/analiza-el-porcentaje-de-rebote-en-tu-web/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Menú desplegable con CSS y JavaScript</title>
		<link>http://www.jorgebravo.es/2009/08/menu-desplegable-con-css-y-javascript/</link>
		<comments>http://www.jorgebravo.es/2009/08/menu-desplegable-con-css-y-javascript/#comments</comments>
		<pubDate>Thu, 20 Aug 2009 08:00:15 +0000</pubDate>
		<dc:creator>Jorge Bravo</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[DESTACADOS]]></category>
		<category><![CDATA[DISEÑO]]></category>
		<category><![CDATA[Diseño web]]></category>
		<category><![CDATA[GUÍAS]]></category>
		<category><![CDATA[JAVASCRIPT]]></category>
		<category><![CDATA[RECURSOS]]></category>
		<category><![CDATA[CSS y JavaScript]]></category>
		<category><![CDATA[Diseño Web]]></category>
		<category><![CDATA[menus desplegables]]></category>

		<guid isPermaLink="false">http://www.jorgebravo.es/?p=281</guid>
		<description><![CDATA[Hola a todos hoy respondere a un correo con una consulta de un amigo, que me preguntaba por programas para, generar menúes desplegables con CSSy JavaScript. Bien tratare dos puntos antes de comenzar, El primero es que no soy nada partidario de los generadores de menús, uno por que muy sencillo crearlos nosotros mismos, segundo [...]]]></description>
			<content:encoded><![CDATA[<p class='fb-like'><iframe src='http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.jorgebravo.es%2F2009%2F08%2Fmenu-desplegable-con-css-y-javascript%2F&amp;layout=box_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=65&amp;font=lucida+grande' scrolling='no' frameborder='0' allowTransparency='true' style='border:none; overflow:hidden; width:450px; height:65px'></iframe></p><p><img class="aligncenter size-full wp-image-286" title="stats-menuCSS" src="http://www.jorgebravo.es/wp-content/uploads/2009/08/stats-menuCSS.png" alt="stats-menuCSS" width="500" height="233" /></p>
<p>Hola a todos hoy respondere a un correo con una consulta de un amigo, que me preguntaba por programas para, generar <strong>menúes desplegables con CSSy JavaScript.</strong> Bien tratare dos puntos antes de comenzar,<span id="more-281"></span></p>
<p>El primero es que no soy nada partidario de los generadores de menús, uno por que muy sencillo crearlos nosotros mismos, segundo quedan obsoletos rapidamente ya que internet cambia demasiado a prisa y a menos que el programa se actualice lo veo dificil que aprenda una manera nueva de generar el menu ademas como extra el hecho de suelen generar mucho codigo realmente inecesario.</p>
<p>Punto dos, son las formas que veremos de generar menus desplegables mediante CSS y JavaScript, supongo y doy por hecho de que quienes sigan la guia tendran unos c<strong>onocimientos minimos hacerca de los procedimientos</strong> que realizaremos, ya que si hay que explicar paso a paso cada una de las cosas que haremos el Post se alargaria demasiado, tampoco es la idea de hacer una clase magistral sobre CSS.</p>
<p><strong><em>Nota: </em></strong><em>lo que aqui veamos noes ni mucho menos la mejor de las mejores maneras y tampoco creo que este exenta de errores, tan solo son metodos de trabajo y formas de hacer algo puntual si haceís una busqueda en Google sobre (</em><strong><a target="_blank" href="http://www.google.es/search?rlz=1C1GGLS_esES338ES339&amp;sourceid=chrome&amp;ie=UTF-8&amp;q=menu+desplegable+en+CSS" target="_blank"><em>menu desplegable en CSS</em></a></strong><em>) os aseguro que hay una buena cantidad de guias con las cuales podeís complementar esta pequeña reseña.</em></p>
<p>Luego de esta pequeña intro ons vamos de cabeza al tema que nos trae a la cancha. Primero comenzaremos con los programas para generar menues CSS.</p>
<p><strong>CSS Tab Designer :</strong> Creo que es uno de los más conocidos en esta area y de los que mas se utiliza, lo he probado y cumple perfectamente su cometido sin dejarnos un bodrio muy grande de codigo para su funcionamiento.</p>
<p><strong>Con CSS Tab Designer puedes:</strong></p>
<p>- Diseñar rápidamente tu lista visualmente.<br />
- Elegir una variedad de estilos y colores grande (más de 60 diseños y colores).<br />
- Generar el código final de xhtml con un solo click.</p>
<p><img class="aligncenter size-full wp-image-282" title="CSSTab-Designer" src="http://www.jorgebravo.es/wp-content/uploads/2009/08/CSSTab-Designer.png" alt="CSSTab-Designer" width="271" height="203" /></p>
<p><strong>Enlace de Descarga:</strong> <a target="_blank" title="CSS Tab Designer" href="http://www.highdots.com/css-tab-designer/" target="_blank">CSS Tab Designer</a></p>
<p><strong>PureCSSMenu.com :</strong> Es un generador en línea de menús desplegables del tipo CSS, se ofrece en forma gratuita. Este software es capaz de crear un menú desplegable sin JavaScript, en un 100% en CSS, ofrece menús CSS horizontales y también menús del tipo vertical. El usuario simplemente necesitará realizar tres sencillos pasos para poder construir sus menús CSS.</p>
<p style="text-align: center;"><img class="aligncenter size-full wp-image-283" title="purecssmenu" src="http://www.jorgebravo.es/wp-content/uploads/2009/08/purecssmenu.jpg" alt="purecssmenu" width="336" height="197" /></p>
<p><strong>Enlace de descarga:</strong> <a target="_blank" title="PureCSSMenu" href="http://www.purecssmenu.com/purecssmenu.zip" target="_blank">PureCSSMenu</a></p>
<p><strong>IzzyMenu :</strong> es una aplicación web desarrollada en Ajax que nos permite crear menus css de una manera por demas sencilla. Tiene una lista de diseños predefinidos entre los cuales hay unos muy buenos y que de seguro te serviran para tus diseños y desarrollos web.<br />
Podemos escoger entre crear un menú horizontal y un menú vertical, asi como configurar el tamaño de fuente, el estilo de fuente, color, color de fondo entre muchas otras opciones.</p>
<p><img class="aligncenter size-full wp-image-284" title="menus-css" src="http://www.jorgebravo.es/wp-content/uploads/2009/08/menus-css.jpg" alt="menus-css" width="460" height="208" /></p>
<p><strong>Enlace de descarga:</strong> <a target="_blank" title="IzzyMenu" href="http://www.izzymenu.com/" target="_blank">IzzyMenu</a></p>
<p><strong>CSSmenubuilder.com :</strong> Otra herramienta que además genera código bastante más “limpio”. Su galería de menús predefinidos en mucho más corta pero a cambio podemos modificarlos totalmente sin necesidad de tocar el código.<br />
La única desventaja que le encuentro es que no podemos generar la estructura de enlaces desde la propia herramienta. Aunque tampoco es ningún drama pues la propia herramienta nos permite crearla a mano.</p>
<p><img class="aligncenter size-full wp-image-285" title="CSS Menu Builder" src="http://www.jorgebravo.es/wp-content/uploads/2009/08/CSS-Menu-Builder-.jpg" alt="CSS Menu Builder" width="434" height="219" /></p>
<p><strong>Enlace de descarga:</strong> <a target="_blank" title="CSSMenuBuider.com" href="http://www.cssmenubuilder.com/home" target="_blank">CSSmenubuilder.com</a></p>
<p>Ahora veremos como crear nosotros mismos esto que nos generan estos programas de manera tan sencilla, obiamente tardaremos algo más, pero estoy seguro de que aprenderemos mucho más y lo mas importantes que el limite lo pone nuestra imaginación y no la cantidad de diseño que trae incorporado algun programa. jejejje estuve a punto de decir programa cutre.</p>
<p>Muchas veces, nuestras páginas tienen tantos contenidos que si quisiéramos que apareciesen todos estos en un determinado lugar de nuestra página, en un menú, este abarcaría casi la totalidad del espacio que tenemos para nuestra web. En estos casos es muy útil insertar uno o varios de estos menús desplegables, apareciendo por encima del propio contenido de la página para mostrar todas sus partes y desapareciendo posteriormente.</p>
<p>Preparamos el <strong>codigo CSS</strong> para las cajas del menu</p>
<div class="codecolorer-container css dawn" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><table cellspacing="0" cellpadding="0"><tbody><tr><td style="padding:5px;text-align:center;color:#888888;background-color:#EEEEEE;border-right: 1px solid #9F9F9F;font: normal 12px/1.4em Monaco, Lucida Console, monospace;"><div>1<br />2<br />3<br />4<br />5<br />6<br />7<br />8<br />9<br />10<br />11<br /></div></td><td><div class="css codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap">body <span style="color: #00AA00;">&#123;</span><br />
<span style="color: #000000; font-weight: bold;">font-family</span><span style="color: #00AA00;">:</span> Arial<span style="color: #00AA00;">,</span> Helvetica<span style="color: #00AA00;">,</span> <span style="color: #993333;">sans-serif</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">margin</span><span style="color: #00AA00;">:</span> <span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">padding</span><span style="color: #00AA00;">:</span> <span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><br />
<span style="color: #00AA00;">&#125;</span><br />
<span style="color: #cc00cc;">#marco</span> <span style="color: #00AA00;">&#123;</span><br />
<span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span><span style="color: #933;">455px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">margin</span><span style="color: #00AA00;">:</span><span style="color: #933;">10px</span> <span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">padding</span><span style="color: #00AA00;">:</span><span style="color: #933;">0px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">text-align</span><span style="color: #00AA00;">:</span><span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">;</span><br />
<span style="color: #00AA00;">&#125;</span></div></td></tr></tbody></table></div>
<div class="codecolorer-container css dawn" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;height:300px;"><table cellspacing="0" cellpadding="0"><tbody><tr><td style="padding:5px;text-align:center;color:#888888;background-color:#EEEEEE;border-right: 1px solid #9F9F9F;font: normal 12px/1.4em Monaco, Lucida Console, monospace;"><div>1<br />2<br />3<br />4<br />5<br />6<br />7<br />8<br />9<br />10<br />11<br />12<br />13<br />14<br />15<br />16<br />17<br />18<br />19<br />20<br />21<br />22<br />23<br />24<br />25<br />26<br />27<br />28<br />29<br />30<br />31<br />32<br />33<br />34<br />35<br />36<br />37<br />38<br />39<br />40<br />41<br />42<br />43<br />44<br />45<br />46<br />47<br />48<br />49<br />50<br />51<br />52<br />53<br />54<br />55<br /></div></td><td><div class="css codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #808080; font-style: italic;">/*Creditos: WebEstudio */</span><br />
<span style="color: #6666ff;">.preload2</span> <span style="color: #00AA00;">&#123;</span><br />
<span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span> <span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span><span style="color: #ff0000; font-style: italic;">button4a.gif</span><span style="color: #00AA00;">&#41;</span><span style="color: #00AA00;">;</span><br />
<span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #00AA00;">&#123;</span><br />
<span style="color: #000000; font-weight: bold;">padding</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">margin</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">margin-bottom</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">list-style</span><span style="color: #00AA00;">:</span><span style="color: #993333;">none</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span><span style="color: #933;">25px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #cc00cc;">#fff</span> <span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span><span style="color: #ff0000; font-style: italic;">fd_menu.gif</span><span style="color: #00AA00;">&#41;</span> <span style="color: #993333;">repeat-x</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">position</span><span style="color: #00AA00;">:</span><span style="color: #993333;">relative</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">font-family</span><span style="color: #3333ff;">:arial</span><span style="color: #00AA00;">,</span> verdana<span style="color: #00AA00;">,</span> <span style="color: #993333;">sans-serif</span><span style="color: #00AA00;">;</span><br />
<span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> li.<span style="color: #000000; font-weight: bold;">top</span> <span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">display</span><span style="color: #00AA00;">:</span><span style="color: #993333;">block</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">float</span><span style="color: #00AA00;">:</span><span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">position</span><span style="color: #00AA00;">:</span><span style="color: #993333;">relative</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> li a<span style="color: #6666ff;">.top_link</span> <span style="color: #00AA00;">&#123;</span><br />
<span style="color: #000000; font-weight: bold;">display</span><span style="color: #00AA00;">:</span><span style="color: #993333;">block</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">float</span><span style="color: #00AA00;">:</span><span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span><span style="color: #933;">25px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">margin-left</span><span style="color: #00AA00;">:</span><span style="color: #933;">6px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">line-height</span><span style="color: #00AA00;">:</span><span style="color: #933;">25px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">color</span><span style="color: #00AA00;">:</span><span style="color: #cc00cc;">#333</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">text-decoration</span><span style="color: #00AA00;">:</span><span style="color: #993333;">none</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">font-size</span><span style="color: #00AA00;">:</span><span style="color: #933;">11px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">font-weight</span><span style="color: #00AA00;">:</span><span style="color: #993333;">bold</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">padding</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span> <span style="color: #cc66cc;">0</span> <span style="color: #cc66cc;">0</span> <span style="color: #933;">6px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">cursor</span><span style="color: #00AA00;">:</span><span style="color: #993333;">pointer</span><span style="color: #00AA00;">;</span><br />
<span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> li a<span style="color: #6666ff;">.top_link</span> span <span style="color: #00AA00;">&#123;</span><br />
<span style="color: #000000; font-weight: bold;">float</span><span style="color: #00AA00;">:</span><span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">display</span><span style="color: #00AA00;">:</span><span style="color: #993333;">block</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">padding</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span> <span style="color: #933;">10px</span> <span style="color: #cc66cc;">0</span> <span style="color: #933;">6px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span><span style="color: #933;">40px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> li a<span style="color: #6666ff;">.top_link</span> span<span style="color: #6666ff;">.down</span> <span style="color: #00AA00;">&#123;</span><br />
<span style="color: #000000; font-weight: bold;">float</span><span style="color: #00AA00;">:</span><span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">display</span><span style="color: #00AA00;">:</span><span style="color: #993333;">block</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">padding</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span> <span style="color: #933;">10px</span> <span style="color: #cc66cc;">0</span> <span style="color: #933;">6px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span><span style="color: #933;">25px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #808080; font-style: italic;">/*background:url(prodrop2/down.gif) no-repeat right top;*/</span><br />
<span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> li a<span style="color: #6666ff;">.top_link</span><span style="color: #3333ff;">:hover </span><span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">color</span><span style="color: #00AA00;">:</span><span style="color: #cc00cc;">#fff</span><span style="color: #00AA00;">;</span> &nbsp;<span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span><span style="color: #ff0000; font-style: italic;">button4a.gif</span><span style="color: #00AA00;">&#41;</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> li a<span style="color: #6666ff;">.top_link</span><span style="color: #3333ff;">:hover </span>span <span style="color: #00AA00;">&#123;</span> <span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span><span style="color: #ff0000; font-style: italic;">button4a.gif</span><span style="color: #00AA00;">&#41;</span><span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> li a<span style="color: #6666ff;">.top_link</span><span style="color: #3333ff;">:hover </span>span<span style="color: #6666ff;">.down</span> <span style="color: #00AA00;">&#123;</span> <span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span><span style="color: #ff0000; font-style: italic;">button4a.gif</span><span style="color: #00AA00;">&#41;</span><span style="color: #00AA00;">&#125;</span><br />
<br />
<span style="color: #6666ff;">.menu2</span> li<span style="color: #3333ff;">:hover </span>&amp;gt<span style="color: #00AA00;">;</span> a<span style="color: #6666ff;">.top_link</span> <span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">color</span><span style="color: #00AA00;">:</span><span style="color: #cc00cc;">#fff</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span><span style="color: #ff0000; font-style: italic;">button4a.gif</span><span style="color: #00AA00;">&#41;</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> li<span style="color: #3333ff;">:hover </span>&amp;gt<span style="color: #00AA00;">;</span> a<span style="color: #6666ff;">.top_link</span> span <span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span><span style="color: #ff0000; font-style: italic;">button4a.gif</span><span style="color: #00AA00;">&#41;</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> li<span style="color: #3333ff;">:hover </span>&amp;gt<span style="color: #00AA00;">;</span> a<span style="color: #6666ff;">.top_link</span> span<span style="color: #6666ff;">.down</span> <span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span><span style="color: #ff0000; font-style: italic;">button4a.gif</span><span style="color: #00AA00;">&#41;</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span><br />
<br />
<span style="color: #6666ff;">.menu2</span> table <span style="color: #00AA00;">&#123;</span><br />
<span style="color: #000000; font-weight: bold;">border-collapse</span><span style="color: #00AA00;">:</span><span style="color: #993333;">collapse</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">position</span><span style="color: #00AA00;">:</span><span style="color: #993333;">absolute</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">top</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><br />
<span style="color: #00AA00;">&#125;</span></div></td></tr></tbody></table></div>
<p>Como pueden ver esta parte no es muy compleja aun  que si un poco extensa.<br />
<strong>Ahora los estilos para los enlaces y el submenu.</strong></p>
<div class="codecolorer-container css dawn" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;height:300px;"><table cellspacing="0" cellpadding="0"><tbody><tr><td style="padding:5px;text-align:center;color:#888888;background-color:#EEEEEE;border-right: 1px solid #9F9F9F;font: normal 12px/1.4em Monaco, Lucida Console, monospace;"><div>1<br />2<br />3<br />4<br />5<br />6<br />7<br />8<br />9<br />10<br />11<br />12<br />13<br />14<br />15<br />16<br />17<br />18<br />19<br />20<br />21<br />22<br />23<br />24<br />25<br />26<br />27<br />28<br />29<br />30<br />31<br />32<br />33<br />34<br />35<br />36<br />37<br />38<br />39<br />40<br />41<br />42<br />43<br />44<br />45<br />46<br />47<br />48<br />49<br />50<br />51<br />52<br /></div></td><td><div class="css codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #808080; font-style: italic;">/* Estilo por defecto para los links */</span><br />
<span style="color: #808080; font-style: italic;">/* Estilo para link hover. Dependiendo del navegador que se use */</span><br />
<br />
<span style="color: #6666ff;">.menu2</span> a<span style="color: #3333ff;">:hover </span><span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">visibility</span><span style="color: #00AA00;">:</span><span style="color: #993333;">visible</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> li<span style="color: #3333ff;">:hover </span><span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">position</span><span style="color: #00AA00;">:</span><span style="color: #993333;">relative</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">z-index</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">200</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span><br />
<br />
<span style="color: #808080; font-style: italic;">/* mantener el &quot;siguiente nivel&quot; invisibles colocándolo fuera de la pantalla. */</span><br />
<span style="color: #6666ff;">.menu2</span> ul<span style="color: #00AA00;">,</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul ul<span style="color: #00AA00;">,</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul ul<span style="color: #00AA00;">,</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul ul<span style="color: #00AA00;">,</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul ul <span style="color: #00AA00;">&#123;</span><br />
<span style="color: #000000; font-weight: bold;">position</span><span style="color: #00AA00;">:</span><span style="color: #993333;">absolute</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">:</span><span style="color: #933;">-9999px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">top</span><span style="color: #00AA00;">:</span><span style="color: #933;">-9999px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">margin</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">padding</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">list-style</span><span style="color: #00AA00;">:</span><span style="color: #993333;">none</span><span style="color: #00AA00;">;</span><br />
<span style="color: #00AA00;">&#125;</span><br />
<br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul<span style="color: #6666ff;">.sub</span> <span style="color: #00AA00;">&#123;</span><br />
<span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">:</span><span style="color: #933;">6px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">top</span><span style="color: #00AA00;">:</span><span style="color: #933;">25px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span> <span style="color: #cc00cc;">#fff</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">padding</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><br />
<span style="color: #808080; font-style: italic;">/*border:1px solid #1E8BB5; white-space:nowrap;*/</span><br />
<span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span><span style="color: #993333;">auto</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span><span style="color: #993333;">auto</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">font-weight</span><span style="color: #00AA00;">:</span><span style="color: #993333;">normal</span><span style="color: #00AA00;">;</span><br />
<span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul<span style="color: #6666ff;">.sub</span> li <span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">display</span><span style="color: #00AA00;">:</span><span style="color: #993333;">block</span><span style="color: #00AA00;">;</span> <span style="color: #808080; font-style: italic;">/*height:20px; */</span><span style="color: #000000; font-weight: bold;">position</span><span style="color: #00AA00;">:</span><span style="color: #993333;">relative</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">float</span><span style="color: #00AA00;">:</span><span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span><span style="color: #933;">160px</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">border-bottom</span><span style="color: #00AA00;">:</span><span style="color: #933;">1px</span> <span style="color: #993333;">solid</span> <span style="color: #cc00cc;">#005FB9</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">border-left</span><span style="color: #00AA00;">:</span><span style="color: #933;">1px</span> <span style="color: #993333;">solid</span> <span style="color: #cc00cc;">#005FB9</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">border-right</span><span style="color: #00AA00;">:</span><span style="color: #933;">1px</span> <span style="color: #993333;">solid</span> <span style="color: #cc00cc;">#005FB9</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">margin-bottom</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul<span style="color: #6666ff;">.sub</span> li a <span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">display</span><span style="color: #00AA00;">:</span><span style="color: #993333;">block</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span><span style="color: #993333;">auto</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">font-size</span><span style="color: #00AA00;">:</span><span style="color: #933;">11px</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">padding</span><span style="color: #00AA00;">:</span><span style="color: #933;">4px</span> <span style="color: #933;">3px</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">line-height</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">1</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">color</span><span style="color: #00AA00;">:</span><span style="color: #cc00cc;">#005FB9</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">text-decoration</span><span style="color: #00AA00;">:</span><span style="color: #993333;">none</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul<span style="color: #6666ff;">.sub</span> li a<span style="color: #6666ff;">.fly</span> <span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #cc00cc;">#fff</span> &nbsp;<span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span><span style="color: #ff0000; font-style: italic;">vineta_menu.gif</span><span style="color: #00AA00;">&#41;</span> <span style="color: #993333;">no-repeat</span> <span style="color: #933;">150px</span> <span style="color: #933;">6px</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul<span style="color: #6666ff;">.sub</span> li a<span style="color: #3333ff;">:hover </span><span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #cc00cc;">#E5FAFC</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">color</span><span style="color: #00AA00;">:</span><span style="color: #cc00cc;">#005FB9</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul<span style="color: #6666ff;">.sub</span> li a<span style="color: #6666ff;">.fly</span><span style="color: #3333ff;">:hover </span><span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #cc00cc;">#E5FAFC</span> <span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span><span style="color: #ff0000; font-style: italic;">vineta_menu.gif</span><span style="color: #00AA00;">&#41;</span> <span style="color: #993333;">no-repeat</span> <span style="color: #933;">150px</span> <span style="color: #933;">6px</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul li<span style="color: #3333ff;">:hover </span>&amp;gt<span style="color: #00AA00;">;</span> a<span style="color: #6666ff;">.fly</span> <span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #cc00cc;">#E5FAFC</span><span style="color: #00AA00;">&#125;</span><br />
<br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul<span style="color: #00AA00;">,</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul<span style="color: #00AA00;">,</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul<span style="color: #00AA00;">,</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul <span style="color: #3333ff;">:hover </span>ul<span style="color: #00AA00;">&#123;</span><br />
<span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">:</span><span style="color: #933;">160px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">top</span><span style="color: #00AA00;">:</span><span style="color: #933;">-1px</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span> <span style="color: #cc00cc;">#fff</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">padding</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span> <span style="color: #808080; font-style: italic;">/* white-space:nowrap; */</span><br />
<span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span><span style="color: #993333;">auto</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">z-index</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">300</span><span style="color: #00AA00;">;</span><br />
<span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span><span style="color: #993333;">auto</span><span style="color: #00AA00;">;</span><br />
<span style="color: #00AA00;">&#125;</span><br />
<span style="color: #6666ff;">.menu2</span> <span style="color: #3333ff;">:hover </span>ul<span style="color: #6666ff;">.sub</span> li ul <span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">border-top</span><span style="color: #00AA00;">:</span><span style="color: #933;">1px</span> <span style="color: #993333;">solid</span> <span style="color: #cc00cc;">#005FB9</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span> <span style="color: #cc00cc;">#fff</span><span style="color: #00AA00;">;</span> <span style="color: #000000; font-weight: bold;">z-index</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">300</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span></div></td></tr></tbody></table></div>
<p><strong>Ahora el HTML donde pondremos nuestro menu</strong><br />
Como puene ver en el codigo HTML se ha aplicado un hack para poder har funcional el menu en navegadores antiguos como IE6</p>
<div class="codecolorer-container html4strict dawn" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;height:300px;"><table cellspacing="0" cellpadding="0"><tbody><tr><td style="padding:5px;text-align:center;color:#888888;background-color:#EEEEEE;border-right: 1px solid #9F9F9F;font: normal 12px/1.4em Monaco, Lucida Console, monospace;"><div>1<br />2<br />3<br />4<br />5<br />6<br />7<br />8<br />9<br />10<br />11<br />12<br />13<br />14<br />15<br />16<br />17<br />18<br />19<br />20<br />21<br />22<br />23<br />24<br />25<br />26<br />27<br />28<br />29<br />30<br />31<br />32<br />33<br />34<br />35<br />36<br />37<br />38<br />39<br />40<br />41<br />42<br />43<br />44<br />45<br />46<br />47<br />48<br />49<br />50<br />51<br />52<br />53<br />54<br />55<br />56<br />57<br />58<br />59<br />60<br />61<br />62<br />63<br />64<br />65<br />66<br />67<br />68<br />69<br />70<br />71<br />72<br />73<br />74<br />75<br />76<br />77<br />78<br />79<br />80<br /></div></td><td><div class="html4strict codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">div</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;marco&quot;</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">span</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;preload2&quot;</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">span</span>&gt;</span><br />
<br />
<span style="color: #808080; font-style: italic;">&lt;!--MENU--&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">ul</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;menu2&quot;</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;menu_izq.gif&quot;</span> <span style="color: #000066;">alt</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;&quot;</span> <span style="color: #000066;">align</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;left&quot;</span> <span style="color: #66cc66;">/</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;menu_der.gif&quot;</span> <span style="color: #000066;">alt</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;&quot;</span> <span style="color: #000066;">align</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;right&quot;</span> <span style="color: #66cc66;">/</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;top&quot;</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;telmex&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;top_link&quot;</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">span</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;down&quot;</span>&gt;</span>La Compañia<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">span</span>&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;!--[if gte IE 7]&gt;&lt;!--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;</span><span style="color: #808080; font-style: italic;">&lt;!--&lt;![endif]--&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;!--[if lte IE 6]&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;table&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;tr&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;td&gt;&lt; ![endif]--&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">ul</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;sub&quot;</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Acerca de Nosotros<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Filosofía<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Código de Etica<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Inducción a Empleados<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">ul</span>&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;!--[if lte IE 6]&gt;&lt;/td&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;/tr&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;/table&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt; ![endif]--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;top&quot;</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;Direcciones&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;top_link&quot;</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">span</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;down&quot;</span>&gt;</span>Direcciones<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">span</span>&gt;</span><span style="color: #808080; font-style: italic;">&lt;!--[if gte IE 7]&gt;&lt;!--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;</span><span style="color: #808080; font-style: italic;">&lt;!--&lt;![endif]--&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;!--[if lte IE 6]&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;table&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;tr&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;td&gt;&lt; ![endif]--&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">ul</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;sub&quot;</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;fly&quot;</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Dirección Legal<span style="color: #808080; font-style: italic;">&lt;!--[if gte IE 7]&gt;&lt;!--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;</span><span style="color: #808080; font-style: italic;">&lt;!--&lt;![endif]--&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;!--[if lte IE 6]&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;table&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;tr&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;td&gt;&lt; ![endif]--&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">ul</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Gerencia 1<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Gerencia 2<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Gerencia 3<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">ul</span>&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;!--[if lte IE 6]&gt;&lt;/td&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;/tr&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;/table&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt; ![endif]--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;mid&quot;</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;fly&quot;</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;../boxes/&quot;</span>&gt;</span>Dirección de Mercadeo<span style="color: #808080; font-style: italic;">&lt;!--[if gte IE 7]&gt;&lt;!--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;</span><span style="color: #808080; font-style: italic;">&lt;!--&lt;![endif]--&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;!--[if lte IE 6]&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;table&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;tr&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;td&gt;&lt; ![endif]--&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">ul</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Gerencia de Comunicaciones Internas<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Información de Productos<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Soporte a Ventas<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">ul</span>&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;!--[if lte IE 6]&gt;&lt;/td&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;/tr&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;/table&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt; ![endif]--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;../mozilla/&quot;</span>&gt;</span>Dirección Administrativa y Financiera<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;../ie/&quot;</span>&gt;</span>Dirección Operaciones<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;../opacity/&quot;</span>&gt;</span>Dirección Cuidado al Cliente<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">ul</span>&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;!--[if lte IE 6]&gt;&lt;/td&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;/tr&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;/table&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt; ![endif]--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;top&quot;</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;Comunicacion&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;top_link&quot;</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">span</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;down&quot;</span>&gt;</span>Comunicaciones<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">span</span>&gt;</span><span style="color: #808080; font-style: italic;">&lt;!--[if gte IE 7]&gt;&lt;!--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;</span><span style="color: #808080; font-style: italic;">&lt;!--&lt;![endif]--&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;!--[if lte IE 6]&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;table&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;tr&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;td&gt;&lt; ![endif]--&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">ul</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;sub&quot;</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Zoom Noticias<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Flash<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Enterate<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Manual de Marca<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span>&gt;</span>Presentaciones<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">ul</span>&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;!--[if lte IE 6]&gt;&lt;/td&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;/tr&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;/table&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt; ![endif]--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">ul</span>&gt;</span><br />
<span style="color: #808080; font-style: italic;">&lt;!-- FIN MENU--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">div</span>&gt;</span></div></td></tr></tbody></table></div>
<p>Bueno espero vuestros comentarios y sugerencias como siempre.</p>
<p>Descarga del ejercicio: <a class="downloadlink" href="http://www.jorgebravo.es/wp-content/plugins/download-monitor/download.php?id=2" title="Version0.9 downloaded 637 times" >Archivos del Menu CSS (637)</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jorgebravo.es/2009/08/menu-desplegable-con-css-y-javascript/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Top 10 de las técnicas SEO</title>
		<link>http://www.jorgebravo.es/2009/08/top-10-de-las-tecnicas-seo/</link>
		<comments>http://www.jorgebravo.es/2009/08/top-10-de-las-tecnicas-seo/#comments</comments>
		<pubDate>Wed, 19 Aug 2009 12:54:27 +0000</pubDate>
		<dc:creator>Jorge Bravo</dc:creator>
				<category><![CDATA[BLOG]]></category>
		<category><![CDATA[DESTACADOS]]></category>
		<category><![CDATA[GUÍAS]]></category>
		<category><![CDATA[RECURSOS]]></category>
		<category><![CDATA[SEO]]></category>
		<category><![CDATA[técnicas SEO]]></category>
		<category><![CDATA[Top 10]]></category>
		<category><![CDATA[Webmasters]]></category>

		<guid isPermaLink="false">http://www.jorgebravo.es/?p=278</guid>
		<description><![CDATA[En Maestros del Web encontre este exelente articulo que nos explican 10 técnicas SEO para cponseguir crear una web exitosa. Corren ríos de tinta sobre las técnicas SEO y este artículo no pretende desautorizar ninguno de ellos sino ser un compendio, mejorando lo que otros han dicho, o atribuyendo la autoría de lo que mejor [...]]]></description>
			<content:encoded><![CDATA[<p class='fb-like'><iframe src='http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.jorgebravo.es%2F2009%2F08%2Ftop-10-de-las-tecnicas-seo%2F&amp;layout=box_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=65&amp;font=lucida+grande' scrolling='no' frameborder='0' allowTransparency='true' style='border:none; overflow:hidden; width:450px; height:65px'></iframe></p><p style="text-align: center;"><img class="aligncenter size-full wp-image-279" title="stats-best-SEO" src="http://www.jorgebravo.es/wp-content/uploads/2009/08/stats-best-SEO.png" alt="stats-best-SEO" width="500" height="233" /></p>
<p>En Maestros del Web encontre este exelente articulo que nos explican 10 técnicas SEO para cponseguir crear una web exitosa.<span> Corren ríos de tinta sobre las técnicas SEO y este artículo no pretende desautorizar ninguno de ellos sino ser un compendio, mejorando lo que otros han dicho, o atribuyendo la autoría de lo que mejor se ha dicho.<span id="more-278"></span></span></p>
<p>No quiero que sea muy detallado, sino simplemente mencionar las áreas en que hay que incidir si se quiere que <a target="_blank" href="../2009/07/100-formas-de-obtener-mas-visitas-para-tu-blog/">obtener mas visitas para tu web.</a> toque de todos los aspectos necesarios para lograr el éxito.</p>
<p>Hay enlaces a muchos sitios web, tanto en castellano como en inglés, que ayudarán enormemente a seguir las directrices que en este artículo detallo. Cabe mencionar que para la aplicación de todo lo expuesto aquí se requiere algún tiempo, ya que la optimización para motores de búsqueda (SEO) es una técnica larga, dura y difícil.</p>
<h3>Aspectos internos</h3>
<h3>1. Redacción apropiada de contenidos internos:</h3>
<p>Aunque no hay que redactar todo el contenido como si sólo los buscadores fueran a leerlo, hay que cuidar la <a target="_blank" href="http://www.desarrolloweb.com/articulos/2091.php">densidad de palabras y frases clave</a> y <a target="_blank" href="http://searchenginewatch.com/showPage.html?page=2175121">mantener un equilibrio entre lo que los visitantes y los buscadores</a>.</p>
<ul>
<li><a target="_blank" href="http://www.maestrosdelweb.com/editorial/escribirweb/">Cuando la escritura atrae</a></li>
<li><a target="_blank" href="http://www.maestrosdelweb.com/editorial/buenaredaccion/">Herramientas (con hache) para escribir bien (con be)</a></li>
</ul>
<h3>2. Optimización técnica de la página:</h3>
<p>Para la elección correcta del contenido de las etiquetas meta puedes usar herramientas como:</p>
<ul>
<li><a target="_blank" href="http://www.digitalpoint.com/tools/suggestion/">Keyword Suggestion Tool</a>: da la frecuencia con que un término o frase es buscada por día.</li>
<li><a target="_blank" href="http://inventory.overture.com/d/searchinventory/suggestion/">Keyword Selector Tool</a>: da el número de veces que un término o frase ha sido buscado en el último mes.</li>
<li><a target="_blank" href="http://www.submitexpress.com/analyzer/">SubmitExpress</a>: varias herramientas que validan la densidad de palabras clave.</li>
</ul>
<p>Aspectos a tomar en cuenta:</p>
<ul>
<li>Introducir mala ortografía de las palabras clave que suelen ocurrir al teclear rápido. Por ejemplo: “compar” en vez de “comprar”.</li>
<li>Usar nombres de archivo que contengan frases clave. Por ejemplo: si se puede llamar <strong>http://www.tuweb.com/comprar-mi-producto.html</strong>, no lo llames solamente <strong>../comprar.html</strong></li>
<li>No usar guiones bajos en nombres de archivo largos, usar guiones normales <strong>(-)</strong>.</li>
<li>Usar palabras clave en el título de la página.</li>
<li>Utilizar título y etiquetas meta diferentes para cada página.</li>
<li>Usar cabeceras <strong>(h1, h2, h3…)</strong> para definir importancia en el contenido y colocar en ellas las palabras clave.</li>
<li>Utilizar palabras clave en el <strong>“anchor text”</strong> de los enlaces, rellenar todas las etiquetas <strong>alt</strong> de las imágenes y <strong>title </strong>de los enlaces.</li>
<li>Servirnos de la mejor tecnología para que la página cargue rápido y el usuario no tenga que esperar.</li>
<li>No utilizar frames.</li>
<li>Imprescindible un <a target="_blank" href="http://www.sitemapbuilder.net/download.aspx">mapa del sitio visual </a>(para el usuario), otro en <a target="_blank" href="http://www.maestrosdelweb.com/editorial/flashxml/">XML</a> (para los buscadores), y el archivo <a target="_blank" href="http://www.mcanerin.com/EN/search-engine/robots-txt.asp">robots.txt</a>.</li>
<li>En cualquier página web sobre posicionamiento SEO se pueden encontrar más técnicas como estas por docenas: <a target="_blank" href="http://www.seomoz.org/article/search-ranking-factors">SEOmoz</a>, tiene un ranking de técnicas de posicionamiento elaborado por los más prestigiosos SEO a nivel internacional. <a target="_blank" href="http://google.dirson.com/posicionamiento.net/">Dirson</a>, <a target="_blank" href="http://www.1-en-buscadores.com/">1-en-buscadores</a>, etc.</li>
</ul>
<h3>3. Actualizaciones, creación de datos:</h3>
<p>Los buscadores indexan con más frecuencia las webs que cambian de contenido continuamente; por lo tanto si mantenemos un contenido de calidad, y un nivel de creación de datos aceptable, la escalada en los buscadores se hará más rápidamente.</p>
<h3>4. Link building:</h3>
<p>Este es uno de los capítulos más relevantes del top 10. La construcción de enlaces hacia tu sitio es lo hace aumentar el <a target="_blank" href="http://google.dirson.com/pagerank.php">PageRank</a>, que es el medidor de importancia de webs que utiliza Google (no olvides que quien te enlace tiene que tener buen PageRank, si no, no se consigue casi nada).</p>
<p>En este punto toca hacer referencia a un artículo que es toda una autoridad en el tema: <a target="_blank" href="http://www.seobook.com/archives/001792.shtml">101 Link Building Tips to Market Your Website</a> por Aaron Wall y Andy Hagans.</p>
<h3>5. Redacción de contenidos externos:</h3>
<p>Consiste en escribir artículos, reportajes, comentarios y respuestas en foros….siempre enlazando con la firma del pie de página, hacia tu sitio web. Aquí me gustaría hacer referencia al artículo <a target="_blank" href="http://www.maestrosdelweb.com/editorial/el-arte-de-escribir-bien-para-comunicar-mejor/">El arte de escribir bien para comunicar mejor</a>, que como su propio nombre indica, nos servirá de ayuda para mejorar nuestra redacción (tanto en papel como multimedia).</p>
<ul>
<li><a target="_blank" href="http://www.maestrosdelweb.com/editorial/los-beneficios-de-escribir-en-internet-y-para-otros-sitios-web/">Los beneficios de escribir en internet y para otros sitios web</a></li>
</ul>
<h3>6. Red social:</h3>
<p>Es importante crear una comunidad virtual que genere contenido cambiante y dinámico para tu web. Esto consiste básicamente en administrar foros y mantener un blog y/o escribir en otros.</p>
<p>Si se disponen de más recursos, pueden construirse varias web “paralelas” con utilidades o de temática diferente, que a fin de cuentas redirijan tráfico a nuestra web principal.</p>
<ul>
<li><a target="_blank" href="http://www.maestrosdelweb.com/editorial/redessociales/">Redes Sociales en Internet</a></li>
<li><a target="_blank" href="http://www.maestrosdelweb.com/editorial/blogs/">¿Ya tienes un blog?</a></li>
</ul>
<h3>7. Be famous:</h3>
<p>Se tiene que hablar de tu sitio web. Organizar concursos online dando un premio al mejor diseño web, o al mejor diseño de un logotipo, siempre da publicidad al organizador. Y como dicen los políticos: que se hable de ti es bueno, aunque se digan cosas malas; lo malo es que nadie te haga caso.</p>
<ul>
<li><a target="_blank" href="http://www.maestrosdelweb.com/editorial/blogexitoso/">Cómo hacer un blog único y exitoso</a></li>
<li><a target="_blank" href="http://www.maestrosdelweb.com/actualidad/celebra-los-10-anos-tomandote-una-foto/">Celebra los 10 años tomándote una foto</a></li>
</ul>
<h3>8. Seguimiento de resultados:</h3>
<p>Hay que mantenerse al tanto del tráfico que genera tu página web y cómo es ese tráfico. Aconsejo utilizar <a target="_blank" href="http://www.google.com/analytics">Google Analytics</a>. Se tienen que corregir “imperfecciones” de tráfico, palabras clave con bajo rendimiento, etc.</p>
<p>Pero hay que ser cauto porque un cambio de palabras clave puede tardar mucho tiempo en hacerse notar, para bien o para mal, y se tienen que analizar bien los resultados antes de lanzarse a un cambio radical.</p>
<ul>
<li><a target="_blank" href="http://www.maestrosdelweb.com/editorial/herramientas-para-medir-las-estadisticas-de-tu-web/">Herramientas para medir las estadísticas de tu web</a></li>
</ul>
<h3>9. Relaciones comerciales recurrentes:</h3>
<p>Es útil que otros nos ayuden a vender. Un programa de afiliados o de comisiones por venta realizada siempre es un buen método por tres razones fundamentalmente:</p>
<ul>
<li>La gente que venda los productos por nosotros está haciéndonos publicidad gratuita desde sus propias webs o tiendas.</li>
<li>Las personas de nuestro programa de afiliados tienen que esforzarse en mostrar al público un producto bueno. Es decir, nos dan buena imagen.</li>
<li>Mantienes a una cantidad fija de gente siempre interesada en tu sitio web, o navegando “alrededor” de él, ya que son tus comisionistas.</li>
</ul>
<p>Si tu sitio web no vende productos, se pueden hacer otro tipo de programas de afiliados, por ejemplo, poder colaborar si es una revista online, y así beneficiará a los que colaboren (dejarán su firma con su web en el artículo), y a ti porque llenarán de contenido tu web.</p>
<ul>
<li><a target="_blank" href="http://www.maestrosdelweb.com/editorial/internetatrae/">Internet: atrae publicidad e inversiones</a></li>
<li><a target="_blank" href="http://www.maestrosdelweb.com/editorial/publici/">Publicidad en Internet: ¿Hora de cambiar el esquema de trabajo?</a></li>
</ul>
<h3>10. Offline:</h3>
<p>Promoción offline que revierte en publicaciones online. Publicar en medios en soporte papel (periódicos, revistas, etc.), asistir a conferencias y congresos. Quien lea un artículo suyo en el periódico, o le haya gustado una buena conferencia, es muy problable que visite su sitio web, o publique una entrada en su blog haciéndole referencia. El boca a oreja sigue siendo efectivo. Incluso en técnicas SEO.</p>
<p>Toda esta información son meras DIRECTRICES. Lo que he pretendido con este artículo es hacer una guía de los puntos indispensables para una campaña SEO. El lector de este artículo debería completar la información de cada punto del que no tenga conocimiento extenso para poder iniciar así una campaña SEO viable.</p>
<p>Via : <a target="_blank" href="http://www.maestrosdelweb.com/editorial/top-10-de-las-tecnicas-seo/" target="_blank">Maestros del Web</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jorgebravo.es/2009/08/top-10-de-las-tecnicas-seo/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
	</channel>
</rss>

