11

Tehnologia realizrii siturilor WEB

Reeaua INTERNET = ansamblu de milioane de calculatoare interconectate n vederea schimbului de informaii;

Comunicaia prin Internet:

pot electronic (e-mail);

informare, documentare, jocuri;

comer;

grupuri de discuie.

World Wide Web (WWW, Web): Parte din Internet constnd dintrun numr imens (miliarde!) de documente memorate pe discurile unor calculatoare aflate undeva, n lume, accesibile prin intermediul reelei cu ajutorul unui program de navigaie (browser).

URL: Fiecare document are o adres unic (Uniform Resource Locator, URL) folosit pentru accesarea sa de ctre programul de navigaie. Ea se scrie fr spaii i este compus din 3 pri: protocolul folosit, numele calculatorului gazd i cale:

Pagin Web: Fiier (document) aparinnd WWW. O pagin poate conine text, imagini, sunete i secvene animate.

Server Web: calculator care memoreaz pagini Web i le pune la dispoziia utilizatorilor reelei.

Sit Web (Web site): o colecie de pagini Web ntreinut de o firm, o instituie de nvmnt, o agenie guvernamental sau chiar de un individ.

Referine (hyperlinks): iruri de caractere sau imagini a cror selectare provoac afiarea unei alte pagini, aflat pe acelai calculator sau undeva, n reea.

Programe de navigaie (Web browsere): aplicaii destinate afirii paginilor Web. Cele mai uzuale: Microsoft Internet Explorer i Netscape. Sunt gratuite.

Furnizorul de servicii Internet (Internet Service Provider, ISP): firm care ofer acces la Internet. Dup ncheierea contaractului, furnizorul de servicii comunic numrul de telefon, numele de utilizator (sub care se va realiza conectarea) i o parol. Universitile i colile ofer elevilor i studenilor servicii Internet gratuite.

Coninutul paginilor Web:

Comunicarea unor informaii cu caracter personal;

Distribuirea de informaii cu caracter tiinific;

Promovarea unor firme, asociaii, cluburi etc.

Prezentarea de produse;

Formulare pentru comanda de produse;

Liste cu locuri de munc;

Informaii necesare pentru a fi contactat;

Glume, bancuri, etc.

Paii realizrii paginilor Web

1. Stabilirea subiectului i reunirea informaiilor necesare;

2. Organizarea informaiilor. Informaiile trebuie grupate n seciuni, fiecare seciune fcnd ulterior obiectul unei pagini Web;

3. Scrierea textelor din fiiere cu ajutorul unui editor de texte i inserarea marcajelor HTML (HyperText Markup Language);

4. Adugarea imaginilor (referine la fiiere care conin imagini);

5. Legarea paginilor prin adugarea n fiecare pagin a referinelor spre alte pagini;

6. Publicarea (transferul) pe un server Web.

Pentru reuita unui sit Web:

Parcurgei alte situri. O list de pagini considerate deosebite poate fi gsit la adresa: www.zdnet.com/pcmag/special/web100 Poziionai informaiile cele mai importante n primele paragrafe;

Evitai paginile prea lungi sau prea scurte;

Furnizai-v adresa electronic pentru a putea fi contactai. Creai o pagin cu cele mai frecvente ntrebri (FAQ, Frequentely Asked Questions) pentru a evita repetarea unor ntrebri.

Evitai problemele de protecie a informaiei (copyright);

Folosii avertismente dac pagina conine informaii care ar putea fi considerate ofensatoare sau obscene;

Actualizai frecvent informaiile i evideniai data cnd au fost realizate ultimele modificri;

Scriei pagini care se ncarc rapid. Imaginile mari au timpi de ncrcare mari.

Cine citete paginile Web ?

Citii statisticile de la www.cc.gatech.edu/gvu/user_surveysVrsta medie: 38 ani; 66% brbai; venit anual mediu de 57300$; vorbitori de limb englez (92%); 46% dintre utilizatorii Web-ului cumpr anual, prin Internet produse de peste 100$; 59% dintre utilizatori au studii superioare.

Pagina principal a unui sit

n orice sit Web exist o pagin care prezint succint coninutul acestuia i conine referine spre pagini care detaliaz informaiile. De regul fiierul n care aceasta este memorat poart numele index.html.

Principiile limbajului HTML

Limbajul HTML este destinat realizrii de pagini Web. Cu ajutorul lui se descrie modul de afiare a informaiilor coninute n paginile Web. Versiunea utilizat n prezent este 4.

Comenzile de formatare se transmit folosind marcaje. Un marcaj const dintr-o succesiune de caractere cuprinse ntre semnele < >. Dac efectul unei comenzi date trebuie anulat, se utilizeaz un marcaj de anulare de forma .

Exemplu: Titlul lucrarii

Unele marcaje au atribute opionale. De exemplu marcajul , permite definirea mrimii fontului dar i a culorii caracterelor:

Pagina principala...

Marcajele informeaz programul de navigaie asupra modului de afiare a coninutului unei pagini, dar diferitele aplicaii pot da interpretri oarecum diferite marcajelor introduse. Marcajele se pot scrie cu litere mari sau mici. Este bine ca aspectul paginilor s fie testat cu diferite programe de navigaie.

Afiarea codului HTML al unei pagini din Internet se realizeaz selectnd n programul de navigaie opiunea View / Page Source:

Organizarea paginilor unui sit

Liniar:

Ierarhic

n reea

Combinat.

Aplicaii pentru crearea paginilor Web

Pentru realizarea paginilor HTML se pot folosi:

Editoare de text obinuite: Notepad, Wordpad, Word;

