LICEUL TEORETIC DUNAREA GALATI

PROIECT DE LECTIE

DATA: 23 mai 2012 CLASA: a IX-a C (profil matematica-informatica) DISCIPLINA: Tehnologia Informaiei si a Comunicatiilor UNITATEA DE INVATARE: Html - limbaj pentru pagini web SUBIECTUL LECTIEI: Adugarea imaginilor. Crearea legaturilor n HTML DURATA LECTIEI: 50 minute TIPUL LECTIEI: formare de priceperi si deprinderi LOCUL DE DESFASURARE: laboratorul de informatica STUDENT SUSTINATOR: Diaconu Mihaela

COMPETENTE GENERALE : Cunoasterea si intelegerea conceptelor, terminologiei si a procedurilor specifice informaticii Dezvoltarea capacitatilor de explorare/investigare si rezolvare de probleme Dezvoltarea capacitatii de a comunica, utilizand limbajul informatic Dezvoltarea interesului si a motivatiei pentru studiul si aplicarea informaticii in contexte variate COMPETENTE SPECIFICE : Ordonarea cunostintelor dobandite Descrierea coerenta a etapelor de rezolvare ale unei probleme OBIECTIVE OPERATIONALE : La sfarsitul orei, elevii sunt capabili: O1 - Sa utilizeze etichetele de HTML pentru crearea de liste si tabele O2 - Sa demonstreze cunoasterea atributelor si legatura acestora cu etichetele O3 - Sa demonstreze cunoasterea metodelor de formatare a tabelelor i listelor STRATEGII DIDACTICE : 1. Resurse procedurale: metode si procedee: explicatia, conversatia, lucrul cu fise forme de organizare: frontal i individual 2. Resurse materiale: calculator, fi de lucru STRATEGII DIDACTICE: Principii didactice: principiul participrii i nvrii active; principiul asigurrii progresului gradat al performanei; principiul conexiunii inverse; Metode de nvmnt: metode de comunicare oral: expunere, conversaie, problematizarea, studiu de caz, munca independent ;

metode de aciune(activ-participative): problematizarea, exerciiul, nvare prin descoperire;

ETAPELE LECIEI I. Moment organizatoric(2 min) II. Pregtirea leciei noi (5 min) III. Comunicarea cunotinelor (15 min) IV. Formarea de priceperi i deprinderi(25 min) V. Secvena final(tema pentru acas-notarea elevilor- 3 min)

Desfurarea leciei: Activitatea Profesorilor I. Moment organizatoric Verificareaprezentei elevilor; Verificarea starii retelei de calculatoare II. Pregatirea lec iei noi Ce este HTML? Activitatea Elevilor Raporteaza absentii si motivele absentarii Raporteaza eventualele defectiuni tehnice

HTML este prescurtarea de la Hypertext Markup Language, ceea ce reprezinta limbajul pe care browserele de internet il inteleg si cu ajutorul lui pot fi afisate paginile web. Care sunt instrumentele necesare pentru crearea Pentru a realize un site in HTML avem nevoie unui site web in HTML? de:un editor de text (ex: Notepad) si un browser de internet (ex: Microsoft Internet Explorer) III. Comunicarea cuno tin elor: Se anun titlul noii leciei: 1. Crearea listelor -Liste neordonate: folosim tag-urile <UL> si </UL>. Fiecare element al listei trebuie introdus de tag-ul <LI>. Cu ajutorul atributului TYPE, putem schimba cercul plin din fata fiecarui element. Prin atribuirea unei valori atributului TYPE, vom putea face ca elementele listei sa fie precedate de un patrat <UL TYPE=square> sau de un cerc gol <UL TYPE=circle>. -Liste ordonate: se formeaza cu ajutorul tagurilor <OL> si </OL>. Atributul TYPE are o valoare implicita numere. In loc de numere putem folosi: litere mari <OL TYPE=A>, litere mici <OL TYPE=a>, cifre romane mici <OL TYPE=i>, cifre romane mari <OL TYPE=I>. -Liste de definiii: Pentru a forma liste de definitii trebuie sa folosesti tag-urile <DL> si </DL>. Fiecare element al unei liste de definitii va trebui introdus de tag-ul <DT> (Definition Term), iar apoi fiecare definitie va fi precedata de tag-ul <DD> (Definition Definition). 2. Crearea tabelelor Pentru a crea un tabel, trebuie sa folosim tagurile <TABLE> si </TABLE>. Tot ce va fi scris Noteaza pe caiete Asculta profesorul

