Structura unui site Web

1. Tipuri de site-uri Web

Paginile statice sunt formate din text, imagini i tag-uri
HTML pentru formatare. Aceste pagini sunt create i
ntreinute manual, astfel c dac informaiile se modific i
pagina trebuie modificat. Aceasta implic ncrcarea
paginii ntr-un editor, realizarea modificrilor, reformatarea
textului dac este necesar i apoi salvarea fiierului. Aceste
operaii necesit foarte mult timp dac numrul paginilor
care trebuie actualizate este mare.
Paginile dinamice conin foarte puin text. n schimb extrag
informaiile necesare din alte aplicaii. Paginile dinamice
pot comunica cu bazele de date, foi de calcul tabelar,
sisteme de gestiune a bazelor de date client-server i multe
alte aplicaii.

Crearea paginilor Web dinamice permite crearea de aplicaii puternice,

care pot include caracteristici precum urmtoarele:
interogarea aplicaiilor de baze de date existente pentru obinerea
datelor
crearea de interogri dinamice care faciliteaz obinerea n mod flexibil a
datelor
execuia procedurilor stocate
execuia codului condiional on-the-fly pentru a personaliza rspunsurile
n funcie de situaiile specifice
sporirea capabilitilor formularelor HTML standard prin folosirea unor
funcii de validare
popularea n mod dinamic a elementelor din formulare
personalizarea modului de afiare a informaiilor legate de dat, timp i
moned folosind funcii de formatare
uurarea crerii aplicaiilor de introducere a datelor prin wizards
generarea automat de email
site-uri comerciale i couri electronice de cumprturi

 E-learning-este un tip de nvmnt care se nfptuiete prin intermediul

Internetului. Web-siteurile care pot fi sub forma de: web-manuale(cri
electronice), web-cursuri(cursuri virtuale), web-teste s.a.
Prin comer electronic (e-comert) se subnelege orice form de nelegeri
cu privire la afaceri, la care conlucrarea ntre pri are loc n mod
electronic n loc de schimb sau contact fizic ntre pri i n urma creia
dreptul de utilizare sau proprietate a mrfii sau serviciului este transmis
de la o persoana la alta.
E-banking presupune: pli n lei i valut, pli planificate (la termen sau
recurente) sau schimb valutar, deschidere de conturi sau de carduri,
administrarea portofoliului de credite, pli cu telefoane inteligente etc.

2 . Structura unei pagini din cadrul unui site web (unui document
HTML). Elemente specifice publicrii si regsirii site-ului n cadrul
motoarelor de cutare

 Coninutul unui site este foarte important pentru motoarele de cutare,

fiind definitoriu n obinerea unei clasri ct mai bune. De aceea trebuie
s-i acordai acestuia o atenie sporit, innd cont de urmtoarele
aspecte:
Fiecare pagin web trebuie s aib titlu descriptiv i nu pagina1,
unknown, new etc.
Nu trebuie s existe pagini web care s nu aib text. Dac sunt prezentate
imagini, trebuie s existe mcar denumirile imaginilor. Ar fi binevenit o
descriere a imaginilor, cu ajutorul atributului ALT.
Nu folosii text de diferite mrimi i prea multe culori.
Coninutul trebuie s fie original! Nu copiai informaii de pe alte site-uri,
deoarece materialul duplicat va fi penalizat.
Asigurai-v c stpnii gramatica. Evitai scrierea neglijent pe site, cu
greeli de ortografie i mai ales folosirea limbajului de Messenger, gen k,
nashpa, dc etc.
Folosii pe ct posibil tastatura n limba romn i diacriticele (, , , , ).
Motoarele de cutare au nvat s afieze rezultatele cutrii chiar dac
cutarea se face dup cuvinte fr diacritice.

3. Elemente de coninut ale paginilor

web
O pagina web poate conine urmtoarele
elemente: texte, tabele, liste, imagini, hri de
imagini, sunete, animaie, cadre, filme,
butoane, casete de dialog, casete combinate,
ferestre, texte.

