L-M-TIK-10-Zgjedhje

Etleva Smaçi

TIK 10

LIBËRMËSUESI MËSUESI LIBËR TEKNOLOGJIA E TË MENDUARIT KRITIK DHE STRUKTURA “E.R.R” E PLANIFIKIMIT TË MËSIMIT INFORMACIONIT DHE (MODELE MËSIMI) KOMUNIKIMIT 10

Tiranë-2012

Botues: Redin JEGENI Redaktor letrar: Etleva Smaçi Arti grafik: Lindita Dervishi Kopertina: Parid Teferiçi

© Copyright, IDEART © Të gjitha të drejtat e rezervuara. Riprodhimi i librit, qoftë edhe në formë të pjesëshme, është i ndaluar. Nuk mund të kopjohet asnjë tekst apo zgjidhje grafike e tij pa lejen dhe miratimin paraprak të IDEART, i cili është mbajtës i vetëm i së drejtës së botimit dhe shpërndarjes së tij, përveç rasteve kur kjo e drejtë lejohet qartazi nga ligji. Botuesi është i gatshëm t’i ofrojë të drejtat pa pagesë për citimet, përdorimet me qëllim studimi vetiak apo për elementë të veçantë grafikë që gjenden në këtë libër, libër, duke nënshkruar fillimisht marrëveshje për to. Të drejtat morale të autorëve dhe artistëve që punuan për realizminin e këtij projekti mbrohen nga IDEART, bazuar në legjislacionin shqiptar mbi pronësinë intelektuale dhe të Drejtat e Autorit, Nr. 9380, dt. 28.04.2005 si dhe në konventat, dispozitat dhe marrëveshjet ndërkombëtare.

Botimi i parë: IDEART IDEART,, 2010

www.ideartlibri.com botimet ideart [email protected] PO BOX 1532, Tiranë (AL) Tel./Fax: ++ 355 4 2233205

Botues: Redin JEGENI Redaktor letrar: Etleva Smaçi Arti grafik: Lindita Dervishi Kopertina: Parid Teferiçi

© Copyright, IDEART © Të gjitha të drejtat e rezervuara. Riprodhimi i librit, qoftë edhe në formë të pjesëshme, është i ndaluar. Nuk mund të kopjohet asnjë tekst apo zgjidhje grafike e tij pa lejen dhe miratimin paraprak të IDEART, i cili është mbajtës i vetëm i së drejtës së botimit dhe shpërndarjes së tij, përveç rasteve kur kjo e drejtë lejohet qartazi nga ligji. Botuesi është i gatshëm t’i ofrojë të drejtat pa pagesë për citimet, përdorimet me qëllim studimi vetiak apo për elementë të veçantë grafikë që gjenden në këtë libër, libër, duke nënshkruar fillimisht marrëveshje për to. Të drejtat morale të autorëve dhe artistëve që punuan për realizminin e këtij projekti mbrohen nga IDEART, bazuar në legjislacionin shqiptar mbi pronësinë intelektuale dhe të Drejtat e Autorit, Nr. 9380, dt. 28.04.2005 si dhe në konventat, dispozitat dhe marrëveshjet ndërkombëtare.

Botimi i parë: IDEART IDEART,, 2010

www.ideartlibri.com botimet ideart [email protected] PO BOX 1532, Tiranë (AL) Tel./Fax: ++ 355 4 2233205

Përmbajtja 5 7 8 10 12 14 16 23 24 26 29 31 32 34 36 38 40

Parathënie Orë mësimore model TEMA: Faqet e Internetit TEMA: Krijimi i një dokumenti HTML TEMA: Hyperlinket TEMA: Imazhet TEMA: Formatimi tekstit TEMA: Tabelat TEMA: Rëndësia e CSS TEMA: Sintaksa e shkrimit të CSS TEMA: TESTIM MBI KAPITULLIN CSS LINJA 4: DREAMWEAVER TEMA: Hyrje në Dreamweaver TEMA: Krijimi site në Dreamweaver teksti t, imazheve imazheve dhe linkeve. Klasat TEMA: Vendosja e tekstit, PUNË PRAKTIKE: Krijimi i një rollover imazh, navigation bar PUNË PRAKTIKE: Krijimi linkeve

Dreamweaver er TEMA: Vendosja e skedarëve ash në Dreamweav

4

Libër mësuesi

TIK 10



PARATHËNIE Libri mësuesit është një mjet didaktik ndihmës në mbështetje të tekstit mësimor të përgatitur nga shtëpia botuese në ndihmë të mësuesve të Informatikës. Libri bazohet në modele mësimore për të orientuar mësuesin për të realizuar sa më mirë dhe

sa më me ekasitet mësimdhënien. Mësuesi duhet ta konsiderojë këtë libër si një këshillues dhe jo imitim, sepse kështu do të shmangte elementet vetjake në mësidhënie dhe do të krijonte një model standart. Në libër një vend të veçantë zënë testimet, që gjithashtu kanë karakter orientues për mënyrën si do të ndërtohen.

Duke u nisur nga specika e lëndës më shumë prioritet ju janë dhënë veprimtarive praktike dhe ushtrimeve. Më poshtë do të gjeni shkurtimisht një terminologji të thjeshtuar të disa koncepteve bazë të mesimdhënies që në praktikën e përditshme kanë gjetur një përhaprje të gjerë.

1. Terminologji • • • • • • • • • • • • •

Arritje (performance) Objektiva të përmbajtjes Objektiva të arritjeve Objektiva të arritjeve të një kapitulli (linje) Objekte dhe veprimtari Objektiva specikë Veprimtari të vëzhgueshme, të demonstrueshme Kusht, kriter Nivelet e arritjeve Niveli bazë, mesatar dhe i lartë Niveli minimal Nënobjektiva Kompetencë

Arritja Ky term (që ka zëvendësuar termin performancë) përdoret për të treguar: • dije • shprehi • qëndrime që nxënësi i demonstron (i shfaq) në formën e veprimtarive dhe sjelljeve të ndryshme që kryen, të cilat janë të vëzhgueshme nga mësuesi dhe nxënësit e tjerë, madje, shpesh herë, edhe të matshme.

Në hartimin e synimeve të niveleve të ndryshme, arritja e nxënësve (performanca) llon të përshkruhet më konkretisht sapo kalohet nga qëllimet, te objektivat e kapitujve, që janë objektiva të përgjithshme të përmbajtjes , veçse deri këtu arritja akoma nuk është plotësisht konkrete. Kur hartohen objektivat specikë (për objekte të caktuara mësimore), arritja e demonstrueshme bëhet e përcaktuar plotësisht, madje tani tregohen edhe kushtet në të cilat ajo pritet të shfaqet, si dhe kriteret e saktësisë së përmbushjes (plotësimit) të Parathënie



5

arritjes së synuar. Për të përmbushur objektivat specikë, nxënësit i jepen detyra konkrete për të plotësuar, në një sasi dhe renditje që përzgjidhen nga mësuesi.

Objektivat e arritjes- Përkuimi Objektivat e arritjeve të një kapitulli, përbëjnë bashkësinë e të gjitha objektivave specike të hartuara për të gjitha objektet e kapitullit, ose linjës, të ndarë në tri nivele, duke u nisur nga

objektivat e programit, ose nga standardet (nëse ka të tilla për lëndën).

2. Nivelet e arritjeve

•

Niveli baë, mesatar dhe i lartë

Përsa i përket hierarkisë së arritjeve të nxënësve, do të ruajmë terminologjinë e përdorur te standardet :

• • •

6

niveli baë (më i ulëti) i arritjeve. niveli mesatar. niveli i lartë.

Libër mësuesi

TIK 10



Njohja dhe të kuptuarit Klasikimi dhe krahasimi Krijimi individual dhe kombinimi ideve

ORË MËSIMORE MODEL TEMA: FAQET E INTERNETIT Objektivat: N ë përfundim të or ës së mësimit nxënësi të jetë i aftë të: 1. Të bë jë dallimin mes koncepteve Website, Webserver, Web broëser. 2. Të listojë dhe të diskutojë mbi disa prej aplikacioneve q ë përdoren për ndërtimin e Website-ve. 3. Të krahasoj e veprimtaritë q ë kryen një Web disegner dhe një Web developer.

Mjeti dhe burimi i informacionit: libri, interneti. Struktura E R R

Metoda Parashikim me terma paraprakë Insert Veprimtari e pavarur

Evokim : Parashikim me terma paraprak ë Mësuesi shkruan në tabelë konceptet: WWW, Website, Webserver, Web browser. U kërkon nxënësve të japin një kuptim vetjak mbi to. Më pas u kërkon që me një Web browser të caktuar të hapin një faqe interneti si p.sh, Yahoo, Google etj.

Realiimi kuptimit: Insert Nisur nga fakti që një pjesë e konsiderueshme e njohurive që trajtohen gjatë k ësaj teme mësimore janë trajtuar edhe në klasat e mëparshme, për realizimin e kuptimit, mësuesi përdorë teknik ën insert.

√

+

WWW

•

We b r o w s e r (shetuese interneti);

? Çfarë është gjuha HTML/ XTML.

Websitebashkësi skedarësh, të shpërndarë në disa servera.

•

Web server- bën të mundur aksesimin e faqes së një ëeb.

Ndërtuesit e faqes

• •

Web designer Web developer

Reektim: Puno në dyshe Punohet me rubrikën e tekstit Kontroll njohurish. Modele mësimore



7

TEMA: KRIJIMI I NJ Ë DOKUMENTI HTML Objektivat: Në përfundim të orës së mësimit nxënësi të jetë i aftë të: 1. Të identikojnë kuptimin dhe qëllimin e etiketave HTML. 2. Të njohë ambientin e punës ku ndërtohet një faqe HTML. 3. Të përdorë Notepad si tekst editor për të krijuar një strukturë teksti dokumenti për çdo faqe ëeb-i. 4. Të ndërtojë një faqe të thjeshtë që përmban një titull dhe një tekst.


Metoda Kontroll frontal Ushtrime Veprimtari e pavarur

Evokim: Kontroll frontal 1. Kur përgatitim një dokument për nevojitet një gjuhë e veçantë? 2. Nëse po a njihni një të tillë?

Realimikuptimit:Ushtrime 1. Hapet Notepad. 2. Shkruhet në k ëtë skedarë struktura bazë:

8

Libër mësuesi

TIK 10



në internet a

3. Plotësohet ky dokument me të dhëna të tjera. P.sh, ëebsite ynë ka nevojë për një emërtim. Etiketat që do të përdoren janë:

Kjo është faqja ime e parë </ title> . Ja si duket në notepad 4. Kur shetohet në broëser titulli vendoset në pjesën e kokës së dokumentit, kurse pjesa tjetër është bosh. 5. Të plotësojmë tashti në pjesën e trupit dokumentin me një paragraf. Etiketat që do të përdoren: Faqja zyrtare e shkollës “Sami Frashëri”. 6. Rezervimi dokumentit. Në notepad do të klikojmë Save As. Këtu duhet të jemi të kujdeshëm që të zgjedhim te kutiza Save as type: All Files/ jo Text Documents. I japim dokumentit emërtimin Index.hTML /htm dhe e rezervojmë dhe kemi krijuar kështu faqen e parë të ëebsit-it tone. Reektim:Veprimtari e pavarur Krijoni në mënyrë idividuale faqen Rreth nesh. html. Vendoseni Brenda sitet që keni krijuar faqen Indx.html. Në etore shkruani hapat që ndoqët. Në përfundim të veprimtarisë së pavarur mësuesi bën vlerësimin e nxënësve. Modele mësimore  9 TEMA: HYPERLINKET Objektivat: Në përfundim të orës së mësimit nxënësi të jetë i aftë të: 1. Të kuptojë çfarë përfaqëson një link. 2. Të dallojë elementet e sintaksës së shkrimit të linkut në një dokument html . 3. Të ndërtojë një link me një faqe interneti duke përdorur një tekst (p.sh google). 4. Të dallojë URL absolute nga ajo relative. Mjeti dhe burimi i informacionit: libri, interneti. Struktura E R R Metoda Stuhi mendimi Ushtrime Veprimtari e pavarur Evokimi: Stuhi mendimi Mësuesi shkruan në tabelë fjalën Hyperlink. Nxënësit japin kuptimin e tyre për të. Lidhje me një faqe interneti, lidhje me një adresë emai, lidhje me një imazh etj. Mësuesi hap faqen e internetit dhe me ndihmën e projektorit u tregon nxënësve shenjat dalluese të një linku: - teksti ngjyrosur me ngjyrën blu, - kur afrojmë mausin shfaqet shenja e dorës, Realizmi kuptimit: Ushtrime Për realizimin e ushtrimit rekomandohet që mësuesi të punojë me ndihmën e projektorit në kompjuterin e tij hap pas hapi duke shfaqur çdo veprim për klasën. Në mungesë të tij punohet në tabelë. Nxënësit duhet të kenë të hapur Notepad. Faqen Index.html. • • • Shkruhet në tabelë etiketa e linkut <a> </a>. Cili është atributi që krijon lidhjen me një tjetër dokument? href. Shkruhet sintaksa e një linku: <a href=”url” rel="nofollow">teksti që do klikohet për t’ u hapur faqja(mund të jetë edhe imah ose ndonjë element tjetër </a> • Rikujtohen edhe njëherë me ndihmën e klasës elementet përbërës. • Mbi bazën e sintaksës së mësipërme të krijohet një link me Google në faqen Index.html. Në notepad kemi këtë pamje. 10 Libër mësuesi TIK 10  • E hapim me një shetues dhe shohim karakteristikat e linkut: • Teksi është i nënvizuar dhe me ngjyrë blu/ kur afrohet mausi merr trajtën e dorës. Reektim:Veprimtari e pavarur Duke ndjekur hapat e shembulli nxënësit duhet të krijojnë një lidhje të ëebsite të tyre me Yahoo. Në etore të shkruajnë hapat që ndoqën. Mësuesi bën vlerësimin me notë të veprimtarive. Modele mësimore  11 TEMA: IMAZHET Objektivat: Në përfundim të orës së mësimit nxënësi të jetë i aftë të: 1. Të dallojë etiketën që vendos një imazh në një dokument HTML. 2. Të përdorë saktë elementet e sintaksës së shkrimit të linkut me imazh. 3. Të ndërtojë një link me faqen interneti Yahoo, duke pasur si link logon e Yahoo-së. Mjeti dhe burimi i informacionit: libri, interneti. Struktura E R R Metoda Kontroll frontal Ushtrime Veprimtari e pavarur Evokimi: Kontroll frontal 1. Çfarë është një link? 2. Cila është etiketa e një linku? 3. Po atributi me të cilën krijojmë linke me dokumente të tjera? Realiimi kuptimit: Ushtrime • • Mësuesi u kërkon nxënësve të hapin faqen Index.html. Në folderin imazhe të krijuar brenda Websit-it personal, u kërkohet nxënësve të shkarkojnën nga interneti logon e google në formatin gif, jpg, png. • Mësuesi shkruan në tabelë etiketën <img> dhe atributin scr duke dhënë shpjegimet përkatëse dhe më pas shkruan sintaksën për shtimin e një imazhi në dokument <img src=”url” alt=”tekst”/>. • Shkruajmë sintakën e saktë si tregohet në gurë në notepad. • E hapim me një shetues dhe kemi këtë pamje • Këtë imazh do ta përdorim si link për të shkuar në Google. 12 Libër mësuesi TIK 10  • Shkruajmë në notëpad sintaksën: <a href=”http://ëëë.google.com”/ rel="nofollow"> <img src=”imazhe/logo google.jpg”alt =”imazhe”/> </a> • Rezultati është gura. Bëjmë dallimin mes imazhit të insertuar dhe imazhit të përdorur si link. • Përdorimi i një imazhi si sfond për një faqe Web. • Mësuesi merr një imazh nga Pictues, p.sh , Tulips dhe e vendos brenda dosjes Imazhe. • Shkruan në tabelë sintaksën: <body background= “Imazhe/Tulips.jpg”>. • • • • Aplikimi i një ngjyre si sfond i faqes. Shkruhet sintaksa <body bgcolor= ngjyra> Rezultati shihet në gurë. Reektim:Veprimtari e pavarur Klasa ndahet në tri grupe. Grupi i parë: Nxënësit duhet të insertojë në një dokument html një logo të Yahoo dhe më pas me këtë logo të krijojë një lidhje po me Yahoo. Grupi i dytë: Zgjedh një imazh nga Pictures ose e shkarkon nga interneti dhe e vendos si sfond të faqes Index. html. Grupi i tretë: Aplikon si sfond të faqes Index.html një ngjyrë të caktuarl. Të gjitha veprimet realizohen në notepad dhe ruhen ndryshimet. Në etore të shkruajnë hapat që ndoqën. Mësuesi bën vlerësimin me notë të veprimtarive. Modele mësimore  13 TEMA: FORMATIMI TEKSTIT Objektivat: Në përfundim të orës së mësimit nxënësi të jetë i aftë të: 1. Të identikojë disa etiketa që përdoren për formatimin e tekstit në një dokument HTML. 2. Të përdorë lirshëm dhe saktë etiketat e formatimit. 3. Të ndërtojë një faqe me larmishmëri formatimesh teksti . Mjeti dhe burimi i informacionit: libri, interneti. Struktura e orës së mësimit Realimi kuptimit: Shpjeim Mësuesi shkruan në tabelë etiketat përkatëse dhe funksonin që kryejnë Etiketa <tt> Funksioni që kryen Shfaq tekst të theksuar në dokument. Shfaq tekst të pjerrët në dokument. Shfaq tekst të nënvizuar në dokument. Shfaq fontin e shetuesit. Font face = lloji i shkrimit(psh Arial) Përcakton madhësin fontit që mund të jetë:+1,+2, e kështu me radhë Përcakton llojin e shkrimit që do përdorim në dokument Përdoret për të bërë vizimin: - e tekstit të një paragra; - të një titulli nëse përdorim etiketën <h1 align= ...>. pra vendosjen djathtas(right), majtas(left) apo në qendër(center) të tekstit. Kjo tabelë mund të shfaqet edhe me ndihmën e projektorit. Për secilin etiketë mësuesi u kërkon nxënësve ta provojnë në një dokument html. Reektim:Veprimtari e pavarur -Ushtrime a) Hapi i parë është krijimi i një faqeje të re brenda Ëebsite personal, që do të emërtohet Rresh_nesh.html dhe ka strukturën standarte të një dokumenti html. b) Mësuesi përcakton elementet që do t’i shtohen faqes burim. Kjo faqe do të shërbejë për të dhënë një informacion mbi shkollën. c) Nxënësit janë të lirë të shkruajnë një tekst personal, të shkurtër dhe mbi të përdorin etiketa të ndryshme formatimi. d) Ja një shembull: <body bgcolor= green> 14 Libër mësuesi TIK 10  Historiku Shkolla jonë u themelua ne vitin 2000.Që nga ky vit dhe ne vazhdim <tt>shkolla jonë</tt> ka pasur një ecuri mjaft të mirë. Ne arritëm në këtë përfundim jo vetëm për faktin që jemi vetë nxënës të kësaj shkolle por edhe sepse brezat e mëparshëm janë sot inxhinierë të zotë ,diplomatë, doktorë dhe punonjës të suksesshëm në fusha të ndryshme të jetës sociale dhe kulturore të vendit tonë. Është pikërisht kjo arsyeja që na bën ne të ndihemi krenarë që jemi nxënës të kësaj shkolle. Bashkohuni edhe ju me ne. Pamja që duhet të marrim është si në gurë. Detyrë shtëpie Formatimi i një teksti, në një dokument html, me etiketat e trajtuara gjatë temës mësimore. Modele mësimore  15 TEMA: TABELAT Objektivat: Në përfundim të orës së mësimit nxënësi të jetë i aftë të: 1. Të identikojë etiketa që ndërtojnë një tabelë, një rresht, një qelizë. 2. Të përdorë atributet cellpading, cellspacing, bgcolor, bordercolor. 3. Të ndërtojë tabela me larmishmëri elementesh. Mjeti dhe burimi i informacionit: libri, interneti. Struktura E R R Metoda Kontroll frontal Ushtrime Veprimtari e pavarur Evokim: Kontroll i detyrës së shtëpisë Secili prej nxënësve sjellë me usb punimin vetjak. Mësuesi fton nxënësit të shfaqin me ndihmën e projektorit detyrën. Gjithashtu shpjegohen edhe hapat e ndjekura për realizimin e saj. Mësuesi bën vlerësimin me notë të nxënësve. Realimi kuptimit: Ushtrime Mësuesi shkruan në tabelë etiketën që tregon ndërtimin e një tabele: <table>.....</table> Etiketa e rreshtit:<tr> Etiketa e qelizës: <td> - këtu mund të vendosim tekst, linke, imazhe etj. • • • • • • • • Krijohet llimisht një dokument i ri në html Galeria.html. Përcaktohen elementet e tabelës 2 kolona dhe 2 rreshta. Border = 2 Cellspacing = 15 Cellpading = 10 Bordercolor = yelloë Bgcolor për dy qeliza = green dhe dy qelizat e tjera = blue Brenda njërën qelizë të vendoset një tekst/ imazh. Në notepad do të kishim këtë pamje: 16 Libër mësuesi TIK 10  Po të hapnim faqen me një shetues pamja do të ishte kjo: Reektim:Veprimtari e pavarur 1. Ndërtoni një tabelë në një dokument HTML që përmban 3 rreshta dhe dy kolona a- me hapësirë ndarëse midis qelizave 10; b- me rreshtin e parë ne ngjyrë të verdhë; c- me korniza të tabelës me trashësi 3. Orë praktike-Ndërtimi i një Web site. Përgjatë këtyrë orëve mësimore që kemi punuar me dokumente HTML kemi mësuar të krijojmë faqe të ndryshme dhe të përdorim sintaksat e gjuhës HTML. Tani le të krijojmë një Ëebsite të thjeshtë që përmban njohuritë kryesore që gjatë këtyre orëve kemi marrë dhe praktikuar. Web Site që do ndërtojmë do të përmbaje gjithsej 4 faqe HTML dhe këto do të jenë: 1. Faqja Index. 2. Foto_galeria 3. Rreth_nesh 4. Kontakt Le të llojmë pa humbur kohë: Faqja Index do të ketë të shkruajtur sintaksën e mëposhtme dhe do të ketë paraqitjen si më poshtë: <HTML> <HEAD> <im src=”imahe/amuri jone.jp” heiht=”100”> <a href =”indexp.htm” rel="nofollow"> <ul> Index </ul></A> alt=”imah”/ ëidth=”1650” Modele mësimore  17 <a href =”rreth_neshp.htm” rel="nofollow"> <ul> Rreth nesh </ul></A> <a href =”fotogaleriap.htm” rel="nofollow"> <ul> Foto </ul></A> <a href =”kontaktp.htm” rel="nofollow"> <ul> Kontakt </ul></A> <TITLE> Kjo është faqja ime e parë ueb

Jeni të lutur të sugjeroni elementë për krijimin e faqes Ueb të shkollës sonë

Ky është një paragraf.

Ky është një paragraf tjetër.

Tani do të vazhdojmë ndërtimin e faqeve : Rreth_nesh; Foto-galeria, Kontakt duke kopjuar pjesën e kokës te secila prej tyre nga faqja Index .(në këtë mënyrë krijuam nënfaqet të cilat paraqitje të njëjtë në pjesën e kokës me faqen index). Pjesa që do kopjohet është ajo ku krijohen linket si më poshtë:

Index

Rreth nesh

Foto

Kontakt
Kjo është faqja ime e parë ueb 18

Libër mësuesi

TIK 10



ëidth=”1650”

Pastaj do të ndërtojmë pjesën e përmbajtjes së tyre. Kështu faqja Rreth_nesh do ketë këtë kod dhe pamje:

Index

Rreth nesh

Foto

Kontakt

Historiku

Ne sot për herë të parë po krijojmë Websiten tonë në mënyrë që të provojmë njohuritë tona rreth HTML.
Elmentët që ne kemi përdorur janë :

Vendosja e imaheve

Formatimi i tekstit
Ndërtimi i linkeve

Bashkohuni edhe ju me ne të mësojmë ndërtimin e faqeve Web

Faqja fotogaleriap do kishte këtë kod dhe pamje: Modele mësimore



19

Index

Rreth nesh

Foto

Kontakt

width=”1650”

Faqja konakt do të kishte këtë kod dhe këtë pamje:

Index

Rreth nesh

Foto

Kontakt

Emri:
Mbiemri: 20

Libër mësuesi

TIK 10



width=”1650”

Mashkull
Femër

Shqip
Anglisht
Frengjisht
Italisht

Name:
Password:

Modele mësimore



21

Siç mund ta vini re ka shume elementë të cilët ne i kemi përdorur gjatë orëve të mësimit në të cilat kemi ndërtuar faqet e internetit. P.sh, ne kemi ndërtuar forma që përmbajnë checkboxe , radiobutona etj. Nëse i keni të ruajtura mund ti përdorni ato dhe vetëm të shtoni pjesën që përsëritet në secilën faqe. Mbasi të përfundoni së shkruajturi të gjithë kodet e mësipërme sigurohuni që të gjitha faqet ti vendosni në një folder të quajtur përsëritje ku të vendosni edhe një folder të quajur imazhe në të cilin duhet të vendosni të gjitha imazhet që do të përdorni në ndërtimin e faqes. Në këtë mënyrë ne ndërtojmë një Website të thjeshtë që ka katër faqe html ku mund të kalojmë tek secila prej këtyre faqeve thjesht duke klikuar në linket Index, Rreth nesh, Foto dhe Kontakt.

22

Libër mësuesi

TIK 10



TEMA: RËNDËSIA E CSS Objektivat: Në përfundim të orës së mësimit nxënësi të jetë i aftë të: 1. Të japë një përkuzim të saktë se çfarë përfaqëson CSS. 2. Të bëjë dallimin mes HTML dhe CSS. 3. Të tregojë si përdoren në funksion të njëra tjetërës HTML dhe CSS.


Metoda Kontroll frontal Punë e udhëhequr Minitest

Evokim: Kontroll frontal 1. Me çfarë mjetesh mund t’i rregullojmë faqet e internetit nga pikëpamja estetike? 2. Kujtoni disa atribute që kemi përdorur gjatë kapitullit të HTML për dokumente të ndryshme.

Realiimi kuptimit: Punë e udhëhequr Hapi i parë: Mësuesi duhet pasi ka rikujtuar edhe njëherë njohuritë mbi HTML dhe ka dhënë një përkuzim të saktë për CSS duhet të ndalet në dallimin mes tyre dhe përparësitë e përdorimit të CSS

HTML Bazohet tekstit.

CSS në

Përparësitë

përmbatjen Me ndihmën e CSS Modikimet janë të thjeshta. përdoruesi bën një ndarje Hapësira e rezervimit më e të kësaj përmbatjeje sipas vogël. stileve (vijëzim, lloji shkrimit Koha e shkarkimit më e vogël etj). etj.

Hapi i dytë: Mënyrat e ndërfutjes së CSS në një faqe Web. -

External style sheet Internal style sheet Inline style

Reektimi: Minitest Përgjigjuni me e vërtetë apo e gabuar.

a. Të gjithë shetuesit suportojnë stiliet CSS.

V

G

b. Faqet e formatuara me stilin CSS nuk updatohen automatikisht.

V

G

c. Stilet CSS janë të aplikueshme: 1-në paragrafe; 2- në fjalë të zgjedhura – në të dyja opsionet. d. Listoni mënyrat e futjse së CSS në një faqe Web. _________________________________________________________________ Modele mësimore



23

TEMA: SINTAKSA E SHKRIMIT TË CSS Objektivat: Në përfundim të orës së mësimit nxënësi të jetë i aftë të: 1. Të listojë disa nga rregullat kryesore të CSS. 2. Të bëjë dallimin mes zgjedhësit id dhe class. 3. Të ndërtojë një document në html duke përdorur sintaksën e CSS.

Mjeti dhe burimi i informacionit: libri, interneti. Struktura: ERR Evokimi: Parashikimi me terma paraprkë Mësuesi shkruan në tabelë h1, h2, h3…dhe pyet klasën se çfarë përfaqësojnë ato në html?

Etiketa (tag)- në CSS quhen zgjedhës( selector ).

Realiimi kuptimit:Shpjeim Mësuesi shkruan në tabelë ose paraqet me ndihmën e projektorit stukturën e një instruksioni CSS. Instruksioni në CSS përbëhet nga dy pjesë:

1. Një selektor (etiketë, angl.=tag) 2. 3. 1. 2. 3. 4.

Një ose disa deklarime Listohen në tabelë rregullat e sintaksës CSS. etiketë që vendoset jashtë dhe deklarimi brenda kllapave hapëse dhe mbyllëse{} atributi ndahet nga vlera me : Nëse kemi disa atribute që marrin vlera si p.sh,

h1{color:blue;font-sie:12px,font-famil:arial} ndahen nga njëra tjetra me ;

Hapi i dytë: Ushtrime Mësuesi shkruan në notepad shembullin si në gurë. Shpjegohen të gjithë elementet e sintaksës.

24

Libër mësuesi

TIK 10



E hap me një shetues dhe demostron rezultatin përpara klasës.

Reektim:Veprimtari e pavarur Zbatoni në një dokument sintaksën e mëposhtme. Shikoni ndryshimet me shembullin e dhënë në tekstin mësimor dhe tregoni çfarë është ndryshuar.

Ky titull vendoset ne qender

Ky paragraf vendoset majtas.

Modele mësimore



25

TESTIM MBI KAPITULLIN CSS Plotësoni përgjigjet e sakta: 1. CSS është shkurtim i? Computer Sheets

Style

Creative Style Sheets Cascading Style Sheets Colorful Style Sheets

2. Cila sintaksë HTML I referohet external style sheet?

L-M-TIK-10-Zgjedhje

Recommend Documents

Jeni të lutur të sugjeroni elementë për krijimin e faqes Ueb të shkollës sonë

Ky titull vendoset ne qender