En este capítulo veremos cómo marcar ciertas partes del contenido para destacarlas y hacer más clara la lectura.
Recuerda que siempre nos referimos a destacar semánticamente, el aspecto de todos los formatos se controla con CSS.
Acerca de <b> y sus secuaces
Si eres de la vieja escuela de webmasters, probablemente estés acostumbrado a usar etiquetas como <b> , <i> y compañía para poner negrita, cursiva, subrayado, monoespaciado, etc. ¡Olvídalo!
El HTML 4 nos permitía controlar el aspecto con el que se iba a mostrar el texto con etiquetas como <font> con la que cambiábamos tamaño, fuente y color del texto. Con XHTML nos limitamos a estructurar el contenido y a asegurarnos de que sea semántico.
¿Qué es esto de la semántica? Sería algo así como lograr que una máquina pueda entender un texto. Por ejemplo, un ordenador no sabe qué significa el que algo esté en negrita. Pero sí entiende que algo que tiene énfasis es importante, y debe ser destacado de alguna manera. Puede parecer una tontería, pero a la hora de trabajar con navegadores aurales (para ciegos), de texto, o desde móviles, la cosa cobra importancia.
Énfasis
Para dar énfasis a un texto o parte de texto usaremos la etiqueta <em> y si queremos marcar un texto en negritas utilizaremos <strong> .
Por ejemplo, este código:
<p>
<em>Far</em> is not the word because I'm never far
<strong>enough</strong>.
</p>
Se vería en el navegador así:
Far is not the word because I'm never far enough.
Es importante que sepas que estas dos etiquetas van dentro de elementos block, como párrafos.
Preformato
Si has practicado algo de los capítulos anteriores, te habrás dado cuenta de que cuando el navegador interpreta el código XHTML, ignora múltiples espacios en blanco, saltos de línea, tabuladores, etc. del código. Hay ocasiones en las que necesitamos mantener este formato, por ejemplo cuando queremos mostrar código fuente. Para eso existe la etiqueta <pre> , que tampoco se utiliza mucho actualmente.
Un ¡Hola mundo! en C nos quedaría así:
<pre>#include <stdio.h>
int main() {
printf("Hello World!n");
return(0);
}</pre>
Acrónimos y abreviaturas
Para utilizar acrónimos y abreviaturas tenemos las etiquetas <acronym> y <abbr> respectivamente. En el navegador se genera el mismo efecto; se muestra su significado al pasar el mouse por encima.
Para que funcionen, estas etiquetas necesitan el atributo title donde colocamos su significado.
Ejemplo:
<p>
Mi ordenador tiene 512 <abbr title="Megabytes">MB</abbr>
de memoria <acronym title="Random Access Memory">RAM</acronym>.
</p>
Si no conoces la diferencia entre acrónimo y abreviatura, en nuestro manual de accesibilidad encontrarás una ayuda.
Acerca de <b> y sus secuaces
Si eres de la vieja escuela de webmasters, probablemente estés acostumbrado a usar etiquetas como <b> , <i> y compañía para poner negrita, cursiva, subrayado, monoespaciado, etc. ¡Olvídalo!
El HTML 4 nos permitía controlar el aspecto con el que se iba a mostrar el texto con etiquetas como <font> con la que cambiábamos tamaño, fuente y color del texto. Con XHTML nos limitamos a estructurar el contenido y a asegurarnos de que sea semántico.
¿Qué es esto de la semántica? Sería algo así como lograr que una máquina pueda entender un texto. Por ejemplo, un ordenador no sabe qué significa el que algo esté en negrita. Pero sí entiende que algo que tiene énfasis es importante, y debe ser destacado de alguna manera. Puede parecer una tontería, pero a la hora de trabajar con navegadores aurales (para ciegos), de texto, o desde móviles, la cosa cobra importancia.
Énfasis
Para dar énfasis a un texto o parte de texto usaremos la etiqueta <em> y si queremos marcar un texto en negritas utilizaremos <strong> .
Por ejemplo, este código:
<p>
<em>Far</em> is not the word because I'm never far
<strong>enough</strong>.
</p>
Se vería en el navegador así:
Far is not the word because I'm never far enough.
Es importante que sepas que estas dos etiquetas van dentro de elementos block, como párrafos.
Preformato
Si has practicado algo de los capítulos anteriores, te habrás dado cuenta de que cuando el navegador interpreta el código XHTML, ignora múltiples espacios en blanco, saltos de línea, tabuladores, etc. del código. Hay ocasiones en las que necesitamos mantener este formato, por ejemplo cuando queremos mostrar código fuente. Para eso existe la etiqueta <pre> , que tampoco se utiliza mucho actualmente.
Un ¡Hola mundo! en C nos quedaría así:
<pre>#include <stdio.h>
int main() {
printf("Hello World!n");
return(0);
}</pre>
Acrónimos y abreviaturas
Para utilizar acrónimos y abreviaturas tenemos las etiquetas <acronym> y <abbr> respectivamente. En el navegador se genera el mismo efecto; se muestra su significado al pasar el mouse por encima.
Para que funcionen, estas etiquetas necesitan el atributo title donde colocamos su significado.
Ejemplo:
<p>
Mi ordenador tiene 512 <abbr title="Megabytes">MB</abbr>
de memoria <acronym title="Random Access Memory">RAM</acronym>.
</p>
Si no conoces la diferencia entre acrónimo y abreviatura, en nuestro manual de accesibilidad encontrarás una ayuda.
Serviweb
Diseño web Murcia