Crearea Unui Site Pentru Cercul DE Matematică

UNIVERSITATEA VASILE ALECSANDRI BACĂU

FACULTATEA DE INGINERIE

CONVERSIE INFORMATICA ,3 SEMESTRE

CREAREA UNUI SITE PENTRU CERCUL DE MATEMATICĂ

LUCRARE FINALĂ-CONVERSIE PROFESIONALĂ INFORMATICĂ 3 SEMESTRE

PROFESOR COORDONATOR, STUDENT,

PROF.GHICA (BOTEZATU) NADIA

IULIE 2016

CUPRINS

1.NOȚIUNI INTRODUCTIVE

Fiind profesor de matematică, de 20 de ani am hotărât să adaug calificării mele profesionale și informatica.Pentru lucrarea finală a acestor doi ani de studiu am ales ca temă creearea unui site pentru cercul de matematică venind astfel și în sprijinul elevilor mei dar și pentru a–mi ușura o parte din muncă.

Pentru a realiza cu succces această lucrare crearea unui site pentru cercul de matematică aplicată în viața cotidiană am cules și sugestiii de la elevii actuali și de cei din generațiile trecute.Creearea unui site web pentru a fi îndeplinită cu succes trebuie să respecte o anumită ordine și claritate în execuție deoarece este un proces complex.A pune ușor în practică structura unui site web este nevoie de o imagine mentală bine conturată asupra aspectului ce dorim să-l obținem .

Deoarece în planul cadru sunt doar câte patru ore alocate matematicii pe fiecare clasa în fiecare an școlar trebuie să propun elevilor și părinților câte un opțional pentru două clase reușind să completez catedra cu cele 18 ore.În urma întocmirii de-a lungul anilor a acestor programe și planificări de opțional matematică realizate pe discilina matematică sau interdiscilinar am hotărât să realizez acest site, el fiind o prelungire a muncii realizate în clasă.

II.Web-site-ul

Chiar dacă s-ar părea că în lume există mult mai multe posibilități de informare a populației, de ce anume site-ul web? Deoarece este o metodă mult mai efectivă în comparație cu celelalte și chiar aș vrea să precizez că site-ul web este un instrument foarte util în dezvoltarea unei afaceri,în educație,aproape în toate domeniile, iar odată cu trecerea timpului, acest instrument devine tot mai greu de înlocuit. 
Primul website din istorie a fost lansat pe 20 decembrie 1990 și a fost creat de Tim Berners-Lee, un cercetator la CERN (Organizatia Europeană pentru Cercetare Nucleară) în Elveția.Proiectul a fost creat inițial pentru a le permite cercetătorilor să comunice mai ușor, însă World Wide Web (abreviat www) a fost crescut enorm de atunci fiind acum folosit de 3 miliarde de oameni. Aproape toate lucrurile pe care le facem în fiecare zi sunt influențate de internet, inclusiv interacțiunile sociale, job-ul, banking-ul, gaming-ul și altele. Unul din primele elemente fundamentale ale WWW ( World Wide Web ) este HTML ( Hypertext Markup Language ), care descrie formatul primar în care documentele sunt distribuite și văzute pe Web. Multe din trăsăturile lui, cum ar fi independența față de platformă, structurarea formatării și legăturile hipertext, fac din el un foarte bun format pentru documentele Internet și Web.. HTML a fost văzut ca o posibilitate pentru fizicienii care utilizează computere diferite și să schimbe între ei informație utilizind Internetul .Primele specificațiile de baza ale Web-ului au fost HTML, HTTP și URL.Erau prin urmare necesare câteva trăsturi : independența de platformă, posibilități hypertext și structurarea documentelor.Independența de platforma înseamnă că un document poate fi afișat în mod asemănător de computere diferite ( deci cu fonte, grafică și culori diferite ), lucru vital pentru o audiență atât de variată.

