жүктеу мүмкіндігіне ие боласыз
Бұл материал сайт қолданушысы жариялаған. Материалдың ішінде жазылған барлық ақпаратқа жауапкершілікті жариялаған қолданушы жауап береді. Ұстаз тілегі тек ақпаратты таратуға қолдау көрсетеді. Егер материал сіздің авторлық құқығыңызды бұзған болса немесе басқа да себептермен сайттан өшіру керек деп ойласаңыз осында жазыңыз
HTML тілі .(аш ти эм эл)
|
Қысқа мерзімді жоспары |
||||
|
Бөлім |
Веб-жобалау |
|||
|
Педагогтың аты-жөні |
|
|||
|
Күні |
|
|||
|
Сынып 10 ә |
Қатысушылар саны |
|
Қатыспағандар саны |
|
|
Сабақтың тақырыбы: |
||||
|
Оқу бағдарламасына сәйкес оқыту мақсаттары |
10.4.2.1 web (веб)-парақшаларды әзірлеуде HTML (аш ти эм эл)- тегтерін қолдану |
|||
|
Сабақтың мақсаты: |
|
|||
Сабақтың барысы:
|
Сабақ кезеңі/уақыт |
Педагогтің әрекеті |
Оқушының әрекеті |
Бағалау |
Ресурстар |
||||||||||||||||||||||||||||||||
|
1-5 мин |
Сабақтың тақырыбын түсіндіру, HTML тілінің негізгі құрылымын таныстыру. |
Оқушылар мұқият тыңдайды, сұрақтар қояды. |
Оқушылардың сұрақ қою белсенділігі. |
Тақта, слайдтар. |
||||||||||||||||||||||||||||||||
|
5-10 мин |
HTML тілінде кесте құрылымын түсіндіру: <table>, <tr>, <th>, <td>. Мысал көрсету. |
Оқушылар HTML тегтерін жазып, мысалды қайталайды. |
Түсінгенін тексеру, үлгі бойынша жұмыс. |
Интербелсенді тақта, HTML редактор. |
||||||||||||||||||||||||||||||||
|
10-20 мин |
Оқушыларға кесте құрудың қадамдарын түсіндіру. Тапсырмаларды тарату. |
Оқушылар жеке жұмыс жасайды, HTML тілінде кесте құрады. |
Жұмыс нәтижесін тексеру, қажет болса көмек көрсету. |
Компьютер, HTML редактор. |
||||||||||||||||||||||||||||||||
|
20-30 мин |
Топтық жұмыс: Оқушыларға топ ішінде үлкенірек кесте құру тапсырмасы беріледі (мысалы, студенттердің мәліметтерін кесте түрінде көрсету). Топтық тапсырма: Мақсаты: Оқушылардың топта жұмыс істеу дағдыларын дамыту, HTML тілінде күрделі кесте құруды үйрету. Тапсырма: Оқушылар өздері таңдап алған тақырып бойынша топта үлкен кесте құрады (мысалы, студенттердің аты-жөні, бағалары, пәндер тізімі).
Дискрипторлар:
Жеке тапсырма: Мақсаты: Оқушыларға HTML тілінде қарапайым кесте құруды үйрету. Тапсырма: Төмендегі мәліметтерді HTML тілінде кесте түрінде құрыңыз:
Дискрипторлар:
|
Оқушылар топта бірігіп жұмыс істейді, кесте құрады. |
Топ жұмысының нәтижесін бағалау. Бағалау критерийлері:
Бағалау критерийлері:
|
Компьютер, HTML редактор. |
||||||||||||||||||||||||||||||||
|
30-40 мин |
Жұптық жұмыс: Әр оқушы өзінің құрастырған кестесін жұптасып талқылайды, пікірлер алмасады. Мақсаты: HTML тілінде құрылған кестелерді жұпта талқылау және дұрыс жасау дағдыларын дамыту. Тапсырма: Әр жұпқа бір кесте беріледі, онда 5 баған мен 5 жол болады. Оқушылар кестелерді талқылап, қажет болса өзгертулер енгізеді.
Дискрипторлар:
|
Оқушылар жұптасып жұмыс істейді, бір-біріне түсінік береді. |
Бағалау критерийі |
Балл |
||||||||||||||||||||||||||||||||
|
40-45 мин |
Сабақты қорытындылау, кері байланыс беру. Үй тапсырмасын хабарлау. |
Оқушылардың сабақты қаншалықты меңгергенін сұрау, пікірлерін тыңдау. |
Оқушы кесте құрылымын дұрыс құрады. |
5 балл |
||||||||||||||||||||||||||||||||
|
|
|
|
HTML тегтерін дұрыс қолданады. |
5 балл |
||||||||||||||||||||||||||||||||
|
|
|
|
Кестенің мазмұнын дұрыс орналастырады. |
5 балл |
||||||||||||||||||||||||||||||||
|
|
|
|
Кесте дизайнын жақсарту үшін CSS қолданады. |
5 балл |
||||||||||||||||||||||||||||||||
|
|
|
|
Тапсырмаларды уақытында орындап, көрсетілген нұсқауларды дұрыс орындайды. |
5 балл |
Үй тапсырмасы:
-
HTML тілінде өзіңіз туралы мәліметтерді (аты-жөніңіз, жасыңыз, қалаңыз) көрсететін кесте құрыңыз.
-
Кестеге кемінде 5 жол және 3 баған қосыңыз.
-
Кестенің дизайнын жақсарту үшін, CSS көмегімен әр бағанның түсін өзгертіңіз.
![]()
![]()
Жұптық тапсырма:
![]()
Жалпы бағалау критерийлері:
Бұл ҚМЖ жоспары оқушылардың функционалдық сауаттылығын дамытуға, HTML тіліндегі кестелермен жұмыс істеу дағдыларын арттыруға бағытталған. Жеке, жұптық, және топтық тапсырмалар әртүрлі жұмыс түрлерін қамтып, оқушылардың өзара қарым-қатынастарын дамытуға ықпал етеді.
1. Сабақ кестесін құру
Қадам 1: HTML құжатын ашып, негізгі құрылымды құрыңыз:
html
Копировать
<!DOCTYPE html>
<html lang="kk">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Сабақ кестесі</title>
</head>
<body>
<h1>Сабақ кестесі</h1>
<table border="1">
<tr>
<th>Күн</th>
<th>1-ші сабақ</th>
<th>2-ші сабақ</th>
<th>3-ші сабақ</th>
<th>4-ші сабақ</th>
<th>5-ші сабақ</th>
</tr>
<tr>
<td>Дүйсенбі</td>
<td>Математика</td>
<td>Физика</td>
<td>Қазақ тілі</td>
<td>Биология</td>
<td>Химия</td>
</tr>
<tr>
<td>Сейсенбі</td>
<td>Информатика</td>
<td>География</td>
<td>Английский</td>
<td>Әдебиет</td>
<td>Дене шынықтыру</td>
</tr>
<tr>
<td>Бейсенбі</td>
<td>Математика</td>
<td>Химия</td>
<td>Тарих</td>
<td>Музыка</td>
<td>География</td>
</tr>
</table>
</body>
</html>
Қадам 2: Кодтың түсіндірмесі:
-
<table> — кестені бастайды.
-
<tr> — әр жолды білдіреді.
-
<th> — тақырып ұяшықтары, яғни кестенің басында болатын жазулар.
-
<td> — мәліметтер ұяшықтары, яғни әр сабақтың атауы.
Қадам 3: Құжатты браузерде ашып, кестенің дұрыс көрінуін тексеріңіз.
2. Дүкеннің тауарлар тізімі
Қадам 1: HTML құрылымын дайындаңыз:
html
Копировать
<!DOCTYPE html>
<html lang="kk">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Дүкеннің тауарлар тізімі</title>
</head>
<body>
<h1>Дүкеннің тауарлар тізімі</h1>
<table border="1">
<tr>
<th>Тауар атауы</th>
<th>Бағасы (тг)</th>
<th>Мөлшері</th>
<th>Сипаттамасы</th>
</tr>
<tr>
<td>Смартфон</td>
<td>150,000</td>
<td>1 дана</td>
<td>6 дюйм, 128 ГБ жады</td>
</tr>
<tr>
<td>Ноутбук</td>
<td>300,000</td>
<td>1 дана</td>
<td>15.6 дюйм, Intel Core i7</td>
</tr>
<tr>
<td>Құлаққап</td>
<td>15,000</td>
<td>1 жұп</td>
<td>Беспроводной, шумоподавление</td>
</tr>
</table>
</body>
</html>
Қадам 2: Кодтың түсіндірмесі:
-
Кестеде тауардың атауы, бағасы, мөлшері және сипаттамасы көрсетілген.
-
<table border="1"> кестенің жиектері болатынын көрсетеді.
-
<th> — кестенің тақырыптарын көрсетеді, ал <td> — әрбір ұяшықтағы мәліметтерді орналастырады.
Қадам 3: Құжатты браузерде ашып, дүкеннің тауарлар тізімінің дұрыс көрінуін тексеріңіз.
![]()
Дүкеннің тауарлар тізімі
|
Тауар атауы |
Бағасы (тг) |
Мөлшері |
Сипаттамасы |
|
Смартфон |
150,000 |
1 дана |
6 дюйм, 128 ГБ жады |
|
Ноутбук |
300,000 |
1 дана |
15.6 дюйм, Intel Core i7 |
|
Құлаққап |
15,000 |
1 жұп |
Беспроводной, шумоподавление |
3. Отбасы мүшелері туралы мәлімет
Қадам 1: HTML құжатын ашып, отбасы мүшелері туралы кесте құрыңыз:
html
Копировать
<!DOCTYPE html>
<html lang="kk">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Отбасы мүшелері</title>
</head>
<body>
<h1>Отбасы мүшелері</h1>
<table border="1">
<tr>
<th>Аты-жөні</th>
<th>Жасы</th>
<th>Қызметі</th>
<th>Сүйікті ісі</th>
</tr>
<tr>
<td>Әкем</td>
<td>45</td>
<td>Дәрігер</td>
<td>Балық аулау</td>
</tr>
<tr>
<td>Анам</td>
<td>42</td>
<td>Мұғалім</td>
<td>Кітап оқу</td>
</tr>
<tr>
<td>Інім</td>
<td>18</td>
<td>Студент</td>
<td>Спортпен шұғылдану</td>
</tr>
</table>
</body>
</html>
Қадам 2: Кодтың түсіндірмесі:
-
<h1> — тақырып, яғни отбасы мүшелері туралы ақпарат.
-
<table border="1"> кестені бастайды және оны визуалды түрде көруге мүмкіндік береді.
Қадам 3: Құжатты браузерде ашып, отбасы мүшелері туралы мәліметтің дұрыс көрінуін тексеріңіз.
![]()
4. Спорттық жарыс нәтижелері
Қадам 1: HTML құжатын ашып, спорттық жарыс нәтижелерін көрсететін кесте жасаңыз:
html
Копировать
<!DOCTYPE html>
<html lang="kk">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Спорттық жарыс нәтижелері</title>
</head>
<body>
<h1>Спорттық жарыс нәтижелері</h1>
<table border="1">
<tr>
<th>Ойыншы аты</th>
<th>Команда</th>
<th>Голдар саны</th>
<th>Позиция</th>
</tr>
<tr>
<td>Әлихан</td>
<td>Алматы</td>
<td>2</td>
<td>Шабуылшы</td>
</tr>
<tr>
<td>Рахман</td>
<td>Астана</td>
<td>1</td>
<td>Қорғаушы</td>
</tr>
<tr>
<td>Сұлтан</td>
<td>Шымкент</td>
<td>3</td>
<td>Шабуылшы</td>
</tr>
</table>
</body>
</html>
Қадам 2: Кодтың түсіндірмесі:
-
Спорттық жарыс нәтижелері туралы ақпаратты көрсететін кесте құрылды.
-
Әрбір ұяшықта ойыншының аты, командасы, голдар саны және оның позициясы көрсетілген.
Қадам 3: Құжатты браузерде ашып, спорттық жарыс нәтижелерінің дұрыс көрінуін тексеріңіз.
Спорттық жарыс нәтижелері
|
Ойыншы аты |
Команда |
Голдар саны |
Позиция |
|
Әлихан |
Алматы |
2 |
Шабуылшы |
|
Рахман |
Астана |
1 |
Қорғаушы |
|
Сұлтан |
Шымкент |
3 |
Шабуылшы |
![]()
Отбасы мүшелері
|
Аты-жөні |
Жасы |
Қызметі |
Сүйікті ісі |
|
Әкем |
45 |
Дәрігер |
Балық аулау |
|
Анам |
42 |
Мұғалім |
Кітап оқу |
|
Інім |
18 |
Студент |
Спортпен шұғылдану |
Қорытынды:
-
HTML кестелері <table>, <tr>, <th>, және <td> тегтері арқылы құрылып, мәліметтер нақты және көрнекі түрде беріледі.
-
Тегтерді дұрыс қолдану, кестелерді ұйымдастыру және көрнекі етіп көрсету — бұл HTML тіліндегі негізгі дағдыларды дамытуға көмектеседі.
Дүкеннің тауарлар тізімі
|
Тауар атауы |
Бағасы (тг) |
Мөлшері |
Сипаттамасы |
|
Смартфон |
150,000 |
1 дана |
6 дюйм, 128 ГБ жады |
|
Ноутбук |
300,000 |
1 дана |
15.6 дюйм, Intel Core i7 |
|
Құлаққап |
15,000 |
1 жұп |
Беспроводной, шумоподавление |
шағым қалдыра аласыз



Бұл курс Қазақстан Республикасы Оқу-ағарту министрлігімен келісілген