HTML web-сайттарын әзірлеу әдістері ҚМЖ 10 сынып

Тақырып бойынша 11 материал табылды

HTML web-сайттарын әзірлеу әдістері ҚМЖ 10 сынып

Материал туралы қысқаша түсінік

Дайын қмж

Материалдың қысқаша нұсқасы

Қысқа мерзімді сабақ жоспары

Мектеп:
Бөлім:		10.3А Web-жобалау
Мұғалімнің аты-жөні:
Күні:
Сынып: 10		Қатысқандар саны: Қатыспағандар саны:
Сабақтың тақырыбы:		HTML web-сайттарын әзірлеу әдістері
Оқу бағдарламасына сәйкес оқумақсаттары:		10.4.2.1 web-парақшаларды әзірлеуде HTML-тегтерін қолдану
Сабақ мақсаттары:		Веб беттің негізгі тегтерін атайды және қызметтерін сиппаттайды; Веб құжатты құру барысында құжатты құру, іске қосу және сақтау ережелерін қолданады; Веб сайт әзірлеу әдістерін атайды;
Бағалау критерийі:		HTML тілінде веб программалау ұғымдарын (элемент, тег, атрибут) түсіндіреді; Веб бетінің негізгі тегтерін және қызметін анықтайды; HTML құжатын құрады;
ЕБҚБ сипаттамасы		Ақыл-ой және физикалық дамуы бұзылмаған, жергілікті қоғамға бейімделуде қиындықтарға тап болған
Ерекше білімді қажет ететін оқушыға арналған сабақ мақсаты		HTML тілінде веб программалау ұғымдарын (элемент, тег, атрибут) түсіндіреді; Веб бетінің негізгі тегтерін және қызметін анықтайды;
Ойлау деңгейінің дағдылары:		Қолдану
Сабақтың жоспары
Сабақ кезеңдері/уақыт	Мұғалімнің іс-әрекеті		Оқушының іс-әрекеті	Бағалау	Ресурстар
Сабақтың басы 5 мин	Оқушылармен сәлемдесу, сабаққа дайындығын тексеру Психологиялық көңіл-күйді көтеру үшін оқушыларға Ынтымақтастық атмосферасын қалыптастыру «Мақсаттар ағашы». Оқуға мотивацияны ынталандыру үшін жаттығуды орындау. 3. Оқушыларды топтарға бөлу (орналастыру) Сыныптағы оқушыларды Flippity.net онлайн бағдарламасы арқылы 3 топқа топтастыру. 4. «Ой қозғау» әдісі Оқушылардың қызығушылығын ояту және тақырып бойынша білімін анықтау мақсатында сұрақ қойылады: Сайт дегеніміз не? Сайтқа қандай ақпаратты орналастыруға болады? Сайтты кімдер және қалай жасайды? 5. Сабақтың тақырыбы мен сабақ мақсатымен таныстыру.		1. Мұғаліммен сәлемдеседі. 2.Ынтымақтастық атмосферасын құрады. Әр оқушы жасыл жапырақты жапсырады. Жапырақтың бір жағына, оқушылар өздерінің жеке мақсаттарын, яғни ол осы тақырып бойынша қандай ақпарат алу керектігін білгісі, түсінгісі келетінін жазады. 3. Есімдері бір топта (қатарда) көрсетілген оқушылар шағын топтарға бірігеді. ЕБҚБ өз есімі қатар көрсетілген топта бірге топтасады, мұғалімге жақын орынға отырады 4. Оқушылар сұраққа жауап береді 5.Сабақ тақырыбын, тірек сөздерді дәптерге жазады, мақсатымен танысады.	Ауызша мадақтау, ынталандыру	1.Интерактивті тақта 2.Стикерлер 3 Интербелсен.тақта «Online Flippity.net» сайты Flippity.net: Flashcards and Other Resources for Educators and Learners 4.Слайд 5.Дәптер, оқулық
Сабақтың ортасы 7 мин 7 мин 5 мин 15 мин Сабақтың соңы: 3 мин Рефлексия 3мин	6. «Графикалық органайзер» әдісі. Бейнероликпен жұмыс . Жаңа тақырыпқа ендіру мақсатында Веб беттер дегеніміз не? Веб сайтарды әдістерді жайлы ақпараттармен танысуды ұйымдастыру. Бейнежазба мазмұны бойынша топтық талқылауды ұйымдастыру және графикалық органайзерді толтыруды ұсыну. №1 қосымша Дескриптор: -Веб-сайт ұғымына анықтама береді; -Элемент ұғымына анықтама береді; -Атрибут ұғымына анықтама береді; -Тег ұғымына анықтама береді. 7. Мәтінмен жұмыс. №2 қосымша. HTML тілінің құрылымын және негізгі тегтерін таныстыру мақсатында «Ойлан,жұптас,бөліс» әдісі бойынша жұптық жұмыс. Дескриптор: HTML тілінің қандай тіл екенін анықтайды. - <HTML> тегінің сипаттамасын береді; - <HEAD> тегінің сипаттамасын береді; - <BODY> тегінің сипаттамасын береді; - <TITLE> тегінің сипаттамасын береді; -notepad ортасына тапсырма кодын енгізеді; - нәтижесін талдайды. ЕБҚБ тапсырмасы: HTML тілінің негізгі терминдерін анықтаңыз (бірнеше дұрыс жауапты таңдаңыз): а)элементтер б) атрибуттар в) тегтер г) мәтін д)сан Дескриптор: - HTML тілінің негізгі терминдерін анықтайды. 8.NotePad++ туралы шағын лекциясы Веб бет жасаудағы NotePad++ тег редакторында веб парақша құру жөнінде ақпарат беріледі. №3 қосымша Дескриптор: NotePad++ қосымшасы туралы ақпарат алады; веб парақша құруды үйренеді. 9. Компьютер және ақпараттық сауаттылық тапсырмасы Практикалық жұмыс (жеке жұмыс). Мерейтой Ахмет Байтұрсынұлы 1872 жылы 5 қыркүйектe қазіргі Қостанай облысы, Жангелді ауданы Сарытүбек ауылында дүниеге келген. Қазақтың ақыны, әдебиет зерттеуші ғалым, түркітанушы, публицист, педагог, аудармашы және қоғам қайраткері, Қазақ халқының 20 ғасырдың басындағы ұлт-азаттық қозғалысы жетекшілерінің бірі, мемлекет қайраткері, қазақ тіл білімі мен әдебиеттану ғылымдарының негізін салушы ғалым, ұлттық жазудың реформаторы, ағартушы және Алаш-Орда өкіметінің мүшесі. Ахмет Байтұрсыновтың 150 жылдығына орай мектеп оқушыларының арасында Ахмет Байтұрсыновтың ағартушылық еңбек жолын жас ұрпаққа насихатау барысында веб сайт жасау тапсырмасы берілген. Веб сайтты құруға көмектесіңіз. Ол үшін NotePad++ тег редактор көмегімен алғашқы бетін жасауға көмектесіңіз. Дескриптор - NotePad++ тег редакторымен танысады; - Программалық кодын жазу арқылы веб-бет құрады. -веб-бетті сақтайды; - браузерден көреді. 10. Сабақты бекіту. Қалыптастырушы бағалау тапсырмасы Оқу бағдарламасына сәйкес оқыту мақсаттары: 10.4.2.1 web-парақшаларды әзірлеуде HTML-тегтерін қолдану Бағалау критерийлері: Білім алушы: Веб бетінің негізгі тегтерін және қызметін анықтайды; Берілген тегтерді қызметтеріне қарай сәйкестендіріңіз. №4 қосымша Дескриптор -тегтерді қызметтеріне қарай сәйкестендіреді; 11. Сабақ мақсатына және бағалау критерийіне қайта оралу және «Рефлексиялық жазба» әдісі бойынша рефлексия жасауды сұрау 1.Бүгінгі сабақ бойынша не білемін? 2.Нені үйрендім? 3. Түсінбей қалғаным.... 12.Үйге тапсырма: Интернет желісі ресурстарын пайдаланып, заманауи web-парақтар құру құралдары туралы немесе Html тегтері жайлы хабарлама дайындау		6.Бейнероликті мұқият қарайды. Веб сайт ұғымына анықтама береді, қазіргі веб сайт әзірлеудің әдістерін жазады. HTML тілінде веб программалау ұғымдарын (элемент, тег, атрибут) сипаттап графикалық органайзерді толтырады. №1 қосымша Топтар «айналмалы бекіт» әдісі бойынша өзара жұмыстарымен танысады, бағалайды. 7.Оқушылар шағын топта бір-бірімен жұптасады. Мәтінді оқып, берілген сұрақтарға бірлесе отырып жауап береді. Шағын топта жұптар өзара жұмыстарымен алмасып танысады. ЕБҚБ оқушы: HTML тілінің негізгі терминдерін анықтайды. 8.Оқушылар мұқият тыңдайды, NotePad++ тег редакторында мұғаліммен бірге код жазып үйренеді. 9. NotePad++ тег редакторында программаның кодын жазып, веб-сайт құрады. Веб-сайтты сақтап, оны браузерден ашып көреді. 10. Оқушылар қалыптастырушы тапсырмаларын жеке жеке орындайды. ЕБҚБ оқушы қалыптастырушы тапсырманы мұғалім көмегімен орындайды 11. Оқушылар берілген сұрақтар бойынша рефлексиялық жазба жасайды. 12.Оқушылар үй тапсырмасын белгілеп алады.	Оқулықтағы дұрыс жауап нұсқасымен салыстырып өзін-өзі бағалайды «Сэндвидч» әдісі бойынша дескрипторды қолданып жұптар бір-бірін бағалайды Мұғалімнің кері байланысы «екі жұлдыз бір тілек» әдісі	1.Интербелсенді тақта, https://www.youtube.com/watch?v=WfJfxRNtvCY №1 қосымша материал HTML web-сайттарын әзір леу әдістері Информатика Г.Салғараева 10 сыныпқа арналған оқулық – 124бет №2 қосымша материал Компьютер ,NotePad++,слайд №3 қосымша Компьютер, оқулық, NotePad++ №4 қосымша материал

