Sunteți pe pagina 1din 18

ATESTAT INFORMATICA

1
CUPRINS:

1.Argument.................................................................................3
2.Mediul de lucru………………………………………………4
3.Realizarea aplicatiei.................................................................13

2
1.Argument

Acest atestat are ca tema unitatea structurala a corpului, celula .


Sunt prezentate caracteristicile generale ale celulei, proprietati fizice si
chimice , structura , functiile celulei , diviziunea celulara.
De asemenea , este prezentat si un test,de verificare a
cunostintelor cu privire la celula,cat si doua clipuri video despre
celula.

Datele de contact se gasesc pe pagina „contact.html” . Proiectul


este structurat sub forma de div-uri, avand in compozitie meniul din
stanga („sidebar”) , titlul („header”) , continutul („page”) . Toate
aceste caracteristici privind alinierea in pagina se gasesc in fisierul
CSS(Cascading Style Sheet) – „style.css” .

3
2.Mediul de programare

HTML este prescurtarea Hyper Text Markup Language.


HTML este cea mai populara limba a web-ului. Pagini si sit-uri
web sunt scrise in HTML. Cu HTML si WWW, poti aduce in
acelasi loc texte, sunete, poze, si link-uri. Documentele HTML
pot fi compuse si editate pe orice tip de calculator.

Intr-un document HTML poti avea caractere bold, italice,


mici si mari.
Pentru a crea propozitia de mai sus, codul HTML va arata asa:

Intr-un document HTML poti avea caractere <b>bold</b> ,


<i>italice</i>, <font size=-2>mici</font> si <font
size=+2>mari</font>

Bine, bine...dar ce inseamna aceste "<" si ">" ? Cand scrii un


anumit lucru intre aceste doua semne, creezi un lucru cunoscut
sub numele de tag. De exemplu, tagul <b> da comanda de a
incepe scriere cu caractere bold, si tagul </b> da comanda de
a opri scrierea cu caractere bold. Tagul cu semnul slash(/) este
cunoscut ca tag de inchidere. Cele mai multe taguri necesita si
un tag de inchidere, dar nu toate. Tagurile formeaza intreaga
structura a unui document HTML.

Prima pagina a site-ului este denumita: "caracteristici


generale.html"
La un moment data pare un pop-up galben in partea de sus a
paginii,cu textul:” To help protect your security, Internet Explorer
has restricted this file from showing Active Content that could

4
access your computer. Click here for more options”. Apesi click-
dreapta si dai “Allow blocked content…”

In aceasta pagina este prezentata o animatie in Flash


8. Acesta animatie este realizata prin modificarea unui
bitmap in flash(folosind comanda „trace bitmap”).
Apoi s-a creat animatia folosind foarte mult „shape
tween-ul”.

5
Aceasta se numeste „header.swf”

Titlul paginii se pune intre tag-urile <head> </head> si


se noteaza <title>
<head>
<title>Atestat</title>
</head>
comanda se inchide cu </title>

Elementele Macromedia Flash au fost inserate cu functia


<embed>
exemplu in “caracteristici generale.html”:
<embed SRC="header.swf">
</embed>
comanda se inchide cu </embed>

Scrollbar-ul: A fost introdus cu functia body {};

