Din Lumea Dulciurilor

Din lumea dulciurilor
LUCRARE PENTRU ATESTAREA COMPETENELOR PROFESIONALE
Elev : .............. Profesor indrumtor : ............. Liceul : ................
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT
Cuprins
Motivul alegerii temei.....................................................................................................3 Structura aplicaiei...........................................................................................................4 Detalii tehnice..................................................................................................................6 Limbajul HTML............................................................................................................10 Prezentarea programului n care a fost realizat proiectul..............................................23 Resurse de hard i soft necesare....................................................................................31 Modaliti de utilizare....................................................................................................32 Bibliografie....................................................................................................................33
Motivul alegerii temei
Am ales aceasta tema pentru a prezenta intr-un mod cat mai detaliat, tuturor, lumea dulciurilor. Acest site ofera oricarui vizitator posibilitatea de a se informa in legatura cu lumea minunata a dulciurilor.
Structura aplicaiei
Siteul contine o forma principala (home) alcatuita din mai multe butoane (linkuri spre alte pagini ale siteului) precum: Categoria Acasa contine diverse articole despre dulciuri. Categoria Ciocolata prezinta diverse tipuri de ciocolata precum si istoria acesteia. Categoria Bomboane prezinta diverse tipuri de bomboane. Categoria Prajituri contine mai multe pagini despre urmatoarele prajituri : Alba ca Zapada , Tiramisu Tarta cu capsuni Baclava. Categoria Mai mult dezvolta ideea de a inlocui dulciurile cu fructe. Categoria Autor contine informatii despre autorul programului.
Detalii tehnice
Codul sursa al primei pagini, index.html : <html> <head> <title>Acasa</title> <link type="text/css" href="documents/textstyles_nf.css" rel="stylesheet"> </head> <body> <div id="topbar"> <div id="banner"><a href="documents/acasa.html"><img src="images/Romana_ezg_logo.jpg" alt="Din Lumea Dulciurilor"></a></div> <div id="mmenu"> <a id="ma" class="mmenu" href="index.html" target="_self">Acasa</a> <a class="mmenu" href="documents/despreciocolata.html" target="_self">Ciocolata</a> <a class="mmenu" href="documents/retetebomboane.html" target="_self">Bomboane</a> <a class="mmenu" href="documents/reteteprajituri.html" target="_self">Prajituri</a> <a class="mmenu" href="documents/maimult.html" target="_self">Mai mult</a> <a class="mmenu" href="documents/autor.html" target="_self">Autor</a> <div id="name"><div style="text-align:center"></div></div> </div> </div> <div id="container"> <div id="sidebar" > <div id="sub_imag" ><img src="images/l_sub_image.gif" alt=""></div> <div id="smenu" ><br/><a href="index.html" style="textdecoration:none">   Acasa</a> <a href="documents/despreciocolata.html" style="textdecoration:none">   Ciocolata</a> <a href="documents/retetebomboane.html" style="textdecoration:none">   Bomboane</a> <a href="documents/reteteprajuturi.html" style="textdecoration:none">   Prajuturi</a> <a href="documents/maimult.html" style="textdecoration:none">   Mai mult</a></div> <div id="sub_bottom" ><img src="images/sub_bottom.gif" alt=""></div> <div id="earea" ></div> </div>
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT <div id="xm1" ><div align="left" id="xm2" ><div class="pageheader"></div><div align="center"><table width="95%" cellspacing="0" cellpadding="0"> <tr><td><img src="images/t1tl.gif" class="cim" alt=""></td><td class="topic_t" ><b style="font-size:14px">Bine ati venit!</b></td><td><img src="images/t1tr.gif" class="cim" alt=""></td></tr> <tr><td class="topic_l"><img src="images/t1l.gif" class="clr" alt=""></td> <td class="topic_bg" valign="top"> <table cellpadding="1" cellspacing="2" style="width:100%;"> <tr valign="top"><td style="width:100%;"><p>    Dulciurile sunt o tentatie careia ne este foarte greu sa-i rezistam. Reclamele atragatoare ne influenteaza zi de zi psihicul si ne atrag fara sa ne dam seama spre aceste produse "delicioase" dar extrem de nocive.</p> <p>Cand vorbim despre dulciuri trebuie sa ne punem urmatoarea intrebare: ce contin dulciurile si cat sunt de necesare pentru o nutritie echilibrata ? Componentele de baza sunt: zaharul, margarina, faina alba, aditivii (E-uri). Toate aceste produse sunt daunatoare sanatatii. </p> <p>Unul dintre ingredientele principale este zaharul rafinat. Zaharul creeaza dependenta dar daca ai vointa vei reusi sa renunti la dulciuri care nu numai ca ingrasa, dar genereaza si o multime de probleme de sanatate. </p></td></tr></table></td> <td class="topic_r"><img src="images/t1r.gif" class="clr" alt=""></td></tr> <tr><td><img src="images/t1bl.gif" class="cim" alt=""></td><td class="topic_b"></td> <td><img src="images/t1br.gif" class="cim" alt=""></td></tr> </table> </div> <br> <div align="center"><table cellpadding="0" cellspacing="0" style="width:95%;"> <tr valign="top"><td style="width:50%;height:411px;"><table width="97%" cellspacing="0" cellpadding="0"> <tr><td><img src="images/t1tl.gif" class="cim" alt=""></td><td class="topic_t" ><b style="font-size:14px">Articole</b></td><td><img src="images/t1tr.gif" class="cim" alt=""></td></tr> <tr><td class="topic_l"><img src="images/t1l.gif" class="clr" alt=""></td> <td class="topic_bg" valign="top"> <table cellpadding="1" cellspacing="2" style="width:100%;"> <tr valign="top"><td style="width:100%;height:400px;"><p>    Cele mai indicate deserturi pentru copii sunt fructele, ciocolata si prajiturile de casa. </p> <p>De Mos Nicolae, primele cadouri si cele mai asteptate sunt dulciurile. Nu rebuie insa depasita masura.</p> <p>    Creierul are nevoie de zahar pentru stimularea memoriei, a capacitatii de concentrare si de invatare. Cu ajutorul zaharului este stimulata si productia de serotonina care creeaza buna-dispozitie. Aportul de zahar trebuie insa sa fie moderat pentru a produce aceste beneficii, arata Adevarul.</p>
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT <p>    Potrivit OMS (Organizatia Mondiala a Sanatatii), zaharul din alimentative nu trebuie sa depaseasca 50-60 de grame pe zi. Nu numai dulciurile contin zahar: el se gaseste si in paine, in sosurile din comert, in cereal si bauturi racoritoare.</p> <p>    Este de preferat zaharul brun celui alb, sau mierea. Zaharul brun este identic cu cel alb in ceea ce priveste aportul de calorii, insa contine si urme de vitamine si minerale. Zaharul poate fi inlocuit si cu fructoza (in stare naturala, ce se gaseste in fructe).</p> <p>    Cele mai benefice dulciuri pentru cei mici, care au nevoie de un aport mai mare de glucide decat adultii (se joaca, aleagra, consuma mai multa energie) sunt fructele, tartele si prajiturile facute in casa. De Mos Nicolae,in loc de dulciuri din comert, sunt de preferat o placinta de mere cu scortisoara si suc natural de portocale. </p></td></tr></table></td> <td class="topic_r"><img src="images/t1r.gif" class="clr" alt=""></td></tr> <tr><td><img src="images/t1bl.gif" class="cim" alt=""></td><td class="topic_b"></td> <td><img src="images/t1br.gif" class="cim" alt=""></td></tr> </table> </td><td style="width:50%;height:411px;"><div align="right"><table width="97%" cellspacing="0" cellpadding="0"> <tr><td><img src="images/t1tl.gif" class="cim" alt=""></td><td class="topic_t" ><b style="font-size:14px">Articole</b></td><td><img src="images/t1tr.gif" class="cim" alt=""></td></tr> <tr><td class="topic_l"><img src="images/t1l.gif" class="clr" alt=""></td> <td class="topic_bg" valign="top"> <table cellpadding="1" cellspacing="2" style="width:100%;"> <tr valign="top"><td style="width:100%;height:400px;"><p><table style="width:100%"><tr><td style="padding-left:50px"><img style="margin:4px;vertical-align:bottom;width:200px;height:200px;" alt="" title="building" src="documents/969.jpg"></td></tr></table> </p> <p>    Medicii spun ca excluderea completa a zaharurilor din alimentatie nu este cea mai sanatoasa si mai comoda metoda de a te mentine suplu, insa trebuie sa tinem cont si de faptul ca aportul caloric adus de dulciuri se depune rapid, sub forma de rezerve si, astfel, controlul greutatii devine dificil. </p> <br> <p>    "Practic, noi recomandam ca zaharidele sa nu depaseasca zece la suta din aportul caloric zilnic, insa in aceasta ratie nu intra glucidele provenite din lapte sau fructe, ci doar glucidele adaugate din zahar, miere sau fructoza", explica lector univ. dr. Lygia Alexandrescu, medic nutritionist la un cabinet particular din Bucuresti. Potrivit specialistului, fructele proaspete si cele uscate reprezinta cea mai sanatoasa sursa de zahar, insa exista, totusi, si o minima permisivitate la un alt fel de dulce care poate sa fie consumat fara vinovatie. Un astfel de exemplu este crema de banane cu fructe. Pentru prepararea ei, medicul spune ca avem nevoie de un albus de ou, o banana mare, 300 de grame de fructe proaspete (piersici, pere, ananas, kiwi), o lingura de zeama de lamie si o lingurita de zahar pudra. Albusul se bate spuma, se adauga banana maruntita, zeama de lamie si zaharul pudra. Aceasta compozitie se mixeaza bine pna cnd devine ca o crema. In cupe 8
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT individuale se asaza fructele si deasupra se toarna crema. Produsul se serveste rece. Nutritionistul ne face si analiza nutritionala. "O portie are 82 de kcal, dar nu are grasime si nici colesterol. Continutul de carbohidrati este de 20 de grame, iar cel de sodiu, de 13 mg", precizeaza lector. dr. Lygia Alexandrescu.</p> <br> <p>    Nutritionistul spune ca, in ce priveste cantitatea de zahar consumat, aceasta variaza de la o persoana la alta, in functie de necesarul caloric al fiecarui individ. De aceea, este recomandat ca acest aport caloric sa fie adus de alimente bogate in nutrienti, substante fitochimice, fibre si vitamine esentiale unei bune stari de sanatate. Adultii sedentari si cei care incearca sa piarda excesul ponderal trebuie sa-si limiteze cantitatea de zahar adaugat la 40-45 de grame pe zi, ceea ce ar corespunde unui aport energetic de 160-180 kcal zilnic, completeaza medicul Alexandrescu.</p></td></tr></table></td> <td class="topic_r"><img src="../images/t1r.gif" class="clr" alt=""></td></tr> <tr><td><img src="images/t1bl.gif" class="cim" alt=""></td><td class="topic_b"></td> <td><img src="images/t1br.gif" class="cim" alt=""></td></tr> </table> </div> </td></tr></table> </div> </div></div> <div id="footer"><br></div> </div> </body></html>
Codul de mai sus incarca in pagina index.html alte pagini din folderul documents/ al atestatului. Fiecare link face trimitere la una din paginile continute de acel director.
Limbajul HTML
HTML (Hypertext Markup Language) este un limbaj creat n scopul de a descrie, n mod text, formatul paginilor Web; fiierele create n acest limbaj vor fi interpretate de navigatoare, care vor afia paginile n form dorit (cu texte formatate, liste, tabele, formule, imagini, hiperlegturi, obiecte multimedia etc.). HTML a aprut ca o aplicaie ISO standard (aparine standardului SGML - Standard Generalized Markup Language, specializat pentru hipertext i adaptat la Web). Aa cum se poate deduce din numele limbajului, HTML descrie caracteristicile de format ale elementelor incluse prin procedee de marcare. Acestea pot fi asemnate intuitiv cu marcajele folosite n tipografie pentru a indica scrierea unui text cu un anumit tip de caractere. Fiecare element va fi introdus ntre dou marcaje ("tags", n limba englez) - de nceput i sfrit - (uzual) de forma <marcaj>... </marcaj>. Caracterele speciale de delimitare a marcajelor "<", ">" permit deosebirea acestora de textul propriu-zis. De exemplu, pentru textele aldine (ngroate), marcajul de nceput este <B> iar de sfrit - </B>. n informatic, limbajele de marcare sunt foarte convenabile fiindc comenzile lor pot fi interpretate simplu. LaTeX-ul, de exemplu, este tot un limbaj de marcare; prin interpretarea fiierelor. Tex descrise n acest limbaj se va genera formatul dorit al documentelor pe diverse tipuri de sisteme de calcul (n cazul, LaTeX-ului, se obine uzual format PostScript sau PDF). n schimb, procesoarele de documente uzuale nu au un limbaj de marcare standardizat, care s ofere compatibilitate ntre diverse tipuri de calculatoare i sisteme de operare. Astfel, se poate spune c avantajele aplicrii limbajelor de marcare constau n portabilitate i flexibilitate: fiierele create cu ajutorul lor pot fi transferate pe orice tip de sistem, unde vor fi interpretate cu ajutorul unor programe specifice. De fapt, procesoarele de texte uzuale folosesc adesea procedee de marcare pentru formatri (de exemplu, formatrile de tip caracter din Word); n acest caz ns, caracterele de control introduse sunt ascunse iar rezultatul editrii este direct vizibil ("What You See Is What You Get"). n schimb, n limbajele de marcare - inclusiv
10
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT HTML - marcajele sunt introduse n text, astfel nct acestea sunt exclusiv succesiuni de caractere (litere, cifre, caractere speciale) - fiiere de tip text. Referitor la legtura dintre procesoarele de documente uzuale i limbajul HTML, mai trebuie menionat faptul c ultimele versiuni ale editoarelor de documente ofer faciliti de salvare n format HTML - de exemplu, Word, ncepnd cu versiunea Microsoft Office '97. Mai mult, toate produsele incluse n aceast gam dedicat biroticii (MS Office) ofer compatibilitate cu formatul HTML. Procesele de standardizare i de includere a comenzilor de marcare n fiierele HTML permit navigatoarelor s citeasc i s formateze paginile Web, lucru foarte important n condiiile n care ele conin nu numai texte alb-negru, ci i culori, imagini, hiperlegturi, diverse obiecte. Practic, marcajele HTML asigur controlul asupra modului de afiare a obiectelor corespunztoare n cadrul programelor de vizualizare a documentelor HTML - navigatoarele. Limbajul HTML a evoluat n versiuni succesive, odat cu evoluia protocolului HTTP i a programelor de navigare. Astfel, HTML 1.0 era compatibil cu Mosaic, primul program de navigare, dar dup apariia unor navigatoare noi, a fost necesar introducerea unui standard oficial Internet pentru construirea pgnilor (HTML 2.0) i extinderea sa cu noi faciliti: formule matematice, tabele, moduri avansate de descriere a organizrii pgnilor (ncepnd cu HTML 3.0). Standardizarea oficial a limbajului HTML a fost realizat de consoriul WWW i dezvoltat de diveri productori de soft (unii dintre acetia urmresc chiar promovarea navigatoarelor proprii prin introducerea unor particulariti n formatele oficiale). Paginile HTML se pot crea cu orice editor de texte de ctre utilizatorii care cunosc limbajul HTML sau, mai simplu, se pot utiliza editoare speciale, n care obiectele se introduc interactiv iar codul HTML se genereaz automat. Avnd n vedere c i n acest caz este util cunoaterea marcajelor generate pentru corectarea eventualelor erori (mai ales n cazul link-urilor), vom prezenta n continuare entitile care se pot introduce n paginile HTML i marcajele caracteristice acestora.
Elementele limbajului HTML
11
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT Toate obiectele HTML sunt introduse ntre marcaje care le definesc; majoritatea acestora sunt de forma <tip_obiect> (la nceput) i </tip_obiect> (la sfrit). Tipul standard al obiectului poate fi specificat cu majuscule sau minuscule; totui, se recomand utilizarea majusculelor fiindc astfel marcajele ies n evident. Majoritatea navigatoarelor permit vizualizarea paginii curente n formatul surs HTML (forma pe care o interpreteaz pentru afiarea paginii). La interpretare, programele de navigare ignor spaiile i <Enter>-urile, aplicnd formatarea specificat. Exist ns i marcaje cu parametri; acestea au forma <tip_obiect param1=valoare1 param2=valoare2... >. De exemplu, obiectele de tip imagine sunt introduse cu delimitatorul <IMG>, care are diveri parametri. Pentru definirea hiperlegturilor se folosete marcajul <A>, care are de asemenea parametri proprii. Codurile de marcare HTML pot fi clasificate n urmtoarele categorii: 1. marcaje de baz - cele care delimiteaz pagina/documentul HTML, titlul acesteia i corpul paginii; 2. marcaje pentru structurarea documentului - care permit introducerea de subtitluri, paragrafe, linii de delimitare; 3. marcaje pentru formatarea textului i crearea listelor; 4. marcaje pentru crearea hiperlegturilor (hyperlinks); 5. marcaje pentru introducerea de obiecte - tabele, formule, imagini sau obiecte multimedia preluate din fiiere, formulare. Vom descrie n paragrafele urmtoare, elementele caracteristice fiecreia din aceste categorii. Pentru structurarea i organizarea informaiilor din paginile web se pot utiliza frame-uri (marcajul <FRAME>), prin care la un moment dat se afieaz mai multe ferestre coninnd fiecare cte o pagin. Introducerea i gestiunea frame-urilor se realizeaz foarte convenabil folosind editoarele HTML. Mai menionm faptul c n ultimele versiuni ale limbajului HTML i ale browserelor s-a introdus posibilitatea integrrii, respectiv lansrii n execuie prin navigator, a unor aplicaii. Acestea sunt scrise n limbajul Java, un limbaj cu caracteristici distribuite i obiectuale, adaptat programrii n Web; ele se numesc "applet"-uri i se introduc n sursele HTML cu marcajul <APP> sau <APPLET>. Ultimele versiuni de editoare HTML permit introducerea interactiv a applet-urilor Java. 12
Marcaje de baz
O pagin Web este delimitat de marcajele <HTML> i </HTML> care indic nceputul i finalul documentului i conine: zon de antet cuprins ntre marcajele: <HEAD>... </HEAD> i un corp delimitat de marcajele: <BODY>... </BODY>.
Zona de antet este utilizat de ctre programele de cutare pe site-urile web i permite specificarea titlului paginii care va fi afiat de navigator (nu apare propriu-zis n coninutul paginii). titlul, introdus n antet, este cuprins ntre marcajele <TITLE>... </TITLE>. Astfel, o form extrem de simpl a unui document HTML ar putea fi cea din urmtorul exemplu: <HTML> <HEAD> </HEAD> <BODY>Document </HTML> HTML foarte simplu</BODY> <TITLE>Titlul documentului </TITLE>
Marcaje pentru structurarea documentului

