Texto en HTML (II)
por Luciano Moreno, del departamento de diseño web de BJS Software.

ESTILOS FÍSICOS Y LÓGICOS.-

A la hora de dar formato a nuestro texto web podemos hacerlo partiendo de dos planteamientos diferentes, cada uno de los cuales presenta sus ventajas y sus inconvenientes, por lo que muchas veces tendremos que recurrir a una mezcla de ambos tipos de estilos si nuestro diseño así lo exije.

El primer concepto mental para aplicar estilos al texto de una página es el de utilizar estilos físicos, entendiendo por tales aquellos que formatean cada porción de texto atendiendo tan sólo a cómo debe aparecer finalmente en pantalla, sin preocuparse en absoluto en qué peso o papel desempeña cada parte del documento en el esquema total del mismo. Un ejemplo de este esquema mental sería:

"Este parrafo debe aparecer en negrita y de tamaño mas grande que el resto de la página, el siguiente debe ser de tamaño normal y peso normal y el último lo pondré en cursiva para que destaque del resto".

Frente a este concepto se encuentra el esquema de estilos lógicos, caracterizado porque en él hacemos un estudio lógico de cada parte del documento, viendo la importancia que tiene en el total del mismo y distinguiendo entre cabeceros, citas de otras personas o fuentes, comienzos de capítulo, etc, por lo que formatearemos cada parte del documento de acuerdo con su lugar en el esquema completo. Un ejemplo de este planteamiento sería:

"Este parrafo es una cabecera, por lo que debera aparecer con el formato correspondiente para que destaque, el siguiente es una porción de texto normal y el último es una cita tomada de otro autor, por lo que debera llevar el formato correspondiente a la misma."

Aunque en un principio ambos esquemas se pueden confundir late tras cada uno de ellos una concepción diferente, pudiéndose asemejar a grandes rasgos el formateo físico al que llevaría a cabo un diseñador grafico y el lógico al que desarrollaría un maquetador de prensa.

¿Cual es mejor y cual es peor?. Como todo en esta vida, depende del caso concreto. Generalmente el formateo físico esta indicado en aquellos casos en los que andamos apurados de espacio para presentar un texto o unos datos concretos, en aquellos en que deseamos una presentación fija, que se muestre en pantalla siempre igual sea cual sea el navegador y la resolución del usuario, ya que este tipo de formateo nos permite un mayor control absoluto sobre los resultados. Por otro lado, el planteamiento lógico es adecuado en aquellos casos en que deseamos obtener documentos con unos esquemas constructivos perfectamente definidos, que puedan sufrir variaciones dependiendo de la resolución y versión del navegador conservando su estilo en conjunto, manteniéndose cada parte del documento con un estilo adecuado a su papel en el total del mismo.

Por ejemplo, una cabecera de página lo formatearíamos con estilo físico asignandole un tamaño de fuente grande y en negrita:

<font size="5"><b>Cabecera</b></font>

cuyo resultado es:

Cabecera

mientras que conseguimos un efecto similar usando estilos lógicos mediante:

<h2>Cabecera</h>

con el que obtenemos:

Cabecera

estando la diferencia entre ambos en que mediante el estilo físico asignamos el estilo sin tener en cuenta qué es el texto que estamos formateando, mientras que en el lógico sí que tenemos en cuenta que es una cabecera, y que por lo tanto debe destacar mas que el resto del texto. Mientras que en el físico debemos indicarle en cada momento cómo deseamos que quede cada parte, con el lógico sólo debemos decirle que es una cabecera, y el navegador se encarga por sí mismo de ponerlo en mayor tamaño y en negrita, porque le hemos dicho que es importante sólo mediante la propia definición de que es una cabecera.

En HTML disponemos de etiquetas físicas y lógicas, y normalmente siempre encontraremos etiquetas de ambos tipos equivalentes, que produzcan el mismo resultado. La diferencia principal entre ambos estilos reside en su propia concepción.

Si visualizamos este trozo de código en un navegador sólo texto, antiguo o que no es de los normalmente usados el resultado obtenido por ambos métodos puede ser diferente de lo que esperabamos, pero mientras con el estilo físico el cabecero puede mostrarse casi sin diferencias respecto al texto normal, si hemos aplicado un estilo lógico es casi seguro que esta diferencia seguira presente; tal vez no de la forma que nosotros esparabamos, pero si existira esa diferencia, ya que el navegador sabe entonces que ese trozo de texto debe enfatizarlo respecto al que le rodea.

Todo esta explicación es un poco dar vueltas siempre alrededor de lo mismo, pero es conveniente que de una vez por todas aprendamos qué es cada estilo de formateo de un texto.

Estableciendo un símil con la " vida real ", si queremos explicar a una persona de un país remoto (el navegador) quién es un Juan Carlos I, podemos decirle que es un señor que lleva una corona, un cetro, que vive en un palacio y que es el representante de nuestro país (estilo físico), y también podemos decirle símplemente que es el rey de España (estilo lógico). Si en su país los reyes no llevan corona ni cetro tal vez no nos entienda bien en el primer caso, pero aunque en su país el rey lleve un sombrero de paja y viva debajo de un puente, seguro que nos entiende en el segundo caso.

Un factor a destacar en los estilos lógicos: no existe una manera predeterminada y estandar de presentación de estilos lógicos, quedando esta en manos del navegador, con la pérdida de control sobre el resultado final que ello supone.

En resumen: los estilos físicos causan siempre el mismo efecto (negrita, cursiva, etc.), mientras que los lógicos indican un tipo de texto (citas, nombres, etc.) que por su definición tienen un modo propio de presentarse. Los puristas del HTML recomiendan que se use siempre un estilo lógico, argumentando que los estilos físicos dependen del navegador y características graficas del ordenador del usuario. Pero actualmente los ordenadores son muy potentes y tienen un buen comportamiento grafico, por lo que esta recomendación carece ya de sentido practico real.

Vamos a estudiar a continuación las etiquetas que nos ofrece HTMl para trabajar con ambos estilos, dejando para el final el formateo de textos mediante Hojas de Estilos en Cascada (CSS).