Facultatea de tiine Economice si

Administrarea Afacerilor
Specializarea: Informatic Economic
Anul III

Note de curs

Web Design

Lect.univ.dr. Enache-David Nicoleta

Braov
2017

1
 1. Proiectarea unui site web

Proiectarea unui site web presupune parcurgerea

urmatoarelor etape:

Etapa I: Stabilirea continutului site-ului web

In aceasta etapa se stabilesc tipul si continutul site-ului
web: site personal, site de prezentare, forum de discutii, etc.

Etapa a II-a: Identificarea audientei

In aceasta etapa se stabileste audienta, respectiv

categoriile de utilizatori de Internet carora li se adreseaza
site-ul, ceea ce presupune:
Nivelul cultural al vizitatorilor;
Motivatia accesarii site-ului (un student cauta referate,
un angajator cauta salariati, etc);
Tipul de browser folosit de vizitatori;
Viteza conexiunii folosite de vizitatori.

Etapa a III-a: Structurarea informatiei

In aceasta etapa se stabilesc urmatoarele caracteristici:

1. Modul de navigare in site daca se utilizeaza

cadre (frame-uri) sau meniuri inserate in
pagina;
2. Setul de culori pentru fundal/fonturi/link-
uri - se recomanda utilizarea culorilor placute si
aceeasi schema de culori sa fie folosita in tot
site-ul, pentru un aspect unitar;
3. Logo-ul site-ului o imagine cat mai simpla,
dar sugestiva, care reprezinta continutul site-
ului. Logo-ul este unic si apare de obicei pe
toate paginile.

2
Etapa a IV-a: Realizarea si testarea site-ului

In aceasta etapa se realizeaza site-ul folosind

tehnologii adecvate. Se recomanda utilizarea CSS-urilor
pentru stilizarea paginilor, cea mai recenta versiune fiind
CSS3 cu HTML5.
Testarea site-ului se face pe diferite rezolutii ale
monitorului si cu diferite browsere: Internet Explorer, Mozilla
Firefox, Opera, Google Chrome, etc. Aspectul paginii trebuie
sa fie acelasi in toate browserele testate. De asemenea,
TAG-urile care functioneaza doar in anumite browsere,
trebuie sa fie evitate.

Etapa a V-a: Achizitionarea unui nume de

domeniu pentru site

Numele de domeniu este unic si are forma

www.numedomeniu.ro (.com) si se achizitioneaza prin
intermediul unei firme specializate (www.rnc.ro).

Etapa a VI-a: Upload-ul site-ului pe un server de

Internet

Upload reprezinta incarcarea paginilor HTML pe un

server de hosting. Upload-ul se face utilizand un program de
tip FTP (File Transfer Protocol). Exemplu: Cute FTP.

Etapa a VII-a: Promovarea site-ului

Etapa de promovare a site-ului este deosebit de

importanta, deoarece utilizatorii de internet trebuie informati
despre existenta site-ului. Popularitatea unui site este
exprimata prin Page Rank-ul sau, care reprezinta un scor
intre 0 si 10 acordat de motorul de cautare Google site-ului
respectiv.

Promovarea site-ului presupune:

3
 Prezenta tag-urilor <META> la inceputul fiecarei
pagini. Acestea sunt elemente HTML care furnizeaza
descrierea, cuvintele-cheie (keywords), etc. Programele
robot sau spider viziteaza pagina si o indexeaza dupa
indicatiile prezente in elementele <META>;
Inscrierea site-ului in Google;
Inscrierea site-ului in cataloage de specialitate;
Inscrierea site-ului pe listele de discutii specifice
profilului site-ului;
Inserarea reclamelor/banner-elor publicitare.

2. Limbajul HTML pentru crearea paginilor web

HTML (HyperText Markup Language) este un limbaj

utilizat pentru crearea paginilor web ce pot fi afisate intr-un
browser/navigator. Exemple de browsere: Internet Explorer,
Mozilla Firefox, Opera, Google Chrome, etc.

Un site web reprezinta o colectie de pagini web gazduite

pe un server web, care sunt accesibile pe Internet. O
pagina web poate contine :
text
imagini
fisiere audio
fisiere video

Standardul oficial HTML este dat de World Wide Web

Consortium (W3C), www.w3c.org. W3C a enuntat cateva
versiuni ale limbajului HTML, incepand cu HTML 2.0, HTML
3.0, HTML 3.2, HTML 4.0, HTML 4.01, cel mai recent fiind
HTML 5.

Paginile HTML sunt formate din etichete sau TAG-uri si

au extensia .HTM sau .HTML. In general, aceste etichete

4
sunt pereche, una de deschidere <eticheta> si una de
inchidere </eticheta>.
Sintaza unui TAG este urmatoarea:

<TAG atribut1=valoare1
atribut2=valoare2>...text...</TAG>

HTML este un format text proiectat pentru a putea fi citit

si editat utilizand un editor de text simplu. Totusi, scrierea si
modificarea paginilor HTML in acest fel solicita cunostinte
solide de HTML.
Editoarele HTML Macromedia Dreamweaver sau
Microsoft Front Page permit ca paginile web sa fie tratate
asemanator cu documentele Word, dar aceste programe
genereaza automat si codul HTML al paginii.

3. Clase in CSS

<style type="text/css">
.numeclasa {
color:#990000;
padding:10px;
background-color:#CCCCCC;
}
</style>

Aplicatie:
<p class="numeclasa">
Text pentru care am aplicat clasa numeclasa
</p>

Putem aplica aceeasi clasa si unui titlu,

heading:

5
<h2 class="numeclasa">Titlu, heading cu clasa
numeclasa</h2>

Cu ajutorul regulilor CSS (Cascading Style

Sheets) putem defini stilul si aspectul mai
multor pagini web in acelasi timp

stilurile CSS au fost create pentru limbajul

HTML4.0

Sintaxa CSS:
Selector {Declaratii...}
Exemplu: h1 {color:red; font-size:9px}

Selector Declaratii

Aplicatie: paragraf de culoare verde, text centrat

p{
color: green;
text-align: center;
}

Selectorii in CSS
selectorii CSS permit selectarea si manipularea
elementelor HTML

1. Selectorul id

Selectorul ID foloseste atributul id al unul tag

HTML pentru a gasi un anumit element

Acest id trebuie sa fie unic in pagina web

Exemplu:
<!DOCTYPE html>
<html>
Selector id
<head>
<style>
#paragraf {
text-align: left;
color: red;
}
</style>
</head>
<body>

<p id="paragraf">Aici am folosit un selector id.</p>

</body>
</html>

Stiluri CSS externe

Sunt fisiere cu extensia .CSS ce contin regulile CSS.
Un fisier .CSS se apeleaza astfel:
<head>
<link rel="stylesheet" type="text/css" href="stiluri.css">
</head>

7
Diacritice in HTML