Сабақ тақырыбы

Web парақшаға мультимедия

Модуль /пән атауы

Информатика

Дайындаған педагог

Шыңғысова Айнұр Қуанышқызы

Күні

Курс, топ

1 курс

Сабақтың түрі

аралас

Міндеттер

• HTML және CSS тегтерін пайдалана отырып, техника-технологиялық салаға арналған веб-сайтты жасайды.

Мақсаты

• HTML тегтері арқылы веб-сайтты әзірлеу;

• веб-беттерді әзірлеу кезінде CSS қолданады;

Күтілетін нәтижелер

HTML және CSS тегтерін пайдалана отырып, веб-сайтты әзірлейді

Қажетті ресурстар және АКТ

Қадырқұлов Р.А., Нұрмұханбетова Г.К. Информатика. Оқулық. Жалпы білім беретін мектептің жаратылыстану-математикалық бағытындағы 10-сынып оқушыларына арналған оқулық. – Алматы: Алматыкітап баспасы, 2019. -105-138б.

Тыңдаушыларға арналған нұсқаулық, 190б

Интернет ресурстары

Сабақтың барысы

Кезеңі / Уақыты

Сабақта жоспарланған іс-әрекет

Ресурсы

1. Ұйымдастырушылық және уәждемелік

Ұйымдастыру кезеңі

1. Студенттермен сәлемдесу;

2. Сабаққа қатысуын тексеру;

Студенттерді бүгінгі сабаққа ынталандыру. «Көршіме тілек» әдісі.

Психологиялық ахуал

(7 минут)

Білімді өзектендіру

«Конверт – сұрақ» әдісі

1-тапсырма:

2-3 сұрақ жазып, конвертке салыңыз. Әрбір оқушыда өзінікі болатындай етіп, бірнеше конверт дайындаңыз. Әрқайсысына екі минут беріңіз: оқушы стикерде атын және жауабын жазады; екі минут өткен соң конверт келесі оқушыға беріледі, осылай бұл 2-3 сұраққа барлығы жауап бергенше жүре береді. Стикерлерді жинап, бірнеше жауапты дауыстап оқыңыз (аттарын атамастан); сынып белгілі бір сұрақтың қаншалықты дұрыс болғанын талқылайды.

Веб-сайт ұғымы бойынша білімдерін тексеру

1. Web-бағдарламалау дегеніміз не?

2. Оны қандай мақсатта қолданады?

3. Сайтты жоспарлау кезеңдері қандай?

4. Сайтты жариялаудың қандай тәсілдері бар?

Сайтты жоспарлау кезеңдері қандай?

Қадырқұлов Р.А., Нұрмұханбетова Г.К. Информатика. Оқулық. Жалпы білім беретін мектептің жаратылыстану-математикалық бағытындағы 10-сынып оқушыларына арналған оқулық. – Алматы: Алматыкітап баспасы, 2019. -105б.

Мақсаты мен міндетін хабарлау

Жеке жұмыс

2-тапсырма:

Берілген тапсырма бойынша сәйкестендіру

https://learningapps.org/watch?v=p2zp6uof522

2. Теориялық және практикалық

2.1. Алдын ала білім

Жалпы қайталау

(13 минут)

Бірге ойлаймыз» әдісі

Топпен жұмыс

3-тапсырма:

Веб-сайттың негізгі компоненттеріне қойылатын талаптарды кестеге толтыру

Топтық жұмыс

Ойлан, тап!

4-тапсырма:

HTML тілінің құрылымын құрастыру:

2.2. Жаңа материалды зерттеу

2.3. Жаңа білімді практикада қолдану

Бекіту.

Бақылау жұмысы

(60 минут)

Жеке жұмыс

5-тапсырма:

Тегтер мен анықтамаларын сәйкестендіру

• .

Жеке жұмыс

6-тапсырма:

Қосымша №1

Жұптық жұмыс

7-тапсырма:

HTML тегтерін пайдалана отырып, кез келген техникалық бағытта cайт жасаңыз

Сайттың мазмұнына қойылатын талаптар, критерийлер:

• Үш түстен артық қолданбау;

• Сайтыңызға сай суреттер енгізу

• Кесте қолдану

Сілтемелер пайдалану

Жаңа білім мен дағдыларды/кәсіби дағдыларды қалыптастыру