Қосымша №1

«Графикалық органайзер»

Топ атауы

Веб сайт дегеніміз не?

Элемент дегеніміз не?

Атрибут дегеніміз не?

Тег дегеніміз не?

Дескриптор:

-Веб-сайт ұғымына анықтама береді;

-Элемент ұғымына анықтама береді;

-Атрибут ұғымына анықтама береді;

-Тег ұғымына анықтама береді.

Қосымша №2

Тапсырма мәтіні

Компьютер немесе басқа да электронды құрылғыларда оқылатын мәтіндер гипермәтін деп аталад. Гипермәтін терминін алғаш рет америкалық әлеуметтанушы, философ Тед Нельсон 1963 жылы айналымға енгізді. Ал 1986 жылы Халықаралық Стандарттау ұйымының «Standart Generalized Markup Language» деп аталатын ISO-8879 стандартын қабылдауы HTML тілінің пайда болуына негіз болды. Гипермәтінді белгілеу тілі web-браузерде web-беттерді және басқа да ақпараттарды шығару үшін қолданылатын ең басты белгілеу тілі, яғни құжатқа қойылатын тегтердің көмегімен құжаттың логикалық құрылысын сипаттайды, құжатты форматтауды және нысандарды қоюды басқарады.

HTML - гипермәтінді белгілеу тілі. Ол кәдімгі мәтіндерді web беттер түрінде бейнелеуге арналған ережелер жиынын анықтайды.