Hipertext înseamnă că orice cuvânt, frază, imagine sau alt element al documentului văzut de un utilizator ( client ) poate face referință la un alt document, ceea ce ușurează mult navigarea între multiple documente sau chiar în interiorul unui aceluiași document. Structurarea riguroasă a documentelor permite convertirea acestora dintr-un format în altul precum și interogarea unor baze de date formate din aceste documente.
SGML și HTML
Tim Berners-Lee a utilizat ca model SGML ( Standard Generalized Markup Language ), un standard internațional în plină dezvoltare. SGML avea avantajul unei structurări avansate și al independenței de platformă dar proiectarea lui a avut în vedere mai mult structura semantică a documentului decât modul de formatare. Flexibil, SGML putea fi descris ca o specificare pentru descrierea altor formate. Utilizatorii puteau crea noi formate (DTD, Document Type Definitions) care puteau fi înțelese de orice produs soft SGML pur și simplu prin citirea mai întâi a definițiilor noilor formate.
HTML este pur și simplu un DTD, deci o aplicație a SGML. În primii ani de evoluție HTML a crescut lent, în principal pentru că îi lipseau posibilitățile de a descrie publicații electronice profesionale; limbajul permitea oarece control asupra fontelor, dar nu permitea inserarea graficii. În 1933, NCSA a îmbogățit limbajul pentru a permite inserarea graficii și au construit primul navigator grafic, Mosaic. Au urmat apoi contribuții ad hoc ale diverselor firme care au adus adăugiri limbajului HTML (adaugiri și nu îmbogățiri pentru că unele taguri nu erau în conformitate cu principiile generale ale SGML) astfel încât, prin 1994 limbajul părea scăpat de sub control. Urmarea a fost că la prima conferință WWW din Geneva ( Elvetia ) s-a constituit un grup ( HTML Working Group ) a cărui primă misiune a fost formalizarea HTML într-un DTD al SGML, lucru care s-a concretizat în HTML Level 2 ( sau HTML 2.0; Nivelul 1, deci HTML 1.0, a fost proiectat de Tim Berners-Lee ). Importanța acțiunii acestui grup constă în faptul că, odată standardizat, limbajul poate fi apoi extins într-un mod mai controlat la altenivele.
Standardul oficial HTML este World Wide Web Consortium (W3C), care este afiliat la Internet Engineering Task Force (IETF). W3C a enuntat câteva versiuni ale specificației HTML, printre care și HTML 2.0, HTML 3.0,HTML 3.2, HTML 4.0 și, cel mai recent, HTML 4.01. În același timp, autorii de browsere, cum ar fi Netscape și Microsoft, au dezvoltat adesea propriile "extensii" HTML în afara procesului standard și le-au încorporat în browserele lor. In unele cazuri, cum ar fi tagul Netscape , aceste extensii au devenit standarde de facto adoptate de autorii de browsere.
HTML 2.0, elaborat în Iunie 1994, este standardul pe care ar trebui să-l suporte toate browserele curente – inclusiv cele mod text. HTML 2.0 reflecta concepția originală a HTML că un limbaj de marcare independent de obiectele existente pentru așezarea lor în pagina, în loc de a specfica exact cum ar trebui să arate acestea. Dacă doriți să fiți siguri că toți vizitatorii vor Dacă doriți să fiți siguri că toți vizitatorii vor vedea paginile așa cum trebuie, folosiți tagurile HTML 2.0.
Specificația HTML 3.0, enunțată în 1995, a încercat să dezvolte HTML 2.0 prin adăugarea unor facilități precum tabelele și un mai mare control asupra textului din jurul imaginilor. Deși unele din noutățile HTML 3.0 erau deja folosite de autorii de browsere, multe nu erau încă. In unele cazuri, taguri asemănătoare implementate de autorii de browsere au devenit mai răspândite decât tagurile "oficiale". Specificația HTML 3.0 acum a expirat, deci nu mai este un standard oficial.
În mai 1996, W3C a scos pe piață specificația HTML 3.2 , care era proiectată să reflecte și să standardizeze practicile acceptate la scară largă. Deci, HTML 3.2 include tagurile HTML 3.0 ce erau adoptate de autorii de browsere ca Netscape și Microsoft plus extensii HTML răspândite.

