Document 1

2.
Esquema mnimo de un documento HTML
Un documento HTML comienza siempre con la etiqueta <HTML>5, que indica que el
documento en cuestin est construido con dicho lenguaje.
La mayora de las etiquetas son pareadas, es decir, <...> corresponde al principio de la
accin y </...> indica el fin de dicha accin.
Por tanto, una pgina web estar siempre contenida entre las etiquetas <HTML> y
</HTML>.
Por otra parte, todo documento HTML consta de dos partes: la cabecera (head) y el cuerpo
del documento (body).
1. La cabecera contiene bsicamente informacin destinada al browser (o navegador), que
queda oculta al usuario. Su etiqueta (pareada) es <HEAD>.
2. El cuerpo es el documento que ve el usuario. Su etiqueta (pareada) es <BODY>.
Ya estamos en condiciones de componer nuestra primera pgina web. Basta con escribir las
siguientes etiquetas en nuestro editor de texto y salvar el resultado con la extensin *.HTML
o*.HTM:
EJEMPLO 1
<HTML>
<HEAD>
</HEAD>
<BODY>
</BODY>
</HTML>
Ver resultado
He introducido una pequea tabulacin a la hora de escribir las etiquetas de cabecera y
cuerpo, simplemente para facilitar su compresin grfica, puesto que esta cuestin es
totalmente indiferente. El resultado no variara de haber colocado las etiquetas de cualquier
otra manera. Por ejemplo:
EJEMPLO 1: Variantes de escritura
<HTML>
<HEAD>
</HEAD>
<BODY>
</BODY>
</HTML>
<HTML><HEAD></HEAD><BODY></BODY></HTML>
<HTML>
<HEAD></HEAD>
<BODY></BODY>
</HTML>
Ver resultado
Esta primera pgina web est, lgicamente, vaca, pero es perfectamente operativa. Para
modificarla, basta con modificar sus cdigos en el editor de texto. No hace falta cerrar para
ello el navegador: una vez modificado y salvado el fichero, basta con utilizar el comando
Actualizar (o Refresh) para ver los cambios.
Al visualizar los resultados del Ejemplo 1, en la barra de ttulo de la ventana correspondiente
slo aparece el nombre del navegador (con Netscape) o la trayectoria completa del archivo
(con Explorer). Esto sucede porque nuestro documento no posee un ttulo propio. Para
crearlo, debemos introducir una nueva etiqueta (pareada) en la cabecera: <TITLE>. Nuestro
pgina web podra quedar, por tanto, as:
EJEMPLO 2
<HTML>
<HEAD>
<TITLE>Ejemplo 2</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Ver resultado
Ya sabemos crear el esqueleto de una pgina web. La siguiente tarea ser aprender a
introducir texto (entre los tags <BODY> y </BODY>) y controlar sus etiquetas elementales.
inicio
3. El texto bsico de un documento HTML
El texto bsico de un documento HTML puede escribirse sin etiquetas. Cada navegador lo
visualiza entonces con el tipo y tamao de caracteres escogidos en su configuracin por
defecto, e introduce un salto de lnea cuando los caracteres alcanzan el borde de la
ventana.
Para dominar las cuestiones de formato (de caracteres, de prrafo, etc.) es necesario utilizar
las etiquetas correspondientes.
3.1. La etiqueta bsica
La etiqueta bsica, que controla el tipo de fuente utilizado, es <FONT>.

<FONT> es una etiqueta pareada. Por tanto, afecta a los caracteres introducidos entre
<FONT> y </FONT>. Pero sin ms especificaciones, la etiqueta an no sirve para nada.
Se puede especificar el tipo de letra (es decir, la fuente de caracteres) aadindolo a la
etiqueta, de la siguiente manera (en este caso, la fuente escogida es Arial): <FONT
FACE="Arial">...</FONT>.
Se puede especificar el color de la fuente con la etiqueta <FONT COLOR="?">...</FONT>.
Para especificar los colores, conviene saber al menos lo siguiente:
3. Cada color posee su correspondiente cdigo.