HTML тілінде қолданылатын командалар «тег» деп аталады. HTML тіліндегі тегтер еі топқа бөлінеді: жұпты,жұпсыз.

Жұпты тегтер бір тег ашылса, келесі тег оны жабады. Мысалы: <html> тегтің жұмысын ашады, келесі </html> тегі оны жабады.

Жұпсыз тегтер – тег ашылып, жабылуды қажет етпей олданыла беретін тегтер.

Веб құжат-тегтермен толықтырылған мәтіндік файл, оның мәтіндерін бір-бірімен байланыстыра отырып, белгілеуге мүмкіндік беретін HTML тілі.

Веб-бет негізгі үш құрамды бөліктерден тұрады:

<HTML>

<HEAD>

</HEAD>

<BODY>

1-тапсырма

HTML тілі дегеніміз...

А.Гипермәтіндік

В.Web беттер

С.Логикалық

2-тапсырма

Кестеде берілген тегтердің сипаттамасын жазыңыз

Тег атауы	Сипаттамасы
<HTML> .... </HTML>
<HEAD> ..... </HEAD>
<BODY> ... </BODY>
<TITLE> …. </TITLE>

Тапсырма типі	Ақпараттық
Мәтінді оқу жағдайлары	Білім алу мақсатындағы
Мәтіннің түрі	Аралас мәтін
Когнитивті процесс	Ақпараты табу және алып шығу
Жауаптар формасы	Бір дұрыс жауапты таңдау

Дескриптор:

- <HTML> тегінің сипаттамасын береді;

- <HEAD> тегінің сипаттамасын береді;