Programele de navigare asigur afiarea difereniat a unot titluri i subtitluri pentru seciunile paginii, dup criteriile implementate n acest scop la conceperea s (litere mai mari sau mai mici, diverse culori, litere aldine sau simple, unul sau mai multe rnduri libere dup titlu etc.). Titlurile de capitole sau subtitlurile sunt definite de marcajele <Hn>, unde n este o cifr ntre 1 i 6 care specific nivelul titlului (1 este titlul principal iar 6 corespunde celui mai sczut nivel). Astfel: <H1> <H6> </H6> indic un subtitlu de nivelul 6. 13 </H1> indic un subtitlu de nivelul 1
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT Pentru separarea zonelor paginii se pot folosi treceri la: linie nou - cu marcajul <BR>, eventual cu desenarea unei linii orizontale marcajul <HR>; paragraf nou - cu marcajul <P> (se insereaz o linie nou i eventual se face o indentare). Marcajul </P> desemneaz sfritul de paragraf dar este mai rar folosit (se poate omite).
Marcaje pentru formatarea textului si crearea listelor

Formatrile uzuale de texte permit scrierea cu caractere: aldine - n acest scop pentru acel text se aplic marcajele <B>... </B>; cursive (italice) - pentru acel text se aplic marcajele <I>... </I>; subliniate - textul se introduce ntre marcajele <U>...</U>.
Unele programe mai vechi de navigare nu permiteau reprezentarea acestor formate; n acest caz, se aplicau alte moduri de evideniere a textelor respective (culori, video invers). Alte tipuri de formatri de caractere care se pot defini se refer la: dimensiunea fonturilor i culori - se va utiliza marcajul cu parametri: <FONT SIZE=x COLOR=y>... </FONT>, care indic utilizarea unui font de dimensiune x i culoare y. x poate fi un numr ntre 1 i 12, indicnd mrimea exact, sau un numr cu semn, indicnd mrimea relativ la dimensiunea curent. y poate fi numele unei culori standard, specificat n limba englez i ntre ghilimele, sau, eventual, descompunerea unei culori n componentele RGB, sub form hexazecimal (cte dou cifre hexa pentru fiecare component). Suplimentar, se pot crea pagini de stiluri, n care s se defineasc stiluri logice, modificabile ulterior; n acest scop, se folosesc marcajele <DN> - definiie, <EM> punere n evident, <STRONG> - accentuare puternic. Pentru tastaturile care suport numai codurile ASCII, caracterele speciale se pot crea folosind formatul &nume_caracter - de exemplu, è pentru e. Avnd n vedere semnificaia special a caracterelor <, > i &, apariia lor n documente trebuie specificat sub forma caracterelor speciale: <, >, respectiv &.
14
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT Prezentm n continuare un exemplu de document HTML, precum i modul n care acesta este afiat de Netscape Navigator. <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> <html> <head> <title>Pagina simpla</title> </head> <body> <p>Acesta este un exemplu simplu de o pagin HTML. Ea arat cum pot aprea caractere <strong>bold</strong>, <em>italic</em>, <font size="5">mai mari</font>, <font size="1">mai mici</font>, respectiv insera o mic imagine <img
src="Handshake8114.gif" width="20" height="14">. </p> </body> </html> n figur, se observ c textul propriu-zis al documentului poate fi delimitat fat de codurile de marcare, iar formatarea textului din documentul HTML nu corespunde cu cea afiat de programul de vizualizare: textul este extins pentru a ocupa ntregul ecran i este afiat cu un corp de liter diferit fat de sursa HTML; terminatorii de linie nu sunt respectai; spaiile albe suplimentare din documentul surs sunt ignorate.
Introducerea obiectelor de tip imagine (marcajul <IMG>) este detaliat mai jos.
15
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT Limbajul HTML permite definirea mai multor tipuri de liste i imbricarea lor (includerea unor liste n altele), caz n care trebuie verificat cu atenie corespondenta dintre marcajele de nceput i sfrit pentru fiecare list. Formatarea listelor la afiarea paginii (introducerea bulinelor, numerotrii etc.) se face de ctre programul de navigare. Elementele listelor se introduc ntre marcajele <LI>... </LI> ("list item"). Modul de apariie al elementelor depinde de tipul de list n care sunt incluse (cu buline, numerotate etc.), determinat de marcajul specific. Astfel, listele pot fi:
neordonate (cu buline) - delimitate de marcajele <UL>... </UL> ("unordered list"); elementele lor se afieaz cu buline;
ordonate (numerotate) - delimitate de marcajele <OL>... </OL> ("ordered list"); elementele lor se vor numerota;
de tip meniu - delimitate de marcajele <MENU>... </MENU>; elementele acestor liste apar ntr-o reprezentare compact pe ecran (multicoloan);
glosare (liste de definiii) delimitate de marcajele <DL>... </DL> ("definition list"); elementele acestora au cte dou componente, introduse respectiv cu marcajele <DT> (pentru nume) i <DD> (pentru semnificaia asociat);
tabele scurte - create cu marcajul <DIR>.
Listele utilizate cel mai frecvent sunt cele ordonate i neordonate. Prezentm n continuare un exemplu simplu de pagin HTML care conine aceste tipuri de liste. <html> <head> <title>Pagina cu liste</title> </head> <body> <p>Aceasta pagin exemplifica crearea listelor</p> <p>Cele mai uzual folosite tipuri de liste sunt: <ul> <li>neordonate</li> <li>ordonate</li> 16
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT </ul> <p>O list ordonat este o list numerotat: <ol> <li>primul element;</li> <li>al doilea element...</li> </ol> </body>
</html>
Exemple de liste ntr-o pagin HTML
Marcaje pentru crearea hiperlegturilor

