Análisis estilo orquídea de la página Zen Garden

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" >
CABEZA<head>
METAS <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta name="author" content="Dave Shea" />
<meta name="keywords" content="design, css, cascading, style, sheets, xhtml, graphic design, w3c, web standards, visual, display" />
<meta name="description" content="A demonstration of what can be accomplished visually through CSS-based design." />
<meta name="robots" content="all" /> FIN DE METAS
ETIQUETA DE TÍTULO <title>css Zen Garden: The Beauty in CSS Design</title> FIN DE ETIQUETA DE TÍTULO

<script type="text/javascript"></script>

<style type="text/css" title="currentStyle">
@import "/211/211.css";
</style>
<link rel="Shortcut Icon" type="image/x-icon" href="http://www.csszengarden.com/favicon.ico" />
<link rel="alternate" type="application/rss+xml" title="RSS" href="http://www.csszengarden.com/zengarden.xml" />
</head> FIN DE CABEZA

<!--

This xhtml document is marked up to provide the designer with the maximum possible flexibility.
There are more classes and extraneous tags than needed, and in a real world situation, it's more
likely that it would be much leaner.

However, I think we can all agree that even given that, we're still better off than if this had been
built with tables.

-->

CUERPO

<div id="container">
<div id="intro">
<div id="pageHeader">
TEXTO ALINEADO A LA IZQUIERDA

ETIQUETA DE TÍTULO <h1><span>Jardin Zen css</span></h1>
<h2><span>La belleza del diseño <acronym title="Cascading Style Sheets">CSS</acronym>
</span></h2>
</div>
<div id="quickSummary">
<p class="p1"><span>Una demostración de lo que se puede lograr visualmente
usando diseño basado en <acronym title="Cascading Style Sheets">CSS</acronym>–.
Seleccione cualquier estilo de la lista para cargarlo en esta página.</span></p>

<p class="p2"><span>Baje el archivo de ejemplo <a href="/zengarden-sample.html" title="This page's source HTML code, not to be modified.">html
</a> y <a href="/zengarden-sample.css" title="This page's sample CSS, the file you may modify.">css
</a></span></p>FIN TEXTO ALINEADO A LA IZQUIERDA
</div>
<div id="preamble">
TEXTO ALINEADO A LA DERECHA

<h3><span>El camino hacia La Luz</span></h3>
<p class="p1"><span>Ensuciando un camino oscuro y aburrido reposan las reliquias
pasadas de selectores específicos para navegadores, <acronym title="Document Object Model">DOM</acronym>s
incompatibles, y soporte incierto para <acronym title="Cascading Style Sheets">CSS</acronym>
.</span></p>

<p class="p2"><span>Hoy, tenemos que limpiar la mente de prácticas
pasadas. La claridad de la Web ha sido alcanzada gracias a los esfuerzos
infatigables de gente como <acronym title="World Wide Web Consortium">W3C</acronym>,
<acronym title="Web Standards Project">WaSP</acronym> y los grandes creadores
de los navegadores.</span></p>
<p class="p3"><span>El Jardin Zen css invita a usted a relajarse y meditar
acerca de las lecciones importantes de los maestros.Comience a ver con
claridad. Aprenda a usar (aun por ser) tecnicas honradas por el tiempo
en una nueva y vigorosa forma. Conviertase en uno con la Web.</span></p> FIN DE TEXTO ALINEADO A LA DERECHA
</div>
</div>
<div id="supportingText">
<div id="explanation">
TEXTO AL CENTRO DE LA PÁGINA <h3><span>Y De que se Trata Esto?</span></h3>