4. Hay dos cdigos: hexadecimal lo ms habitual o RGB. En ambos casos se trata de
expresar las proporciones de tres colores bsicos: rojo, verde y azul.
5. Los valores hexadecimales de los tres colores se expresan de la siguiente manera:
i. Rojo: color:#ff0000;
ii. Verde: color:#00ff00;
iii. Azul: color:#0000ff;
6. Los mismos colores, expresados con los valores RGB (red, green, blue), son los siguientes:
i. Rojo: color:rgb(255,0,0);
ii. Verde: color:rgb(0,255,0);
iii. Azul: color:rgb(0,0,255);
7. Todos los colores se expresan mediante combinaciones de estos tres colores bsicos.
Existen muchos programas que proporcionan los valores de todos los colores que el usuario
puede componer. Tambin en internet existen muchas pginas con los Cdigos de colores.
8. Los colores ms bsicos pueden especificarse sin cdigo, simplemente escribiendo la
palabra correspondiente (por supuesto en ingls). Por ejemplo: <FONT
COLOR="blue">...</FONT>, <FONT COLOR="red">...</FONT>, etc.
Se puede especificar el tamao de la fuente con la etiqueta <FONT SIZE="?">...</FONT>.
El valor del tamao ("?") deseado puede suministrarse de manera absoluta (un nmero del 1
al 7) o relativa (+1, +2, -1, -2, etc., teniendo en cuenta que el valor por defecto es 3).6
Todas estas etiquetas se pueden combinar, de modo que con una sola se controla, por
ejemplo, el tipo, el tamao y el color de los caracteres: <FONT FACE="Arial"
COLOR="#0000FF" SIZE="5">...</FONT>.
Con esta etiqueta hemos visto ya la sintaxis bsica de las etiquetas HTML,
que podamos formalizar as: <ETIQUETA [ATRIBUTO="valor"]>.
Lo anterior quiere decir que una etiqueta HTML (por ejemplo, FONT) puede
llevar uno o varios atributos (FACE, COLOR, SIZE), cuyos valores se colocan
entrecomillados tras el signo igual (="arial", ="#0000FF", etc.).
Esto ser vlido para todas las etiquetas HTML que veamos a partir de este
momento.
Volvamos a nuestro documento web y practiquemos con las posibilidades de la etiqueta

<FONT>. Por ejemplo:
EJEMPLO 3
<HTML>
<HEAD>
</HEAD>
<BODY>
Esto es texto simple: cada navegador lo visualizar segn su
configuracin por defecto.
<FONT SIZE="1">Este texto es tamao 1.</FONT>
<FONT SIZE="+1">Este texto es tamao +1 (que es lo mismo que
tamao 4).</FONT>
<FONT FACE="Arial" SIZE="5" COLOR="FFFF00">Este texto posee varias
especificaciones de formato.</FONT>
</BODY>
</HTML>
Ver resultado
Nuestra pgina web, tal y como est diseada en el Ejemplo 3, no posee ninguna
especificacin de lneas. A pesar de que las etiquetas estn ordenadas en varias lneas, el
navegador coloca todos los caracteres seguidos (slo tiene en cuenta un nico espacio
entre palabras). Para corregir este problema podemos utilizar la etiqueta <BR>, que
introduce un salto de lnea. Nuestro pgina quedara entonces as:
EJEMPLO 4
<HTML>
<HEAD>
</HEAD>
<BODY>
Esto es texto simple: cada navegador lo visualizar segn su
configuracin por defecto.<BR>
<FONT SIZE="1">Este texto es tamao 1.</FONT><BR>
<FONT SIZE="+1">Este texto es tamao +1 (que es lo mismo que
tamao 4).</FONT><BR>
<FONT FACE="Arial" SIZE="5" COLOR="FFFF00">Este texto posee varias
especificaciones de formato.</FONT>
</BODY>
</HTML>
Ver resultado
Hay otra cuestin importante que debe saberse sobre la etiqueta <FONT>:
es la etiqueta ms bsica, y conviene empezar a aprender por ella, pero est
en desuso y desaparecer en las versiones futuras de HTML. En su lugar,
existen otras etiquetas ms potentes, que iremos viendo en su momento.
3.2. Etiquetas de formato de caracteres
A partir de este momento, se trata simplemente de aadir ms etiquetas a nuestra an