Hiperlegturile ("hyperlinks") se introduc cu marcajele <A>... </A> ("anchor") aplicate asupra unui text sau a unei imagini. Ele se pot crea ctre:
adrese URL - astfel se asigur accesul n cadrul procesului de navigare (prin protocoale specifice), nu numai la paginile web, ci i la diverse servicii Internet;
fiiere/resurse locale adic aflate pe acelai calculator cu pagina creat - linkuri locale; acestea ar putea fi accesate i printr-un URL cu protocolul "file" dar
17
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT pentru mai mult simplitate, este suficient specificarea numelui i cii fiierului local;
o zon din documentul HTML curent - link-uri interne.
n fiecare din aceste cazuri, un click pe textul su imaginea respectiv va determina activarea legturii i afiarea prin intermediul navigatorului a resursei asociate linkului. Resursa asociat unei legturi este descris prin parametrii marcajului <A>:
HREF - permite asocierea unei adresei URL, crearea unei legturi locale prin specificarea numelui i cii fiierului corespunztor sau a unei legturi interne documentului; este cel mai important parametru pentru construirea de hiperlegturi;
NAME - numele hiperlegturii sau al zonei dintr-o pagin ctre care se face referirea, n cazul unui link intern;
METHODS - metodele de acces (acest parametru se utilizeaz doar n prelucrri HREF="resursa"> text </A>. speciale). Astfel, un link local sau ctre o adres URL se poate defini pe un text cu: <A
O legtur intern ctre o zon a documentului curent se indic folosind marcajul <A NAME="nume-zon">.
Marcaje pentru introducerea de obiecte

