COLEGIUL NAŢIONAL DE INFORMATICĂ

„GRIGORE MOISIL” BRAŞOV

LUCRARE PENTRU ATESTAREA

COMPETENŢELOR PROFESIONALE

Profesor îndrumător: Bărbat DianaElevi: Iancu Sergiu şi Ruşeţ Dragoş

clasa a XII-a A

Mai 2013

Contents

Contents.....................................................................................................................................................................1

Motivaţia alegerii temei şi utilitatea aplicaţiei............................................................................................................2

Structura aplicaţiei.....................................................................................................................................................2

Principalele coduri ale aplicaţiei.................................................................................................................................5

Codul meniului:.......................................................................................................................................................5

Codul care deschide o pagină cu informaţii detaliate, independentă de aplicaţie:................................................6

Codul formularului:.................................................................................................................................................7

Cod pentru video:...................................................................................................................................................7

Cod înserare imagini:..............................................................................................................................................7

Resurse Hardware şi Software....................................................................................................................................8

Posibilităţi de dezvoltare............................................................................................................................................9

Bibliografie.................................................................................................................................................................9

Motivaţia alegerii temei şi utilitatea aplicaţiei

Am decis să alegem această temă datorită pasiunii comune pentru fenomenul global numit fotbal. Ne-am dorit să dăm naştere unui mic website care să prezinte cât se poate de simplu şi pe înţelesul tuturor cel mai important turneu internaţional de fotbal - Campionatul Mondial 2014 - ce va avea loc în Brazilia.

1

Această lucrare are ca scop promovarea ţării gazdă – Brazilia(cea mai titrată echipă din istoria competiţiei) şi a principalelor oraşe care participă activ la organizarea evenimentului. Totodată, site-ul conţine scurte descrieri ale stadioanelor – adevărate minuni arhitecturale – şi „face” vizitatorilor cunoştinţă cu mascota oficială a turneului –Fuleco.

Structura aplicaţiei

În realizarea acestui proiect am utilizat un meniu orizontal. Fiecărui capitol specific temei abordate i s-a atribuit câte un buton. În imaginea de mai jos se poate vedea meniul:

Meniul conţine şaşe opţiuni (de la stânga la dreapta): „Home Page”, „Host Country”, „Host Cities” , „Stadiums”, „Official Mascot”, „Contact”. Alegerea unei opţiuni din meniu deschide o nouă pagină cu informaţii despre opţiunea accesată.

La alegerea opţiunii Home Page, se afişează o pagină ce cuprinde câteva informaţii generale despre Cupa Mondială. Prin apăsarea denumirii ţării gazdă din anul 2014, Brazilia, vizitatorul va fi direcţionat către pagina Host Country.

În pagina Host Country am prezentat pe scurt principalele aspecte ale Braziliei. Prin apăsarea denumirilor Ronaldinho şi Kaka, vizitatorul va fi direcţionat către pagini cu informaţii detaliate independente de aplicaţie. Totodată, în această pagină am înserat un film care promovează evenimentul.

2

Prin alegerea opţiunii Host Cities, se deschide o pagină care conţine o hartă cu oraşele participante şi o galerie de imagini reprezentative pentru fiecare oraş organizator. Prin apăsarea imaginii corespunzătoare fiecărui oraş, vizitatorul va fi direcţionat către o pagină ce descrie oraşul şi ceea ce înseamnă fotbalul în aceste comunităţi.

3

Prin alegerea opţiunii Stadiums, se deschide o pagină care conţine o hartă cu stadioanele pe care se vor desfăşura meciurile şi o galerie de imagini reprezentative pentru fiecare stadion. Prin apăsarea imaginii corespunzătoare fiecărui stadion, vizitatorul va fi direcţionat către o pagină ce descrie stadionul.

La alegerea opţiunii Official Mascot se afişează o pagină în care este promovată mascota turneului – armadillo Fuleco.

4

Prin apăsarea butonului Contact, se va deschide o pagină care conţine un formular de contact unde vizitatorii îşi pot exprima sugestiile şi opiniile cu privire la website. Acest formular este din păcate nefuncţional, singura metodă în care vizitatorii îşi pot trimite ideile creatorilor site-ului fiind trimiterea lor sub forma unui email.

Principalele coduri ale aplicaţiei

Codul meniului:

<div id="menu">

<ul>

<li class="menuitem"><a href="index.html">Home Page</a></li>

<li class="menuitem"><a href="hostcountry.html">Host Country</a></li>

<li class="menuitem"><a href="hostcities.html">Host Cities</a></li>