- <BODY> тегінің сипаттамасын береді;

- <TITLE> тегінің сипаттамасын береді;

3-тапсырма

Суретте көрсетілген HTML кодын қарай отырып, нәтижені анықтаңыз

_____________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________

Тапсырма типі	Интерпретациялау
Мәтінді оқу жағдайлары	Білім алу мақсатындағы
Мәтіннің түрі	Аралас мәтін
Когнитивті процесс	Мәтінді интерпретациялау
Жауаптар формасы	Бір дұрыс жауапты таңдау

Дескриптор:

-notepad ортасына тапсырма кодын енгізеді;

- нәтижесін талдайды.

ЕБҚБ тапсырмасы:

HTML тілінің негізгі терминдерін анықтаңыз (бірнеше дұрыс жауапты таңдаңыз):

а)элементтер

б) атрибуттар

в) тегтер

г) мәтін

д)сан

Қосымша №3

Notepad++ - Windows амалдық жүйесіне арналған GPL рұқсатқағазымен азат таратылатын мәтін өңдеуіші. Бұл бағдарлама STL кітапханасын пайдаланып C++ бағдарлау тілінде жазылған, негізгі құраласы - Scintilla өңдеу модулі. Мәтін өңдеуіші өздігенен бөлектеп бірталай бағдарлау телдері мен белгілеу жүйелерін қолдайды. Бағдарламаның негізгі жетелігі кеңейтімдер (plugins) арқылы, не сыртқы модулдер арқылы кеңейте алынады.

1.Беттің барлық компоненттерін сақтау үшін Windowsжүйесінде жаңа бума (каталог) құрыңыз.

2. Іске қосу (Пуск) батырмасын және notepad++.exe белгішені басыңдар.

3. Notepad++ редакторы ашылады.

4. 1,3,а-суретте көрсетілген программа кодын енгізіңіз.

<html>

<head>

<title>Internet</title>

</head>

<body>

<h1>Бірінші веб-бет</h1>

<br>

<hr>

<h2>Мұнда сіз біле аласыз:</h2>

<br>

<p><b>HTML деген не?</b></p>

<p><i>HTML негізгі түсініктері</i></p>

<p><u>Web-бетті қалай құруды</u></p>

</body>

</html>

Қосымша №4

Қалыптастырушы бағалау тапсырмасы

Оқу бағдарламасына сәйкес оқыту мақсаттары: 10.4.2.1 web-парақшаларды әзірлеуде HTML-тегтерін қолдану

Бағалау критерийлері:

Білім алушы:

Веб бетінің негізгі тегтерін және қызметін анықтайды;

Берілген тегтерді сипаттамасына қарай сәйкестендіріңіз

Р/с	Тегтер атауы	Сипаттамасы
1	<HTML>	Парақтың барлық мазмұны көрінеді
2	<body>	Тақырып тегтері орналасады
3	<head>	HTML беті екенін айтады
4	<title>	Бұл тегтер ортасында орналасқан барлық нәрслерді ортаға түзетеді
5	<center>	Бұл тегте браузердің жоғарығы жағында көрсетілген бет тақырыбы жазылады

1)_____, 2) _____,3)_____, 4)_____, 5)_____,

Дескриптор

-тегтерді қызметтеріне қарай сәйкестендіреді;

Жүктеу

Бөлісу

ЖИ арқылы жасау

Файл форматы:

doc

Информатика Ашық сабақ 10 сынып

17.02.2025

213

Жүктеу

ЖИ арқылы жасау

Жариялаған:

Ертай Ақерке Ерланқызы

Бұл материалды қолданушы жариялаған. Ustaz Tilegi ақпаратты жеткізуші ғана болып табылады. Жарияланған материалдың мазмұны мен авторлық құқық толықтай автордың жауапкершілігінде. Егер материал авторлық құқықты бұзады немесе сайттан алынуы тиіс деп есептесеңіз,
шағым қалдыра аласыз

HTML web-сайттарын әзірлеу әдістері ҚМЖ 10 сынып

HTML web-сайттарын әзірлеу әдістері ҚМЖ 10 сынып

Химия пәні

Тарих пәні

Биология пәні

Ағылшын тілі пәні

География пәні

Информатика пәні

Мектепке дейінгі білім беру

«Қазақ тілі» жəне «Қазақ əдебиеті»

Дене шынықтыру

Білім алушылардың білім сапасын арттыру

Инклюзивті білім беру