5.5 - Estilos físicos y lógicos

Estilos físicos y Estilos lógicos

     Como estilos definiremos los distintos efectos que se pueden aplicar al texto normal. Estos efectos son los resaltes (negrita, cursiva, subrayado, etc ...) que se pueden usar.

     En HTML existen dos grupos principales de estilos los lógicos y los físicos. Los físicos son aquellos que siempre causan un mismo efecto (negrita, cursiva, ...) y los lógicos indicarán un tipo de texto (cita, nombre de persona) que por sus características tiene un modo de mostrarse propio.

     Se pueden utilizar ambos estilos para especificar un mismo efecto, por ejemplo para obtener una frase resaltada podemos usar el estilo físico (negrita) o el estilo lógico (STRONG) y en ambos casos el resultado puede ser el mismo.

     Es más recomendado, sin embargo, utilizar el estilo lógico, ya que en este el modo en que se ven los distintos efectos puede ser definido por el usuario, de forma que se pueda obtener una presentación personalizada. Además en un futuro los navegadores podrían añadir modos más sofisticados de presentar los distintos estilos y si están definidos de forma lógica la adaptación es más sencilla. Y por último y más importante, al utilizar estilos lógicos el modo de escribir HTML se hace independiente de como se presentará finalmente el texto, se utilizará el estilo según el tipo de texto que sea y no según como se debe presentar.

     La tendencia actual de los navegadores es el uso de los estilos físicos olvidando un poco la versatilidad de los estilos lógicos, pero sin embargo ambos estilos pueden ser usados indistintamente, sin ningún problema.

Estilos Físicos.

     El efecto se aplicará al texto expresado entre la etiquetas de inicio y fin. Los estilos físicos son los siguientes:

Etiqueta HTMLEjemploDescripción
<B> Ejemplo Negrita.
<I> EjemploCursiva.
<TT> Ejemplo Maquina de escribir, muestra una fuente de caracteres de espaciado fijo.
<BLINK> EjemploParpadeo.
<SUB> Ejemplo Subíndice. Para Netscape 2.0+
<SUP> Ejemplo Superíndice. Para Netscape 2.0+
<BIG> Ejemplo Texto grande, se utilizará el mayor tamaño de fuente. Para Netscape 2.0+
<SMALL> Ejemplo Texto pequeño, se utilizará la fuente de menor tamaño. Para Netscape 2.0+

      Los estilos se pueden combinar entre sí obteniendo cualquier efecto deseado.

Ejemplo
Inst.
HTML
Este texto es <B>negrita, <I>cursiva y <BLINK>parpadeante </BLINK></I></B>
Resul
tado
Este texto es negrita, cursiva y parpadeante
Explica
ción
El texto es por tramos negrita, cursiva y parpadeante.

Estilos lógicos

     En este caso se definen las situaciones o tipos de frases y estas tomarán la representación más adecuada a cada caso. Estos estilos son:

Etiqueta HTMLEjemploDescripción
<ADDRESS>
Ejemplo
Se utilizará para especificar direcciones de correo electrónico.
<BLOCKQUOTE>
Ejemplo
Introduce citas textuales o texto destacado, en este caso el texto se separará del texto circundante y se ajustará a los márgenes derecho e izquierdo.
<CITE> EjemploIndica el titulo de una película o un libro.
<CODE> EjemploCódigo fuente de un lenguaje de programación.
<DFN> EjemploEspecifica una definición.
<EM> EjemploIndicará enfasis.
<KBD> EjemploTexto introducido desde el teclado.
<SAMP> EjemploMensajes de estado de la computadora.
<STRIKE> EjemploTexto desechado, tachado.
<STRONG>EjemploEspecificará texto resaltado.
<VAR>Ejemplo Indicará una variable.