«Шағын дәріс» әдісі

Каскадтық стильді кестелер CSS және оның артықшылықтары мен кемшіліктері

CSS (Cascading Style Sheets – Каскадтық стильді кестелер) – HTML, XHTML және т.б. белгілеу тілдерінде жазылған web-беттердің сыртқы көрінісін суреттейтін, әрлейтін тіл болып есептеледі. Бұл тілде web-беттердің сыртқы көрінісіндегі шрифттер мен түстердің орналасуы, блоктар сияқты элементтерді жасауға болады. Белгілеу тілдерінде (HTML, XHTML, XML және т.б.) web беттердің логикалық құрылымдары мен сыртқы көріністерін суреттеуді бір-бірінен бөліп қарастыру болды. Әрқайсысы бөлек болса, сайт жасағанда да, сайттың кодын оқығанда да түсінуге ыңғайлы болады.

Артықшылықтары:

HTML кодының көлемін едәуір кемейтеді және оны оқуға ыңғайлайды.

CSS тілі көмегімен HTML тілінде беруге болмайтын параметрлерді жасауға болады. Мысалы, сілтемелердің астындағы сызықты алып тастауға болады;

CSS арқылы web-беттің сыртқы көрінісін оңай өзгертуге болады. Көп құжаттардың сыртқы көрінісін бір кесте арқылы көрсетуге болаады. Мысалға, 30 беттегі кодтағы шрифттерді жасыл түске боядық дейік. Біраз уақыт өткен соң, көк не қызыл түске өзгеру керек болса, барлық 30 беттегі ширфттердің әрбірін өзгертіп шығу керек. Ал CSS тіліндегі бір қатар программа арқылы арқылы сол 30 беттің барлығын бірден өзгерте салуға болады.

Өтілген тақырыпты бекіту:

Жеке жұмыс

8-тапсырма:

Арман осы екі тегтерді жазып салыстырды. Салыстыру барысында сіз қандай өзгерісті байқадыңыз

3. Қорытынды

Үй тапсырмасы

(4 минут)

Өткен тақырыптарды қайталау.

«HTML және CSS тегтерін зерттеп, осы тегтер арқылы жасалған сайттарды қарап, тегтерін салыстырып келу

Қадырқұлов Р.А., Нұрмұханбетова Г.К. Информатика. Оқулық. Жалпы білім беретін мектептің жаратылыстану-математикалық бағытындағы 10-сынып оқушыларына арналған оқулық. – Алматы: Алматыкітап баспасы, 2019. -105-138 б.

Бағалау

(3 минут)

Шахмат тақтасының суретін пайдалану арқылы білімалушылар бос ақ ұяшықтарға өз ойларын стикерге жазып жапсырады. Сол жазылған ойлары негізінде өтілген сабақтан алған білімі қорытындыланады.

4. Сабақ бойынша рефлексия

(3 минут)

Рефлексия «Аяқталмаған сөйлем» тәсілі

«Мұғалімге жеделхат» тақтасына оқушылар стикер жапсыру арқылы орындалады.

Оқушылар өздеріне жақын сөйлемді таңдап, айтылған ойды жалғастырады:

• бүгінгі сабақта мен....түсіндім, ...білдім, ....көзімді жеткіздім.

• бүгін сабақта қуантқаны.....

• мен өзімді.....үшін мақтар едім.

• маған ерекше ұнағаны.....

• сабақтан соң маған........келді.

• бүгін маған..........сәті түсті.

• қызықты болғаны.....

• ......қиындық тудырды.

• менің түсінгенім.....

енді мен......аламын.

Сандық эквивалент

Балл

Критерийлер

Баға

«Өте жақсы»

90-100

• HTML тегтері арқылы веб-сайтты әзірлей алады;

• веб-беттерді әзірлеу кезінде CSS қолдана алады ;

• HTML және CSS тегтерін пайдалана отырып, техника-технологиялық салаға арналған веб-сайтты жасай алады

Баға

«Жақсы»

70-89

• HTML тегтері арқылы веб-сайтты әзірлей алады

2 веб-беттерді әзірлеу кезінде CSS қолдана алады

Баға

«Қанағаттанарлық»

50-69

• HTML тегтері арқылы веб-сайтты әзірлей алады;