<p class="p1"><span>Hay claramente una necesidad de que <acronym title="Cascading Style Sheets">CSS</acronym>
sea tomada seriamente por los artistas gráficos. El Jardin Zen
intenta motivar, inspirar, y animar la participacion. Para empezar, vea
algunos de los excitantes diseños de la lista. Seleccionando cualquiera
de ellos cargara la hoja de estilos en esta misma pagina. El codigo se
mantiene intacto, lo unico que cambia es el archivo externo .css. Si,
verdad.</span></p>
<p class="p2"><span><acronym title="Cascading Style Sheets">CSS</acronym>
permite total y completo control sobre el estilo de un documento de hypertexto.
La única forma en que este punto puede ser ilustrado de manera
tal que la gente quede impresionada es demostrando lo que realmente se
puede hacer, una vez que las riendas son colocadas en las manos de aquellos
dispuestos a crear belleza basada en estructura.. Hasta la fecha, la mayoría
de los trucos y mejoras han sido demostrados por estructuristas y codificadores.
Los diseñadores tienen que todavia poner su marca. Esto necesita
cambiar. </span></p>
</div>

<div id="participation">
<h3><span>Participación</span></h3>
<p class="p1"><span>Solo artistas gráficos por favor. Usted esta
modificando esta página, por tanto fuertes cualidades en <acronym title="Cascading Style Sheets">CSS</acronym>
son necesarias, sin embargo los archivos de ejemplo estan comentados de
manera suficiente que aun un novato en <acronym title="Cascading Style Sheets">CSS</acronym>
puede usarlos como punto de inicio. Por favor vea la <a href="http://www.mezzoblue.com/zengarden/resources.asp" title="A listing of CSS-related resources"><acronym title="Cascading Style Sheets">Guia
de Recursos CSS</acronym></a> para encontrar tutoriales avanzados y concejos
pra trabajar con ACRONIMO <acronym title="Cascading Style Sheets">CSS</acronym> CIERRE ETIQUETA ACRONIMO.</span></p>

<p class="p2"><span>Usted puede modificar la hoja de estilos en la manera
que desee, pero no el código <acronym title="HyperText Markup Language">HTML</acronym>.
Esto puede ser desalentador al principio si es que no ha trabajado de
esta forma previamente, pero siguiendo los enlaces listados podrá
aprender más , tambien puede usar los archivos de ejemplo como
guía.</span></p>
<p class="p3"><span>Baje los archivos de ejemplo <a href="/zengarden-sample.html" title="This page's source HTML code, not to be modified.">html</a>
y <a href="/zengarden-sample.css" title="This page's sample CSS, the file you may modify.">
css</a> para poder trabajar con una copia local. Una vez terminada su
obra maestra (y por favor, no envie trabajos a medio terminar) copie su
archivo .css a un servidor web bajo su control. <a href="http://www.mezzoblue.com/zengarden/sendfile.asp" title="Use the contact form to send us your CSS file">Envienos
un enlace</a> hacia el archivo y si decidimos usarlo nosotros bajaremos
las imágenes asociadas. Trabajos finales serán colocados
en nuestro servidor..</span></p>

<p class="p4"><span>actualización : Estoy buscando traductores. Si
usted es fluente en Ingles y otro idioma, esta es otra forma de envolverse
en el proyecto. Por favor <a href="http://www.mezzoblue.com/contact/" title="Send me an e-mail mentioning which languages you are fluent in.">contacteme</a>
para mas detalles. Esta traduccion hecha por <a href="http://www.llajta.com/">Fernando Lopez</a>.</span></p>
</div>
<div id="benefits">
<h3><span>Beneficios</span></h3>
<p class="p1"><span>Por que participar? Por el reconocimiento, la inspiración y por la fuente a la que todos podemos referir cuando tengamos que defender nuestra posición de diseño basado en <acronym title="Cascading Style Sheets">CSS</acronym>. Esto es altamente necesario. Mas y mas grandes lugares estan tomando el riesgo, pro no los suficientes. Un día esta galería será una curiosidad histórica, sin embargo ese dia no sera hoy.</span></p>

