Sunteți pe pagina 1din 20

LICEUL TEHNOLOGIC „ION NISTOR, VICOVU DE SUS

Denumire proiect
Mai 2017

Autor,
Burlă David

Îndrumă tor,
prof. Galan Petrică

Examenul de atestare a competențelor profesionale a absolvenților claselor de matematică-


informatică si matematică-informatică, intensiv informatică
Motivarea alegerii temei „ Istoria
Românilor”

„UN POPOR CARE NU-ȘI CUNOAȘTE ISTORIA ESTE CA UN COPIL


CARE NU-ȘI CUNOAȘTE PĂRINȚII” - Nicolae Iorga

Motivat de această afirmație a cunoscutului istoric și om politic, Nicolae


Iorga, care subliniază importanța istoriei și a cunoașterii ei de către un oarecare
cetățean, voi dezvolta în câteva rânduri motivul alegerii de a arăta aspectele și
adevărurile pe care le tratează istoricii în lucrările lor despre „Istoria
Românilor”.
Un prim motiv care a stat la baza alegerii aceste teme este de a arăta prin
ce anume rolul și ajutorul istoriei se exercită în formarea conștiinței naționale a
poporului român. Rolul istoriei este de a ne ajuta să învățăm din cine ne tragem,
cum au trăit strămoșii noștri, cu cine au avut războaie, cum s-a format poporul
român, cum s-au unit toate cele trei țări: Moldova, Țara Românească și
Transilvania, etc.
Un al doilea motiv este aspectul utilității unui material și în dreptul altor
persoane, acesta trebuind să satisfacă nevoile a câtor mai mulți indivizi
interesați de subiectul pe care obiectul creat îl tratează. Deaceea, ca cetațean
român am ales să abordez tema istoriei naționale, aceasta fiind un punct forte în
topul căutărilor realizate de elevii care susțin examenul de bacalaureat la istorie,
și nu numai. Dorind ca materialul să fie cât mai folositor în domeniul didactic
am introdus, pe lângă materia prezentată, și un ghid de pregătire pe bacalaureat,
aceste oferind sfaturi utile atât pentru perioada de dinainte de bacalaureat cât si
în timpul examenului.
Referitor la motivele de mai sus, am încercat să dezvolt cât mai amplu
această temă folosindu-mă de obiectele actuale și de cunoștințele acumulate pe
parcursul anilor de studiu: cărți, calculator, tutoriale, limbaj de programare, etc.
Descrierea tehnologiilor utilizate
HTML
Ce este HTML?

HTML este un limbaj de marcare pentru crearea de pagini web.

Descriere

Este folosit pentru a crea pagini web, majoritatea paginilor web din întreaga
lume fiind realizate cu HTML.

<! DOCTYPE html>


<Html lang = "en">
<Head>
<Title> Pagina web Exemplu </ title>
</ Head>
<Body>
<P> Aici este un paragraf </ p>
</ Body>

Istorie

HyperText Markup Language (HTML) este limbajul de publicare a World Wide


Web. Prima versiune a HTML a fost descrisă de către Tim Berners-Lee la
sfârșitul anului 1991. În primii cinci ani (1990-1995), HTML a trecut printr-o
serie de revizuiri și a cunoscut o serie de extensii, în primul rând a găzduit mai
întâi la CERN, și apoi la IETF.

Odată cu crearea W3C, dezvoltarea HTML a schimbat din nou locul de


desfășurare. O primă încercare eșuată de a extinde HTML in 1995, cunoscut sub
numele HTML 3.0 făcut apoi drumul spre o abordare mai pragmatică, cunoscut
sub numele HTML 3.2, care a fost finalizat în 1997. HTML4 a urmat, ajungând
la finalizare în 1998.
Versiune publicat ani

HTML + 1993

HTML2.0 1995

HTML3.2 1997

HTML4.01 1999

Elemente

HTML utilizează etichete de marcare pentru a crea pagini Web. Întregul


conținut de pe pagina web se înțelege prin tag-uri. De exemplu, „Aici este un
paragraf“, „Aceasta este o imagine“ și așa mai departe.

Sintaxa elementelor
HTML utilizează tag - uri pentru sintaxa. O etichetă este compusă din caractere
speciale: < , > și / . Acestea sunt interpretate de software -uri pentru a compune
un element HTML.

Elementele HTML vin de obicei în perechi de tag-uri.

