Sveučilište Jurja Dobrile u Puli Odjel za odgojne i obrazovne znanosti Akademska 2012./2013. godina Mentorica: Doc.dr.sc. Maja Ružić-Baf Asistent: Mladen Bočev, mag.edu.inf. Priprema za izvođenje nastavnog sata informatike Uvod u programski jezik HTML Ana Jovanović
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Sveučilište Jurja Dobrile u PuliOdjel za odgojne i obrazovne znanostiAkademska 2012./2013. godinaMentorica: Doc.dr.sc. Maja Ružić-BafAsistent: Mladen Bočev, mag.edu.inf.
Priprema za izvođenje nastavnog sata informatike
Uvod u programski jezik HTML
Ana Jovanović
Pula, 13.05.2013.
Škola: OŠ „Tone Peruška“
Razredni odjel: 7.c
Nastavni predmet: Informatika
Nastavna cjelina: Izrada web stranica
Nastavna tema: Izrada web stranica korištenjem programskog jezika HTML
Nastavna jedinica: Uvod u programski jezik HTML
Tip nastavnog sata: Obrada novog sadržajaVrijeme izvođenja: 15. svibanj 2013., 2. sat (45 minuta)
Cilj (svrha) sata: Upoznati učenike s pojmom i osnovnim elementima programskog jezika HTML, pravilima pisanja i spremanja te uređivanja HTML koda.
Obrazovna, funkcionalna i odgojna postignuća:
Obrazovna:
učenici će znati pogledati izvorni kod stranice na web stranici poznavanje pravila pisanja HTML-a prepoznati identifikatore, osnovne elemente koje svaka stranica mora sadržavati
(<html>, <head>, <title> i <body>)
Funkcionalna:
razvijati smisao za logičko zaključivanje, poticati učenike na raščlanjivanje problema razvijati sposobnost promatranja i uočavanja
Odgojna:
razvijanje samostalnosti u radu izgrađivanje individualnog interesa i motivacije razvijanje upornosti, odgovornosti, sustavnosti, marljivosti i točnosti u rješavanju
zadataka
Nastavna načela:
načelo postupnosti (gradivo se izlaže od jednostavnijeg ka složenijem, na kraju sata se ponavljaju ključni pojmovi)
načelo primjerenosti (primjeri i zadaci su odabrani u skladu s dobi i predznanjem učenika, u izlaganju se navodi suodnos s ostalim predmetima)
načelo zornosti (primjerima se predočuju pojmovi koji se obrađuju tijekom demonstracije)
načelo individualizacije (tijekom praktičnog rada se prati situacija u razredu te se tempo rada prilagođava prosječnom napretku učenika, kroz individualnu pomoć
2
učenicima se održava usmjerenost i zainteresiranost)Nastavne metode: metoda usmenog izlaganja, metoda razgovora, metoda pisanja,
demonstracija na računalu.
Nastavna sredstva: Osobna računala, projektor, prezentacija, zadaci za vježbu, ploča, kreda
Oblici rada:
frontalni rad individualni rad
Literatura za pripremanje učenika:
Kralj, L., Kniewald, I., Galešev V., Sokol, G.: Informatika 7, multimedijski udžbenik informatike za 7. razred osnovne škole, SysPrint d.o.o., Zagreb, 2007.
Brođanac, P., Stjepanek, N., Paleka, I.: Klikni mišem! 7, udžbenik informatike za 7. razred osnovne škole, Školska knjiga, Zagreb, 2007.
Literatura za pripremanje nastavnika:
Brođanac, P., Stjepanek, N., Paleka, I.: Klikni mišem! 7, udžbenik informatike za 7. Razred osnovne škole, Školska knjiga, Zagreb, 2007.
Svetličić, Barišić, Vrhovski, Floriani: www Informatika 7, udžbenik s cd-om za sedmi razred osnovne škole, Profil International, 2007.
Srdić, I., Hrpka, B., Kadić, G.: Informatika 7, udžbenik za 7. razred informatike, Alfa d.d., Zagreb, 2007.
Kralj, L., Kniewald, I., Galešev V., Sokol, G.: Informatika 7, multimedijski udžbenik informatike za 7. razred osnovne škole, SysPrint d.o.o., Zagreb, 2007.
3
TIJEK NASTAVNOG SATA:
ARTIKULACIJA SATA:
Uvodni dio
Nastavni sat započinjem upisujući sat u dnevnik, provjeravanjem ploče i krede, uključivanjem
projektora. Učenike motiviram na način što im kažem da nakon obrada današnjeg gradiva više
im neće ista perspektiva prilikom pristupa web stranicama.
Otvaram prezentaciju te najavjujem temu nastavnog sata i prateći slajdove započinjem s
obradom gradiva.
Glavni dio
Učenici sjede za stolovima ispred računala te prate prezentaciju na projektoru. Kažem im da
na svojim računalima pristupe web stranici www.barkun.hr te desnim klikom miša kliknu na
Prikaži izvorni kod stranice.
HTML (HyperText Markup Language) je jezik koji se koristi za kreiranje dokumenata na
World Wide Web-u, tj. kojim se određuje struktura, sadržaj i funkcija nekog HTML
dokumenta. Dakle, HTML nam služi za određivanje naslova, odlomaka, slika,
hipertekstualnih veza; te nam također omogućava da te iste elemente u manjoj ili većoj mjeri i
stilski/grafički uredimo.
4
ETAPA SADRŽAJ OBLICI RADA METODE RADA VRIJEME
Uvodni dio
Priprema za radNajava temeMotiviranje učenika za temu
Frontalni Razgovor 7 minuta
Središnji dioObrada sadržaja i ključnih pojmova
Frontalni i individualni rad
Usmeno izlaganje, razgovor,
demonstracija na računalu, praktični
rad na računalu
35 minuta
Završni dioPonavljanje i utvrđivanje sadržaja
Frontalni i individualni rad
Razgovor, praktični rad na računalu
3 minuta
PRAVILA PISANJA HTML-a
Postoje neka pravila pisanja koda prema HTML standardu kojih bi se trebali pridržavati
ukoliko želimo da nas HTML kod bude podržan na različitim preglednicima i na različitim
platformama. Ta pravila su sljedeća:
1. Svi elementi i imena atributa pišu se malim slovima. HTML nije osjetljiv na veličinu
slova, ali predlažemo da se sve piše malim slovima.
2. Sve vrijednosti atributa moraju biti pod navodnicima. U HTML-u je moguće pisati
atribute bez navođenja vrijednosti pod navodnicima, no kod XHTML-a to je obavezno, stoga
predlažemo da se stekne navika stavljanja navodnika kod svih atributa kako kasnije ne bi
imali problema.
3. Svi elementi moraju biti zatvoreni. Svi elementi koji nisu prazni, pa čak i oni koji jesu
trebaju biti pravilno zatvoreni, dakle moramo staviti ''/'' poslije identifikatora elementa.
4. Svi elementi moraju biti pravilno ugniježđeni. Na primjer <b><u>Tekst</b></u>, ce u
većini preglednika biti ispravno prikazan, ali to ne znaci i da je sintaksno pravilno ispisan.
(Prema standardu se element koji se zadnji otvara, mora prvi zatvoriti, dakle ispravno bi bilo
napisati <b><u>Tekst</u></b>)
KAKO POČETI?
Za izradu HTML dokumenata dovoljan nam je najobičniji tekst uređivač kao što je blok za
pisanje, internet preglednik po slobodnom izboru (po mogućnosti najmanje dva kako bi izgled
svoje stranice provjerili sa vise preglednika, što je neophodno jer različiti preglednici različito
tumače neke HTML identifikatore).
Nakon što svoj kod natipkamo u blok za pisanje ili neki drugi tekst uređivač, spremimo taj
dokument na način: File- Save as (u dijalog prozoru prvo odaberemo folder u kojem ćemo
spremiti naš stranicu. U polje File name upišimo ime naše prve stranice, a kao ekstenziju
otkucajmo .html (npr. "ime web stranice.htm"). )
Ono sto čini osnovu svakog HTML dokumenta je njegov identifikator koji internet
pregledniku govori o kojem se elementu zapravo radi kako bi ga ovaj znao pravilno prikazati.
HTML identifikatori su "case insensitive" tj. svejedno je pišemo li ih malim ili velikim
slovima. identifikatori se pišu unutar srednjih zagrada < (manje od) i > (veće od).
5
<html> je identifikator koji je obavezan nalaziti se na početku svakog HTML dokumenta i on
govori našem pregledniku da se ovdje radi o HTML dokumentu. Završni identifikator se
dobije dodavanjem znaka "/" i označava mjesto na kojem prestaje djelovanje početnog taga,
stoga je posljednji element HTML dokumenta </html>, koji pregledniku govori da se ovdje
radi o kraju našeg HTML dokumenta.
Svaki HTML dokument može se strukturno podijeliti na dva dijela: 1. dio je zaglavlje (engl.
head), a 2. dio je tijelo (engl. body). Identifikatori za ta dva dijela su 1. <head> i </head> i 2.
<body> i </body>. Sadržaj zaglavlja se ne prikazuje u internet pregledniku i on služi za
detaljniji opis stranice. Unutar zaglavlja stavljamo identifikatore <title> i </title> između
kojih ćemo staviti naslov naše stranice, koji se upisuje u naslovnoj traci preglednika. Sav
sadržaj koji se nalazi unutar <body> elementa, je stvarni sadržaj, te se kao takav prikazuje u
pregledniku. Upravo navedeni elementi (<html>, <head>, <title> i <body>) su osnovni i
obvezni elementi koje svaka stranica mora sadržavati, te zajedno cine najjednostavniji HTML
dokument. Učenici na računalu izrađuju zadatak redoslijedom kojim je prikazano na
prezentaciji (slajd 6,7,8).
Završni dio
Učenici samostalno izrađuju zadatak za vježbu koji je zadan na slajdu prezentacije.
PLANIRANJE RADA NA ŠKOLSKOJ PLOČI
Uvod u HTML
PPT PREZENTACIJA
6
Prilog:
7
8
9
10
11
12
Related Documents
