liceul teoretic „emil racoviȚĂ” - liceulracovita.ro · deoarece sunt pasionată de design...
TRANSCRIPT
LICEUL TEORETIC „EMIL RACOVIȚĂ”
LUCRARE DE ATESTAT
IINNTT’’DDEESSIIGGNN
Profesor îndrumător,
Muntean Rareș Absolvent,
Augustin Andrada Andreea
BAIA MARE
2014
2
3
LICEUL TEORETIC „EMIL RACOVIȚĂ”
LUCRARE DE ATESTAT
IINNTT’’DDEESSIIGGNN
Profesor îndrumător,
Muntean Rareș Absolvent,
Augustin Andrada Andreea
BAIA MARE
2014
4
CUPRINS
1. Introducere ............................................................................................................... 5
2. Prezentarea mediului de programare .................................................................... 6
3. Int'Design ................................................................................................................. 8
4. Bibliografie ............................................................................................................. 12
5. Anexă ...................................................................................................................... 13
5
INTRODUCERE
Deoarece sunt pasionată de design interior am ales pentru lucrarea de atestat un site
în care să prezint câteva dintre modalitățile de decorare a principalelor încăperi ale unei
locuințe.
Aplicația este realizată cu ajutorul limbajelor HTML și CSS în vederea publicării
acesteia pe internet pentru a împărtăși dintre frumusețile acestei arte cu ceilalți.
Pentru realizarea acestui site am utilizat o serie de aplicații utilitare cum ar fi
Notepad++ pentru editarea codului sursă și IrfanView pentru editarea simplă a imaginilor.
6
PREZENTARE MEDIULUI DE PROGRAMARE
Așa cum am amintit și în introducere am utilizat HTML care este un limbaj utilizat
pentru crearea paginilor web ce pot fi afișate într-un browser.
Html (Hyper Text Markup Language) este o formă de marcare orientată către
prezentarea documentelor text pe o singura pagină, utilizând un software de redare
specializat, numit agent utilizator HTML, cel mai bun exemplu de astfel de software fiind
browserul web. HTML furnizează mijloacele prin care conținutul unui document poate fi
adnotat cu diverse tipuri de metadate și indicații de redare. Indicațiile de redare pot varia
de la decorațiuni minore ale textului, cum ar fi specificarea faptului că un anumit cuvânt
trebuie subliniat sau că o imagine trebuie introdusă, până la scripturi sofisticate, hărți de
imagini și formulare. Metadatele pot include informații despre titlul și autorul
documentului, informații structurale despre cum este împărțit documentul în diferite
segmente, paragrafe, liste, titluri etc. și informații cruciale care permit ca documentul să
poată fi legat de alte documente pentru a forma astfel hiperlink-uri (sau web-ul).
HTML este un format text proiectat pentru a putea fi citit și editat de oameni
utilizând un editor de text simplu. Totuși scrierea și modificarea paginilor în acest fel
solicită cunoștințe solide de HTML și este consumatoare de timp. Editoarele grafice (de tip
WYSIWYG) cum ar fi Macromedia Dreamweaver, Adobe GoLive sau Microsoft
FrontPage permit ca paginile web sa fie tratate asemănător cu documetele Word, dar cu
observația că aceste programe generează un cod HTML care este de multe ori de proastă
calitate.
7
HTML se poate genera direct utilizând tehnologii de codare din partea serverului
cum ar fi PHP, JSP sau ASP. Multe aplicații ca sistemele de gestionare a conținutului,
wikiuri și forumuri web generează pagini HTML.
HTML este de asemenea utilizat în e-mail. Majoritatea aplicațiilor de e-mail
folosesc un editor HTML încorporat pentru compunerea e-mail-urilor și un motor de
prezentare a e-mail-urilor de acest tip. Folosirea e-mail-urilor HTML este un subiect
controversat și multeliste de mail le blochează intenționat.
CSS (Cascading Style Sheets) este un standard pentru formatarea elementelor unui
document HTML. Stilurile se pot atașa elementelor HTML prin intermediul unor fișiere
externe sau în cadrul documentului, prin elementul <style> și/sau atributul style. CSS se
poate utiliza și pentru formatarea elementelor XHTML, XML și SVGL.
CSS3 reprezintă un upgrade ce aduce câteva atribute noi și ajută la dezvoltarea
noilor concepte in webdesign.
Unele dintre cele mai importante segmente (module) noi adăugate acestui standard
pentru formatarea elementelor HTML aduc un plus considerabil in dezvoltarea activități
webdesign.
8
INT’DESIGN
Așa cum se poate observa în imaginea de mai sus site-ul este structurat în felul
urmator: lânga banner-ul din partea de sus urmează meniul aplicației (Home, Portofoliu,
Despre noi, Contact), secțiunea centrală conține informații corespunzătoare meniului ales.
În subsol sunt afișate informații despre copyrights.
Meniul HOME
Conține informații generale despre design interior și ambianța plăcută la care mulți
dintre voi visați. De asemenea este și pagina de start a site-ului.
9
Meniul PORTOFOLIU
În pagina PORTOFOLIU am inserat o serie de imagini reprezentative despre
design interior. Pentru o vizualizare mai bună este suficient un simplu click pe imaginea
dorită.
10
Meniul DESPRE NOI
Conține informații despre modalitățile de lucru oferite de acest site, așa cum se
observă în imaginea de mai jos.
11
Meniul CONTACT
Cum majoritatea site-urilor conțin o secțiune de contact am implementat și eu o
astfel de soluție pentru ca vizitatori site-ului, să aibă acces la numarul de telefon , adresa
de e-mail, și adresa.
12
BIBLIOGRAFIE
1. http://homedesignideaspics.com/wp-content/uploads/2013/11/Home-interior-
design-11-hd-wallpaper-wallnen-com.jpg
2. http://designdeinterior.ro/
3. http://www.w3schools.com/
4. http://www.bing.com/images/search?q=design+de+interior&qpvt=design+de+inter
ior&FORM=IGRE#view=detail&id=90CEA12420B9BE0C0983246CB9C3DDC9
64874BA9&selectedIndex=78
5. http://designdeinterior.ro/amenajari-interioare.html
6. http://ro.wikipedia.org/wiki/HyperText_Markup_Language
7. http://ro.wikipedia.org/wiki/Cascading_Style_Sheets
8. https://www.google.ro/search?q=css&espv=210&es_sm=93&source=lnms&tbm=i
sch&sa=X&ei=mqhDU5GhFIaoywO924CYCg&ved=0CAYQ_AUoAQ&biw=136
0&bih=677#facrc=_&imgdii=_&imgrc=81R-
bE85ZreltM%253A%3BkL1vhwbb3UEloM%3Bhttp%253A%252F%252Fwww.st
ojmenovic.info%252Fwp-
content%252Fuploads%252F2014%252F01%252Fcss3.jpg%3Bhttp%253A%252F
%252Fwww.stojmenovic.info%252Fcss%252Fwriting-efficient-
css%252F%3B280%3B250
9. https://www.google.ro/search?q=html&espv=210&es_sm=93&source=lnms&tbm=
isch&sa=X&ei=TahDU7XqPIrMygP50oGIDQ&ved=0CAgQ_AUoAQ&biw=136
0&bih=677#facrc=_&imgdii=_&imgrc=MgzWYusGyM_GpM%253A%3BHCAD
ZIfd9alsMM%3Bhttp%253A%252F%252Fwww.codenoesis.com%252Fwp-
content%252Fuploads%252F2013%252F10%252FHtml5-01-
1024x768.jpg%3Bhttp%253A%252F%252Fwww.codenoesis.com%252Fcategory
%252Ftechnology%252Fhtml%252F%3B1024%3B768
10. http://tutorialehtml.com/
13
ANEXĂ
SECVENȚE COD SURSĂ
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href='http://fonts.googleapis.com/css?family=Englebert|Open+Sans:400,600,700'
rel='stylesheet' type='text/css'>
<link href="default.css" rel="stylesheet" type="text/css" media="all" />
</head>
<body>
<div id="header" class="container">
<div id="logo">
<h1><a href="#">Int'Design</a></h1>
</div>
<div id="menu">
<ul>
<li><a href="index.html" accesskey="1" title="">Home</a></li>
<li><a href="portofoliu.html" accesskey="2"
title="">Portfoliu</a></li>
<li><a href="despre.html" accesskey="3" title="">Despre
noi</a></li>
<li><a href="contact.html" accesskey="5"
title="">Contact</a></li>
</ul>
14
</div>
</div>
<div id="wrapper" class="container">
<div id="page">
<div id="content"> <a href="#" class="image-style"><img
src="images/img02.jpg" width="900" height="250" alt="" /></a>
<h2>Int'Design</h2>
<p> O casa in care sa te simti cu
adevarat bine sau un birou in care sa lucrezi cu placere sunt necesitati ale timpului prezent.
<p> Avem nevoie de confort,
dar si de o ambianta relaxanta si primitoare.
<p> Designul de interior se
refera la aceasta ambianta si la toate elementele care o compun: piese de mobilier, obiecte
de uz casnic dau decorative, corpuri de iluminat.
<p> Sa nu uitam importanta
legaturilor create intre aceste elemente, felul in care ele se influenteaza reciproc si se pun
in valoare.
<p> De ce ai avea nevoie de
sfaturile noastre? Pentru ca te putem ajuta sa obtii ambianta eleganta la care doar visezi
!</p>
</div>
</div>
</div>
<div id="footer">
<p>Copyright (c) 2014 Augustin Andrada</p>
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
15
<title></title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href='http://fonts.googleapis.com/css?family=Englebert|Open+Sans:400,600,700'
rel='stylesheet' type='text/css'>
<link href="default.css" rel="stylesheet" type="text/css" media="all" />
</head>
<body>
<div id="header" class="container">
<div id="logo">
<h1><a href="#">Despre</a></h1>
</div>
<div id="menu">
<ul>
<li><a href="index.html" accesskey="1" title="">Home</a></li>
<li><a href="portofoliu.html" accesskey="2"
title="">Portfoliu</a></li>
<li><a href="despre.html" accesskey="3" title="">Despre
noi</a></li>
<li><a href="contact.html" accesskey="5"
title="">Contact</a></li>
</ul>
</div>
</div>
<div id="wrapper" class="container">
<div id="page">
<div id="content"> <a href="#" class="image-style"><img
src="images/img02.jpg" width="900" height="250" alt="" /></a>
<h2>Amenajari</h2>
<p> Biroul nostru de arhitectura
are ca obiect de activitate realizarea unor proiecte de design si amenajare interioara pentru
locuinte, sedii de firme, magazine, hoteluri.
16
<p> Proiectele sunt personalizate, in
functie de organizarea spatiala, de dorintele si preferintele clientului.
<p> proiect elaborat de amenajare interioara cuprinde:
<p> * masuratori detaliate pentru toate spatiile care urmeaza sa fie
amenajate
<p> * o remodelare si reorganizare eficienta a spatiului , cu
propuneri de ambientare (scafe, tavane false, nise din gips-carton, pereti despartitori usori,
etc.);
<p> * detalii legate de culori, materiale, finisaje;
<p> * detalii pentru sistemul de iluminat, cu pozitionarea prizelor,
spoturilor, corpurilor de iluminat;
<p> * dispunerea corecta a mobilierului in functie de necesitatile
clientului, lumina, dimensiunile si functiunile spatiilor;
<p> * detalii constructive pentru mobila realizata la comanda,
<p> * folosirea justa a tuturor elementelor pentru obtinerea unei
ambiante interioare de calitate, intr-o prezentare tridimensionala a spatiilor care urmeaza
sa fie amenajate.
<p> Fiecare amenajare interioara este, in felul ei, unica, prin felul in
care noi – arhitect si beneficiar - stim sa ne lasam amprenta asupra ei.
<p> O amenajare interioara de calitate trebuie sa prezinte un concept
unitar, care sa permita unirea spatiilor diferite intr-un ansamblu original.
<p> Exista mai multe variante de amenajare interioara pentru acelasi
spatiu, important este sa stim ce sa alegem, in functie de personaliatea fiecaruia dintre noi.
</p>
</div>
</div>
</div>
<div id="footer">
<p>Copyright (c) 2014 Augustin Andrada</p>
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
17
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href='http://fonts.googleapis.com/css?family=Englebert|Open+Sans:400,600,700'
rel='stylesheet' type='text/css'>
<link href="default.css" rel="stylesheet" type="text/css" media="all" />
<script type="text/javascript" src="/highslide/highslide.js"></script>
<link rel="stylesheet" type="text/css" href="/highslide/highslide.css" />
<script type="text/javascript">
hs.graphicsDir = '/images/';
</script>
</head>
<body>
<div id="header" class="container">
<div id="logo">
<h1><a href="#">Int'Design</a></h1>
</div>
<div id="menu">
<ul>
<li><a href="index.html" accesskey="1" title="">Home</a></li>
<li><a href="portofoliu.html" accesskey="2"
title="">Portfoliu</a></li>
<li><a href="despre.html" accesskey="3" title="">Despre
noi</a></li>
<li><a href="contact.html" accesskey="5"
title="">Contact</a></li>
</ul>
</div>
18
</div>
<div id="wrapper" class="container">
<div id="page">
<div id="content"> <a href="#" class="image-style"><img
src="images/img02.jpg" width="900" height="250" alt="" /></a>
<h2>Int'Design</h2>
<center>
<p>
<a href="images/living1mare.jpg" class="highslide"
onclick="return hs.expand(this)">
<img src="images/living1mic.jpg" alt="Highslide JS"
title="Click pentru a mari" /></a>
<a href="images/living2mare.jpg" class="highslide"
onclick="return hs.expand(this)">
<img src="images/living2mic.jpg" alt="Highslide JS"
title="Click pentru a mari" /></a>
<a href="images/living3mare.jpg" class="highslide"
onclick="return hs.expand(this)">
<img src="images/living3mic.jpg" alt="Highslide JS"
title="Click pentru a mari" /></a>
<a href="images/living4mare.jpg" class="highslide"
onclick="return hs.expand(this)">
<img src="images/living4mic.jpg" alt="Highslide JS"
title="Click pentru a mari" /></a>
</p>
<br/>
<p>
<a href="images/living5mare.jpg" class="highslide"
onclick="return hs.expand(this)">
<img src="images/living5mic.jpg" alt="Highslide JS"
title="Click pentru a mari" /></a>
<a href="images/living6mare.jpg" class="highslide"
onclick="return hs.expand(this)">
<img src="images/living6mic.jpg" alt="Highslide JS"
title="Click pentru a mari" /></a>
19
<a href="images/living7mare.jpg" class="highslide"
onclick="return hs.expand(this)">
<img src="images/living7mic.jpg" alt="Highslide JS"
title="Click pentru a mari" /></a>
<a href="images/living8mare.jpg" class="highslide"
onclick="return hs.expand(this)">
<img src="images/living8mic.jpg" alt="Highslide JS"
title="Click pentru a mari" /></a>
</p>
<br/>
<br/>
<p>
<a href="images/living9mare.jpg" class="highslide"
onclick="return hs.expand(this)">
<img src="images/living9mic.jpg" alt="Highslide JS"
title="Click pentru a mari" /></a>
<a href="images/living10mare.jpg" class="highslide"
onclick="return hs.expand(this)">
<img src="images/living10mic.jpg" alt="Highslide
JS" title="Click pentru a mari" /></a>
<a href="images/living11mare.jpg" class="highslide"
onclick="return hs.expand(this)">
<img src="images/living11mic.jpg" alt="Highslide
JS" title="Click pentru a mari" /></a>
<a href="images/living12mare.jpg" class="highslide"
onclick="return hs.expand(this)">
<img src="images/living12mic.jpg" alt="Highslide
JS" title="Click pentru a mari" /></a>
</p>
<br/>
</center>
</div>
20
</div>
</div>
<div id="footer">
<p>Copyright (c) 2014 Augustin Andrada</p>
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href='http://fonts.googleapis.com/css?family=Englebert|Open+Sans:400,600,700'
rel='stylesheet' type='text/css'>
<link href="default.css" rel="stylesheet" type="text/css" media="all" />
</head>
<body>
<div id="header" class="container">
<div id="logo">
<h1><a href="#">Contact</a></h1>
</div>
<div id="menu">
<ul>
<li><a href="index.html" accesskey="1" title="">Home</a></li>
<li><a href="portofoliu.html" accesskey="2"
title="">Portfoliu</a></li>
<li><a href="despre.html" accesskey="3" title="">Despre
noi</a></li>
21
<li><a href="contact.html" accesskey="5"
title="">Contact</a></li>
</ul>
</div>
</div>
<div id="wrapper" class="container">
<div id="page">
<div id="content"> <a href="#" class="image-style"><img
src="images/img02.jpg" width="900" height="250" alt="" /></a>
<h2>Int'Design</h2>
<p> Daca ai nevoie de un
designer specializat in amenajarea de interioare, nu ezita sa ne contactezi.
</p>
<p> Pentru sugestii, intrebari, nelamuriri sau cereri de oferte
ne puteti contacta la:<p>
<p> &nbs
p;
Telefon: 0743 839 213<p>
<p> &nbs
p; i
ng.Augustin Andrada <p>
<p> &nbs
p;
Str. Alexandru Cel Bun nr. 88b, sector 1, Bucuresti<p>
<p> &nbs
p;
Email: office @ int'design.ro
</div>
</div>
22
</div>
<div id="footer">
<p>Copyright (c) 2014 Augustin Andrada</p>
</div>
</body>
</html>