Activitatea Profesorilor intre aceste tag-uri va forma un tabel. Dupa tagul <TABLE> urmeaza tag-ul <TR> care vine de la "Table Row" (randul tabelului) si reprezinta introducerea unui rand in cadrul tabelului. Tot ce va fi scris intre tag-urile <TR> si </TR> va forma un rand al tabelului. Dupa crearea unui rand, trebuie sa adaugam in cadrul acestuia cateva celule, cu ajutorul tag-urilor <TD> si </TD>. Pentru ca liniile unui tabel sa fie vizibile tag-ul <TABLE> trebuie sa fie insosit de atributul BORDER avand valoarea egala cu cel putin 1. In plus, poti schimba culoarea liniilor unui tabel folosind atributul BORDERCOLOR insotit de codul culorii dorite. Pentru a avea decat o singura linie vom folosi atributul CELLSPACING cu valoarea "0". Acest atribut specifica distanta dintre celulele unui tabel. Alaturi de acest atribut putem folosi si atributul CELLPADDING care indica distanta dintre marginile celulelor si textul din cadrul acestora. Pentru a stabili dimensiunea unui tabel, unui rand sau a unei celule, folosim atributele WIDTH pentru latime si HEIGHT pentru inaltime. Pentru alinierea datelor din cadrul tabelului folosim atributul ALIGN cu una dintre valorile "left", "center" sau "right". Pentru a alinia datele tabelului pe verticala folosim atributul VALIGN insotit de una dintre valorile "top", "middle" sau "bottom". Pentru a schimba culoarea unei celule, unui rand sau chiar a intregului tabel folosim atributul BGCOLOR impreuna cu codul culorii alese. De asemenea mai sunt doua atribute foarte importante ale tag-ului <TD>: COLSPAN (numarul de coloane pe care se intinde celula) si ROWSPAN (numarul de linii pe care se intinde celula). IV. Formarea de priceperi si deprinderi Se propun spre realizare exerciiile din fisa de lucru: 1. Scriei codul pentru a realiza o pagin web care s arate astfel:

Activitatea Elevilor

1. <html> <head> <title> Liste</title> </head> <ul><b>Legume, fructe si citrice</b> <li> Legume <ol type=a> <li>salata; <li>ridichi;

Activitatea Profesorilor

Adaugai o culoare de fundal paginii. Salvai pagina cu denumirea liste.html. 2. Tastai codul urmtor. Urmarii rezultatele obinute. Dup modelul de mai jos, creai o pagin web cu orarul vostru.
<html><title>ORAR partial</title> <body> <table border="5"> <caption>ORAR-ul clasei IX F</caption> <tr> <th width=100>Luni</th> <th width=100>Marti</th> <th width=100>Miercuri</th> <th width=100>Joi</th> <th width=100>Vineri</th> </tr> <tr> <td bgcolor=yellow height=100 align=center><font color=blue><B>Informatica</B></td> <td align=center>Romana</td> <td bgcolor=green align=center>Matematica</td> <td align=center><font color=red size=20pt><b><i>Fizica</i></b></td> <td align=right><font face="Monotype Corsiva" size=3pt color=magenta>Geografie</td> </tr> </table></html>

Activitatea Elevilor <li> sfecla rosie; <li> pastarnac; <li>morcov. </ol> <li><dl><dt>Fructe <dd> Sunt alimentele cele mai sanatoase.</dl> <li> Citrice <ol> <li> portocale; <li> mandarine; <li>lamai. </ol> </ul> </html> 2.Elevii tasteaz codul i urmresc rezultatele obinute.

V. Secven a final Se anunta tema pentru acasa ca fiind continuarea exerciiului nr.2 din fisa de lucru.

Noteaza tema pe caiete