Prima versiune de HTML (1.0) nu permitea descrierea tabelelor sau a informaiilor formatate. Asemenea obiecte trebuiau create formatat i introduse ca obiect deja formatat, cu marcajele <PRE>, </PRE>. Aceste marcaje indicau navigatorului c textul inclus trebuia afiat caracter cu caracter, fr vreo intervenie de formatare. n versiunile ulterioare ale limbajului HTML, s-au introdus ns faciliti elegante de formatare, de includere a tabelelor i a altor obiecte. n HTML 3.0 s-au introdus obiectele de tip tabel, formate din linii orizontale i coloane verticale la a cror intersecie se formeaz celulele. Acestea pot conine intrri diverse: texte, figuri sau chiar alte tabele. Se pot realiza reuniri de celule (de exemplu,
18
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT pentru titluri mai lungi). Atributele de formatare a tabelului (aliniere, stilul chenarului i marginilor etc.) se definesc n proiectarea paginii dar modul lor de afiare va depinde i de programul de navigare. Tabelele se introduc ntre marcajele <TABLE>... </TABLE>, crora li se pot ataa (opional) parametrii BORDER i RULES. Un titlu pentru tabel se poate introduce cu marcajul <CAPTION>. Fiecare coloan se definete cu marcajul <COL>, avnd ca parametru ALIGN - modul de aliniere a informaiilor din acea coloan (LEFT, CENTER, RIGHT). Antetul tabelului se poate indica ntre marcajele <TH>...</TH> ("Table Header"), pentru trecerea la o linie nou se utilizeaz marcajul <TR> ("Table Row") iar celulele individuale se marcheaz cu <TD> ("Table Dat"), eventual cu parametru de aliniere. Se mai pot specifica alinieri orizontale sau verticale ale celulelor, grupri de celule etc. Aceste marcaje permit navigatorului s afieze difereniat informaiile din tabel. Prezentm n continuare un exemplu simplu de tabel.
<HTML> <HEAD> <TITLE>Pagina cu tabel</TITLE> </HEAD> <BODY> <H1>Aceasta pagin da un exemplu de folosire a unui tabel</H1> <H3>Vnzri anuale:</H3> <TABLE> <TH>1996</TH><TH>1997</TH><TH>1998</TH><TR>
19
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT <TD>125 milioane lei</TD><TD>160 milioane lei</TD><TD>231 milioane lei</TD> </TABLE> </BODY> </HTML>
Exemplu de tabel ntr-o pagin HTML

