ЖИ көмекші
0 / 1
Барлық 400 000 материалдарды тегін жүктеу үшін
Ұнаған тарифті таңдаңыз
Айлық
Жылдық
1 - күндік
Танысу 690 ₸ / 1 күнге
Таңдау
UstazTilegi AI - ЖИ арқылы тегін ҚМЖ, БЖБ, ТЖБ, тест, презентация, авторлық бағдарлама т.б. 10 материал жасау
Материалдар бөлімі - Барлық 400 000 материалдарды тегін 30 материал жүктеу
Аттестация ПББ тестеріне доступ аласыз шексіз
Көрнекілік бөлімі - 10 000 астам көрнекіліктерді жүктеу Күніне 2 көрнекілік жүктеу
Жеке ҚМЖ бөлімінде - дайын ҚМЖ-ларды, презентацияларды жүктеу5 файлды тегін жүктеу
Олимпиада, турнир, байқауларға 50% жеңілдік
1 - айлық
Стандарт
2990 ₸ / айына
UstazTilegi AI - ЖИ арқылы тегін ҚМЖ, БЖБ, ТЖБ, тест, презентация, авторлық бағдарлама т.б. жасау 30 материал жасау
Материалдар бөлімі - Барлық 400 000 материалдарды тегін 900 материал жүктеу
Аттестация ПББ тестеріне доступ аласыз шексіз
Көрнекілік бөлімі - 10 000 астам көрнекіліктерді жүктеу30 көрнекілік жүктеу
Жеке ҚМЖ бөлімінде - дайын ҚМЖ-ларды, презентацияларды жүктеу 150 файлды тегін жүктеу
Жинақталған ҚМЖ бөлімінде 10 файлды тегін жүктеу
Олимпиада, турнир, байқауларға 50% жеңілдік
Іс-шаралар (мини-курстар, семинарлар, конференциялар) тегін қатысу
1 - айлық
Шебер 7990 ₸ / айына
Таңдау
UstazTilegi AI - ЖИ арқылы тегін ҚМЖ, БЖБ, ТЖБ, тест, презентация, авторлық бағдарлама т.б. жасау 150 материал жасау
Материалдар бөлімі - Барлық 400 000 материалдарды тегін 900 материал жүктеу
Аттестация ПББ тестеріне доступ аласыз шексіз
Көрнекілік бөлімі - 10 000 астам көрнекіліктерді жүктеу90 көрнекілік жүктеу
Жеке ҚМЖ бөлімінде - дайын ҚМЖ-ларды, презентацияларды жүктеу 300 файлды тегін жүктеу
Жинақталған ҚМЖ бөлімінде 50 файлды тегін жүктеу
Олимпиада, турнир, байқауларға 50% жеңілдік
Іс-шаралар (мини-курстар, семинарлар, конференциялар) тегін қатысу
Назар аударыңыз!
Сіз барлық мүмкіндікті қолдандыңыз.
Қалған материалдарды ертең жүктей аласыз.
Ок
Материалдың қысқаша нұсқасы
Сабақ жоспары №12
|
Сабақ тақырыбы |
5.2.1. HTML құжаты. Сайттың басты беті. 5.2.2. Веб-сайт беттерін стильдеу үшін каскадтық стиль кестелерін ( CSS) пайдалану. |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Модуль /пән атауы |
Информатика |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Дайындаған педагог |
Шыңғысова Айнұр Қуанышқызы |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Күні |
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Курс, топ |
1 курс |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Сабақтың түрі |
аралас |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Міндеттер |
HTML және CSS тегтерін пайдалана отырып, техника-технологиялық салаға арналған веб-сайтты жасайды. |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Мақсаты |
1) HTML тегтері арқылы веб-сайтты әзірлеу; 2) Веб-беттерді әзірлеу кезінде CSS қолданады; |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Күтілетін нәтижелер |
HTML және CSS тегтері арқылы web – бет жасайды. |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Қажетті ресурстар және АКТ |
Информатика 10- сынып, ДК, интерактивті тақта, Visual studio code бағдарламасы |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Сабақтың барысы |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Кезеңі / Уақыты |
Сабақта жоспарланған іс-әрекет |
Ресурсы |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|
Сәлемдесу. Түгендеу.Ұйымдастыру кезеңі.
. |
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Психологиялық ахуал (7 минут) |
Жаңа тақырыпты түсіндіру. «Миға шабуыл» әдісі арқылы шағын дәріс. Web-бет – бұл мәтіннен, графикалық иллюстрациялардан, мультимедиалық нысандардан тұратын құжаттар жиынтығы. Файлдардың басым көпшілігі web-бет түрінде HTML (Hyper Text Markup Language – гипермәтінді белгілеу тілі) тілінде жазылған арнаулы файлдар түрінде болады. HTML гипермәтіндік тілін 1989 жылы Тим Бернерс-Ли ұсынған. HTML құжатында өзінің арнайы тегдері болады.Тегтер программалау тілдеріндегі «BEGIN END» жақша ұғымдарына жақын және жергілікті айнымалылардың HTML атауларының арасындағы амалдардың аймағын білдіреді. Құжаттағы мәтіндік элементтерді түсіндіру ережелерінің амалдарын анықтайды. CSS (Cascading Style Sheets – каскадтық стильді кестелер) – HTML, XHTML, т.б. белгілеу тілдерінде жазылған web-беттердің сыртқы көрінісін безендіретін, әрлейтін тіл. бұл тілде web-беттердің сыртқы көрінісіндегі қаріптер мен түстердің орналасуы, блоктар сияқты элементтерді жасауға болады. белгілеу тілдерінде (HTML, XHTML, XML, т.б.) web-беттердің логикалық құрылымдары мен сыртқы көріністерін безендіруді бір-бірінен бөліп қарастыруға болады. Әрқайсысы бөлек болса, сайт жасағанда да, сайттың кодын оқығанда да түсінікті болады. |
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Мақсаты мен міндетін хабарлау |
Топтық жұмыс «Ойлан-Бірік-Бөліс» әдісі арқылы «Flippity.net» ресурсында топқа бөліп, постерге өз ойларын түсіреді. 1-тапсырма: I – топ: Web- те HTML құжаттын форматтау маңыздылығын көрсетеді. II- топ: HTML құжатында тегтерді пайдаланып, оны CSS- каскадты стиль көмегімен әрлеуді көрсетеді.. |
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
2.1. Алдын ала білім |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Жалпы қайталау (13 минут) |
Жұптық жұмыс (Компьютерлік ақпараттық сауаттылық) «Жұбыңды тап» әдісі арқылы «Flippity.net» ресурсында жұпқа бөлу. 2-тапсырма: Аудиторияда информатика пәні өтіп жатыр, оқытушының бүгінгі күнгі жоспары бойыншы «HTML және CSS тегтерін пайдалана отырып» Web- бет жасау. Студенттер жаңа тақырыпты меңгерген соң «Менің алғашқы сайтым» тақырыбында жұптық жұмыс жасайды. Бірақ жұптық жұмыс жасау барысында Асель мен Дидарда жасаған Web- беттегі суреті және сілтемесі ашылмады. Оның себебі неде? HTML және CSS тегтерін пайдалана отырып, Visual studio code бағдарламасында «Менің алғашқы сайтым» тақырыбында web- бет жасау. Сайтта көрнекілік, қаріп «Times New Roman» өлшемі 12, маркерлік тізім, күнделікті өмірілерініздегі уақытынызды үнемдеу күн тізбелігін кесте түрінде көресту, сурет/бейне жазаба немесе сілтеме болу керек. Сайтты CSS – каскадты стиль арқылы біріктіріп көрнектеу. |
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
2.2. Жаңа материалды зерттеу |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
2.3. Жаңа білімді практикада қолдану |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Бекіту. Бақылау жұмысы (60 минут) |
Жеке жұмыс 3-тапсырма: А - деңгейі: Visual studio code бағдарламасында, төменде көрсетілген тегтерді жалғастырып жазып төмендегі суреттер бойынша, HTML және CSS тегтерін пайдалана отырып ,кестені өзгертетін атрибуттар тізімін құру. Кесте №1. 3 қатар және 4 бағаннан тұратын кесте <html> <head> <title>кесте</title> </head> <body> <h3>кесте </h3> <table cellspacing=0 cellpadding=0 width="60%" border=4> <tr align=center> кесте <th bgcolor=black> <th bgcolor=white>а12 .............................................. </table> </body> </html> Нәтижесі:
Кесте №2. 4 қатар және 2 бағаннан тұратын түстер кестесі <html> <head> <title>кесте түстері</title> </head> <body bgcolor=white> <table width="30%" border=1> <tr> ............... </table> </body> </html> Нәтижесі:
Кесте №3. Пифагор (көбейту) кестесін құрыңдар. <table border=1> <tr> <td > мәтін</td> <td> мәтін</td> <td> мәтін</td> </tr> <tr>
Нәтижесі:
В - деңгейі: Visual studio code бағдарламасында, HTML және CSS тегтерін пайдалана отырып ,кестені өзгертетін атрибуттар тізімін құру.
Кесте №1. 3 қатар және 4 бағаннан тұратын кесте
Кесте №2. Бұл материал сайт қолданушысы жариялаған. Материалдың ішінде жазылған барлық ақпаратқа жауапкершілікті жариялаған қолданушы жауап береді. Ұстаз тілегі тек ақпаратты таратуға қолдау көрсетеді. Егер материал сіздің авторлық құқығыңызды бұзған болса немесе басқа да себептермен сайттан өшіру керек деп ойласаңыз осында жазыңыз Сабақ жоспары №12 Сабақ
тақырыбы 5.2.1. HTML құжаты. Сайттың
басты беті. 5.2.2. Веб-сайт беттерін
стильдеу үшін каскадтық стиль кестелерін ( CSS)
пайдалану. Модуль /пән
атауы Информатика Дайындаған
педагог Шыңғысова Айнұр
Қуанышқызы Күні Курс,
топ 1 курс Сабақтың түрі аралас Міндеттер HTML және CSS тегтерін
пайдалана отырып, техника-технологиялық салаға арналған веб-сайтты
жасайды. Мақсаты 1) HTML тегтері арқылы
веб-сайтты әзірлеу; 2) Веб-беттерді әзірлеу
кезінде CSS қолданады; Күтілетін нәтижелер
HTML және
CSS тегтері арқылы web – бет жасайды. Қажетті ресурстар
және АКТ Информатика 10- сынып, ДК,
интерактивті тақта, Visual studio code
бағдарламасы Сабақтың барысы Кезеңі / Уақыты Сабақта жоспарланған
іс-әрекет
Ресурсы
Ұйымдастырушылық және уәждемелік
Сәлемдесу.
Түгендеу.Ұйымдастыру кезеңі. Сабақтың тақырыбын хабарлау, оқу нәтижесі және бағалау
критерийлерімен таныстыру «Жетістікке жетудін сыры
білімде » мотивациялық бейнеролик
көрсету. .
Психологиялық ахуал (7
минут) Жаңа тақырыпты түсіндіру. «Миға
шабуыл» әдісі арқылы шағын
дәріс.
Web-бет – бұл мәтіннен, графикалық
иллюстрациялардан, мультимедиалық нысандардан тұратын құжаттар
жиынтығы.
Файлдардың басым көпшілігі web-бет түрінде
HTML
(Hyper Text Markup Language – гипермәтінді белгілеу тілі)
тілінде жазылған арнаулы файлдар түрінде болады. HTML гипермәтіндік
тілін 1989 жылы Тим Бернерс-Ли ұсынған. HTML құжатында өзінің
арнайы тегдері болады.Тегтер программалау тілдеріндегі «BEGIN END»
жақша ұғымдарына жақын және жергілікті айнымалылардың HTML
атауларының арасындағы амалдардың аймағын білдіреді. Құжаттағы
мәтіндік элементтерді түсіндіру ережелерінің амалдарын
анықтайды.
CSS (Cascading Style Sheets –
каскадтық стильді кестелер) – HTML, XHTML, т.б.
белгілеу
тілдерінде жазылған web-беттердің сыртқы көрінісін
безендіретін, әрлейтін тіл. бұл тілде web-беттердің сыртқы
көрінісіндегі қаріптер мен түстердің орналасуы, блоктар сияқты
элементтерді жасауға болады. белгілеу тілдерінде (HTML, XHTML, XML,
т.б.) web-беттердің логикалық құрылымдары мен сыртқы көріністерін
безендіруді бір-бірінен бөліп қарастыруға болады.
Әрқайсысы бөлек болса, сайт жасағанда да, сайттың кодын оқығанда да
түсінікті болады. Мақсаты мен міндетін
хабарлау Топтық
жұмыс «Ойлан-Бірік-Бөліс» әдісі
арқылы
«Flippity.net» ресурсында топқа бөліп, постерге өз ойларын
түсіреді. 1-тапсырма:
I –
топ: Web- те HTML құжаттын
форматтау маңыздылығын көрсетеді. II-
топ: HTML құжатында тегтерді
пайдаланып, оны CSS- каскадты стиль көмегімен
әрлеуді көрсетеді..
Теориялық және практикалық 2.1. Алдын ала
білім
Жалпы
қайталау (13
минут)
Жұптық
жұмыс (Компьютерлік ақпараттық
сауаттылық)
«Жұбыңды
тап» әдісі арқылы
«Flippity.net» ресурсында жұпқа бөлу.
2-тапсырма:
Аудиторияда информатика
пәні өтіп жатыр, оқытушының бүгінгі күнгі жоспары бойыншы
«HTML және CSS
тегтерін пайдалана отырып» Web- бет жасау. Студенттер жаңа
тақырыпты меңгерген соң «Менің алғашқы сайтым»
тақырыбында жұптық жұмыс
жасайды. Бірақ жұптық жұмыс жасау барысында Асель мен Дидарда
жасаған Web- беттегі суреті және сілтемесі ашылмады. Оның себебі
неде? HTML және CSS тегтерін пайдалана отырып,
Visual
studio code бағдарламасында «Менің алғашқы
сайтым» тақырыбында web- бет жасау. Сайтта көрнекілік, қаріп «Times
New Roman» өлшемі 12, маркерлік тізім, күнделікті өмірілерініздегі
уақытынызды үнемдеу күн тізбелігін кесте түрінде көресту,
сурет/бейне жазаба немесе сілтеме болу керек. Сайтты
CSS –
каскадты стиль арқылы біріктіріп көрнектеу.
2.2. Жаңа материалды
зерттеу 2.3. Жаңа білімді
практикада қолдану
Бекіту.
Бақылау
жұмысы (60
минут) Жеке
жұмыс 3-тапсырма: А -
деңгейі: Visual studio code
бағдарламасында, төменде көрсетілген тегтерді жалғастырып
жазып төмендегі суреттер бойынша, HTML және CSS тегтерін
пайдалана отырып ,кестені өзгертетін атрибуттар тізімін құру. Кесте
№1. 3 қатар және 4 бағаннан тұратын кесте <html> <head> <title>кесте</title>
</head>
<body> <h3>кесте
</h3>
<table cellspacing=0
cellpadding=0 width="60%" border=4>
<tr align=center>
кесте
<th
bgcolor=black>
<th
bgcolor=white>а12
..............................................
</table>
</body>
</html> Нәтижесі:
а12
а14 а21
а23
Кесте №2. 4 қатар және 2 бағаннан тұратын түстер
кестесі <html> <head> <title>кесте түстері</title> </head> <body bgcolor=white> <table width="30%" border=1> <tr> ............... </table> </body> </html> Нәтижесі: cyan magenta yellow blaсk
Кесте
№3. Пифагор
(көбейту)
кестесін
құрыңдар.
<table
border=1> <tr>
<td
> мәтін</td>
<td> мәтін</td>
<td> мәтін</td>
</tr> <tr>
Нәтижесі:
2 3 4 5 6 7 8 9 2 4 6 8 10 12 14 16 18 3 6 9 12 15 18 21 24 27 4 8 12 16 20 24 28 32 36 5 10 15 16 25 30 35 40 45 6 12 18 24 30 36 42 48 54 7 14 21 28 35 42 49 56 63 8 16 24 32 40 48 56 64 72 9 18 27 36 45 54 63 72 81
В - деңгейі: Visual
studio code бағдарламасында, HTML және CSS тегтерін пайдалана отырып ,кестені өзгертетін атрибуттар тізімін
құру.
Кесте №1. 3 қатар және 4 бағаннан тұратын кесте
а12
а14 а21
а23
Кесте №2. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Жүктеу