</div>
<div id="requirements">
<h3><span>Requerimientos</span></h3>
<p class="p1"><span>Nos gustaría ver cuanto<acronym title="Cascading Style Sheets, version 1">CSS1</acronym> como sea posible. <acronym title="Cascading Style Sheets, version 2">CSS2</acronym> debería ser limitado a elementos altamente soportados solamente. El Jardin Zen css se concentra en <acronym title="Cascading Style Sheets">CSS</acronym> funcional y práctico y no así en los últimos trucos tecnológicos vistos solamente por un 2% de la población navegante. El único requerimiento real que tenemos es que vuestro <acronym title="Cascading Style Sheets">CSS</acronym> llegue a validar.</span></p>

<p class="p2"><span>Desgraciadamente , el diseñar de esta manera enfoca las fallas de las diferentes implementaciones de <acronym title="Cascading Style Sheets">CSS</acronym>. Diferentes navegadores se muestran de manera diferente, aun cuando a veces el <acronym title="Cascading Style Sheets">CSS</acronym> es completamente válido, y esto se convierte en un delírio cuando un arreglo en uno conlleva una ruptura en el otro. Vea la página de <a href="http://www.mezzoblue.com/zengarden/resources.asp" title="A listing of CSS-related resources">Recursos</a> para información en algunos de los arreglos disponibles. Compatibilidad total entre navegadores es aun un sueño, y no esperamos que termine con un código creado a la perfección para cada plataforma. Pero pruebe en cuantos le sea posible. Si su diseño no funciona en al menos IE5+/Win y Mozilla (usado por un 90% de la población), no aceptaremos su trabajo.</span></p>

<p class="p3"><span>Le pedimos someter arte originial. Por favor respete las leyes de derechos reservados. Por favor mantenga material objetable a un mínimo; desnudos delicados son aceptables, completa pornografía será rechazada.</span></p>
<p class="p4"><span>Este es un ejercício de aprendizaje como tambien una demostración. Usted mantiene todos los derechos sobre los gráficos, sin embargo le pedimos que someta su <acronym title="Cascading Style Sheets">CSS</acronym> bajo una licencia de Creatividad Comun identica a la encontrada <a href="http://creativecommons.org/licenses/sa/1.0/" title="View the Zen Garden's license information.">en este sitio</a> para que otros puedan aprender de su trabajo.</span></p>

<p class="p5"><span>Ancho de banda donado amablemente por <a href="http://www.mediatemple.net/">mediatemple</a></span></p> FIN DEL TEXTO AL CENTRO DE LA PÁGINA
</div>
PIE DE PÁGINA <div id="footer"> <a href="http://validator.w3.org/check/referer" title="Check the validity of this site’s XHTML">xhtml</a>
  <a href="http://jigsaw.w3.org/css-validator/check/referer" title="Check the validity of this site’s CSS">css</a>
  <a href="http://creativecommons.org/licenses/by-nc-sa/1.0/" title="View details of the license of this site, courtesy of Creative Commons.">cc</a>
  <a href="http://www.mezzoblue.com/zengarden/faq/#s508" title="Check the accessibility of this site according to U.S. Section 508">508</a>
  <a href="http://www.mezzoblue.com/zengarden/faq/#aaa" title="Check the accessibility of this site according to WAI Content Accessibility Guidelines 1">aaa</a> FIN DEL PIE DE PÁGINA
</div>

</div>

MENÚ LADO DERECHO
<div id="linkList">
<div id="linkList2">
<div id="lselect">
<h3 class="select"><span>Seleccione un diseño:</span></h3>
ELEMENTO DE LISTA (DESORDENADA) <ul>
ELEMENTO DE LISTA <li><a href="?cssfile=/213/213.css&page=0" title="AccessKey: a" accesskey="a">Under the Sea!</a> por <a href="http://www.ericstoltz.com/" class="c">Eric Stoltz</a></li> CIERRE ELEMENTO DE LISTA