Un element poate avea atribute pentru a rafina sensul său.


Aceste atribute sunt specificate pe eticheta de start. Ele constau dintr-un nume și
o valoare, separate printr-un „=“ caracter. Precum:

<Atribut tagname = "valoare"> </ tagname>

In HTML, valoarea atributului poate rămâne necitate în cazul în care nu conține


spații sau oricare dintre următoarele caractere: " '` = <sau>, în caz contrar,
acesta trebuie să fie citat folosind ghilimele simple sau duble. Valoarea
împreună cu.. semnul „=“ caracterul, poate fi omis cu totul, dacă valoarea este
gol șirul. După ce lucrați într-o echipă pe care s-ar putea dori să aleagă un mod
comun de autor cod.

Documentul HTML

Următorul exemplu este un document HTML simplu:

<! DOCTYPE html>


<Html lang = "en">
<Head>

Document metadate

</ Head>
<Body>

conţinutul documentului

</ Body>
</ Html>

Descriere
-
doctype
Referinta trebuie să fie specificate, și să fie de top în documentul HTML. Adică,
există DOCTYPE înainte de tag - ul de start <HTML>. Declarația DOCTYPE
este <! DOCTYPE html> si este insensibilă la majuscule , în sintaxa HTML.
-elementul HTML <html> ... </ html>

 Reprezintă rădăcina unui document HTML. El ar trebui să aibă


întotdeauna un atribut lang. Atributul lang Specifică limba principală
pentru conținutul elementului. De exemplu, „en“ înseamnă „engleză“,
„fr“ înseamnă „franceză“.
 Există instrumente disponibile , care oferă ajutor suplimentar în timp ce
căutarea tag - ul langage, cum ar fi instrument de limbă.
 conține un cap element de urmat de un corp de element.

-elementul de cap <Head> ... </ head>

 Reprezintă o colecție de metadate pentru document. El conține titlul și


informații cu privire la foi de stil și script-uri.
 Conținutul în tag-ul capului nu sunt afișate pe un browser Web.

-elementul de corp <Body> ... </ body>

 Elementul de corp reprezintă conținutul principal al documentului.


 Conține un marcaj cu conținut vizibil .

Metadate
 Exemplul următor reprezintă metadatele documentului:

<Head>
<Meta charset = "utf-8">
<Title> Despre W3C | World Wide Web Consortium (W3C) </ title>
<Meta name = "description"
content = "World Wide Web Consortium (W3C) este o comunitate
internațională
în cazul în care organizațiile membre, un personal cu normă
întreagă,
și lucrările publice împreună pentru a dezvolta standarde Web.
">
<Meta name = "keywords" content = "W3C, HTML, HTML5, XHTML,
CSS, CSS3, SVG, MathML, WCAG ">
</ Head>
-seturi caractere <meta charset=” ”>

 Codificarea caracterelor utilizate de document este specificat de atributul


charset pentru elementul meta.

-Titlu <title>.

 Titlul este utilizat într-un bar din titlu de browsere web, istoricul
utilizatorului, semne de carte, sau în rezultatele căutării.
 Ar trebui să folosiți titluri care să identifice documentele lor chiar și
atunci când acestea sunt utilizate în afara contextului.
-Descrierea paginii web
 Descrierea paginii web este specificat de <meta name = "description">.
-cuvinte cheie pagina Web
 cuvintele cheie ale paginii web sunt specificate de <meta name =
„cuvinte cheie“>.
-conţinutul de bază
 Următorul exemplu este un conținut de bază.

<Body>
<H1> DESPRE W3C </ h1>
<P> World Wide Web Consortium (W3C) este o comunitate internațională
în care organizațiile membre,
un personal cu normă întreagă, iar lucrările publice împreună
pentru a dezvolta standarde Web. </ p>
<Hr>
<H2> Întrebări despre W3C sau pe Web? </ H2>
<P> Vă rugăm să consultați Ajutor și FAQ pentru răspunsuri la
întrebări precum: </ p>
<Ul>
<Li> Ce face W3C? </ Li>
<Li> Cum este finanțată W3C? </ Li>
<Li> Este W3C mi trimite mesaje spam? </ Li>
</ Ul>
<ol type="lower-alpha">
<Li> sample1 </ li>
<Li> sample2 </ li>
<Li> sample3 </ li>
</Ol>
<Dl>
<Dt> termen1 </ dt>
<Dd> definiție1 </ dd>
<Dt> term2 </ dt>
<Dd> definiția2 </ dd>
</Dl>
</ Body>

