M�todos Avanzados / Un ejemplo motivador

Un Ejemplo Motivador
(A Motivational Example )

Para ayudarte a apreciar c�mo p�ginas estilizadas te pueden hacer el dise�o de tu red mas f�cil, vamos a considerar como a�adir�amos algo llamativo a encabezamientos de secciones en una p�gina de la red. Las etiquetas por omisi�n del navegador   <h1>,....,<h6> te permiten f�cilmente crear encabezamientos de varios tama�os, pero no te permiten mucho en la manera de variaciones en estilo. Por ejemplo, si tu deseas titular una secci�n con el encabezamiento tama�o mediano "Algunos Ejemplos de GIFs Animados" y est�s satisfecha/o con el encabezamiento por omisi�n del navegador, puedes obtener

Algunos Ejemplos de GIFs Animados

Algunos Ejemplos de GIFs Animados

siempre y cuando est�s dispuesto a pasar suficiente trabajo:

   
<p>     
<B>     
<FONT FACE="Helvetica,Geneva,Arial" size="+1"     
color="#cc0000">   
Algunos Ejemplos de GIFs Animados   
</FONT>     
</B>     
<p>     

Nota que para conseguir �ste �ltimo encabezado tienes que especificar tipo de letra, tama�o, color, estilo ennegresido, y hasta espacios entre p�rrafos despu�s del encabezado. (Expl�citamente centralizamos los dos t�tulos anteriores para que �stos ejemplos no se confundan con los t�tulos actuales de la secci�n en �sta p�gina.)

Posiblemente detallando todas estas especificaciones no sea gran cosa si todo lo que deseas usar tu estilo entallado es para un solo encabezamiento, o un par de ellos. Pero y qu� tal si necesitas encabezados entallados (costomizados) para muchas p�ginas, cada una de ellas con varias secciones tituladas? O, una verdadera pesadilla, qu� tal si despu�s que hayas pasado por tanto trabajo, tienes que cambiar el estilo de todos los encabezamientos en todas las p�ginas para que se vean diferentes? Entonces tienes un grave dolor de cabeza.  Tienes que hacer mucho trabajo, escencialemente para hacer los mismos cambios una y otra y otra y otra vez. Seguramente, tiene que haber una mejor manera.

Existe una mejor manera: puedes usar p�ginas estilizadas para redefinir alguno o todos las etiquetas  <h1>...<h6> para que usen las nuevas versiones cuando tu lo desees. En adici�n, si mas adelante deseas o necesitas cambiar el estilo de los encabezamientos, todo lo que tienes que hacer es modificar las definiciones de tu estilo, y los encabezamientos se actualizar�n para reflejar tales cambios. Hasta puedes preparar cosas de manera que, si lo deseas, globalmente puedes cambiar el formato de todos los encabezamientos para p�ginas m�ltiples, hasta para un una direcci�n completa en la red, con simplemente cambiar las definiciones de estilo en un solo lugar.

Inmedi�tamente vemos que p�ginas estilizadas tienen el potencial de ahorrarte enormes cantidades de tiempo y trabajo (y eliminar las posibilidades de errores que siempre pueden ocurrir si tienes que formatear cada encabezamiento de la manera anticuada). Y �ste ejemplo se queda corto cuando se trata de lo que tu puedes hacer con p�ginas estilizadas.

Preparando[Formateando] webTeacher
(webTeacher Formatting)

Estamos completamente convencidos de las ventajas de usar p�ginas estilizadas, pero las usamos cuando creamos el webTeacher? No. Y por qu� no? Posiblemente en una actualizaci�n futura lo haremos, pero webTeacher fue creado originalmente en el momento en que navegadores 3.0 estaban en su gran uso. IE 3 comenzaba a apoyar algunas caracter�sticas de p�ginas estilizadas, mas sin embargo, Netscape no apoyaba ninguna. As� que en ese momento, no podemos hacer uso de las p�ginas estilizadas ya que una gran porci�n de nuestra audiencia no habr�an tenido los navegadores que mostrar�an las caracter�sticas. En esta publicaci�n del webTeacher queremos indroducirte algunos de los conceptos y capacidades de las p�ginas estilizadas, pero a�n no hemos convertido el tutor en s� en usarlos.

Terminolog�a: Hojas de Estilo y CSS
(Terminology: Style Sheets and CSS)

Antes de que lleguemos a nuestros ejemplos, vamos a decir algo sobre la terminolog�a que estaremos usando en nuestras discusiones. A veces usaremos css com simples abreviatura para "cascadas de p�ginas estilizadas". En otras ocasiones usaremos css para denotar un  lenguaje en que p�ginas estilizadas estan escritas. y en otras ocasiones el t�rmino ser� usado de manera general para que funcione cualquier interpretaci�n.

En adici�n, a menudo omitiremos el t�rmino "cascadas" y simplemente referirse a  "p�ginas estilizadas" ("style sheets") para ser breve. Pero debemos aclarar que estamos tomando un atajo cuando hacemos esto. T�cnicamente, "cascadas en p�ginas estilizadas" se refiere a un tipo particular de p�ginas estilizadas, las cuales se adhieren a un conjunto especifico de convenciones determinado por grupos oficiales de est�ndares de la red. Existen otros typos de p�ginas estilizadas en uso en la red, pero �stas no son abiertamente apoyadas y no las discutiremos aqu�.

Tampoco entraremos en una discusi�n extensa sobre el significado del t�rmino   "cascadas" "cascading". Solo notemos que no es un una mera palabra; se refiere a la manera en que las p�ginas son mostradas cuando existen conflictos en definici�n de estilo.