HTML nu este considerat un limbaj de programare, ci mai degraba este un limbaj de marcare acesta folosind etichete denumite și tag-uri. Tagurile folosite sunt de două feluri: tag-uri pereche (ex.<html></html> , <font></font>) și tag-uri singulare (care nu au tag de incheiere) (ex. <br> , <hr>).
Tag-urile de bază sunt:

<html>

</html> -între aceste tag-uri este cuprins documentul html;
<head>

</head> -între aceste tag-uri se introduc tag-urile ce vor conține titlul paginii cât și alte scripturi cum ar fi scripturi javascript sau legături către scripturi externe și către fișiere css externe;
<title>

</title> aceste tag-uri sunt poziționate între tag-urile head și vor conține titlul paginii web;
<body>

</body> -între aceste tag-uri vom introduce conținutul paginii web care va apărea în fereastra browserului. Tot ce se va introduce între aceste tag-uri va fi afișat de cătrebrowser.
Exemplu de document html simplu
<html>
<head>
<title> Prima mea pagina web

</title>
</head>
<body>
Aceasta este prima mea pagina web.
Vom invata sa facem pagini web mai complexe
</body>

Atributele asociate tag-urilor html pot fi definite ca niște proprietăți ale tag-urilor.Atributele se pun numai în tag-ul de început.
Un atribut este atributul bgcolor care se foloseste cu tag-ul <body> și indică culoarea care o va avea fundalul paginii web.
Un alt atribut folosit frecvent este color folosit îndeosebi cu tag-ul <font>; alt atribut folosit cu acest tag este atributul size care indică ce mărime va avea fontul.
Exemplu:
<font color="#0000ff" size="6">
Bine ati venit!
</font>
Pentru trasarea unei linii orizontale într-o pagina web folosim tag-ul <hr> căruia îi putem asocia următoarele atribute:
-align- pentru aliniera liniei;
-color- pentru culoarea pe care o va lua linia;
-size- pentru grosimea liniei;
-width-pentru lungimea liniei;
Exemplu:
<html>
<head>
<title>Prima pagina web</title>
</head>
<body bgcolor="#ff9900">
<font color="#0000ff" size="6">
Bine ati venit!
</font><br>
<hr color="#ff0000" width="25%" size="5%" align="left"><br>
<font color="#ffoooo">
Formatarea textului
Pentru formatarea textului vom folosi tag-ul <font> însoțit de atributele specifice (color; face; size).
Atributul color se referă la culoarea textului încadrat de tag-urile <font></font>
Atributul face se referă la tipul fontului (Arial; Helvetica; etc.)
Atributul size face referire la dimensiunea fontului și poate lua valorile 1,2,3,4,5,6,7; 1 pentru cea mai mica valoare și 7 pentru cea mai mare valoare.
Pentru a scrie cu font îngrosat vom folosi tag-urile <b></b>; pentru font înclinat vom folosi <i></i> iar pentru ca fontul să apară subliniat vom folosi tag-urile <u></u>.
Un alt tag foarte des utilizat este tag-ul <p></p>.Acest tag definește un paragraf de text. Asemănător cu acest tag mai este și tag-ul <div></div> care definește o diviziune. Acest tag este foarte folosit în crearea paginilor web fiind foarte ușor de formatat cu ajutorul css cu ajutorul lor fiind împărțită pagina în mai multe diviziuni având fiecare un anumit stil pentru fiecare în parte putând fi făcute stilizări ale fundalului ale textului. În același mod pot fi stilizate și paragrafele.
Într-o pagina web se pot insera deasemenea și imagini acest lucru fiind posibil prin folosirea tag-ului <img> urmat neapărat de atributul src care indică adresa sau calea către imaginea pe care o folosim.
Exemplu:
<img src="nume_imagine.extensie"> daca imaginea se află în același director cu pagina în care vrem să apară;
<img src="nume_folder/nume_imagine.extensie"> dacă imaginea se află în alt folder.
Cele mai folosite extensii pentru imagini sunt: .jpg; .jpeg; .gif.
Fotografiile pot fi de asemenea folosite și ca imagine de fundal a paginii web cu ajutorul atributului background al tagului <body>.
În paginile web se folosesc de asemenea tabelele. Acestea sunt definite cu ajutorul tag-urilor <table></table>. Ca orice tabel acestea sunt formate din rânduri și coloane acestea fiind definite cu ajutorul tag-urilor <tr></tr> care definesc rândurile tabelului și <td></td> care definesc celulele tabelului.
Exemplu de tabel cu trei rânduri și trei coloane:
<table>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
</table>

