Tipos de letra - HTML básico - Diseño de páginas web

3. Diseño de páginas web

3.1. HTML básico

3.1.4. Tipos de letra

HTML proporciona etiquetas que nos permiten modificar el tipo de letra, los colores, etc., de nuestros textos. Además, HTML proporciona unos marcadores especiales, llamados entidades de carácter, que permiten introducir caracteres especiales, como el símbolo de copyright, acentos, y otros, para aquellos casos enlos que nuestro teclado o nuestro editor de texto no lo soportan, para cuando el juego de caracteres no lo soporta, etc.

Cabeceras

Disponemos de un elemento <Hx> que podemos utilizar para definir qué partes de nuestro texto deben ser consideradas como encabeza- dos (de sección, capítulo, etc.). La etiqueta asigna un mayor tamaño de texto a los caracteres (en función de x, como veremos). Además, <CITE>The C Programming Language</CITE>,

Ritchie, Dennis; Kernighan, Ritchie. AT&T Bell Labs.  Nuestra dirección es:

<ADDRESS>

10, Downing Street. Londres.

</ADDRESS> 

Los ficheros que acaban con la extensión <SAMP>jpg</SAMP> corresponden a imágenes. 

<CODE>printf(“Hello World\n”);</CODE>

Una vez entrado teclear <KBD>startx</KBD> para arrancar... Definiremos la variable <VAR>neigh</VAR> para guardar... Un <DFN>Distributed-CSP</DFN> es un problema, del ...

ANOTACIONES

utiliza un tipo de letra en negrilla para la cabecera e incluye un salto de párrafo después de esta cabecera.

El tamaño de la cabecera (o el nivel de ésta o el índice de importan- cia) puede variar entre 1 y 6, es decir, existen 6 posibles etiquetas: H1, H2, H3, H4, H5 y H6.

Tipo de letra

HTML proporciona una etiqueta para gestionar la tipografía. Esta etiqueta, FONT, ha sido declarada obsoleta en HTML 4.01, por lo que debemos evitar su uso y tratar de usar en su lugar hojas de estilo (CSS). FONT nos permite especificar:

• Medidas, con el atributo SIZE. • Colores, con el atributo COLOR. • Tipografías, con el atributo FACE.

Debemos utilizar esta etiqueta con mucha precaución. Al especificar tipografías debemos tener en cuenta que quizás el cliente no tenga dicha tipografía instalada, con lo que la visión que obtendrá de la página no corresponderá a la deseada.

Los atributos soportados por FONT y que nos permiten definir las ca- racterísticas del tipo de letra son:

• SIZE: tamaño de los caracteres, con valores de 1 a 7, o valores relativos (-7 a +7).

• COLOR: color de los caracteres.

• FACE: tipografía que vamos a usar. Podemos especificar más de una, separadas por comas.

El atributo SIZE define el tamaño de letra en función del tamaño defi- nido por defecto para el documento, que definiremos con BASEFONT. BASEFONT tiene un solo parámetro, SIZE, que nos permite definir el ta- maño base del documento.

Software libre

ANOTACIONES

Estilos de letra

HTML nos proporciona un conjunto de etiquetas que permiten definir diferentes estilos de letras para el texto contenido entre las marcas. Las etiquetas disponibles son:

B (negrilla). I (itálica). U (subrayado). STRIKE (tachado). SUP (superíndice). SUB (subíndice). BLINK (parpadeo). TT (teletipo). BIG (grande). SMALL (pequeño).

Además de estos tipos físicos de letra, disponemos también de algunos tipos lógicos de letra, que los navegadores pueden preferir re- presentar de otra forma:

EM (enfatizado). STRONG (destacado).

CODE (código de programa). CITE (cita).

KBD (entrada por teclado). SAMP (ejemplos).

VAR (variables de programa).

Algunos de estos estilos lógicos suponen asimismo un estilo de pá- rrafo. Éstos ya se han estudiado anteriormente.

HTML permite mezclar diferentes estilos, como negrilla y cursiva (itá- lica), etc. En ese caso se anidarían las etiquetas de HTML correspon- dientes:

ANOTACIONES

Podemos ver el aspecto de los tipos de letras y colores en la siguiente página.El código HTML que ha producido este resultado es el siguiente:

Software libre

ANOTACIONES

<TITLE>Título del documento</TITLE> </HEAD> <BODY> <h1>Cabecera H1</h1> <h2>Cabecera H2</h2> <h3>Cabecera H3</h3> <h4>Cabecera H4</h4> <h5>Cabecera H5</h5> <h6>Cabecera H6</h6> Tamaño de letra 

1 2 3 4 5 6 7 6 5 4 3 2 1

Colores

C<fontCOLOR=#000080>O LO RE S . D E . L ET RA S

 Negrilla Cursiva Subrayado  <strike>Tachado</strike> ASuperíndice  BSubíndice <blink>Parpadeo</blink> <tt>Máquina de escribir(Teletipo)</tt> <big>Texto grande</big> Texto pequeño

</BODY> </HTML>

ANOTACIONES

Entidades de carácter

HTML proporciona una serie de códigos especiales, llamados entidades de carácter, que nos permiten introducir caracteres que no podamos meter desde el teclado, como acentos, circunflejos, símbolos especiales, etc. Además, podemos introducir cualquier carácter de la tabla de caracteres de ISO-Latín1 con una entidad de carácter especial.

In document Desarrollo de apliaciones web, setiembre 2006 (página 60-65)