Colegiul Naional Mihai Eminescu

LUCRARE DE ATESTAT PROFESIONAL LA INFORMATIC

RILE LUMII
SITE

Profesor coordonator: Popescu Luminia

Elev: Iancu Iulia-Cristina

Bucureti, 2011

Cuprins
Capitolul 1. Introducere Capitolul 2. Structura aplicaiei 2.1 Organizarea coninutului informaional 2.2 Structuri de date utilizate 2.3 Structura generala a paginilor 2.4.1 Structura primei pagini 2.4.2 Structura unei pagini cu submeniu Capitolul 3. Resurse hardware si software necesare Capitolul 4. Modaliti de utilizare Capitolul 5. Bibliografie 4 5 5 6 7 8 11 13 14 15

2.4 Detalii tehnice de implementare (secvene de cod relevante) 8

Capitolul 1. Introducere
Aplicaia de fata isi propune sa vina in ajutorul persoanelor ce doresc rapid informaii despre tarile lumii. Lucrarea dorete sa sporeasc cunotinele sau sa rezolve rapid unele cerine actuale, ca de exemplu capitala unui stat sau fusul orar in funcie de zona. Site-ul poate fi utilizat in scoli pentru pregtirea elevilor in vederea susinerii unor examene: teste naionale, lucrri semestriale. Site-ul este destinat ntocmai pentru a incita setea de cunoatere. Pentru susinerea scopului educativ, aplicaia le este necesar elevilor att la coala in realizarea referatelor cat si in acumularea de cunotine pentru imbunatatirea culturii generale. De asemenea, site-ul este un bun nlocuitor al celor mai complicate si astfel poate fi folosit de oricine, chiar si de cei mai puin iniiai in tehnica actuala ntruct are o structura simpla, uor de utilizat.

Capitolul 2. Structura aplicaiei

2.1 Organizarea coninutului informaional
Programul conine o forma principala alctuita din mai multe butoane precum: - Categoria Prima pagina conine linkuri spre pagina de nceput a site-ului. Ea poate fi accesata din orice pagina a programului. - Categoria Evoluia societatii conine link-uri catre alte subcategorii precum: Preistorie, Antichitate, Evul mediu, Epoca moderna si Epoca actuala, fiecare avnd in descrierea lor informaii eseniale despre fiecare perioada istorica in parte. Ele pot fi accesate prin intermediu a mai mult butoane. - Categoria Informaii utile conine mai multe subcategorii precum : Capitale, Limba oficiala, Moneda, Fus orar si Prefixul statului respectiv. Toate aceste pagini pot fi accesate cu ajutorul a diverse butoane.

2.2 Structuri de date utilizate

HTML este o form de marcare orientat ctre prezentarea documentelor text pe o singura pagin, utiliznd 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 coninutul unui document poate fi adnotat cu diverse tipuri de metadate i indicaii de redare. Indicaiile de redare pot varia de la decoraiuni minore ale textului, cum ar fi specificarea faptului c un anumit cuvnt trebuie subliniat sau c o imagine trebuie introdus, pn la scripturi sofisticate, hri de imagini i formulare. Metadatele pot include informaii despre titlul i autorul documentului, informaii structurale despre cum este mprit documentul n diferite segmente, paragrafe, liste, titluri etc. i informaii cruciale care permit ca documentul s poat fi legat de alte documente pentru a forma astfel hiperlink-uri HTML reprezint baza crerii unui site web, dar din utilizarea acestuia, fara a aduga alte metode de codare, duce la crearea unui website foarte simplu, de multe ori incompatibil cu unele browsere, mai vechi, dar in cele mai multe cazuri, aceste sute-uri sunt indexate mai uor de motoarele de cutare. PHP este un limbaj de programare. Numele PHP provine din limba englez i este un acronim recursiv : Php: Hypertext Preprocessor. Folosit iniial pentru a produce pagini web dinamice, este folosit pe scar larg n dezvoltarea paginilor i aplicaiilor web. Se folosete n principal nglobat n codul HTML, dar se poate folosi i n mod linie de comand (CLI), permind crearea de aplicaii independente. Este unul din cele mai importante limbaje de programare web open-source i server-side, existnd versiuni disponibile pentru majoritatea web serverelor i pentru toate sistemele de operare. Conform statisticilor este instalat pe 20 de milioane de situri web i pe 1 milion de servere web. PHP adauga foarte multe posibilitati de a creea aplicatii in interiorul paginilior web (un formular), de aseamenea cu ajutorul lui se poate securiza un site, usureaza munca developer-ului in crearea site-ului, spre exemplu cand acesta este nevoit sa aduca la zi site-ul, creand aplicatii ajutatoare, el poate face asta cu usurinta in cateva minute. ADOBE DREAMWEAVER CS4