Tag-ul table suporta urmatoarele atribute:
-border căruia i se va da ca valoare un număr reprezentând grosimea bordurii în pixeli;
-cellspacing care va lua de asemenea ca valoare un număr reprezentand distanța între celulele tabelului
-cellpadding -spațiul față de marginea celulei
-width prin care îi vom da dimensiunea dorită tabelului
Tagurile <tr> și <td> au și ele anumite atribute printre care se numără atributul align, atributul bgcolor pentru ai da o culoare de fundal unei sau mai multor celule.
Alte tag-uri foarte importante în html sunt tag-urile care definesc listele. Listele în html sunt de două tipuri: liste ordonate delimitate de tag-urile <ol></ol> și liste neordonate delimitate de tag-urile <ul></ul>. 
Fiecare element al listei este încadrat de tag-urile <li></li>.
Atât tag-urile care definesc lista cât și tag-urile care definesc elementele listei suporta atributul type care i-a diferite valori ( disc, circle, square) în cazul listelor neordonate sau ( A, a, i) în cazul listelor ordonate.
Link-urile sau legăturile sunt definite cu ajutorul expresiei <a href=""></a> unde atributul href ia ca valoare adresa sau calea către pagina la care se face legătura. Un alt atribut pe care îl ia acest tag este atributul target care ia valorile blank, self, parent, top.

Clasificarea web site-urilor

1. static (este un site de prezentare – poate fi modificat doar de către designer (conținut static)).

2.dinamic/ interactiv (site de prezentare dinamic, realizat prin programare web. Poate fi modificat de către oricine are acces la site (cont de utilizator și parolă)):

e-commerce (comerț electronice)

e-learning (educație virtuală)

După tehnologia folosită:

e-banking (tranzacții bancare prin intermediul Internetului)

2. După calitatea beneficiarului site-ului WEB:

site-uri personale

site-uri comerciale

site-uri guvernamentale

site-uri ale organizațiilor neguvernamentale

3. După funcția site-ului:

sisteme de căutare

motoare de căutare

directoare WEB

site-uri tematice

portal-uri

site-uri corporative

site-uri comerciale

3. După funcția site-ului:

sisteme de căutare

motoare de căutare

directoare WEB

site-uri tematice

portal-uri

site-uri corporative

site-uri comerciale

Motoarele de căutare sunt compuse din trei părți componente:

1. Mașina de căutare (păianjen, omida sau robot) – programa care frecventează web-site-urile, citește și indexează total sau parțial conținutul lor. Mașina de căutare regulat, odată în lună, se întoarce la aceste site-uri și controlează indexarea paginilor.

2. Indecșii sistemului de căutare – reprezintă un stoc enorm de informații în care se păstrează toate copiile tuturor paginilor frecventate și indexate de către mașina de căutare. Aceasta pagina apare ca o nouă înregistrare, care va conține titlul și adresa paginii respective, cuvintele cheie folosite, legăturile către alte pagini , precum și porțiuni din text, care însă pot fi diferite de la un motor la altul. Dacă robotul găsește schimbări într-o pagina web, atunci indexul este actualizat cu noile informații.

3. Software-ul de căutare – Programul care selectează indecșii sistemului de căutare conform cererii utilizatorului, clasificându-i după gradul de corespundere cu criteriul dat.

Directoarele web sunt un catalog de resurse de pe Internet, fiind specializat în legături (hyperlinkuri) către alte site-uri și categorizarea acestora.

Clasificarea este de obicei structurată pe categorii, destinate să acopere toate sau o parte din interesele vizitatorilor.

Fiecare categorie conține:

subcategorii pentru aspecte mai avansate ale unui subiect dat

hyperlink-uri către site-uri, completate de o descriere

Funcțiile web site-ului