pequea coleccin, de modo que vayamos teniendo cada vez ms control sobre el formato
de los caracteres. La tabla siguiente muestra las ms comunes:
Cdigo
Funcin
<B>...</B>
Negrita
<I>...</I>
Cursiva
<U>...</U>
Subrayado
<SUB>...</SUB>
Subndice
<SUP>...</SUP>
Superndice
Hay que realizar algunos comentarios sobre las etiquetas precedentes:
9. Existe otra etiqueta similar a <B>, menos utilizada porque depende de las opciones de
configuracin del navegador: <STRONG>...</STRONG>.
10.Existe otra etiqueta similar a <I>, menos utilizada porque depende de las opciones de
configuracin del navegador: <EM>...</EM>.
11.Conviene tener cuidado a la hora de manejar el subrayado, puesto que ste se utiliza
convencionalmente para indicar los hiperenlaces, y podra por tanto resultar confuso para el
usuario.
Es normal utilizar varias etiquetas para un mismo elemento de texto. En ese caso, hay que
tener
cuidado
para
encajarlas
correctamente.
Por
ejemplo:
<FONT
FACE="Courier"><B><I>...</I></B></FONT>
es
correcto,
pero
<FONT FACE="Courier"><B><I>...</FONT><B></I> es incorrecto.
3.3. Otras etiquetas de caracteres
Hay muchas otras etiquetas que afectan a los caracteres. Vamos a presentar varias ms,
que deben manejarse con cierta precaucin:
12.La etiqueta <PRE>...</PRE> indica que el texto afectado est preformateado, de modo que
el navegador s tiene en cuenta todos los espacios y saltos de lnea definidos en la pantalla.
13.La etiqueta <BLINK>...</BLINK> indica texto parpadeante. Slo funciona con Netscape.
14.La etiqueta <S>...</S> genera texto tachado.
15.La etiqueta <TT>...</TT> genera texto similar al de una mquina de escribir (fuente courier
de paso fijo).
16.La etiqueta <BIG>...</BIG> aumenta el tamao de letra (equivale a <FONT SIZE="+1">).
17.La etiqueta <SMALL>...</SMALL> disminuye el tamao de letra (equivale a <FONT SIZE="1">).
EJERCICIO 1
Ya es hora de practicar con las herramientas que hemos
presentado hasta ahora. Cmo? Es muy sencillo: crea una pgina
web!
Si no se te ocurre nada, te propongo que reproduzcas esta pgina.
Para que no tengas que teclearlo todo,aqu tienes el archivo de
texto, de modo que, si quieres, no tienes ms que pegarlo en tu
editor y colocar las etiquetas correspondientes en los lugares
adecuados.
(Por cierto: las fuentes que he utilizado son Arial y Comic Sans
MS.)
inicio
4. Los prrafos de un documento HTML

En el apartado anterior hemos aprendido a controlar la apariencia de los
caracteres. (Recuerda, de todas maneras, que la etiqueta <FONT> est en
desuso.) Vamos ahora a estudiar las etiquetas fundamentales que controlan
la organizacin de los prrafos en un texto ms complejo.
Ya conocemos un tag que afecta a las lneas: <BR>. Si deseamos que una lnea no se parta
al llegar al final de la ventana del navegador, debemos colocar al comienzo la etiqueta
<NOBR>, y el navegador colocar entonces un scroll o barra de desplazamiento horizonal.
Por supuesto, si queremos que haya ms lneas, al final s deber aparecer <BR>.
4.1. Los prrafos y su alineamiento
La etiqueta <BR> inserta un salto de lnea, pero no un salto de prrafo. 7 En cambio, la

etiqueta <P>...</P> inserta una salto de lnea y una lnea en blanco, por lo que, en la
prctica, equivale a un nuevo prrafo.
Por supuesto, tanto <BR> como <P>...</P> pueden repetirse varias veces seguidas para
dejar ms distancia entre las lneas y los prrafos.
De todas maneras, slo podemos separar los prrafos con lneas completas (una, dos, etc.),
pero no podemos controlar el espacio entre los prrafos con la precisin que permite, por
ejemplo, el programa Word (con las opciones de espaciado anterior y posterior).8
Un prrafo puede alinearse introduciendo los siguientes atributos en la etiqueta habitual:
Cdigo
Funcin
<P align="left">...</P>
Prrafo alineado a la izquierda
<P align="center">...</P>
Prrafo centrado
<P align="right">...</P>
Prrafo alienado a la derecha
<P align="justify">...</P>
Prrafo justificado
Las etiquetas anteriores permiten alinear los prrafos enteros, pero siempre dejando una
lnea vaca delante de cada uno de ellas. Hay alguna manera de alinear
independientemente lneas o grupos de lneas? S, con las siguientes etiquetas:
Cdigo
Funcin
<DIV align="left">...</DIV>
Lnea(s) alineada(s) a la izquierda
<DIV align="center">...</DIV>
Lnea(s) centrada(s)
<DIV align="right">...</DIV>
Lnea(s) alineada(s) a la derecha
<DIV align="justify">...</DIV>
Lnea(s) alineada(s) justificadas
En definitiva, disponemos de varias etiquetas similares para la creacin y la alineacin de
los prrafos, que sern ms o menos apropiadas dependiendo de las ocasiones. Veamos
cmo funcionan en una pgina web:
EJEMPLO 5
<HTML>
<HEAD>
</HEAD>
<BODY>
<P align="left">Este prrafo est alineado a la izquierda. En la prctica,
equivale sencillamente a la misma etiqueta sin indicacin de
alineacin.</P>
<P align="center">Este prrafo est centrado. Hay una lnea en blanco
entre este prrafo y el anterior.</P>
<P>Ahora vamos a alinear tres lneas seguidas de tres maneras
diferentes, pero sin dejar lneas vacas entre ellas, por medio de otras
etiquetas:</P>
<DIV align="left">alineado izquierdo alineado izquierdo alineado
izquierdo alineado izquierdo</DIV>
<DIV align="center">alineado centrado alineado centrado alineado
centrado alineado centrado</DIV>
<DIV align="right">alineado derecho alineado derecho alineado derecho
alineado derecho </DIV>
</BODY>
</HTML>
Ver resultado
Otra
etiqueta
que
afecta
a
la
alineacin
de
los
prrafos
es
<BLOCKQUOTE>...<BLOCKQUOTE>, que introduce una doble sangra, derecha e
izquierda. Pueden colocarse varias etiquetas seguidas para acentuar la sangra, como se
observa en el siguiente ejemplo:
EJEMPLO 6
<HTML>
<HEAD>
</HEAD>
<BODY>
<P>Prrafo normal Prrafo normal Prrafo normal Prrafo normal
Prrafo normal Prrafo normal Prrafo normal Prrafo normal.</P>
<P><BLOCKQUOTE>Prrafo con una sangra izquierda-derecha Prrafo
con una sangra izquierda-derecha Prrafo con una sangra izquierdaderecha Prrafo con una sangra izquierdaderecha.</BLOCKQUOTE></P>
<P><BLOCKQUOTE><BLOCKQUOTE><BLOCKQUOTE>Prrafo con tres
sangras izquierda-derecha Prrafo con tres sangras izquierda-derecha
Prrafo con tres sangras izquierda-derecha Prrafo con tres sangras
izquierda-derecha.</BLOCKQUOTE></BLOCKQUOTE></BLOCKQUOTE
></P>
</BODY>
</HTML>
Ver resultado
4.2. Los ttulos
Pueden utilizarse hasta seis tipos de ttulos en un documento HTML, ordenados

jerrquicamente por medio de la etiqueta <Hn>...</Hn>, donde n = 1 a 6.
Las etiquetas de los ttulos introducen una lnea superior en blanco. Como lo habitual
despus de un ttulo es un nuevo prrafo (<P>), que tambin introduce su propia lnea, el
resultado final suele ser que una lnea de ttulo tiene una lnea en blanco antes y otra
despus.
Las etiquetas de los ttulos admiten indicaciones de alineacin, de la misma manera que la
etiqueta de prrafo.
Veamos qu aspecto tienen los ttulos de un documento HTML:
EJEMPLO 7
<HTML>
<HEAD>
</HEAD>
<BODY>
<H1>Ttulo 1</H1>
<H2>Ttulo 2</H2>
<H3>Ttulo 3</H3>
<H4>Ttulo 4</H4>
<H5>Ttulo 5</H5>
<H6>Ttulo 6</H6>
<H7>Ttulo 7 (como no existe, no supone ningn cambio)</H7>
<P>Adems, los ttulos pueden recibir indicaciones de alineacin, como
en los siguientes ejemplos</P>
<H3 align="center">Ttulo centrado</H3>
<H3 align="right">Ttulo a la derecha</H3>
</BODY>
</HTML>
Ver resultado
Este ejemplo permite plantear el siguiente ejercicio:
EJERCICIO 2
En el EJEMPLO 7 se observa que siempre queda una lnea en
blanco entre un ttulo y el prrafo siguiente (el que comienza con
"Adems". Cmo puede suprimirse dicha lnea? Elimina, por
ejemplo, la que hay entre el ttulo 7 y el prrafo siguiente.
Sabes solucionarlo? Te parece fcil? Eso quiere decir que has
entendido estupendamente todo lo expuesto hasta el momento.
No lo has conseguido? No pasa nada, pero tal vez deberas
repasar todo lo anterior con ms detalle. En cualquier caso, aqu
tienes la solucin.
4.3. Las listas
Las listas son elementos que, como los ttulos, permiten presentar niveles jerarquizados de
texto.
Los documentos HTML permiten dos tipos de listas:
18.Listas no ordenadas (bullet list): su etiqueta principal es <UL>...</UL>.
19.Listas ordenadas o numeradas (numbered list): su etiqueta principal es <OL>...</OL>.
20.Listas de definiciones (definition list): su etiqueta principal es <DL>...</DL>
21..
Una vez definido el tipo de lista deseada, los elementos que la componen se marcan de
distinta manera segn el tipo:
22.En las listas ordenadas (<OL>...</OL>) o no ordenadas (<UL>...</UL>), cada elemento de

dicha lista se marca con la etiqueta <LI>...</LI> (list item).
23.En las listas de definicin (<DL>...</DL>), se utilizan dos: cada elemento que se define se
marca con <DT>...</DT> y el texto de cada definicin se marca con <DD>...</DD>. Esta
etiqueta se puede repetir si se necesita introducir varios elementos de definicin.
Las listas se pueden encajar unas dentro de otras, adems de con el resto de las etiquetas
disponibles. Vemos algn ejemplo:
EJEMPLO 8
<HTML>
<HEAD>
</HEAD>
<BODY>
<H3>Los meses de primavera</H3>
<UL>
<LI>Abril</LI>
<LI>Mayo</LI>
<LI>Junio</LI>
</UL>
<BR>
<H3>Los meses de verano</H3>
<OL>
<LI>Julio</LI>
<LI>Agosto</LI>
<LI>Septiembre</LI>
</OL>
<BR>
<H3>Los meses del ao</H3>
<UL>
<LI>Los meses de primavera
<OL>
<LI>Abril</LI>
<LI>Mayo</LI>
<LI>Junio</LI>
</OL>
</LI>
<LI>Los meses de verano
<OL>
<LI>Julio</LI>
<LI>Agosto</LI>
<LI>Septiembre</LI>
</OL>
</LI>
</UL>
<BR>
<H3>Refranes de los meses</H3>
<DL>
<DT>Marzo</DT>
<DD>El sol de marzo da con el mazo.</DD>
<DT>Abril</DT>
<DD>El abril, aguas mil.</DD>
<DT>Mayo</DT>
<DD>Hasta el 40 de mayo no te quites el sayo.</DD>
</DL>
</BODY>
</HTML>
Ver resultado
Las listas admiten varios parmetros, que varan segn el tipo de lista:
24.Las tres listas admiten el parmetro COMPACT, que hace que el navegador presente la lista
de la manera ms compacta posible.
25.El parmetro TYPE funciona con las dos primeras listas. Sus valores respectivos son,
lgicamente, distintos:
En las no numeradas, controla el tipo de vieta: con forma de disco (<UL type="disc">, la
opcin por defecto), de crculo (<UL type="circle">) y de cuadrado (<UL type="square">).
En las numeradas, controla el tipo de numeracin: con nmeros rabes (<OL type="1">, la
opcin por defecto), romanos (<OL type="I">), romanos en minsculas (<OL type="i">),
letras maysculas (<OL type="A">) y minsculas (<OL type="a">).
26.La etiqueta <OL start="n"> indica el nmero por el que empieza la lista numerada.
27.En una lista numerada, se puede cambiar el nmero de un elemento y consiguientemente
de los posteriores con la etiqueta <LI value="n">.
4.4. Las rayas horizontales
Las rayas horizontales son otro de los procedimientos habituales para separar los
contenidos de un documento HTML. Se introducen simplemente con la etiqueta <HR>.
Hay una serie de caractersticas de las rayas que pueden controlarse, como siempre, por
medio de parmetros aadidos a la etiqueta bsica:
28.El tamao: la etiqueta <HR> introduce una raya que ocupa todo el ancho de la pantalla.
Pueden especificarse distintas anchuras aadiendo el valor deseado, expresado en pixeles
(<HR width="n">) o en trminos porcentuales (<HR width="n%">).9
29.La alineacin: cuando una raya ocupa slo una parte de la pantalla, puede especificarse su
alineacin
por
medio
de
las
etiquetas
habituales:
30.<HR align="left">
<HR align="center">
<HR align="right">
31.La altura: se expresa en pxeles por medio de la etiqueta <HR size="n">. Puede adoptar el
valor 0 (la raya ms fina).
32.El color, por medio del prametro habitual: <HR color="?">.
33.El sombreado: la raya posee habitualmente un pequeo efecto de sombreado, que puede
eliminarse con la etiqueta <HR noshade>.10
Como siempre, lo habitual suele ser la combinacin de varios parmetros en una misma
etiqueta.
Por
ejemplo:
<HR width="50%" size="0" align="center">
No queda sino practicar con las distintas posibilidades de rayas. Por ejemplo:
EJEMPLO 9
<HTML>
<HEAD>
</HEAD>
<BODY>
sta es una lnea normal:
<HR>
sta es una lnea normal, sin sombreado:
<HR noshade>
sta es una lnea que ocupa la mitad de la pantalla (si no se establece la
alineacin, se coloca centrada por defecto):
<HR width="50%">
sta es ms estrecha y mucho ms gorda:
<HR width="10%" size="20">
sta es igual pero de color rojo:
<HR width="10%" size="20" color="#FF0000">
</BODY>
</HTML>
Ver resultado
inicio
5. Los enlaces de un documento HTML
En los apartados anteriores hemos aprendido a manejar correctamente el elemento

fundamental de todo documento: el texto. Sin embargo, hay otro elemento bsico en un
documento HTML, que le proporciona su mayor potencial: los hiperenlaces, que
estudiaremos en este apartado.
Un hiperenlace es un vnculo que une un elemento del documento activo (por ejemplo, una
palabra) con otro, de manera que activamos ese segundo elemento simplemente con un
click del ratn en el primero.11
La sintaxis general de la etiqueta es muy simple: <A HREF="destino">...</A>. (Los puntos
suspensivos representan el elemento enlazado.)
Para que el destino se abra en una ventana nueva, hay que indicar el siguiente atributo: <A
HREF="destino" target="_blank">...</A>
El destino de un hiperenlace puede ser de tres tipos:

34.Enlace externo: otro documento HTML situado en un ordenador remoto.
35.Enlace local: otro documento HTML situado en el mismo ordenador.
36.Ancla: otro lugar dentro del mismo documento HTML.
Vamos a examinar separadamente cada uno de estos tipos.
5.1. Los enlaces externos
Desde cualquier punto de un documento HTML puede establecerse un enlace con cualquier
recurso de Internet.
Como es sabido, los recursos ms habituales de Internet son:
37.La WWW, es decir, las pginas web o documentos HTML. La etiqueta correspondiente es:
38.<A HREF="http://servidor/camino.../fichero">...</A>
39.El
correo
electrnico.
La
etiqueta
correspondiente
es:
40.<A HREF="mailto:usuario@servidor">...</A>
41.La
transferencia
de
ficheros (servidores
FTP).
La
etiqueta correspondiente
es:
42.<A HREF="ftp://servidor/camino.../fichero">...</A>
Veamos algunos ejemplos:

EJEMPLO 10
<HTML>
<HEAD>
</HEAD>
<BODY>
Vamos a enlazar las palabras "pincha aqu" con algunos destinos
remotos.<BR>
1.- Con la pgina web de la UD:<BR>
<A HREF="http://www.deusto.es" target="_blank">pincha
aqu</a><BR>
2.- Con el servidor FTP de la sede de Ginebra de la OMS:<BR>
<A HREF="ftp://ftp.who.ch/" target="_blank">pincha aqu</a><BR>
3.- Con mi correo electrnico:<BR>
<A HREF="mailto:airibar@fil.deusto.es">pincha aqu</a><BR>
</BODY>
</HTML>
Ver resultado
5.2. Los enlaces locales
La mayor parte de las "pginas web" son, en rigor, una coleccin de pginas, puesto que la
organizacin clsica de los sitios web consiste en un conjunto ordenado de documentos
HTML entrelazados y residentes en un mismo ordenador.
Dentro de un mismo ordenador, los documentos HTML pueden residir en un mismo

directorio o en varios:
43.Cuando todos los documentos residen en el mismo directorio no hay ningn problema, y la
etiqueta ser, simplemente: <A HREF="fichero.htm">...</A>.
44.Cuando los ficheros residen en diferentes directorios, hay que facilitar la direccin completa
del fichero, lo que puede hacerse de manera absoluta o relativa:
Direccionamiento absoluto: se indica la trayectoria completa del archivo en cuestin:
<A HREF=file:///c:/directorio/subdirectorios/fichero.htm">...</A>
Direccionamiento relativo: no se indican los nombres de los directorios. Por ejemplo:
<A HREF=../../..fichero.htm">...</A>
Aun utilizando un direccionamiento relativo, es necesario indicar los nombres de los

directorios "descendentes". Por ejemplo, en una web ordenada como en la figura siguiente,
un enlace desde un documento situado en el directorio <HTML> a un recurso situado en el
directorio <Imgenes> debera especificarse as:
<A HREF=../../../../Componentes/Imgenes/fichero.htm">...</A>
5.3. Las anclas
Especialmente cuando el documento es largo, conviene utilizar enlaces que apunten hacia
otro lugar dentro del mismo documento. Estos enlaces se denominan anclas, anclajes o
apuntadores.
El procedimiento de enlace es doble:
45.En primer lugar, hay que establecer el punto de anclaje en el lugar del documento que vaya
a ser el destino del enlace. Su etiqueta es <A NAME=nombre>...</A>.
46.Despus slo queda enlazar los caracteres deseados con el ancla anterior. Su etiqueta es
<A HREF=#nombre>...</A>.
Algunas observaciones sobre las anclas:
47.El nombre del ancla es arbitrario, pero lo lgico es que guarde alguna relacin con el
destino, especialmente cuando hay muchas en un mismo documento.
48.Aunque la etiqueta del ancla sea pareada, lo normal es que no incluya nada entre sus dos
partes (<A NAME=nombre>...</A>), puesto que lo importante es marcar el punto de inicio
del ancla, no su final.
Vamos a practicar estas etiquetas creando una nota a pie de pgina como las utilizadas en
este documento, que implican un doble anclaje:
EJEMPLO 11
<HTML>
<HEAD>
</HEAD>
<BODY>
<P>Al final de este prrafo vamos a colocar una nota a pie de pgina, de
modo que al pinchar sobre la llamada, vamos a la nota, y al pinchar
sobre el nmero de nota en el pie de pgina, volvemos a la llamada. <A
NAME="llamada_1"></A><A
HREF="#nota1"><SUP>1</SUP></A><BR><P>
Bla,<BR> Bla,<BR> Bla,<BR> Bla,<BR> Bla,<BR> Bla,<BR> Bla,<BR>
Bla,<BR> Bla,<BR> Bla, <BR> Bla,<BR> Bla,<BR> Bla,<BR> Bla,<BR>
Bla,<BR> Bla,<BR> Bla,<BR> Bla,
<HR size="0">
<A NAME="nota_1"></A><A
HREF="#llamada_1"><SUP>1</SUP></A><FONT SIZE="-1">ste es el
texto de la nota. Si pinchamos sobre el nmero, volvemos a la
llamada.</FONT>
</BODY>
</HTML>
Ver resultado

Document 1

Hochgeladen von

Dokumentinformationen

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

Document 1

Hochgeladen von

Copyright:

Verfügbare Formate

2.

Esquema mnimo de un documento HTML

3. El texto bsico de un documento HTML

3.1. La etiqueta bsica

La etiqueta bsica, que controla el tipo de fuente utilizado, es <FONT>.

3. Cada color posee su correspondiente cdigo.

Volvamos a nuestro documento web y practiquemos con las posibilidades de la etiqueta

3.2. Etiquetas de formato de caracteres

A partir de este momento, se trata simplemente de aadir ms etiquetas a nuestra an

3.3. Otras etiquetas de caracteres

4. Los prrafos de un documento HTML

4.1. Los prrafos y su alineamiento

La etiqueta <BR> inserta un salto de lnea, pero no un salto de prrafo. 7 En cambio, la

4.2. Los ttulos

Pueden utilizarse hasta seis tipos de ttulos en un documento HTML, ordenados

4.3. Las listas

22.En las listas ordenadas (<OL>...</OL>) o no ordenadas (<UL>...</UL>), cada elemento de

4.4. Las rayas horizontales

<HR width="50%" size="0" align="center">

5. Los enlaces de un documento HTML

En los apartados anteriores hemos aprendido a manejar correctamente el elemento

El destino de un hiperenlace puede ser de tres tipos:

5.1. Los enlaces externos

Veamos algunos ejemplos:

5.2. Los enlaces locales

Dentro de un mismo ordenador, los documentos HTML pueden residir en un mismo

Direccionamiento relativo: no se indican los nombres de los directorios. Por ejemplo:

Aun utilizando un direccionamiento relativo, es necesario indicar los nombres de los

5.3. Las anclas

Das könnte Ihnen auch gefallen