«HTML тіліне кіріспе. Web - бет құрылымы» 10 класс

Ембі қаласы №7 орта мектебі

Ашық сабақ

        Тақырыбы: «HTML тіліне кіріспе. Web - бет құрылымы»

        Сыныбы:     10 «а» класы

Мұғалімі: Сарсембаева А.Ж.

2016-2017 оқу жылы

HTML тіліне кіріспе. Web - бет құрылымы.

Сабақтың тақырыбы: HTML құжатымен жұмыс
Сабақтың мақсаты: HTML құжатына әзірлеу, онда фреймдер мен пішімдер орналастыру, жұмыс жасау барысы туралы жан - жақты түсіндіру; оқушылардың ой - өрісін, логикалық ойлау, басқару қабілеттерін дамыту; оқушыларды еңбекшіл, қарапайым болуға және жауапкершілік сезімін қалыптастыруға тәрбиелеу;
Сабақтың техникалық - материалдық
құралдары, көрнекіліктері: Компьютерлік жабдықтар, сабақ презентациясы

Сабақтың барысы:
І. Ұйымдастыру кезеңі: 
- Оқушылармен сәлемдесу;
- Журнал бойынша түгендеу;
- Кабинеттегі техникалық қауіпсіздік ережелерімен таныстырып өту;
ІІ. Кіріспе нұсқау:
1) Презентацияны пайдалана отырып өткен тақырыптар бойынша қайталау жасау;
2) Web - құжат құрылымы. Web - құжатты құрудан алдын, оның қай тілде жазылғанын браузер үшін анықтау қажет. Ол үшін құжаттың басына тэгін орналастырамыз. Бұл қатар құжаттың HTML 4. 0 тілінде жазылғанын білдіреді.
Web - құжат құрылымы төмендегі негізгі тэгтерден тұрады:

head
title тақырып /title
/head
body
негізгі бөлім
/body
/html
Web - құжат html тэгімен басталып, сәйкес /html тэгімен аяқталады. Осы екеуінің арасына құжаттың тақырыбы және негізгі бөлімі орналасады.
ІІІ. Оқушыларға жаңа сабақ туралы нұсқау беру: 
Сырғымалы жолдарды ұйымдастыру
Marquee…./Marquee тегтері мәтіндерді үздіксіз жылжытып отыратын сырғымалы жол түрінде экранға шығады. Бұл тегтің ашылуы кезінде жазылатын бір шама атрибуттары бар. Олар сырғымалы жолдың жылжу жылдамдығын, бағытын, әріптердің түсін, т. б. өзгертеді. Енді жиі өзгертілетін параметрлерді және олардың мүмкін мәндерін қарастырамыз. Benaior - мәтіннің бірбағыты (scrool) немесе қос бағыттада (alternate) жылжуын немесе жылжымай тоқтап тұруын қамтамасыз етеді. Яғни мүмкін мәндері Scrool (alternate/slide).
Bgcolor — сырғымалы жолдың фондық түсін анықтайды.
Direction — жолдық сырғу бағытын анықтайды. Оның мүмкін мәндері Left - солға, Right - оңға.
Height — сырғымалы жолдың биіктігін пиксель арқылы анықталатын бүтін сан.
Оны пайызбен көрсетуге болады.
Width – экрандағы сырғымалы жолдың енін көрсетеді. Оны да биіктік сияқты пайызбен көрсетеміз.(%)
Мысалы:
html
head
title Мысал /title/head
bodytext=red
center
h2 мысал: сырғымалыжол /h2 hr
h3 Marquee bgcolor = «blue» behavior= «Scrool Direction» right=30>бұл алғашқы сырғымалы жол
Marquee h3
p Marquee bgcolor=« green» height=30 widh=90 %
Бұл екінші сырғымалы жол /Marquee
p Marquee bgcolor=« green» «behavior=» «alternate» Direction= «left»
Height=30>бұл үшінші сырғымалы жол / Marquee
hr
/center
/body
/html
IV. Кіріспе нұсқауды бекіту:
Оқушыларға сұрақтар қою арқылы жаңа сабақ барысын қаншалықты дұрыс игере білгендіктері талданады.
- Веб құжат құру барысында қолданылатын тегтерді атаңыз?
- Веб құжаттың құрылымын атап өтіңіз
- Веб құжатта сырғымалы жол қалай ұйымдастырылады?
V. Құрал - жабдықтарды пайдалана отырып, жаттығу жұмыстарын көрсету: 
Компьютерлік жабдықтарды қолдана отырып веб беттерін құру және оны құру барысында қолданылатын тегтермен тереңірек таныстыру;
VI. Ағымдық нұсқау:
Оқушылардың тақырып бойынша игерген білімін жетілдіре түсу үшін зертханалық жұмыс орындау тапсырылады;
VIІ. Тексеру мақсатында оқушылардың жұмыс орындарын аралау:
Бірінші тексеру - жұмыс орнын тексеру (оқушыларға аса мән беру); Екінші - жұмыс амалдарын тексеру (оқушыға аса мән беру); Үшінші - өзін ұстауды тексеру (оқушыға аса мән беру); Төртінші тексеру – техникалық жағдайды дұрыс қолдануын тексеру (оқушыға аса мән беру).
VIІІ. Қорытынды нұсқау: 
1. Сабақ бойынша қорытынды
2. Әрбір оқушының сабаққа араласу барысын бағалау;
3. Сабақты жақсы меңгерген оқушыны атау;