Începând 1980 www-ul și internetul se dezvoltă într-un ritm ancorat la nevoile celor care îl utilizează.Acoperirea nevoilor celor ce utilizează internetul conduce la apariția altor nevoi ce trebuie satisfăcute realizându-se un cerc vicios,

Web-ul și internetul adaptându-se la aceste nevoi ,pentru ca mai tarziu ciclul să se repete.Vorbind despre o evoluție au apărut imediat păreri pro și contra,bazate pe

cercetări psihologice și pe cercetarea în timp a evoluției acestui sistem.

Atfel s-au stabilit funcțiile de bază ale Internetului și ale Web-ului,accestea fiind:

Funcția de comunicare-datorată vitezei cu care se transmit datele,cât și costurilor reduse.Cu ajutorul internetului limitele temporale și cele spațiale se anulează, creându-se o comunitate eterogenă imensă în ionteriorul căreia comunicarea cu persoane din medii este mai mult decât imediată.Acestă funcție este îndeplinită de poșta electronică, e-mail ,prin care se pot transmite corespondență de orice natură audio, video,text ,combinate cu costuri mult mai mici decât cele tradiționale și mult mai rapid.

Funcția educativă-este o funcție nouă aplicată inițial în tările vestice și in USA,unde internetul are un rol important în educația celor care locuiesc în zone izolate,pentru ca apoi să apară platformele e-lerning.

Funcția distractivă-atragerea a cât mai mulți utilizatori pe internet presupune îmbinarea utilului cu plăcutul.În timp facilităților clasice ale internetului le-au fost adăugate și unele cu rol distractiv.Importante sunt în îndeplinirea acestei funcții grupurile de Chat, precum și jocurile de noroc din acst punct de vedere internetul este o mină de aur ce poate fi accesată și de cei ce au interzise aceste jocuri în țările lor.

Funcția de transfer,transport-internetul ofera deplasarea de fișiere cu informații de la un computer la altulîn format text,video,audio,ș.a. Ca urmare a dezvoltării comerțului electronic se pot transporta filme, soft-uripecum și muzică.

Funcția comercială-internetul este un suport pentru comerț, aplicațiile pentru licitații on line,formele diverse de matketing aflate pe internet întăresc această funcție .Comertul on line câștigă mult teren în defavoarea celui tradițional,el are reguli specifice pe care cumparatorul ți vânzătorul trebuie să le cunoască,să le învețe și să le respecte.Cei care crează sau sunt proprietari de pagini web și promovează acest tip de comerț sunt responsabili în asigurarea unui comerț electronic bun ,deoarece mesajul trebuie făcut în așa fel să fie înțeles bine și atmosfera creată să fie una de încredere. Trei aspecte importante caracterizează comportamentul cumpărătorului: decizia de a cumpăra, realizarea plății și transferul asupra produsul achiziționata dreptului de proprietate.tranzacția poate fi întrerupă de tot de contravine desfășurării în siguanță a celor trei acțiuni.din multitudinea de oferte cumpărătorul va alege doar una ,pe cea care transmite mai multă încredere și are un raport calitate –preț foarte avantajos.Singurul lucru care ar putea periclita o tranzacție on line este încrederea, din acest motiv elementele ce privesc tranzacția e necesar să fie simple și sigure.Siguranța ar fi unul din motivele principale pentru care comerțul electronic nu s-a dezvoltat la același standard cu internetul.Vânzătoul on line nu are aceleași priorități ca cel tradițional, clientul, individul și satisfacerea cerințelor.Numărul de accesări ,un trafic mare înseamnă creșterea veniturilor.Număr mare de accesări egal clienți egal venituri sporite.Clienții sunt tratați și primiți pe site cu mesaje identice fară a se face diferențieri.Eforturile sunt îndreptate spre a identifica segmentul de clienți interesați,spre promovarea și popularizarea mărcilor și crearea unui design atrăgător și adecvat.În urma studiilor de specialitate efectuate s+a constatat că fraudele efectuate la tranzacțiile on line afectează în aceeași măsură atât cumparătorii cât și vânzătorii, la acestea adăugându-se și cheltuieli cu comisioane , taxe bancare,costuri de audit și returnări de fonduri.Fraudele