In crearea site-ului cu tema Tarile lumii am folosit ca program de organizare a fisierelor Adobe Dreamweaver CS4. Programul 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 Dreamweaver permite folosirea majoritii browserelor instalate pe calculatorul utilizatorului, pentru a previzualiza website-ul creat. De asemenea conine i cteva utilitare pentru administrarea site-urilor, cum ar fi cele pentru a gsi i 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. 5

2.3 Aspectul general al paginilor

Pentru o nelegere mai uoara a proiectului am creat urmtoarea schema:

Prima Primapagin pagin

Evoluia Evoluiasocietii societii

Informaii Informaiiutile utile

Prima Primapagin pagin

Preistorie Preistorie

Antichitate Antichitate

Capitale Capitale

Limba oficial Limba oficial

Evul Evulmediu mediu

Epoca Epocamodern modern

Moned Moned

Fus Fusorar orar

Epoca Epocaactual actual

Prefix Prefix

Fiecare pagina este construit astfel: HEADER MENIU PRINCIPAL MENIU SECUNDAR (unde este cazul) CONINUT IMAGINI CU ADRESE (Unde este cazul)

2.4.1 Structura primei pagini

Afiarea primei pagini a programului intr-un browser oarecare

Afiarea codului imaginii din header in Macromedia Dreamweaver 8.0

Prima pagina a prezentarii se deschide intr-o fereastra noua a browser-ului folosit, prin accesarea fisierului de tip html: pagina_principala.html. In partea de sus a paginii (header) am inserat o imagine careia i-am adaugat un link ce odata accesat, va conduce intotdeauna la pagina de start. Sub banner am scris titlul site-ului caruia i-am asociat o un text de tip Flash cu ajutorul programului Macromedia Dreamweaver 8.0. Codul folosit este acesta: <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#ver sion=5,0,0,0" title="tari" width="254" height="43"> <param name="BGCOLOR" value="#3399CC"> <param name="BGCOLOR" value="#3399cc"> <param name="BGCOLOR" value="#3399cc"> <param name="BGCOLOR" value="#99cccc"> <param name="BGCOLOR" value="#99cccc"> <param name="movie" value="text2.swf"> <param name="quality" value="high"> <embed src="text2.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi? P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" bgcolor="#3399CC" width="254" height="43"> </object> In continuare, sub titlu, exista meniul principa ce poate fi accesat de la orice pagina. Fiecare contine 3 butoane de tip Flash realizate cu programul Macromedia Dreawever. Fiecare buton are o adresa proprie astfel ca prin accesarea unuia dintre ele, ne va conduce la o noua pagina din cadrul site-ului. Codul folosit este valabil pentru fiecare buton in parte: <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#ver sion=5,0,0,0" title="butonps" width="170" height="67"> <param name="BGCOLOR" value="#99CCCC"> <param name="movie" value="button1.swf"> <param name="quality" value="high"> <embed src="button1.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi? P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" bgcolor="#99CCCC" width="170" height="67"> </object>