body {scrollbar-face-color: #333333;


scrollbar-shadow-color: #333333 ;
scrollbar-highlight-color: #333333 ;
scrollbar-3dlight-color: #333333 ;
scrollbar-darkshadow-color: #333333 ;
scrollbar-track-color: #33ccff;
scrollbar-base-color: #333333 ;
scrollbar-arrow-color: #33ccff ;

6
scrollbar-background-color: #333333 ;
scrollbar-front-color: #333333 ;}

Unde:
 scrollbar-face-color este culoarea principala
 scrollbar-shadow-color este culoarea marginii din
partea dreapta si jos
 scrollbar-highlight-color este culoarea marginii din
partea stanga si sus
 scrollbar-3dlight-color este culoarea marginii din
partea stanga si sus (cea 3D)
 scrollbar-darkshadow-color este culoarea marginii
din partea dreapta si jos (cea 3D)
 scrollbar-track-color este culoarea track-ului
 scrollbar-base-color este culoarea de baza
 scrollbar-arrow-color este culoarea sagetilor
 scrollbar-background-color este culoarea de
background (de fundal)
 scrollbar-front-color este culoarea fata ,

iar #333333 si #33CCFF reprezinta culoarea gri respectiv


albastru deschis.

Exista 16.7 milioane de culori diferite in sistemul de culori


hexadecimal, incepand de la #FFFFFF care este alb, pana la
#000000 care este negru.
Fiecare cod hexadecimal este impartit in 3 grupe:
- #XXxxxx - Tenta de rosu
- #xxXXxx - Tenta de verde
- #xxxxXX - Tenta de albastru
Fiecare unitate(x) este o valoare intre 0 si F in sistemul de
culori hexadecimal. Sistemul de culori hexadecimal consta in
unitatile 0 1 2 3 4 5 6 7 8 9 A B C D E F, 0 fiind valoare nula,
iar F valoarea cea mai mare.
Daca primele doua unitati (adica tenta de rosu) sunt FF (cea
mai mare valoare), iar restul de patru sunt 0 (nul) atunci
culoarea va fi rosu curat.
Daca cele doua unitati din mijloc (adica tenta de verde) sunt FF
(cea mai mare valoare), iar restul sunt 0 (nul) atunci culoarea
va fi verde curat.
Daca ultimele doua unitati (adica tenta de albastru) sunt FF

7
(cea mai mare valoare), iar restul sunt 0 (nul) atunci culoarea
va fi albastru curat.
Incercati sa combinati diferite culori pana cand ajungeti la cea
dorita plecand de la cele 3 culori de baza.

Tagul pentru sfarsit de rand este <br>. Acest tag nu


are un altul pentru inchidere.

Multe taguri suporta atribute de aliniere in pagina;


aliniere la stanga, in centru, la dreapta. Atributul align se
ataseaza tagului de deschidere inaintea semnului >.

Link-urile sunt esenta webului, fara acestea paginile


unui sit nu ar avea legatura intre ele. Pentru a adauga un
link se foloseste tagul de deschidere <a href="locatie"> si
tagul de inchidere </a>. Tot ce va aparea intre aceste
doua taguri va fi subliniat si colorat, iar in momentul click-
ului pe acel text, browser-ul va fi trimis spre locatia data.

Exemplu:
<a href="poze/1.jpg"><img src="poze/1.jpg" width="250"
border="0"></a> (in pagina daca apasam pe poza
respective,ne deschide poza la dimensiunea reala)

Tagul center are ca actiune centrarea lucrurilor intr-o pagina.


Tagul de deschidere este <center>, iar tagul de inchidere este
</center>. Tot ceea ce este cuprins intre aceste doua taguri va
fi centrat in pagina(adica va aparea pe centrul paginii).

Nota: W3C(grupul care decide standardele HTML) recomanda


folosirea <div align="center">text centrat</div> in locul
tagului <center>,desi div nu functioneaza in browsere vechi.
Avantajul folosirii tagului div este ca poti alinia lucrurile in
pagina la stanga, pe centru si la dreapta prin folosirea
atributului align

Tagul <body> are multe atribute..in urmatoarele randuri sunt


cele mai folositoare..

8
background="locatia imaginii" = Pune o imagine ca fundal
al unei pagini web.
bgcolor="#cod hexadeciaml" = Pune o culoare ca fundal.
link="#cod hexadeciaml" = Pune o culoare pentru link.
vlink="#cod hexadecimal" = Pune o culoare pentru linkurile
deja vizitate.
text="#cod hexadecimal" = Pune o culoare pentru text.

Lista neordonata sau mai clar nenumerotata este prima din cele
trei tipruri de liste din acest capitol. Acest gen de lista este
probabil cea mai uzuala.

Exemplu de lista nenumerotata...


 monitor
 modem
 unitate
 mouse
 tastatura

Sursa:(remarcati bulina dinaintea obiectului)

<ul>
<li>monitor
<li>modem
<li>unitate
<li>mouse
<li>tastatura
</ul>

Intre tagul <ul> si </ul> se trece lista de obiecte, fiecare


obiect avand in frunte tagul <li>. Nu exista limita pentru
obiectele din lista.

Lista ordonata cunoscuta si sub denumirea de lista numerotata


este asemanatoare ca structura listei nenumerotate, exceptia
constand in inlocuirea bulinei din fata obiectului cu un numar.
Tagul de deschidere pentru lista ordonata este <ol>, iar cel de
inchidere este </ol>. Fiecare obiect din lista va avea in
continuare acelasi tag <li>.

9
Exemplu de lista numerotata...
1. monitor
2. modem
3. unitate
4. mouse
5. tastatura

Sursa:(remarcati numarul dinaintea obiectului)


<ol>
<li>monitor
<li>modem
<li>unitate
<li>mouse
<li>tastatura
</ol>

Noile versiuni ale browser-elor suporta fonturi de genul


Verdana, Arial..., astfel stilul fontului fiind diferit de cel normal.
Aceasta schimbare de font se poate realiza prin adaugarea
atributului face="nume_font" la tagul <font>. Cele mai folosite
fonturi sunt Verdana, Arial, Helvetica, Impact, Comic Sans MS,
si inca cateva. Nu se recomanda ca textul paginii sa fie
dependent de aceste fonturi deoarece unele browsere mai vechi
nu le suporta inca.

Exemple:
Verdana
<font size=+2 face="Verdana">Verdana</font>
Arial
<font size=+2 face="Arial">Arial</font>
Helvetica
<font size=+2 face="Helvetica">Helvetica</font>
Impact
<font size=+2 face="Impact">Impact</font>
Comic Sans MS
<font size=+2 face="Comic Sans MS">Comic Sans MS</font>

10
Se poate schimba culoarea textului prin adaugarea
atributului color="culoarea_fontului" la tagul <font>.
Culoarea este setatata prin introducerea codului din
sistemul de culori hexadecimal, dar de asemenea se poate
seta in browser-ele noi doar prin introducerea numelui
culorii in engleza.

Exemplu de text colorat:


Componente unitate!
<font size=+2 face="Impact" color="green">Componente
unitate!</font>

Exemplu de tabela cu mai multe randuri si coloane:


Titlu 1 Titlu 2 Titlu 3
Casuta A Casuta B Casuta C
Casuta D Casuta E Casuta F

Sursa:
<table border=2>
<tr>
<th>Titlu 1</th><th>Titlu 2</th><th>Titlu 3</th>
</tr>
<tr>
<td>Casuta A</td><td>Casuta B</td><td>Casuta
C</td>
</tr>
<tr>
<td>Casuta D</td><td>Casuta E</td><td>Casuta
F</td>
</tr>
</table>

Animatia textului se face cu comanda <marquee>


Exemplu:
<marquee behavior="alternate" scrollamount="5"
hspace="200"> textul animat</marquee> ,unde:
behaviour=modul in care e animat textul

11
=poate lua
valorile:”alternate”,”scroll”,”slide”;
scrollamount=cat de repede sa se miste textul(valori de
la 1 la 7):1(se misca incet),7(se misca repede)
hspace=spatial alocat pe orizontala,in pixeli
vspace=spatial alocat pe verticala,in pixeli
direction=directia pe care se misca textul
comanda se inchide cu </marquee>

12
3.Realizarea aplicatiei

Componentele html au fost realizate in Dreamweaver


8, in timp ce componentele Flash au fost realizate in Adobe
Flash CS3.

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 funcţii de editare avansate şi
support pentru alte tehnologii web cum ar fi CSS, JavaScript
etc.
Dreamweaver s-a bucurat de un larg succes încă de
la sfârşitul anilor '90 şi momentan deţine aproximativ 80% din
piaţa editoarelor HTML. Produsul poate fi rulat pe variate
platforme software: Mac, Windows, dar suportă în acelaşi 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 paginilor HTML, făcând
astfel posibilă crearea cu uşurinţă a paginilor web de către
utilizatorii neexperimentaţi.
Unii creatori de pagini web critică aceste tipuri de editoare
deoarece produc pagini de dimensiuni mult mai mari decât ar fi
necesar, ceea ce conduce la o funcţionare neperformantă a
browserelor web.
Această afirmaţie este în mare parte adevarată
deoarece paginile web produse folosesc design-ul pe bază de
tabel. Î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 îmbunătăţit în

13
versiunile recente. Cu toate acestea, Macromedia a crescut
suportul pentru tehnologia CSS precum şi alte modalităţi de
design fără a fi necesară folosirea design-ului pe bază de tabel.
Dreamweaver permite folosirea majorităţii browserelor instalate
pe calculatorul utilizatorului, pentru a previzualiza website-ul
creat. De asemenea conţine şi câteva utilitare pentru
administrarea site-urilor, cum ar fi cele pentru a găsi şi
modifica un paragraf sau o linie de cod, în întregul web site, pe
baza oricăror parametri specificaţi de către utilizator. Cu
ajutorul panourilor de stare se poate crea cod JavaScript fără a
avea cunoştinţe de programare.
Odată cu apariţia versiunii MX, Macromedia a
încorporat utilitare de generare dinamică a conţinutului. De
asemenea este oferit suport pentru conectarea la baze de date
(cum ar fi MySQL şi Microsoft Access) pentru a filtra şi afişa
conţinutul folosind script-uri de genul PHP, ColdFusion, Active
Server Pages (ASP) şi ASP.NET, fără a avea nevoie de o
prealabilă experienţă în programare.
Un aspect foarte lăudat al Dreamweaver-ului îl
reprezintă arhitectura sa extensibilă. Extensiile, aşa cum sunt
ele cunoscute, sunt mici programe, pe care orice dezvoltator le
poate scrie (de obicei în HTML şi JavaScript) şi pe care oricine
le poate descarca şi instala, acestea aducând un spor de
performanţă şi funcţionalitate îmbunătăţită programului. Există
o comunitate de dezvoltatori care produc aceste extensii şi le
publică (atât comercial cât şi gratuit) pentru probleme de
deyvoltare web, de la simple efecte rollover până la soluţii
complete de vânzare online.

14
Adobe Flash sau mai pe scurt Flash este o aplicaţie utilizată
pentru dezvoltarea obiectelor-aplet de tip Flash disponibile în
cadrul unor pagini WEB. Prin intermediul obiectelor flash, veţi
putea creşte dinamismul unei pagini precum şi facilita
interacţiunea cu utilizatorul. Iniţial dezvoltată de Macromedia,
aplicaţia Flash a fost preluată de către Adobe© odată cu
achiziţionarea companiei sus amintite.

Avantajele folosirii Flash-ului pe web:


Elemente grafice vectoriale: dimensiuni mici şi
scalabil: Pentru a “memora” imaginile un calculator poate
recurge la două metode: prima este reţinerea pixel cu pixel a
imaginii, cea de-a doua este memorarea unor “puncte critice”
cu ajutorul cărora imaginea poate fi refăcută. Astfel pentru a
afişa un cerc, acesta poate fi memorat într-o imagine de tip
raster (cum ar fi formatul BitMap sau Jpeg) – dacă avem un
cerc cu o rază destul de mare vor fi memoraţi nu numai pixelii
de pe circumferinţa cercului ci şi cei din interiorul acestuia sau
care sunt în jurul său. Spre deosebire, în cadrul formatelor
vectoriale (SVG - Scalable Vector Graphics, SWF - ShockWave
Flash) sunt reţinute doar centrul şi raza cercului, calculatorul

15
găsind imediat metoda de afişare a tuturor punctelor ce vor
alcătui cercul. Este evident faptul că dimensiunea unui fişier în
format rasterizat (jpg, bmp, gif) este mai mare decât cea a
unui fişier în format vectorial (din cauza numărului de informaţii
ce vor fi reţinute). Atunci când mărim o imagine de tip vectorial
nu facem decât să redesenăm o parte a sa, calculatorul putând
reda cercul cu aceeaşi claritate – se cunoaşte forma geometrică
reprezentată şi mărirea imaginii nu reprezintă decât trasarea
(la scară) a fostei imagini vectoriale. Atunci când mărim o
imagine de tip raster calculatorul nu “cunoaşte” despre ce este
vorba şi operaţia va consta doar în suprademensionarea
pixelilor (un pixel al cercului va fi afişat în mai multe puncte de
pe ecran).
Independenţa de platformă (browser/sistem de
operare): Imaginile vectoriale, deşi mai utile, necesită o
aplicaţie care să genereze imaginea (pentru formatul SVG de
exemplu există Adobe SVG Player iar pentru SWF avem
Playerul de Flash). Independenţa de platformă apare din cauză
că acest program ce „ştie” să afişeze imaginile a fost construit
pentru o gamă largă de hardware şi sisteme de operare: Astfel
dacă vom vizualiza obiectul Flash în Windows se va folosi
automat Playerul de Flash versiunea Windows, dacă utilizăm un
telefon mobil (SmartPhone), se va folosi playerul disponibil
pentru telefoane (Flash Player Lite 1.0), sau dacă vom folosi
MacOS există un player separat (evident toate playerele vor
afişa aceeaşi imagine finală).
Animaţii de lungă durată uşor de realizat: animaţiile
sunt punctul forte al Flash-ului, interfaţa aplicaţiei dă
posibilitatea de a sincroniza (în funcţie de timp) diversele
obiecte, poziţii sau forme ale acestora. Flash-ul nu numai că
realizează această sincronizare, dar poate şi interpola poziţia
(sau forma) unui obiect pentru a uşura munca utilizatorului.
Se pot adăuga interfeţei elemente multimedia: în interiorul
obiectelor Flash puteţi importa şi manipula (înainte, inapoi, salt
la un anumit moment) MP3-uri sau AVI-uri.
Nu necesită cunoştinţe de HTML, XHTML: în cazul în care vă
hotărâţi să realizaţi un întreg site în Flash, aplicaţia vă poate
furniza odată cu obiectul flash şi codul HTML necesar – în acest
fel tot ce mai trebuie făcut este doar publicarea sitului pe un
server WEB.

16
Editoare puternice şi lucrul facil: (Macromedia) Flash
este un editor puternic care dă posibilitatea de ataşări de
comportamente diverselor obiecte fie folosind interfaţa de
desenare grafică fie prin ataşarea de scripturi obiectelor.
• Uşurinţa îmbinării elementelor grafice cu scriptul: ataşarea
codurilor ActionScript obiectelor din flash se realizează prin
selectarea obiectului şi introducerea codului asociat obiectului
într-o fereastră specială.

Transferabil ca flux de date: pentru ca un film Flash


să ruleze pe maşina clientului nu este necesar să fie încărcat în
întregime – playerul va afişa doar cât va putea din film
aşteptând (eventual) încărcarea în continuare. Din acest motiv
se pot realiza scripturi speciale care ataşate obiectelor Flash pot
furniza informaţii privitoare la procentul de fişier care a fost
încărcat.

Dezavantaje ale utilizării Flash-ului:


Printre dezavantajele folosirii obiectelor flash în paginile web
amintim:

Depinde de player: deşi acesta vine instalat pe o suită


de browsere (şi în cazul în care nu este preinstalat instalarea
este destul de rapidă – dimensiunea Playerului Flash este destul
de mică şi descărcarea acestuia în contextul reţelelor actuale
este rapidă), totuşi există cazuri în care obiectele Flash ajung
pe maşini ce nu au instalată aplicaţia necesară interpretării
obiectelor Flash, ajungându-se în imposibilitatea folosirii
fişierelor (Pentru a rula aplicaţiile Flash pe aceste calculatoare
trebuie exportat obiectul Flash ca un executabil).
Mare amator de resurse: deoarece trebuie să
„reconstruiască” de fiecare dată elementele grafice, Playerul
Flash (precum şi aplicaţia de dezvoltare) este mare consumator
de memorie şi procesor (în cazul graficii raster este clar unde

17
trebuiau afişaţi pixelii ce formează cercul – în cadrul graficii
vectoriale trebuie ca poziţiile pixelilor să fie recalculate).
Motoarele de căutare nu pot indexa textul: Flashul lucrează cu
mai multe tipuri de texte, majoritatea dintre acestea (textul
static) nu poate fi indexat de motoarele de căutare deoarece
obiectul Flash este tratat ca element grafic/obiect şi roboţii de
căutare nu au cunoştinţele necesare „disecării” obiectelor Flash
şi extragerii textului intern.
Uşurinţa utilizării îl face sa fie folosit în cele mai
absurde moduri (de exemplu, flash-urile - sperietoare). Pentru
aceste tipuri de Flash-uri, făcute de obicei de începători, în
limba engleză există un termen special: "flashturbation".
Tehnologie licenţiată: fiind o aplicaţie dezvoltată de o
serie de programatori (plătiţi pentru a dezvolta Flashul),
instrumentul de dezvoltare costă cel puţin 600€[necesită
citare]. Totuşi specificaţiile formatului obiectului Flash sunt
disponibile şi din acest motiv au apărut (şi încă apar) destule
instrumente care să utilizeze acest format în scopuri mai mult
sau mai puţin productive sau legale. Dintre acestea amintim:
Swift3D, Swish, ImperatorFLA, ActionScript Obfuscator.

18