îndreptate asupra cărților de credit au generat dezvoltarea unei noi industrii a cardurilor inteligente 3 precum și a protofelelor electronice. Ultimele sunt softuri care înmagazinează și direcționează informații personale utile încheierii tranzacțiilor online.Acțiunile hackerilor care dau neîncrederea celor ce cumpărăa dus la apariția semnăturii electronice.Ea este o succesiune de biți care identifică în mod unic un utilizator și este absolut necesară încheierii tranzacției.Din partea celor ce furnizează semnăturile elctronice ,clienții vir primi două cheii .Una este cea la care are acces doar clientul și cea de+a doua este una publică la care are acces orice utilizator de internet în principiu.Destinatarul este singurul care poate citi un document criptat și semnat cu cheia privată,cu condiția să o dețină.Datorită semnăturii electonice ,tranzacțiile financiare online se desfășoară în condiții mai sigure de securitate.

2.2.Structura elementară a unei pagini web

Contrar cu ceea ce s–ar putea crede, cea mai mare parte dintre paginile web sunt în realitate doar simple fișiere de text. Browserul este cel care citețte textul, caută în el etichete HTML și apoi afișează corespunzător pagina. De exemplu, putem preciza printr–o etichetă HTML că dorim ca un anumit cuvânt să apară cu caractere aldine. Atunci când browserul ajunge la partea respectivă a documentului, el formatează cuvântul cu caractere aldine.

1. Etapele creării unei pagini HTML

P1. Se crează un nou fișier de text: deschidem editorul de text (Notepad, Wordpad sau Word) și eventual apelăm meniul File – New. De asemenea, putem deschide un fișier deja existent (File – Open).

P2. Introducem în fișier textul și etichetele HTML necesare.

OBSERVAȚIE. Nu se folosesc comenzile programului pentru formatare (ex: utilizarea caracterelor italice sau centrarea paragrafelor), deoarece browserul nu va ține cont de ele – pentru el nu contează decât etichetele HTML.

P3. Salvăm fișierul ca pagina web. De exemplu, pentru Notepad:

•  apelăm meniul File – Save/Save As.

•  în caseta Save in, alegem locul unde trebuie salvată pagina web.

•  introducem numele fișierului care trebuie salvat, terminat cu extensia .htm sau .html

•  în caseta Save as type, specificăm tipul fișierului ca fiind All files (*.*). Acest lucru determină Notepad să folosească extensia .htm sau .html (și nu extensia normală, .txt).

•  apăsăm butonul Save.

OBSERVAȚII:

•  Nu se salvează fișierul în formatul nativ al procesorului de texte (ex: .txt, .doc, etc.), ci doar .htm sau .html. Dacă nu facem acest lucru, nu apare în browser pagina dorită, ci doar textul împreună cu etichetele HTML introduse.

•  Se folosesc numai nume de fișier cu litere mici – în caz contrar, serverul web poate să nu identifice corect pagina. De exemplu, majoritatea serverelor web (calculatoare care stochează pagini web) cred ca index.html și INDEX.HTML sunt fișiere diferite.

•  Nu se folosesc spații: Deși browserul Internet Explorer interpretează corect spațiile din numele fișierelor, alte browsere nu fac acest lucru (ex: Netscape). Dacă trebuie separate cuvintele din numele fișierelor și directoarelor, folosim un underscore (_) sau un minus (-).

P4 . Încărcăm pagina în browser, pentru a vedea cum arată dacă o publicăm pe Internet. Pentru aceasta, facem dublu clic pe fișierul HTML sau deschidem browserul și apelăm meniul File – Open (cazul browserului IE). Pentru reîncărcarea paginii, apelăm meniul View – Refresh sau tastăm F5 (ca ultimă soluție: închidem și repornim browserul).

P5 . Repetăm pașii 2 – 3 (și eventual 4) de câte ori este necesar.

2. 2. Etichete HTML

Etichetele HTML, numite și tag – uri (tags) sau marcatori , instruiesc browserul să afișeze elementele din pagină așa cum este necesar. De exemplu, dacă dorim ca un cuvânt din pagina să apară cu scris îngroșat, atunci încadrăm cuvântul respectiv în etichetele corespunzătoare pentru textul cu caractere aldine.

Etichetele HTML au, în general, forma următoare:

<ETICHETA>Textul care va fi afectat de eticheta</ETICHETA>

Partea ETICHETA este un cod care specifică tipul de efect pe care îl dorim. Codul apare întotdeauna înconjurat cu paranteze unghiulare < > ; parantezele spun browserului web că începe sau se termină o porțiune HTML și nu un text oarecare.

De exemplu, eticheta pentru text aldin este < B>. Dacă dorim ca textul „ Bine ați venit ” să apară îngrosat, introducem în document:

<B>Bine ați venit</B>

Primul <B> spune browserului că începe un text care trebuie afișat cu litere aldine, iar </B> comunică terminarea acestui text. – bara oblică (/) definind eticheta în care apare ca eticheta de final (endtag).

2. 3. Elementele de baza ale paginii

Fișierele HTML încep întotdeauna cu eticheta <HTML>. Această etichetă spune browserului că fisierul este o pagina web. Ultima linie din document este eticheta de final corespunzătoare: </HTML>.

Următoarele elemente servesc la împartirea paginii în doua secțiuni: antetul si corpul paginii. Secțiunea antet este asemenea unei introduceri pentru pagina. Browserele web folosesc antetul pentru a prezenta diferite tipuri de informații despre pagina. În antet pot aparea o serie de elemente, dintre care cel mai întâlnit este titlul paginii.

Pentru a defini antetul, se adaugă o etichetă <HEAD> și o etichetă </HEAD> imediat sub/după eticheta <HTML>. Așadar, pagina va arată deocamdată astfel:

<HTML> <HEAD> </HEAD> </HTML>

@ Nu conteaza daca scriem numele etichetelor cu litere mari sau cu litere mici – cu toate că ultimul standard HTML sugerează că toate etichetele HTML să fie scrise folosind litere mici.

Corpul paginii este locul unde introducem textul și alte elemente afișate de browser. Definirea corpului paginii se face cu etichetele: <BODY> – înainte și </BODY> – dupa secțiunea antet (după eticheta </HEAD>), astfel:

<HTML> <HEAD> </HEAD> <BODY> </BODY> </HTML>

Adăugarea unui titlu

Titlul paginii apare în bara de titlu a ferestrei browserului. Pentru a defini un titlu, folosim etichetele <TITLE> și </TITLE>. De exemplu, dacă titlul paginii este „Pagina Colegiului Economic”, introducem:

<TITLE> Pagina Colegiului Economic </TITLE>

REGULI PENTRU TITLU:

•  titlul trebuie să descrie conținutul paginii (să nu fie gen „pagina nr. 34”),

•  să nu fie prea lung, pentru că altfel nu apare complet în bara de titlu a browserului.

•  să aibă sens dacă este văzut în afara contextului (ex: dacă apare în lista paginilor favorite ale unui browser)

Introducerea textului

Textul obișnuit se introduce între etichetele <BODY> și </BODY>, astfel:

<HTML>
<HEAD>
<TITLE> Pagina Colegiului Economic </TITLE>
</HEAD>
<BODY>
Acest text apare în corpul paginii
</BODY>
</HTML>

@ OBSERVATIE: Nu se folosesc spații, tabulatori, sfârșituri de rând (obținute cu tasta ENTER) și alte elemente de formatare (culori, aliniere, etc.) folosind comenzile editorului de text – toate acestea vor fi ignorate de către browser . De asemenea, parantezele unghiulare < și > nu pot fi afișate direct în paginile HTML, deoarece browserul le foloseste pentru identificarea etichetelor.

Realizarea paragrafelor

Pentru a afișa un anumit text într – un nou paragraf, îl încadrăm între etichetele <P> și </P>. Exemplu:

<HTML> <HEAD> <TITLE>Pagina Colegiului Economic</TITLE>
</HEAD>
<BODY>
Acest text apare în corpul paginii.
Aceasta nu este a doua linie: textul apare în continuare.
<P>
Aceasta este a doua linie.
</P>
</BODY>
</HTML>