Editoare HTML (ex. HomeSite, ncrcat de la: www.allaire.com) sau editorul din Netscape (Communicator / Composer)

Editoare n mod grafic: Microsoft FrontPage.

Primele dou tipuri de editoare necesit cunotine de HTML i un program de navigaie pentru a vedea rezultatul.

Deoarece n cele ce urmeaz se va folosi editorul WordPad (inclus n pachetul de aplicaii Accessories din Windows) se recomand modificarea opiunii Word wrap (View / Options):

Exemplu fundamental:

Pagina conine dou seciuni:

Seciunea head (cuprins ntre i ) conine antetul paginii. Aceast seciune furnizeaz un ansamblu de informaii legate de pagina Web, de exemplu: titlul paginii, cuprins ntre marcajele i , afiat pe bara de titlu a ferestrei browserului, fiierul coninnd secvena sonor care va fi reprodus n momentul ncrcrii paginii, indicat cu ajutorul marcajului BGSOUND : , etc.

Seciunea body (cuprins ntre i ) conine corpul paginii.

Cele dou seciuni menionate sunt cuprinse ntre marcajele i care desemneaz nceputul respectiv sfritul paginii.

Vizualizarea paginii cu Netscape Communicator 4.51 se realizeaz prin selectarea ei (File / Open Page, apoi Choose File i Open).

Introducerea i formatarea textului

Marcajele uzuale pentru formatarea textului sunt:

- marcaj trecere forat la linie nou;

. . . - interzice trecerea la linie nou

ex: 096 125236

. . . - marcaj paragraf. Acest marcaj admite atributul ALIGN prin care se impune tipul de aliniere a textului dorit (LEFT stnga, CENTER centrat, RIGHT dreapta sau JUSTIFY ntre marginile din stnga i dreapta ale ferestrei programului de navigare).

Exemplu:

Contactati-ne la 096 123 234

. . .

- marcaj titlu (heading). Ca i n Word se pot folosi marcaje diferite pentru titluri de diferite nivele: H1, H2, , H6. Nivelul 4 coincide cu textul normal. Mrimea caracterelor pentru nivelele 5 i 6 este mai mic dect cea normal. i acest marcaj admite atributul ALIGN:

Cresterea cailor de rasa

- determin centrarea textului cuprins ntre marcaje. Titlul de mai sus se poate scrie i folosind aceest marcaj:

Cresterea cailor de rasa

. . . - se folosete pentru a transmite programului de navigaie c pentru zona de text cuprins ntre marcaje spaiile i caracterele CR (RETURN sau ENTER) trebuie respectate. De regul programele de navigaie ignor aceste caractere, formatarea realizndu-se numai prin informaiile furnizate de marcaje. Pentru tastarea textului nu se va folosi un font proporional ci fontul Courier New, pentru care toate caracterele au aceeai lime.

Exemplu:

Canititi:

Lapte 2 l

Fin 650 g

Ou 4 buc.

Adugarea de spaii suplimentare n alte cazuri se va realiza prin includerea pentru fiecare spaiu suplimentar a irului de caractere "". Similar se procedeaz i pentru adugarea unui caracter special (de exemplu a caracterelor romneti). Dac pagina este redactat cu Netscape Composer, inserarea unui caracter special se va face selectnd Tools / Character Tools / Insert Special Character.

n WordPad pentru caracterele romneti din tabel tastai:

- pentru

- pentru

- pentru (n loc de )

- pentru

- pentru .

Astfel textul "doi romni ntr-o gar" va fi scris: "doi romni ntr-o gar"

Exerciiu: Scriei sub form de pagin Web poezia de mai jos. Fiecare strof va fi un paragraf, astfel asigurndu-se spaierea dintre strofe.

Numai una!

George Cobuc

Pe umeri pletele-i curg ru

Mldie ca un spic de gru,

Cu orul negru prins n bru,

O pierd din ochi de drag.

i cnd o vd, nglbenesc;

i cnd n-o vd, m-mbolnvesc,

Iar cnd merg alii de-o peesc,

Vin popi de m dezleag.

Marcajul permite scrierea n pagina Web a unui comentariu. Exemplu:

Marcaje pentru modificarea aspectului textului:

. . . - pentru marcarea textului de scris bold;

. . . - pentru marcarea textului de scris nclinat (italic);

. . . pentru marcarea textului care se scrie barat;

. . . - pentru marcarea textului care se scrie subliniat;

. . . pentru marcarea textului care va fi scris ca exponent (indice superior);

. . . pentru marcarea textului care va fi scris ca indice inferior;

. . . pentru marcarea textului care va fi scris mrit;

. . . pentru marcarea textului care va fi scris micorat;

. . . determin schimbarea fontului curent. ntre ghilimele se introduce numele fontului dorit i eventual unul sau mai multe fonturi de substituie dac pe calculatorul care afieaz pagina primul font specificat nu este instalat.

Exemplu:

Scrisoare din armata va afia scrisul fie cu fontul CountryBlueprint fie cu Arial.

- se introduce naintea textului paginii i impune mrimea fontului. Numrul n este o valoare ntre 1 (scrisul cel mai mic) i 7 (cel mai mare scris). Textele marcate ca i titluri (cu ) nu sunt afectate.

. . . determin scrierea textului cuprins ntre marcaje cu caractere de mrimea n. Mrimea este o valoare ntre 1 (caracterele cele mai mici) i 7 (caracterele cele mai mari). Valoarea 3 este cea implicit.

. . .

determin afiarea textului dintre marcaje cu caractere de aceeai lime, ca i cele imprimate cu o main de scris.

Modificarea culorilor: