Didaktički dizajn nastavne jedinice

Tekst i hipertekst

Mentor :Prof. dr Milorad K. Banjanin

Student : Gorjana Tošić

1. Entiteti planiranja i organizacije nastave

NASTAVNI PREDMET

RAZRED

Datum Odeljenje / broj učenika

Oznake √ Tmin

mimin

OG Sadržajno – metodička obrada novog gradiva √ 10

IpN Intezivna projektna nastava

PG Sistematizacija i koleracija sadržaja, ponavljanja gradiva – integrisanje pojmova √ 15

PP Pismeni oblici ispitivnaja – učenje ocenjivanja

UI Usmeno ispitivanje - pojedinačno i interaktivno

BN Blok nastava i učenje timskog rešavanja problema

PN Praktična nastava – vežbe u nastavnoj bazi √ 10

KT Kombinovani tip časa iinteraktivno učenje

TmN Timska nastava u multimedijalnoj učionici

IrU I nteraktivno učenje u INTERNET LABORATORIJI – laboratorijske vežbe

IkR I nstruktivno – konsultativni rad √ 5

O Ostalo 5

Σ

45

1.1. Naziv nastavne jedinice / teme : Tekst i hipertekst

Tekst Hipertekst

Navigator Jezik HTML

ListeHiper-veze (Hyperlink)

Slike Mapa slike

Boje i pozadine

Ključne reči, termini i pojmovi!

2. IDENTIFIKACIJA CILJEVA NASTAVE I UČENJA

OBJEKTNI NAMJENSKI PERFORMANSNI KONAČNI

Fizički entiteti:Knjige, radne sveske,

olovke, internet;Računar, proekciono

platno;

Regeneracija i integracija prethodnih

znanja o tekstu, fizičkom stilu karaktera i

uključivanju slika u tekst.

Brzina pretraživanja i sakupljanja podataka.

Kratkoročna refleksija učenja, integracija znanja i veština,

efikasna saradnja nastavnik učenik kao i

saradnja medju učenicima.

Kognitivna produkcija:

Spoznavanje teksta kao smisaone celine, realizacija

logičke i fizičke strukture podataka, realizacija jezika

HTML.

Memorijska produkcija:

Pamćenje definicije teksta i hiperteksta, spoznaja

osnovnih tagova u jeziku HTML, sticanje sposobnosti

za uporedjivanje teksta i hiperteksta, pamćenje

kodova dijakritičkih karaktera ,.

Konvergentna produkcija:

Analiza strukturiranja teksta, realizacija hiper-

linkova, analiza strukuriranja HTML dokumenta, analiza

obeležavanja elemenata teksta i fizičkog stila

karaktera. .

Divergentna produkcija:

Jezik HTML i program za konverziju teksta iz

odredjenog formata u HTML format.

Interpersonalna komunikacija

nastavnik-učenik, kojom se ostvaruje

pretraživanje, integrisanje i

primenjivanje znanja i veština.

PERCEPTIVNO - INFORMACIONI:

Spoznaja funkcionisanja hiper-veza, uspostavljanje hipertekstualne strukture dokumenta zapisanog u

HTML-u;

KOGNITIVNO - INFORMACIONI:Razumevanje pojmova

tekst, hipertekst, navigator, hiperlink, jezik HTML

MOTORNO - INFORMACIONI:

Osposobljenost učenika za artikulaciju obrade teksta i

hiperteksta, osposobljenost učenika za uključivanje

sika u tekst.

Simbolički entiteti:Tekst, tagovi (etikete), hiperlinkovi, čvorovi –

simbolički predstavljeni krugovima,tabele,

slike.Semantički

entiteti: Definicija teksta,

definicija hiperteksta, logička i fizička

struktura dokumenta, navigator, definicija

hiper-veza, jezik HTML, strukturiranje teksta,

obeležavanje elemenata teksta, uključivanje slika u

tekst.

Bihevioralni entiteti:

Proaktivnost, interaktivnost, objektivnost,

ekspresija, racionalnost .

Tekst

Tekst je smisaona celina sastavljena od više rečeničnih iskaza povezanih različitim vrstama semantičkih i sintaksičkih veza.

... ili dokument je "informacija namenjena ljudskom sporazumevanju koja može biti prikazana u dvodimenzionalnom obliku.

Text U svakom tekstu se razlikuju dve osnovne

formalne strukture:

Fizička strukturaLogička struktura

Ili logički izgled (engl. logical layout) opisuje organizaciju

sadržaja teksta. Tipični elementi logičke strukture su jedinice

kao što su naslovi ili, pak, pasusi.

Ili grafički izgled (engl. graphical layout) opisuje

organizaciju teksta u "štampanom" obliku. Tipični elementi grafičke strukture su jedinice kao što su strana

ili red.

... ili web-dokument je, pojednostavljeno, tekst koji

sadrži veze ili uputnice (engl. link) ka drugim dokumentima ili

na samog sebe. Preciznije, hipertekst je skup stranica

(engl. page), u obliku datoteka, međusobno

povezanih uputnicama koje su umetnute u stranice.

Za razliku od običnog teksta, koji se čita linearno (sleva na

desno, odozgo naniže), hipertekst se čita

prateći hiper-veze u tekstu, dakle, ne nužno na linearan

način.

... ili razgledač (engl. browser) je interpretator

jezika za prikazivanje hipertekstuelnih dokumenata: on

omogućava njihov vizuelni prikaz na

ekranu.

Jezik HTMLJedna od najznačajnijih vrsta

jezikaza opisivanje hiperteksta.

Jezici za opisivanje hiperteksta su jezici koji omogućavaju da

se precizno opiše hipertekstualna struktura jednog

teksta (uputnice na druge tekstove, itd).

Ovi jezici dopuštaju da se eksplicitno

opiše logička struktura teksta i

različiti tipovi veza u tekstu.

Izvorne datoteke

Unos i vizuelni prikaz

(vizuelizacija) pomoću posebnog načina obrade teksta u

uobičajenim editorima teksta ili

pomoću posebnog programa za obradu teksta (npr. kao

Netscape Composer ili DreamWeaver).

Vizuelni prikaz se ostvaruje uz pomoć navigatora (npr. opcija "Open Page" u programu Netscape)

PREVODIOCI

Tekst u HTML-u može se proizvesti i pomoću programa za konverziju teksta iz određenog formata u HTML-format. Na primer, iz RTF-formata u HTML (rtf2html), iz LaTeX-formata u HTML (latex2html). Ovakvi programi nas obično suočavaju sa pitanjem verzije HTML-a i sa problemima reprodukcje mogućnosti jednog jezika u drugom

Jezik HTML se zasniva na eksplicitnom obeležavanju logičke strukture dokumenta. Obeležavanje se vrši pomoću etiketa (engl.

tag) koje opisuju elemente logičke strukture teksta.

Tagovi ... se navode između uglastih zagrada < i >. U ovim

zagradama se navode opisi pojedinih elemenata strukture

teksta. Tagovi u HTML-u se mogu

razvrstati naprosti tagovi ili

markeri za opisivanje jednostavnih

elemenata logičke strukture. Oblika su:

<X>

složeni tagovi ili ograđivači su zagrade

oblika <X> y </X> kojima je opisan izgled

dela teksta y.

atributi složenih obeležja oblika:

<X A1=a A2=b ...> y </X>

koji pružaju dodatne

informacije, obično o

grafičkom izgledu, dela teksta y

Strukturiranje teksta!

Minimalna struktura HTML-dokumenta obuhvata tagove:

<HTML>, </HTML> - zagrade HTML-teksta;

<HEAD>, </HEAD> - zagrade zaglavlja, sadrži meta-definicije HTML-dokumenta;

<TITLE>, </TITLE> - zagrade za naziv HTML-dokumenta

<BODY>, </BODY> - zagrade teksta obeleženog dokumenta.

Obeležavanje elemenata teksta!

Opis grafičkih karaktera.

Prikaz grafičkih karaktera se u HTML-u definiše na više nivoa. U odeljku zaglavlja (<HEAD>) se definiše kodna strana koja se koristi za prikaz grafičkih karaktera (npr. ISO-8859-1 za zapadno-evropsku latinicu, ISO-8859-2 za istočno-evropske latinice).

Zadavanje kodne strane se vrši pomoću meta-zaglavlja

META oblika:Za dijakritičke karaktere u srpskoj latinici koriste se sledeći kodovi prema ISO-

8859-2 Veliko slovo

kod 8859-2

Malo slovo

kod 8859-2

Č

Ć

Đ

Š

Ž

200

198

208

169

174

č

ć

đ

š

ž

232

230

248

185

190

Karakteri ćiriličnog pisma se mogu kodirati prema standardu

ISO 8859-5.

Dijakritički latinični karakteri se mogu uneti i kao sekvence

UNICODE-uUNIC

ODE

UNIC

ODE

&#268

&#262

&#272

&#352

&#381

&#269

&#263

&#273

&#353

&#382

Fizički stil karaktera!Karakteri mogu dobiti i atribute "vida pisma"

(prema Pravopisu MS) ili, popularnije, biti prikazani u različitim fontovima: Crni slog

(engl. boldface) se navodi među zagradama <B> i </B> .

Kurziv

(engl. italics) se navodi među zagradama <I> i </I> : kurziv

Podvučena slova

(engl. underline) se dobijaju ograđivanjem teksta zagradama <U>

i </U> : podcrtanoTeleprinterska slova

(engl. teletype) se dobijaju ograđivanjem teksta zagradama

<TT> i </TT>

Precrtana slova

(engl. strike) se dobijaju ograđivanjem teksta zagradama

<STRIKE> i </STRIKE> : precrtano

"blinkujuća" slova

se dobijaju ograđivanjem teksta zagradama <BLINK> i </BLINK> :

treperavo Velika slova

se dobijaju ograđivanjem teksta zagradama <BIG> i </BIG>

Mala slova

se dobijaju ograđivanjem teksta zagradama <SMALL> i </SMALL>

Gornji indeks

se dobija ograđivanjem teksta zagradama <SUP> i </SUP>

Donji indeks

se dobija ograđivanjem teksta zagradama <SUB> i </SUB>

Liste

Liste u jeziku HTML su navođenje, popisivanje onih

delova teksta, koji se ne mogu svesti na prethodno opisane elemente logičke

strukture (pasus, odeljak, i sl).

Razlikuju se tri vrste lista (ili popisa):

Opisne

liste

Numerisa

ne liste Neuredjen

e liste

opisuju logičku strukturu koja odgovara listi pojmova koji se definišu. Otuda se opisne liste

nazivaju i definicione liste.

Ovakva lista se opisuje sledećim etiketama:   <DL>

   <DT> odrednica 1 <DD> opis odrednice 1   <DT> odrednica 2 <DD> opis odrednice 2  . . . . .

</DL>

Hiper - veza (Hyperlink)

Hiper-veza (engl. hyperlink) uspostavlja hipertekstuelnu

strukturu dokumenta zapisanog u HTML-u tako što omogućava da se

poveže neki fragment tekućeg teksta sa nekim drugim delom tog

ili, pak, nekog drugog teksta. Hiper-veza se može zamisliti

kao luk koji povezuje neka

dva čvora.

1 2

Ovakva hiper-veza se enkodira pomoću sidra

(engl. anchor) koje povezuje fragment teksta

u čvoru 1 sa adresom

čvora 2.

Enkodiranje ovakve informacije podrazumeva

da se u čvoru 1 opišu:

fizička pozicija na lokaciji u tom čvoru sa koje se prelazi na tekst u

čvoru 2

fizička lokacija na kojoj se nalazi tekst u čvoru 2.

Polazno sidro

Dolazno sidro

Označava u tekstu onu poziciju sa koje se prelazi na neki drugi

tekst i kodira se pomoću atributa HREF:

<A HREF= adresa čvora 2> pozicija u čvoru 1 sa koje se prelazi na čvor 2 </A>

Dolazno sidro je ili adresa neke datoteke ili etiketa koja

obeležava deo teksta. Enkodira se pomoću atributa NAME:

<A NAME= pozicija u čvoru 2> tekst u čvoru 2 na koji se prelazi iz čvora 1 </A>

Adresiranje Adresiranje se temelji na pojmu uniformnog lokatora

resursa (skr. URL, od engl. Uniform Resource Locator), koji omogućava da se precizno imenuje adresa čvora 2, ma gde on bio fizički lociran. U opisivanju adrese koja

upućuje na čvor 2 razlikujemo više slučajeva u zavisnosti od toga koliki je deo URL-a poznat u tom

trenutku.

Hiper-veza predstavlja mogućnost da se

čitanje teksta iz čvora 1 nastavi u čvoru 2.

Slike

Slike (fotografije, crteži, skice,...) ... u

digitalizovanom obliku, sačuvane u nekoj datoteci,

često su sastavni deo teksta. Za čuvanje slika koristi se

više konvencija. Od značaja je da navigator može

protumačiti format u kome je slika sačuvana. Najčešće se koriste formati JPEG i GIF.

Uključivanje slika u tekst.

Slike se u tekstu navode koristeći tag IMG (skr. od image) koja ima obavezni

atribut SRC (skr. od source). Oblik u kome se navodi ova etiketa je:

<img src="URL datoteke u kojoj je slika">

Mapa slikeJedna slika može biti podeljena na zone na

takav način da svaka zona predstavlja polazno

sidro nekog dokumenta. Ova mogućnost se

temelji na pridruživanju slici jedne mape

preko koje se određuju koordinate pojedinih

zona.Koordinatni početak mape je gornji levi ugao

slike, a koordinate se izražavaju u

broju piksela od koordinatnog

početka.

Na primer, donji desni ugao crvenog

kvadrata na slici ima koordinate

(120,100). Zone se određuju pomoću atributa USEMAP

taga IMG:

Mapa se opisuje pomoću složenog taga MAP.

<IMG SRC="URL slike"

     USEMAPE="#ime mape">

Unutar taga MAP, za opis pojedinačnih zona koristi se prosto

obeležje AREA, čiji su atributi SHAPE, HREF i COORDS:

<MAP NAME="ime mape">      <AREA SHAPE="oblik zone1" HREF="URL koji se poziva" COORDS="x1,y1,x2,y2,...">      <AREA SHAPE="oblik zone2" HREF="URL koji se poziva" COORDS="x1,y1,x2,y2,...">      ..............................................</MAP>

Boje i pozadine

Upotreba boja je prvenstveno vezana za

atribute taga BODY. Prilikom navođenja ovog taga mogu se definisati boje sledećih elemenata

u tekstu:

Boja pozadine

Osnovna boja

slova Osnovna boja slova upotrebljenih u

dokumentu opisuje se vrednostima atributa

TEXT. Tokom sastavljanja dokumenta

osnovna boja slova, opisana atributom

TEXT se može promeniti pomoću

atributa COLOR taga <FONT>.

Boja hipertekstualnih

vezase određuje na osnovu donja

tri atributa prema statusu

veze: Boja neposećene hipertekstuelne veze (pre nego što se na nju

"klikne") je određena atributom LINK;

Boja već posećene hipertekstuelne veze (posle

povratka u dokument iz koga se "kliknulo") je određena atributom

VLINK;

Boja hipertekstuelne veze u trenutku kada se na nju "klikne" je

određena atributom ALINK.

Hvala na pažnji!

Boja pozadine (engl. background), koja predstavlja

boju "papira". Boju pozadine određuje

vrednost atributa BGCOLOR

Pozadina dokumenta se definiše atributima background ili bgcolor.

Pozadina može biti:

● slika (npr. <BODY BACKGROUND="URL slike">)● boja (npr. <BGCOLOR= predefinisan naziv boje> ili<BGCOLOR= #heksadecimalna RGB vrednost boje>)

<BODY BGCOLOR ="#RRGGBB">

RRGGBB predstavlja

heksadecimalni triplet kôda boje:• cifre RR (R=0..9A..F) određuju količinu crvene boje, • cifre GG (G=0..9A..F) određuju količinu zelene boje, • cifre BB (B=0..9A..F) određuju količinu plave boje.

Konvencija!

Konvencija je sporazum ili dogovor o

modalitetima i pravilima ponašanja.

Semantika

Semantika se odnosi na aspekte značenja koji su izraženi u jeziku,

kodu ili nekom drugom obliku predstavljanja.

Semantika takođe može označavati teoretsko

proučavanje značenja u sistemima ili znakovima.

Sintaksa

Sintaksa proučava pravila koja određuju kako se

reči kombinuju u rečenice u datom jeziku.