Universitatea TRANSILVANIA din Brasov

Facultatea de Alimentaie i Turism

Specializarea: Ecobiotehnologii agroalimentare

PAGIN WEB
SILVER MOUNTAIN

Student: Filip Daniela Carmen (Stamp)

Grupa: 16721
Specializare: EBAA
An: I

2014

Prezentare site SILVER MOUNTAIN

Aici scri si u ceva despre hotel,de ce ai ales sa faci site-ul respective blab la bla
Lucrez la silvermountain..le-am vazut siteulmi-a placut .. si am vrut sa incerc sa
creez unul asemanator.

Site-ul meu contine 6 pagini: index.html, aparthotel.html, restaurant.html, spa.html,

apartaments.html, photo.html, atraction.html, contact.html; corespunzatoare link-urilor din bara de meniu
a site-ului, pagina de index (home) fiind link-ata pe logo-ul site-ului.
Pagina de index arata in felul urmator:

Setarile generale ale pagini le-am facut din fereastra Page Properties(click dreapta pe zona libera
din pagina) astfel:

Pentru asezarea in pagina am folosit un tabel cu border=0 si cu o coloana iar in zonele unde era
necesara impartirea pe mai multe coloane am inserat in celula tabelului anterior alt table cu numarul
necesar de coloane. Astfel in partea de sus a site-ului avem trei coloane: cea din stanga pentru logo, cea
din dreapta pentru date de contact iar cea din mijloc (celula goala) pentru spatiere.
Pe urmatorul rand am inserat un tabel cu 1 rand si 7 coloane iar fiecare celula are latimea w=0%
pentru a se auto dimensiona si aseza dupa continutul ei.

Link-urile sunt puse pe text cu ajutorul sintaxei:

<a href="aparthotel.html">ApartHotel</a>

Sub bara de meniu pe urmatorul rand din tabel am inserat o imagine ce are rol de banner al siteului. Codul pt imagine este: <img src="images/banner_01.jpg" width="1000" height="320">.
Pe urmatoarele linii avem text incadrat intre etichetele <h3></h3> respectiv <h5></h5> iar in
continuare in urmatoarea celula am inserat tabel cu 1 linii si 3 coloane pentru o scurta prezentare a
facilitatiilor hotelului. Fiecare celula contine o imagine linck-ata catre pagina corespunzatoare, numele
facilitatii(<h2>) aliniate la centru cu proprietatea align=center si un scurt paragraph(<p>) descriptiv
acesteia aliniat la stanga.
Ca separare vizuala intre articole pe o linie a tabelului am inserat o poza split.png.

In continuare avem atractiile turistice din zona create dupa acelasi principiu cu prezentarea
facilitatiilor iar in partea de jos a site-ului avem zona de footer asemenea barei de meniu cu sincura
diferenta ca textul nu este linck-at iar tabelul are proprietatea CellPad = 20.

Regulile css corespunzatoare paginii de index sunt:

<style type="text/css">
<!-body,td,th {
font-family: Arial, Helvetica, sans-serif;
color: #666666;
}
body {
background-color: #FFFFFF;
}
a:link {
color: #FF9900;
text-decoration: none;
}
a:visited {
color: #FF9900;
text-decoration: none;
}
a:hover {
color: #FFCC00;
text-decoration: underline;
}
a:active {
color: #FF9900;
text-decoration: none;
}
.style2 {font-size: 12px; }
.style3 {color: #FFFFFF}
.style4 {font-size: 14px; }
.style5 {color: #333333}
.style6 {font-size: 12px; color: #FFFFFF; }
-->
</style>

Restul paginilor au fost create dupa acelasi principiu cu pagina index dar cu unele deosebiri: s-a
schimbat imaginea de banner sau uneori lipseste, asezarea in pagina, exceptand zona antet(logo, meniu,
banner) si zona footer, s-a modificat dupa continutul pagini respective.
Dintre aceste modificari putem mentiona aparitia tabelelor cu bordure si spatii intre celule pe paginile
unde era necesara o strucurare (grupare) a pozelor (restaurant, spa, apartaments, photo).

Pe pagina spa.html apar si listele nordonate:

Cu structura:
<ul>
<li>element lista</li>
<li>element lista</li>

</ul>
Tot o deosebire mai putem mentiona la pagina photo.html unde imaginile trimit catre o alta pagina ce
contine doar un link back si imaginea respectiva la dimensiuni mai mari.

Concluzii..am reusit sa creez un site asemanator cu cel ales ca

model, usor de navigat si putin mai aerat din punct de vedere al continutului dar destul de consistent din
punct de vedere al informatiei prezentate.