Mrimea liniilor i a coloanelor poate fi controlat suplimentar prin marcajele <ROWSPAN=x> i respectiv <COLSPAN=y>, fiecare indicnd mrimea n "celule normale". n plus, se poate indica trasarea unei margini pentru tabel, prin marcajul <TABLE BORDER>. Includerea imaginilor se face folosind marcajul <IMG>, care are parametri specifici:
SRC indic (dup semnul '=') URL-ul imaginii, respectiv calea fiierului dac acesta este local; uzual, se accept fiiere n format GF sau JPEG;
ALLIGN controleaz alinierea imaginii fat de limita inferioar a textului (TOP, MIDDLE sau BOTTOM); este un parametru opional;
ALT furnizeaz textul afiat n locul imaginii dac utilizatorul dezactiveaz opiunea de afiare a imaginilor (parametru opional);
ISMAP este un indicator opional pentru imaginile care sunt hri selectabile. Astfel, introducerea simpl a unei imagini se poate realiza cu <IMG
SRC="specificare-imagine">. Un exemplu de imagine inserat ntr-o pagin HTML este prezentat n figur de mai sus. Remarcm faptul c, utiliznd parametri specifici, marcajul <IMG> se poate folosi i pentru inserarea unor fiiere multimedia, cum ar fi secvenele video. Avnd n vedere c aceste operaii se realizeaz mai uor folsind un editor HTML. Formulare. HTML 1.0 permitea uzual doar transferarea informaiilor de la furnizori ctre utilizatori, transferul n sens invers fiind foarte dificil. Odat cu dezvoltarea Web-ului i mai ales cu utilizarea sa n scopuri comerciale i n diverse alte domenii, s-a fcut simit necesitatea comunicrii n dublu sens pentru preluri de comenzi, completarea unor fise de nregistrare, distribuirea de produse soft, 20
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT administrarea de chestionar, transmiterea unor informaii personale etc. Acestea au fost motivaiile introducerii formularelor n HTML 2.0. Formularele conin obiecte de control care permit utilizatorilor introducerea de informaii prin completarea unor cmpuri specifice (casete de text), prin selectarea sau activarea unor opiuni (comutatoare, grupuri sau liste de opiuni). Aceste informaii vor fi transmise, dup activarea butonului SUBMIT (echivalent cu tastarea lui <Enter>) proprietarului paginii, introduse n baze de date dedicate i prelucrate cu aplicaii specifice. Formularele se introduc prin marcajelele <FORM>... </FORM>, crora li se ataeaz parametri specifici care definesc metodele de transmitere i tratare a datelor. Un formular poate conine obiecte de control de diverse tipuri, definite cu marcajul <INPUT> i o varietate de parametri care stabilesc, pentru obiectul definit, tipul, dimensiunea i modul lui de afiare. Astfel, se pot crea cmpuri de text (care vor fi completate cu texte de ctre utilizator), liste de alternative, comutatoare, grupuri de opiuni, butoane, hri active etc. Datele preluate prin intermediul formularelor se trateaz conform standardului CGI (Common Gateway Interface) prin intermediul unor programe sau script-uri CGI. n plus, un asemenea script poate interaciona cu baza de date creat pentru realizarea unor aciuni specifice (de exemplu, hrile active folosesc script-uri CGI pentru a executa diferite aciuni, n funcie de zona selectat de utilizator). Script-urile CGI pot executa i alte operaii dect prelucrarea formularelor, producnd ieiri convenabile. Dac o hiperlegtur indic spre un script CGI, la selectarea legturii se va executa script-ul (cu anumite variabile de context care rein diverse informaii de stare). Script-ul va produce un fiier, de exemplu o pagin web, care va fi interpretat () de navigator. Acest mecanism permite script-urilor s genereze, aproape instantaneu, pagini web care s satisfac diverse cerine ale utilizatorilor, furniznd anumite rspunsuri ateptate n urma unor aciuni. Crearea interactiv a formularelor, folosind produse soft specializate n realizarea de pagini Web este relativ accesibil pentru utilizatorii familiarizai cu caracteristicile obiectelor de control specifice aplicaiilor soft dar tratarea ulterioar a informaiilor transmise necesit cunotine de specialitate. Numele, simbolurile i procedura de introducere interactiv dintr-un editor HTML (de exemplu, Microsoft Front Page) a obiectelor de control sunt extrem de 21
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT apropiate de cele asociate obiectelor similare din formularele sau rapoartele Microsoft Access. Pentru utilizatorii mai puin avizai ns, crearea, chiar interactiv, a formularelor este mai dificil.
22
Prezentarea programului n care a fost realizat proiectul
Macromedia Dreamweaver este o unealt destinat creatorilor de pagini web. Dreamweaver a fost creat de Macromedia (acum Adobe Systems) i momentan a ajuns la versiunea 9. Primele versiuni ale produsului serveau doar ca simple editoare HTML de tipul WYSIWYG, dar n versiunile recente au fost implementate funcii de editare avansate i support pentru alte tehnologii web cum ar fi CSS, JavaScript etc. Dreamweaver s-a bucurat de un larg success nc de la sfritul anilor 90 i momentan deine aproximativ 80% din piaa editoarelor HTML.Produsul poate di rulat pe variante platforme software: Mac, Windows, dar suporta n acelai timp i platforme UNIX cu ajutorul unor emulatoare software, cum ar fi Wine. Ca orice alt editor WYSIWYG, Dreamweaver poate ascunde detaliile de implementare a pgnilor HTML, fcnd astfel posibil crearea cu uurin a pgnilor web de ctre utulizatorii neexperimentai. Unii creatori de pagini web critic aceste tipuri de editoare deoarece produc pagini de dimensiuni mult mai mari dect ar fi necesar, ceea ce conduce la o funcionare neperformant a browserelor web. Aceast afirmaie este n mare parte adevrat deoarece paginile web produse folosesc design-ul pe baz de table. n plus, produsul a mai fost criticat n trecut i pentru producerea de coduri care adesea nu erau conform standardelor W3C, dar acest aspect a fost mult mbuntit n versiunile recente. Cu toate acestea, Macromedia a crescut suportul pentru tehnologia CSS i alte modaliti de design fr a fi necesar folosirea design-ului pe baz de tabel. Dreamweaver pemite folosirea majoritii browserelor instalate pe calculatorul utilizatorului, pentru a previzualiza website-ul creat. De asemenea conine i cteva utulitare pentru administrarea site-urilor, cum ar fi cele pt a gsi i a modifica un paragraf sau o linie de cod, n ntregul web site, pe baza oricror parametri specificai de ctre utilizator. Cu ajutorul panourilor de stare se poate crea cod JavaScript fr a avea cunotine de programare.
23
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT Odat cu apariia versiunii MX, Macromedia a ncorporate utilitare de generare dinamic a coninutului. De asemenea, este oferit suport pentru conectarea la baze de date (cum ar fi MySQL i Microsoft Access) pentru a filtra i afi coninutul scriptului de genul PHP, ColdFusion, Active Server Pages (ASP) i ASP.NET, fr a avea nevoie de o prealabil experien n programare. Un aspect foarte ludat al Dreamweaver-ului l reprezint arhitectura s extensibil. Extensiile, aa cum sunt ele cunoscute, sunt mici programe, pe care orice dezvoltator le poate scrie (de obicei n HTML i JavaScript) ip e care le poate descrca i instala, acestea aducnd un spor de performan i funcionalitate mbuntit programului. Exist o comunitate de dezvoltatori care produc extensii i le public (att commercial, ct i gratuit) pentru probleme de dezvoltare web, de la simple efecte rollover pn la soluii complete de vnzare online.
24
Meniul programul Macromedia Dreamweaver 8

Meniurile File i Edit sunt standard pentru majoritatea programelor. Meniul File conine comenzi de deschidere, salvare, import i export de fiiere. Meniul edit conine comenzile Cut, Copy i Pate, alturi de comenzile Find i Replace i comanda Preferences. Multe elemente din interfaa Dreamweaver i din operarea s pot fi configurate n Preferences.
25
Meniul View activeaz i dezactiveaz vizualizarea coninutului seciunii de antet (head); a elementelor inviziblile; a straturilor, tabelelor i limitelor cadrelor, a barei de stare i a hrilor de imagine. Meniul View are de asemenea comenzi de activare a riglei i a grilei, de executare a pug-in-urilor i pentru afiarea de imagini de trasare. Comanda Prevent Layer Overlaps (Prevenirea suprapunerii de straturi) este i ea poziionat n meniul View.
Meniul View
26
Meniul Insert este aproape echivalent cu bar de inserri. Din acest meniu se poate insera opional toate elementele disponibile pe bar de inserri. Bar de inserri conine un numr total de seciuni din care putem s alegem diferite categorii de obiecte disponibile. Exist dousprezece seciuni n bar de inserri: Common, Layout, Text, Tables, Frames, Forms, Templates, Characters, Media, Head, Script i Application. Pentru a afia butoanele obiectelor dintr-o anumit categorie trebuie s dm click pe seciunea categoriei.
27
Meniul Modify ne permite sa modificm propriettile obiectului selectat la un moment dat.
28
Meniul Text ne ofer acces la mai multe modaliti de finisare a aspectului textului din pagin Web. Cel mai important pentru cei care scriu cu greeli este c meniul text conine 29
ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT comanda Check Spelling (verificarea ortografiei). Putem indenta un text, crea o list i modifica proprietile fontului.
Meniul Commands ofera comenzi utile cum ar fi Clean up HTML (curatarea codului HTML) i Clean Up Word HTML ( Curatarea cuvintelor din codul HTML).
30
Resurse de hard i soft necesare
Siteul a fost realizat cu ajutorul a mai multe programe precum macromedia dremweaver, flash mx2004 i swish max, Microsoft paint, adobe photoshop 9 . Cerinele de sistem ale programului nu sunt exagerate. Resurse minime : 1) Hardware : Procesor (CPU) : 500 MHz + Memorie (RAM): 64 MB Spaiu liber pe hard-disk : 30 MB Monitor :1024*768 Un browser oarecare: Internet explorer(recomandat),Mozilla
2) Software : - Sistem de operare : Windows 98/XP
31
Resurse recomandate: 1) Hardware : Procesor (CPU) : 1000 MHz + Memorie (RAM): 128 MB Spaiu liber pe hard-disk : 30 MB Monitor : VGA 32-bit color (1024x768)
- Un browser oarecare: Internet explorer(recomandat) ,Mozilla 2) Software : - Sistem de operare : Windows XP
Modaliti de utilizare
Utilizarea programului este foarte simpl. Printr-o simpl apsare a click-ului stnga al mouse-lui pe unul din butoanele proiectului putei ajunge la informaia dorit. Link-urile din partea de sus a paginii v ofer acces la toat informaia cuprins n site.
32
Bibliografie
1. Apostol, C., Roca, I.Gh., Roca, V., Ghilic-Micu , B., Introducere n programare. Teorie i aplicaii, Ed. Bucureti, 1993 2. Popovici, C., Georgescu, H., State, L., Bazele Informaticii, vol. I, Universitatea din Bucureti, 1990 3. Georgescu, H., Programare concurent. Teorie i aplicaii, Ed. Tehnic, Bucureti, 1996 4. http://www.scribd.com/doc/17754670/Limbajul-HTML 5. http://ro.wikipedia.org/wiki/World_Wide_Web
33
34