In restul pagini se gsete textul structurat pe subpuncte marcate prin semnul grafic . Codul introdus este urmtorul: <li> <h1 style="background-color: rgb(204, 204, 204);" class="style3" align="left">10.000 de ani este o perioada imensa de timp pentru perspectiva vietii unui singur om, dar este un timp relativ scurt pentru standardele evolutiei. Ce anume a cauzat aceasta schimbare rapida si de o asemenea anvergura?</h1> </li> In parte dreapta a textului se afla si o imagine introdusa cu ajutorul: <img src="New%20Folder/a47earth.gif" width="175" height="176">

2.4.2 Structura unei pagini cu submeniu

10

Pagina prezentata are in plus fata de cea de start un submeniu cu ajutorul cruia putem naviga nainte si napoi printre seciunile aceleiai categorii, in situaia de fata pagina fiind Evoluia societatii-Antichitate. Pagina prezentata in cazul de fata a fost accesata utiliznd din meniul principal butonul Evoluia societatii urmnd ca din submeniu sa selectam Antichitate. Butonul folosit prezint urmtorul cod: <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#ver sion=5,0,0,0" title="btnantiq" width="145" height="35"> <param name="BGCOLOR" value="#9999CC"> <param name="movie" value="button6.swf"> <param name="quality" value="high"> <embed src="button6.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi? P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" bgcolor="#9999CC" width="145" height="35"> </object> O alta noutate o constituie coloana din dreapta textului in care se regsete o scurta clasificare a perioadelor din istoria omenirii. La nivelul primului cuvnt sau grup de cuvinte care denumete o perioad anume, se regsete inserat un link ce va conduce utilizatorul ctre pagina respectiv din cadrul site-ului. Astfel c avem, de exemplu, pentru perioada evului mediu, urmtorul cod: </p> <p align="center" class="style4"><a href="preistorie.html"><span style="font-weight: bold;">Preistorie</span></a></p> <div align="center"><span class="style4">reprezint&acirc;nd prima epoc&#259; din istoria societ&#259;&#355;ii omene&#351;ti. Ea se mai nume&#351;te &#351;i epoca str&#259;veche.</span> </div> In partea de jos a paginii sunt prezente cteva imaginii, ce prin selectare, vor conduce la site-uri exterioare ca de exemplu http://www.ancientgreece.com/s/Main_Page/ pentru imaginea ce reprezint Pantenonul. Codul utilizat in introducerea fiecare imagini este urmtorul: <img src="New%20Folder/Mesopotamia.PNG" alt="mesopotamia" style="border: 2px solid ; width: 263px; height: 229px;">

11

Capitolul 3. Resurse hardware i software necesare

Site-ul a fost realizat cu ajutorul programului Macromedia Dremweaver. 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 explore, ,Mozilla, Opera; 2) Software : - Sistem de operare : Windows 98/XP;

12

Capitolul 4. Modaliti de utilizare

Utilizarea programului este foarte simpla. Lansarea acestuia se face prin dubluclick pe fiierul pagina_de_start din folderul Atestat informatica. Dup deschiderea acestuia intr-un browser, printr-o simpla apsare a click-ului stnga al mouse-lui pe unul din butoanele proiectului putei ajunge la pagina dorit. Link-urile din partea de sus a paginii v ofer acces la toat informaia cuprins n site. Programul ajut la mbogire cunotinelor generale de geografie i istorie, poate fi utilizat n aflarea informaiilor utile oricrei persoane prin simplitatea modului de organizare.

13

Capitolul 5. Bibliografie
Al. I. Alexandrescu Originile Civilizatiei Si Evolutia Societatii Marius Lungu Statele lumii. Antologie http://www.teoria-evolutiei.ro/evolutia-omului.aspx http://ro.wikipedia.org/wiki/Perioada_Marilor_descoperiri http://ro.wikipedia.org/wiki/Neil_Armstrong

14