Titluri
 titlurile sunt specificate de <h1>, <h2>, <h3> <h4> <h5> și <h6> .
 <h1> se spune că are cel mai înalt rang, <h6> are cel mai mic rang și
două elemente cu același nume au rang egal.

Paragrafe
 sunt specificate de <p> .

Linia
 liniile orizontale sunt specificate de <hr> .
 Elementul hr poate omite elementul de capăt. Acest lucru se datorează
faptului că este un element gol.

Liste
1. lista neordonată
 este specificată de <ul> și <li> .
 elementele listei sunt elementul li nodurile copil ale elementului ul. 
2. lista ordonată
 este specificată de <ol> și <li> .
 elementele listei sunt elementul li nodurile copil ale elementului ol.
 Atributul type specifică tipul de marker pentru a utiliza în listă.
3. listă de definiții
 Lista Definiție este specificată de <dl> , <dt> și <dd> .

Hiperlink-uri
 World Wide Web are abilitatea de a defini link-uri de la o pagină la alta,
și să urmeze link-uri la un clic pe un buton. Acest lucru este Hyperlink.
 Hiper sunt specificate de <a> . 
 Documentul legat este reprezentat de atributul href .
 fereastra unde se deschide documentul link-ului specificat este dată prin
target=” “

<a href=" http://www.csail.mit.edu/ "target="_blank"> MIT </a>

 _blank: Deschideți fereastra nouă.


 _self: Deschideți cel curent.
 _parent: Deschideți contextul de navigare părinte al celui curent.
 _top: Deschideți cel mai context de navigare de nivel superior celui
actual.

Imagini / text alternativ

<Body>
<H1> <img src = "images / logo.png" alt = "W3C" width = "90" height =
"53"> </ h1>
</ Body>

1. Imaginile
 sunt specificate de <img> .
 Elementul img poate omite elementul de capăt. Acest lucru se datorează
faptului că este un element gol.
 Imaginea dată de atributul src este conținutul încorporat. SRC
reprezintă sursa .
2. Text alternativ
 Puteți specifica un text alternativ pentru o imagine prin alt=” ”

Foi de stil
 Style Sheets poate formata documentul HTML. Documentele HTML pot
conține reguli de foi de stil direct în ele sau ele pot importa foi de
stil. Există trei moduri de a furniza informații de styling pentru browsere
Web.
 Adăugarea de stil la HTML
 Legarea foaie de stil
o Puteți separa foile de stil din documente HTML. Fișierele foaie
de stil sunt importate în documentele HTML prin <link> .
o Acest lucru oferă mai multe avantaje:
 Autorii și administratorii de site-ul Web pot partaja foi de
stil într-o serie de documente (și site-uri).
 Autorii pot schimba foaia de stil, fără a necesita modificări
ale documentului.
 Agentii utilizatori pot încărca foi de stil selectiv (bazate pe
descrierile media).

<head>
<link rel = tipul "stylesheet" = "text / css" href = "example.css">
</ Head>

foaie de stil intern


 Puteți pune reguli de foi de stil în capul documentului de <style> .

<head>
<style>
p {color: red; font-size: 120%; }
</ Style>
</ Head>
<Body>
<P> Acesta este un paragraf </ p>
</ Body>

foaie de stil inline


 Etichetele de start pot conține reguli de foi de stil direct în documentele
HTML prin atributul style .

<p style = "color: red; font-size: 120%;" > Acesta este un paragraf </
p>
CSS
Ce este CSS?

 CSS este un limbaj foaie de stil.

Descriere

 CSS vine de la Cascading Style Sheet. CSS poate formata conținutul


documentului (scris în HTML sau alt limbaj de marcare): schemă,
culoare, fonturi, etc.
 CSS este destinat în primul rând pentru a permite separarea conținutului
documentului și formatul documentului. Ca urmare, putem îmbunătăți
accesibilitatea conținutului, se poate formata în mod similar, două sau
mai multe documente.

Sintaxa

 Această sintaxă are două părți, selectorul și declarația.

selector : Specifică obiectivul de styling. 


declaration : Specifică proprietatea și valoarea.

 Declarația este cuprinsă între „{“ ... „}“.


 Declarația se încheie cu punct și virgulă.