Meniul de navigare
Meniul este o reprezentare grafica sau de tip text a continutului si este adesea ncorporat n tema
generala a sitului. Meniul principal trebuie sa furnizeze trimiteri rapide si directe la sectiunile si
informatiile disponibile dintr-un site web. El va fi realizat ntr-o forma practica si atractiva.
Locul obisnuit pentru plasarea meniului principal este n partea stnga a ecranului dar el mai poate
fi plasat si n partea dreapta sau n partea superioara a paginii web. Sectiunile meniului vor fi
denumite astfel nct sa ofere o descriere concisa si sugestiva a paginilor web care vor fi accesate.
Cteva dintre schemele de navigare cele mai des ntlnite sunt urmatoarele :
legaturi text
harti grafice ( imagemaps )
butoane de navigare
meniuri tip lista derulanta ( generate cu Javascript , CGI )
pagini generate dinamic
harta sitului ( site map )
De multe ori, ncepatorii si chiar netsurferii mai versati se pot ncurca atunci cnd folosesc un sistem
de navigare mai complicat.
Din aceasta cauza, se recomanda de realizat si o pagina web continnd o harta a sitului. Pentru ca
harta sa poata fi gasita usor e de dorit de pus o legatura directa catre aceasta n fiecare meniu de
navigare.
Aceasta harta este utila si atunci cnd se doreste cautarea rapida a unei informatii sau a unui
subiect, fara a fi nevoie sa se navigheze prin tot situl. Ea trebuie sa fie clara si logica si n acelasi
timp sa afiseze corect structura sitului. Mai poate fi realizata sub forma de tabel, arbore de
legaturi,etc.
Cheia pentru o navigare usoara este o buna organizare. Cu ct situl va fi mai mare si mai complex, cu
att va fi mai dificila sarcina organizarii acestuia si realizarii unui sistem de navigare consistent.

 Cadre
Cadrele ne permit sa afisam doua sau mai multe pagini
web, n acelasi timp, prin mpartirea ecranului n mai multe
sectiuni independente. Initial, cadrele au fost o inovatie a
firmei Netscape dar pe parcurs ele au fost folosite din ce n
ce mai mult si tot mai multe browsere le-au acceptat.
Ele reprezinta o metoda controversata de machetare a unei
pagini web. n rndul web-designerilor exista sustinatori si
adversari ai folosirii cadrelor ca o solutie eficienta de
aranjare n pagina. De aceea, nainte de a ne hotar asupra
folosirii cadrelor n situl nostru, analizam modul cum dorim
sa organizam si sa structuram paginile web. Folosirea
cadrelor prezinta att avantaje ct si dezavantaje.

Tabele
Tabelele sunt folosite att pentru o machetare eficienta ct si pentru a face mai
atractive diversele elemente componente ale unei pagini web. Ele permit o
mpartire a paginii n sectiuni si o pozitionare precisa a textului sau imaginilor n
interiorul paginii.
Putem crea margini sau borduri de diferite dimensiuni si culori. De asemenea, se
poate ncapsula continutul n celulele tabelului pentru a permite alinierea textului si
a limita lungimea liniilor. De oarece, bordura tabelelor nu este totdeauna necesara si
uneori poate avea un aspect neplacut, se poate renunta la ea prin folosirea
atributului "BORDER = 0". Atunci cnd folosim tabele, putem sa setam o latime fixa,
n pixeli, sau o latime relativa la dimensiunea ecranului, n procente.
De exemplu, daca folosim atributul WIDTH=80%, continutul va fi afisat pe 80% din
latimea ecranului. n acest caz, afisarea continutului se adapteaza mai usor la
diferitele tipuri de monitoare sau rezolutii ale acestora. Setarea latimii n procente
se face mai ales la paginile unde exista mult text si unde nu este necesara o
formatare precisa. Pe de alta parte, tabelele definite cu o latime fixa n pixeli vor
ramne neschimbate. n acest caz, daca se foloseste o rezolutie marita va apare un
spatiu alb, n afara tabelului care va da uneori o imagine neplacuta. n schimb,
setarea unei latimi fixe va permite un control ridicat al printarii, realiznd o tiparire
fara ntreruperi laterale ale paginii web respective.

4. Ierarhia paginilor n cadrul site-ului web.

Sistemul de link-uri, pagina de start

Din punct de vedere al structurii, exist mai multe tipuri de site-uri:

site-uri liniare alctuite dintr-o singur pagin sunt utilizate cnd informaiile sunt sub form de
text, care se poate mpri firesc n seciuni mai mici; de obicei la nceputul paginii exist o list de
legturi interne (ancore), care conduc vizitatorul la seciunea care l intereseaz;
site-uri liniare formate din mai multe pagini sunt utilizate cnd informaiile prezentate urmeaz
ntr-o ordine secvenial, de la nceput la sfrit; fiecare pagin trebuie s conin legturi cu pagina
anterioar, cu pagina urmtoare, cu prima pagin a site-ului; prima pagin a site-ului este indicat s
conin cuprinsul pentru a asigura saltul direct la o anumit pagin; pentru o navigare comod, este
indicat ca paginile s nu depeasc un ecran;
site-uri cu structur ierarhic n acest caz, exist prima pagin a site-ului (home), de nivel zero; ea
conine legturi ctre alte pagini, de nivel unu; acestea la rndul lor pot avea legturi ctre alte
pagini, de nivel doi, .a.m.d.; n cazul acestui tip de site-uri, este
indicat s fim ateni la organizarea logic i fluent a site-ului; fiecare pagin trebuie s aib o
legtur ctre pagina principal;
site-uri cu structur de tip reea sunt site-uri care au o structur liber; acestea sunt alctuite din
mai multe pagini, fiecare pagin poate avea legtur cu orice alt pagin; este recomandat un astfel
de site pentru subiectele care nu au o structur logic intern; este important ca fiecare pagin s
aib, pe lng legturile ctre alte pagini, i o legtur ctre prima pagin a site-ului.

Pagina de start (home page)

n general, prima pagin a site-ului (pagina home) stabilete cui aparine site-ul,
descrie scopul site-ului, descrie structura acestuia (are i funcia de cuprins al siteului), furnizeaz informaii de contact, stabilete relaiile ntre paginile de nivel unu
i cele subordonate lor (cu ajutorul barelor de navigare, butoanelor, listelor de
legtur sau a hrilor de imagine).
Este foarte important ca n prima pagin a site-ului s accentum ceea ce site-ul
nostru ofer de valoare utilizatorilor i cum difer serviciile noastre de cele ale
principalilor concureni.
Aceast pagin va avea un aspect diferit fa de celelalte pagini din site i nu va
depi dimensiunile unui ecran.
Elementele care trebuie s atrag atenia vor fi plasate n partea de sus a acestei
pagini.
Pe pagina de nceput vom prezenta toate opiunile importante, astfel nct
vizitatorii s nu fie nevoii s ajung pe paginile de pe nivelul unu i doi pentru a
gsi toate opiunile site-ului.
Accesul la pagina de start va fi asigurat din orice pagin a site-ului, prin intermediul
logo-ului i/sau printr-un link separat numit Home.
Este o regul care spune c niciodat nu trebuie s legm un punct de el nsui,
deoarece dac utilizatorul nu este atent unde este, el va fi confuz unde a ajuns, i
n plus va fi o pierdere de timp pentru el s ajung n acelai loc. Acest lucru este
valabil i pentru pagina home.
Pe prima pagin este necesar ntotdeauna s promovm ultimele articole scrise
sau ultimele produse oferite, facilitnd accesul ctre nou pe homepage.

 Paginile din interior

n cazul n care, subiectul tratat n cadrul site-ului este vast, paginile
de nivelul unu este bine s nu fie ncrcate, detalierea urmnd a o
realiza n cadrul paginilor de nivel doi. Paginile de nivel unu este bine
s conin descrierea subiectului tratat, precum i legturile ctre
paginile de pe nivelul doi, pagini care vor detalia subiectul respectiv.
O tehnic des utilizat, este plasarea n paginile de pe nivelul trei a
unor informaii suplimentare. Prin utilizarea acestei tehnici, paginile
de pe nivelul doi nu vor fi ncrcate.

Vom realiza templat-uri care s conin acelai tip de elemente

pentru toate paginile. Ele vor fi folosite drept tipare n momentul
scrierii codului HTML pentru paginile respective.

 Navigarea n cadrul site-urilor este posibil cu ajutorul

link-urilor (legturilor). Pentru a folosi legturi n
paginile web pe care le vei face, trebuie s foloseti
perechea de tag-uri <A> si </A>. Numele acestor taguri vine de la cuvntul anchor care se traduce ancora.
Tag-ul <A> va trebui folosit mpreun cu atributul HREF.
<A HREF=numelepaginii.html>Textul legturii</A>
Dac pagina respectiv se afl n acelai folder cu
pagina pe care se afla legtura atunci nu sunt necesare
ghilimelele

 Exemplu:

<HTML>
<HEAD><TITLE>Legturi</TITLE></HEAD>
<BODY>
<CENTER><B>Legatura catre o alta pagina </B>
<BR><BR>
<A HREF=imagini.html>Imagine bebe</A>
</CENTER>
</BODY>
</HTML>

 Form general a unei legturi ctre o adres de e-mail

este urmtoarea: <A HREF="mail to:adres de email">Trimite-mi un e-mail</A>
Pentru a folosi o imagine c legtura ntre tag-urile <A> si
</A>, va trebui scris adres imaginii: <A HREF=nume
pagina.html><IMG SRC="adres imaginii"</A>
Fiecare legtura din cadrul unei pagini web are trei culori:
o culoare pentru legturile nevizitate (nu a fost efectuat
nici un click pe ele)
o culoare pentru legturile vizitate (s-a efectuat cel putin
un click pe ele)
o culoare pentru legturile active (atunci cnd cursorul
mouse-ului se afl deasupra lor)

5. Criterii considerate la realizarea documentelor

Web: viteza de ncrcare, raport text/imagine.

Viteza de incarcare a site-ului este foarte importanta din punct de vedere al

procesului de optimizare site, pentru ca in functie de durata de incarcare un
numar mai mare sau mai mic de vizitatori acceseaza paginile web. Iar numarul
vizitatorilor sporeste rezultatele campaniilor Search Engine Optimization (SEO) si
motoarele de cautare pozitioneaza site-ul, printre altele, si dupa numarul de
accesari.
Statisticile arata ca majoritatea vizitatorilor parasesc un site dupa 6-15 secunde de
la accesare, in conditiile in care acesta intazie sa se incarce. Pentru a reduce cat
mai mult posibil confruntarea cu astfel de situatii trebuie sa verifici periodic timpul
de incarcare al fiecarui element al site-ului si sa previi posibilele probleme sau
elementele care ar putea ingreuna incarcarea paginilor web. De regula fisierele
care contin clipuri sau fotografii, imagini in format mare atrag dupa sine probleme
la viteza la incarcare. Mare grija cand le utilizezi pe acestea! Este de preferat sa nu
te complici cu utilizarea lor pentru a nu diminua viteza de incarcare a paginilor
web.
De asemenea, este important sa optimizezi fiecare fisier si pagina in parte folosind
diferite unelte pe care vastul domeniu online ti le pune la dispozitie atat in
sistemul cu plata, cat si gratuit.

6.Cerine de prezentare a informaiilor prezentate n

documentele Web: de coninut, acuratee, lizibilitate,
de design, conformitate cu cerinele proiectului.
Coninutul trebuie sa fie

Pertinent

Diversificat

Actualizat

Dinamic

Interactiv.

Lizibilitate este definita ca usurinta cu care un document poate fi citit.Cea mai buna combinatie de lizibilitate
pentru site este text negru pe fundal alb, dar exista si alte combinatii de asemenea, excelente. In afara de alb, alte
culori eficiente pentru fundal, sunt culorile albastru inchis, gri si negru. Evitati culori light, pentru lizibilitate.
Anumite informatii pe care trebuie sa fie aduse in atentia vizitatorilor poate fi evidentiat prin culoare, acest lucru
imbunatateste si poate ajuta la reducerea de oboseala vizuala.Un factor important in dezvoltarea unui site web
este utilizarea de diferite culori pentru hyperlink-uri, in scopul de a ajuta utilizatorii sa distinga intre paginile pe
care le-au vizitat deja si pagini nevizualizate inca.
Putem prezenta cteva sugestii legate de grafic i imagini:

Este bine s limitm folosirea acestora n paginile site-ului.

Grafica nu trebuie s arate ca bannerele publicitare.

Imaginile pe care vom folosit n site, trebuie s exprime clar mesajul dorit i s nu le utilizm doar pentru c d
bine.

Vom folosi imaginile pentru a facilita nvarea.

Putem folosi imagini simple pentru background.

Este indicat s folosim logo-uri.

Site ul trebuie sa fie o dozare a necesarului de vizual, continut si accesibilitate!