2a Sessió: Enllacem les nostres pàgines

HTML son les sigles de Hypertext Markup Language, es a dir, llenguatge amb marques hipertext. Això vol dir que disposem dun codis especials, les marques (<A> ... </A>) que ens permeten saltar duna pàgina a un altre només amb un clic de ratolí. En aquest mecanisme es basa lèxit de les pàgines Web (WWW) i dInternet.

Fem una nova pàgina Web que ens mostri un text i ens permeti saltar a la nostra primera pàgina. La desarem com a pag3.htm:

<HTML>
<HEAD>
<TITLE>Mi primera pàgina Web</TITLE>
</HEAD>
<BODY>
Des daquesta pàgina podem saltar a la nostra <A HREF=pag1.htm>primera pàgina</A>
</BODY>
</HTML>

Que al navegador veuríem així:

Fixem-nos que el text entre la parella <A ...> i </A> apareix en color blau, significant el seu caràcter denllaç (en aquest cas violat, doncs pag1.htm ha estat visualitzada a la sessió anetrior). A més a més, el cursor canvia per una mà quan ens col·loquem a sobre, i el navegador mostra a sota a on ens porta aquest enllaç. Lobjectiu daquest salt el posem a latribut HREF entre cometes: <A HREF= ... >.

Lobjectiu potser tant una adreça Internet (<A HREF=http://move.to/aptc>) com un fitxer local <A HREF=pag1.htm>). Fixem-nos en alguns detalls:

Si es tracta dun fitxer local, només cal posar el nom de larxiu: <A HREF=pag1.htm> ... </A>. Això ens permetrà copiar els fitxers sense cap modificació al servidor quan els volem penjar a Internet. Si es troba a un altre directori, afegim la trajectòria: <A HREF= invents/telefon.htm> ... </A>. Fixeu-vos que he fet servir la barra normal (/), que es fa servir a Unix, i no la barra invertida (\) de MS-DOS. Tampoc he posat laccent a telefon. Si volem no tenir problemes quan pengem les pàgines a Internet, hem de pensar que la majoria de servidors son Unix: feu servir la barra normal com a separador de carpetes, i no utilitzeu caràcters especials (accents, espais, lletres com la ñ, ...) i, a més a més, heu de citar larxiu amb la mateixa combinació de majúscules i minúscules del seu nom. Unix distingeix entre majúscules i minúscules quan busca un arxiu, Windows no. Com Windows9x acostuma a canviar les majúscules quan es crea un nom darxiu tot en majúscules, és millor fer servir sempre les minúscules.
Si volem indicar la adreça Internet duna pàgina Web afegirem el prefix http:// a lobjectiu: <A HREF=http://move.to/aptc> ... </A>. Com en aquest exemple, moltes vegades no indicarem el document, sino la seva ubicació, ja que el servidor mostrarà la pàgina principal del directori (normalment index.html).
No ens hem de limitar a fer enllaços a documents HTML. El navegador pot visualitzar molts tipus de documents (.txt, .gif, .jpg, ...). Altres tipus els pot visualitzar si tenim el plug-in corresponent (.pdf, ...). Fins i tot podem posar una carpeta on no hem posat la pàgina principal per defecte: el navegador ens mostrarà el contingut del directori (això només funciona amb enllaços locals i alguns ISP).
Podem posar un enllaç per descarregar un fitxer dun servidor FTP com a usuari anònim: <A HREF=ftp://ftp.funet.fi/pub/win/arxiu.zip> ... </A>.
També podem fer un enllaç a la nostra adreça d e-mail per a que ens enviïn un missatge: <A HREF=mailto:jorts@pie.xtec.es>.
Finalment, també podem fer referències dintre del mateix document. Per això cal definir lobjectiu amb la parella <A NAME=capitol2> ... </A> i a lhora de fer lenllaç utilitzar el prefix #: <A HREF=#capitol2> ... </A>. Aquest enllaç el podríem fer, fins i tot, des dun altre document. Amb aquest enllaç saltaríem al paràgraf que ens interessa de laltra pàgina de forma directe: <A HREF=pag1.htm#capitol2> ... </A>

Aquest sistema denllaços és el que dona tota la potència al HTML. Sistemes dajuda de Windows, caixers automàtics, fins i tot telèfons mòbils estan copiant aquesta característica. Amb aquest sistema és fàcil organitzar la informació, i mostrar-la duna forma agradable. Internet es va popularitzar amb les pàgines Web.

Podem pensar en utilitzar HTML no només per Internet, sinó fins i tot per organitzar la nostra informació a lordinador. OS2/WARP va introduir aquest concepte. MicroSoft lha utilitzat per imposar el seu navegador. Si ens trobem connectat a una xarxa podem muntar una Intranet seguint el mateix concepte. I si volem distribuir informació en un disquet o CD-ROM la podem organitzar amb índexs i catàlegs en llenguatge HTML.

IMATGES COM A ENLLAÇOS

Qualsevol cosa que es trobi entre la parella <A HREF= ... > i </A> ens permetrà saltar, fins i tot una imatge (pag4.htm):

<HTML>
<HEAD>
<TITLE>Mi primera pàgina Web</TITLE>
</HEAD>
<BODY>
Des daquesta pàgina podem saltar a la nostra <A HREF=pag1.htm>primera pàgina
<IMG SRC=iconos\i32.gif BORDER=0 ALT=Saltar></A>
</BODY>
</HTML>

Latribut BORDER=0 lhem posat per evitar un efecte desagradable a la vista. Per defecte, HTML ressalta els enllaços amb el color blau. En el cas del text, ja estem acostumat a veurel subratllat i en aquest color. En el cas de les imatges, el que faria seria un rectangle blau al voltant de la imatge que, si bé ens indica el seu caràcter denllaç, desmereix el disseny de la pàgina. Posant aquest atribut evitem el rectangle blau.

Latribut ALT= ... té una doble missió. Inicialment, es va utilitzar per quan un navegador no pogués mostrar la imatge (encara a Unix i MS-DOS ens podem trobar amb navegadors que només poden mostrar text) mostrés aquest text en lloc de la imatge. Avui en dia, amb les versions 4.x del Netscape i 4.x i 5.x de lExplorer, el navegador mostra aquest text en un fons de color groc quan col·loquem el ratolí a sobre de la imatge:

Normalment fem servir fletxes o altres icones per navegar per la Web. Hem de pensar que el navegador té una memòria recent (memòria cau) on es guarden els últims arxius utilitzats. Si fem servir un conjunt dicones limitat, només es carregaren la primera vegada. Quan tornin a sortir a una altra pàgina es llegiren de la memòria cau i, per tant, no tindrem retards per haver desperar larribada de les imatges per la línia telefònica.

2a Sessió: Enllacem les nostres pàgines

IMATGES COM A ENLLAÇOS

© Jordi Orts, febrer 2000