<li class="menuitem"><a href="stadiums.html">Stadiums</a></li>

<li class="menuitem"><a href="officialmascot.html">Official Mascot</a></li>

<li class="menuitem"><a href="contact.html">Contact</a></li>

</ul>

5

</div>

#menu

{

background-image:url(images/menu.png);

background-repeat:no-repeat;

width:940px;

height:69px;

float:left;

clear:both;

}

Codul care deschide o pagină cu informaţii detaliate, independentă

de aplicaţie:

<a href="http://en.wikipedia.org/wiki/Ronaldinho" target="_blank" > Ronaldinho </a>

<a href="http://en.wikipedia.org/wiki/Kak%C3%A1" target="_blank" >Kaka</a>

Codul formularului:

<form method="post" action="mailto:simplejustpuzzle@yahoo.com" >

<table bgcolor="#EEEFE4" border="0" cellspacing="0" cellpandding="0" >

<tr><td><font face="Arial" size="3" color="3A6028">Name*:</font>&nbsp;</td><td><input

type="text" name="nume" value="" size="30" maxlength="30" /></td></tr><br>

<tr><td><font face="Arial" size="3" color="3A6028">Email

address*:</font>&nbsp;</td><td><input type="text" name="adresaemail" value="" size="30"

maxlength="30" /></td></tr><br>

6

<tr><td><font face="Arial" size="3" color="3A6028">Subject*:</font>&nbsp;</td><td><input

type="text" name="subiect" value="" size="30" maxlength="30" /></td></tr><br>

<tr><td><font face="Arial" size="3"

color="3A6028">Message*:</font>&nbsp;</td><td><textarea cols="24" rows="4"

wrap="hard"> </textarea></td></tr><br>

<tr><td align="middle"><input type="submit" value="Send" align="center" /></table>

Cod pentru video:

<div style="text-align: center; margin: auto"><object type="application/x-shockwave-flash" style="width:600px; height:400px;" data="http://www.youtube.com/v/wDvkD8r-rM8">

<param name="movie" value="http://www.youtube.com/v/wDvkD8r-rM8" />

</object>

Cod înserare imagini:

<img src="images/brazilflag.jpg"/>

<img src="images/trophy.jpg" align="right"/>

<img src="images/mascot.jpg" align="right"/>

Resurse Hardware şi Software

Aplicaţia a fost scrisă atât în limbajul HTML căt şi în limbajul CSS.

HTML-HyperText Markup Language este un limbaj de marcare utilizat pentru crearea paginilor web ce pot fi afișate într-un browser (sau navigator). Scopul HTML este mai degrabă prezentarea informațiilor – paragrafe, fonturi, tabele ș.a.m.d. – decât descrierea semanticii documentului.

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.

7

Site-ul a fost realizat cu ajutorul unor diverse programe precum notepad++, adobe photoshop cs5, photoscape, microsoft word 2007, google chrome. Cerinţele de sistem ale programelor nu sunt exagerate.

Resurse minime:

Intel® Pentium® 4 or AMD Athlon® 64 processor

Microsoft® Windows® XP with Service Pack 3; Windows Vista® Home Premium, Business, Ultimate, or Enterprise with Service Pack 1 (Service Pack 2 recommended) or Windows 7

1GB of RAM

1GB of available hard-disk space for installation; additional free space required during installation (cannot install on removable flash-based storage devices)

1024×768 display (1280×800 recommended) with qualified hardware-accelerated OpenGL graphics card, 16-bit color, and 256MB of VRAM

Some GPU-accelerated features require graphics support for Shader Model 3.0 and OpenGL 2.0

Resurse recomandate:

Multicore Intel processor

Mac OS X v10.5.7 or v10.6

1GB of RAM

2GB of available hard-disk space for installation; additional free space required during installation (cannot install on a volume that uses a case-sensitive file system or on removable flash-based storage devices)

1024×768 display (1280×800 recommended) with qualified hardware-accelerated OpenGL graphics card, 16-bit color, and 256MB of VRAM

Some GPU-accelerated features require graphics support for Shader Model 3.0 and OpenGL 2.0

Posibilităţi de dezvoltare

Complexitatea site-ului este una redusă, acestuia putându-i fi adăugate multe alte facilităţi precum muzică de fundal, animaţii, galerii de imagini. Totodată formularul nu funcţionează la parametrii normali. De asemenea, ar mai putea fi adăugate câteva sondaje de opinii, un forum şi o rubrica de comentarii.

8

Bibliografie

www.wikipedia.com www.fifa.com www.vip-gaming.ro www.tutorialehtml.com/ www.shaunakelly.com

9