Selectori
 specifică ținta de stil. 
 poat varia de la nume de elemente simple la reprezentări contextuale
bogate.
1. selector de tip
 Un selector de tip este numele de cod HTML Tag.

p {
culoarea rosie;
font-size: 12px;
culoare de fundal: verde;
}

2. selector de clasă
 este utilizat pentru unul sau mai multe elemente. Este descris valoarea
atributului clasa documentului HTML cu „(perioadă)“.

<p class = "red" > Acesta este un paragraf </ p>


<p class = "blue" > Acesta este un paragraf </ p>
<p class = "red" > Acesta este un paragraf </ p>
<p class = "blue" > Acesta este un paragraf </ p>

p {
font-size: 12px;
}
.red {
culoarea rosie;
}
.blue {
Culoare: albastru;
}

3. selector ID
 este utilizat pentru elementul unic. Este descris valoarea atributului ID-ul
documentului HTML cu „#“.

<P class = "red"> Acesta este un paragraf </ p>


<P class = "blue"> Acesta este un paragraf </ p>
<p class = "red" id = "small" > Acesta este un paragraf </ p>
p {
font-size: 12px;
}
.roșu{
culoarea rosie;
}
.albastru{
Culoare: albastru;
}
#small {
font-size: 9px;
}
Prezentarea proiectului

În debutul proiectului, acesta fiind acesat prin pagina de pornire(pagina


pornire.html) special creeată pentru a facilita folosirea lui, se gasesc câteva
definiții care răspund la unele întrebări referitoare la istorie și aspectele generale
ale acesteia. Aceste definiții sunt accesate în mod automat din pagina
„home.html” care apare în pagina de pornire încadrată în frame-ul, care permite
în aceeași măsura afișarea tuturor informațiior vizibile și cuprinse de proiect.

În antetul paginii se află un meniu prin care ne este permis și cu ajutorul


căruia accesăm informațiile într-un mod ușor. Acest meniu este creeat astfel
încat în momentul în care cursorul mouse-ului se află pe una dintre ramurile
meniului, respectiva ramură își modifică font-ul. Mai mult, atunci când mouse-
ul este pe fila „Cuprins” din aceasta derulază un al doilea meniu subordonat
acestuia.
Majoritatea font-urilor și a opțiunilor de acces sunt sunt editate prin intermediul
css-ului(cascading style sheet), acest aspect oferind un aspec simplu care
facilitează înțelegerea sursei. Spre acest fisier, din fiecare fisier care gazduiește
informații ințelese de către utilizatorul proiectului se îndreaptă un „link” care
preia font-urile din fișierul css.
Proiectul conține 5 ramuri, aceste fiind prezentate în urmatoarele rânduri.

HOME:

-oferă acces la pagina de pornire;

-conține:

 titlul proiectului;
 citatul de referință;
 întrebarile: „Ce este istoria”, „Ce ne oferă istoria” și „Cu ce ne ajută
istoria” și răspunsurile acestora.
CITATE:

-conține citate despre istorie și numele celor care le-au zis.

MATERIALE AUXILIARE:

-conține prezentarea a 3 cărți care ajută la detailarea informațiilor despre tema


proiectului.

GHID PENTRU BAC:

-conține sfaturi pentru pregătirea și susținerea examenului de bacalaureat

-este structurată pe doua părți:

 pregătirea înainte de examen;


 atitudinea în timpul examenului.
CUPRINS:

-conține materia structurată pe capitole;

-printr-un click efectuat asupra unui capitol avem acces la informațiile


respective;

-poate fi accesat prin două modalități;


Cuprins
Motivarea alegerii temei „ Istoria Românilor”.......................................................................................1
Descrierea tehnologiilor utilizate...........................................................................................................3
HTML.................................................................................................................................................3
Ce este HTML?...............................................................................................................................3
Descriere........................................................................................................................................3
Istorie.............................................................................................................................................3
Elemente.......................................................................................................................................4
Documentul HTML.........................................................................................................................5
CSS...................................................................................................................................................11
Ce este CSS?.................................................................................................................................11
Descriere......................................................................................................................................11
Sintaxa.........................................................................................................................................11
Prezentarea proiectului.......................................................................................................................14
HOME:.........................................................................................................................................16
CITATE:.........................................................................................................................................17
MATERIALE AUXILIARE:...............................................................................................................17
GHID PENTRU BAC:......................................................................................................................17
CUPRINS:......................................................................................................................................18

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