<li> REFERENCIA <a href="?cssfile=/212/212.css&page=0" title="AccessKey: b" accesskey="b">Make ’em Proud</a> CIERRE DE REFERENCIA por <a href="http://skybased.com/" class="c">Michael McAghon and Scotty Reifsnyder</a></li>
<li><a href="?cssfile=/211/211.css&page=0" title="AccessKey: c" accesskey="c">Orchid Beauty</a> por <a href="http://www.kevinaddison.com/" class="c">Kevin Addison</a></li>
<li><a href="?cssfile=/210/210.css&page=0" title="AccessKey: d" accesskey="d">Oceanscape</a> por <a href="http://www.pixel-house.com.au/" class="c">Justin Gray</a></li>

<li><a href="?cssfile=/209/209.css&page=0" title="AccessKey: e" accesskey="e">CSS Co., Ltd.</a> por <a href="http://www.benklemm.de/" class="c">Benjamin Klemm</a></li>
<li><a href="?cssfile=/208/208.css&page=0" title="AccessKey: f" accesskey="f">Sakura</a> por <a href="http://www.re-bloom.com/" class="c">Tatsuya Uchida</a></li>
<li><a href="?cssfile=/207/207.css&page=0" title="AccessKey: g" accesskey="g">Kyoto Forest</a> por <a href="http://rpmdesignfactory.com/" class="c">John Politowski</a></li>

<li><a href="?cssfile=/206/206.css&page=0" title="AccessKey: h" accesskey="h">A Walk in the Garden</a> por <a href="http://users.skynet.be/bk316398/temp.html" class="c">Simon Van Hauwermeiren</a></li>
</ul> CIERRE DE ELEMENTO DE LISTA (DESORDENADA)
</div>

<div id="larchives">
<h3 class="archives"><span>Archivos:</span></h3>
<ul>

<li><a href="?cssfile=/211/211.css&page=1" title="View next set of designs. AccessKey: n" accesskey="n">diseños siguie<span class="accesskey">n</span>tes »</a></li>
<li><a href="http://www.mezzoblue.com/zengarden/alldesigns/" title="View every submission to the Zen Garden. AccessKey: w" accesskey="w">Vea todos los diseños</a></li>
</ul>
</div>

<div id="lresources">
<h3 class="resources"><span>Recursos:</span></h3>

<ul>
<li><a href="/211/211.css" title="View the source CSS file for the currently-viewed design, AccessKey: v" accesskey="v"><span class="accesskey">V</span>ea el <acronym title="Cascading Style Sheets">CSS</acronym> CSS de este diseño</a></li> <li><a href="http://www.mezzoblue.com/zengarden/resources.asp" title="Links to great sites with information on using CSS. AccessKey: r" accesskey="r"><acronym title="Cascading Style Sheets">Re<span class="accesskey">c</span>ursos CSS</acronym></a></li>
<li><a href="http://www.mezzoblue.com/zengarden/faq.asp" title="A list of Frequently Asked Questions about the Zen Garden. AccessKey: q" accesskey="q"><acronym title="Frequently Asked Questions">FA<span class="accesskey">Q</span></acronym></a> </li>

<li><a href="http://www.mezzoblue.com/zengarden/sendfile.asp" title="Send in your own CSS file. AccessKey: s" accesskey="s"><span class="accesskey">S</span>ometa un Diseño</a></li>
<li><a href="http://www.mezzoblue.com/zengarden/translations/" title="View translated versions of this page. AccessKey: t" accesskey="t"><span class="accesskey">T</span>raducciones</a></li>
</ul>
</div>
</div>
</div>

</div>

<div id="extraDiv1"><span></span></div><div id="extraDiv2"><span></span></div><div id="extraDiv3"><span></span></div>
<div id="extraDiv4"><span></span></div><div id="extraDiv5"><span></span></div><div id="extraDiv6"><span></span></div>

</body> FIN DE CUERPO
</html>