2. Introducció a la Web
• La visita a pàgines Web és el servei més utilitzat
d’Internet. Tant és així que resulta difícil trobar una
empresa o institució que no disposa d’una o diverses
d’aquestes pàgines (museus, universitats, col·legis,
botigues...).
• La creació de pàgines Web pot parèixer una tasca
complicada, no obstant això, els editors de pàgines
Web l’han convertit en una cosa tan senzilla com la
creació de documents amb un processador de textos.
3. Introducció a la Web
• La web és un sistema HIPERTEXT
• Llenguatge HTML
(Hypertext Marked
Language) : el codi HTML ens indica bàsicament
on col·locar el text, la imatge, el vídeo i la forma
que tindran aquests al ser col·locats en la fulla.
4. Introducció a la Web
• HTML 4.0 (actual versió)
• HTML 5.0 (futura versió del llenguatge ja present)
• HTML VS. XHTML (versió més estricta
semànticament basada en XML)
• HTML es complementa amb un conjunt de normes
denominades CSS (Cascade Style Sheet) o fulls
d’estil.
• HTML s’encarrega de definir l’estructura de la fulla
mentre que CSS ens proporciona una sèrie de regles
encarregades de definir el seu format i apariència.
5. • Per a crear una pàgina Web es pot utilitzar un editor de text, en el
que s’escriguen les etiquetes del llenguatge HTML; per exemple, el
Bloc de notes en Windows i Gedit en Linux. O també un dels
molts programes disponibles en el mercat que permeten crear
pàgines Web sense tindre coneixements de l’anomenat llenguatge,
com és el cas de Microsoft FrontPage i Kompozer,
Dreamweaver, NVU, etc...
COM CREAR UN DOCUMENT HTML
6. • Els documents HTML han de tindre l'extensió
html o htm, perquè puguen ser visualitzats en
els navegadors (programes que permeten
visualitzar les pàgines web).
• Els navegadors s'encarreguen d'interpretar el
codi HTML dels documents, i de mostrar als
usuaris les pàgines web resultants del codi
interpretat.
COM CREAR UN DOCUMENT HTML
7. <html>
Etiquetes que indiquen que el text està escrit en HTML
<head>
Etiquetes i continguts de l’encapçalat
Dades que no apareixen en la nostra pàgina però que són importants per
catalogar-la: Títol, paraules clau, ...
</head>
<body>
Etiquetes i continguts del cos
Part del document que serà mostrat pel navegador
</body>
</html>
PARTS D’UN DOCUMENT HTML
9. En la Web podem trobar, o construir, dos tipus
de pàgines:
• Les que es presenten sense moviment i sense
funcionalitats més enllà dels enllaços.
• Les pàgines que tenen efectes especials i en les
que podem interactuar.
PÀGINES ESTÀTIQUES VS. DINÀMIQUES
10. Pàgines dinàmiques
• Pàgines dinàmiques de client: són les pàgines
dinàmiques que es processen en el client. En
aquestes pàgines tota la càrrega de processament
dels efectes i funcionalitats les suporta el navegador.
• Pàgines dinàmiques de servidor: són
reconegudes, interpretades i executades pel propi
servidor. Són especialment útils en treballs en els
que s’ha d’accedir a informació centralitzada,
situada en una BD en el servidor, i quan per raons
de seguretat els càlculs no es poden realitzar a
l’ordinador de l’usuari.
11. Llenguatges web de client
• Javascript: llenguatge de programació utilitzat
per a crear xicotets programes encarregats de
realitzar accions dins l’àmbit d’una pàgina web.
▫ Efectes especials: continguts dinàmics i
elements de la pàgina amb moviment, que canvien
de color...
▫ Pàgines
interactives:
amb
programes
calculadora, agendes o taules de càlcul...
EXEMPLE 2: JAVASCRIPT
12. Llenguatges web de client
• Visual Basic Script: SOLS COMPATIBLE AMB IE.
Basat en VB, tant la sintaxi com la forma de treballar.
• CSS: fulls d’estil en cascada. Tecnologia que ens permet
crear pàgines web de forma més exacta. Es declaren dins
el codi HTML.
▫ Style
▫ Color, font-weight
▫ Espaiat entre línies
▫ Espaiat entre caràcters
EXEMPLE 3: CSS
13. Llenguatges web de client
• Applets de Java: altra manera d’incloure codi
a executar en els clients que visualitzen una web.
El principal avantatge d’utilitzar applets
consisteix en que són molt menys dependents
del navegador que els scripts en Javascript. A
més a més són independents del SO utilitzat.
EXEMPLE 4: APPLETS DE JAVA (RELLOTGE 3D)
14. Llenguatges web de servidor
• CGI (Common Gateway Interface): sistema
més antic que existeix per a la programació de
pàgines dinàmiques de servidor. S’escriu
normalment en Perl (llenguatge de programació
molt pràctic per a extraure informació d’arxius
de text i generar informes a partir del contingut
dels arxius).
• ASP: tecnologia desenvolupada per Microsoft
per a la creació de pàgines dinàmiques de
servidor.
15. Llenguatges web de servidor
• PHP: llenguatge de programació del costat del
servidor gratuït i independent de plataforma.
S’executa en el servidor web abans que s’envie la
pàgina a través de Internet al client. Pot realitzar
accessos a BD, connexions de xarxa...
• JSP: acrònim de Java Server Pages, és a dir,
Pàgines de Servidor
Java. És doncs, una
tecnologia orientada a crear pàgines web amb
programació en Java.