Din Lumea Dulciurilor

Încărcat de

Informații document

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Din Lumea Dulciurilor

Încărcat de

Drepturi de autor:

Formate disponibile

Din lumea dulciurilor

LUCRARE PENTRU ATESTAREA COMPETENELOR PROFESIONALE

Elev : .............. Profesor indrumtor : ............. Liceul : ................

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

Motivul alegerii temei

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

Elementele limbajului HTML

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

Marcaje pentru structurarea documentului

Marcaje pentru formatarea textului si crearea listelor

tabele scurte - create cu marcajul <DIR>.

Exemple de liste ntr-o pagin HTML

Marcaje pentru crearea hiperlegturilor

o zon din documentul HTML curent - link-uri interne.

Marcaje pentru introducerea de obiecte

Exemplu de tabel ntr-o pagin HTML

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

Prezentarea programului n care a fost realizat proiectul

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

Meniul programul Macromedia Dreamweaver 8

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

Meniul Modify ne permite sa modificm propriettile obiectului selectat la un moment dat.

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

Resurse de hard i soft necesare

2) Software : - Sistem de operare : Windows 98/XP

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

- Un browser oarecare: Internet explorer(recomandat) ,Mozilla 2) Software : - Sistem de operare : Windows XP

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

ATESTAT LA INFORMATIC Din lumea dulciurilor PREZENTARE PROIECT

S-ar putea să vă placă și