Веб-беттегі графика. Информатика, 10 сынып, сабақ жоспары.

Бөлім 5. Веб-проектірлеу

мектеп:

Мұғалімнің аты-жөні:

Веб-беттегі графика

10.2.3.3 Web-бетке анимация мен гарфикалық денелерді орналастыру (логотип, баннер және т.б.)

• Анимация мен графикалық денелердің Web –бетте не үшін қажет екендігін түсіну;
• Логотип, баннер және сурет арасындағы айырмашылықты түсіну;
• Логотипті, анимацияны, фондық суреттерді, суреттерді Web –бетке еңгізуді білу.

Логотипті, анимацияны, фондық суреттерді, суреттерді Web –бетте қолдану.

Пәндік лексика мен терминология: HTML, CSS, PHP, Notepad, Тэгтер (Image, Head, P, H1, H2, Body, Html).

Тиімді сөз-тіркестер:

Кодта негізгі бөлімдердң тізбегін айқындауға болады…….

Body бөлімінде бағдарламаның негізгі коды жазылады.......

серіктестік: ынтымақтастық дағдыларын қалыптастыру және сындарлы тәсілді дамыту, өзара қарым-қатынасты құру кезінде сыни ойлай білу, топтық жұмыс кезінде жылы қарым-қатынасты дамытуды өзіне қосады.

академиялық адалдық: Академиялық адалдық қағидаларын сақтаудағы басқа адамдардың ойлары мен идеяларын құрметтеу

тайм менеджменттің маңыздылығы,

құрал-жабдықтармен және ресурстарға ұқыпты қарау.

Білу және түсіну: Web-бағдарламалау

дағдылар: байланыс және ынтымақтастық

дағдылар: өзіндік сана және ойлау

Нақты проблемалар мен контекстерге оқытуды қолдану

Өнермен интеграция

HTML негіздері

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

Ресурстар

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

Сабақ тақырыбымен, оқу мақсаттарымен танысу. Оқу мақсаттарына қол жеткізу үшін жетістік критерийлерін талқылау.

Презентация

(К) Мұғалім оқушылардан сайтыңызды әдемі және көрнекі етіп қалай жасауға болатынын сұрайды.

(К) Мұғалім нашар және әсем безендірілген сайттардың мысалдарын көрсетеді және әр сайтты талқылайды..

Әсем көркемделген: http://feej.ru/

Жаман көркемделген:

http://www.miauk.com/

http://www.spaceistheplace.ca/

http://www.ronoslund.com/

(К) Мұғалім негізгі терминдердің анықтамасын береді, оқушылар дәптерге жазады.

Баннер (англ. banner «транспарант») —баспасөздегі жарнамалық модульге ұқсас жарнамалық сипаттағы графикалық сурет. Статикалық сурет, тіпті мәтін де, анимациялық элементтерді (бейне және интерактивті нысандарға дейін) қамтуы мүмкін. Әдетте жарнама берушінің сайтына немесе қосымша ақпараты бар бетке гиперсілтеме болады.

Логотип - Фирмалық белгі — ерекше кескін, сондай-ақ толық немесе қысқаша фирманың атауы, осы фирмалардың тауарлар тобы және т. б. (Анимацияланған логотиптердің мысалдары: https://blog.pioneers.com.ua/2017/09/28-logo-animate/)

(И) Мұғалім фондық суретті енгізу үшін код фрагментін таратады (Оқушыларға кеңес беру: суретті анық шекарасыз (текстурасыз) пайдалану.

Оқушылар HTML бетті құрастыру.

(К) Жұмысты талқылау, қолданылған тегтер мен қасиеттері бойынша сұрақтар.

Презентация

Материал алынған сілтеме:

https://stud.kz/prezentatsiya/id/22114

http://elibrary.kaznu.kz/sites/default/files/Besplatnie_resursii/aytbenova_web_dizayn_negizderi.pdf

Рефлексия.

Бес саусақ әдісі

Приложение

Бағалау – оқушылардың мате-риалды меңгеру деңгейін қалай тексеруді жоспарлайсыз?

Денсаулық және қауіп-сіздік техникасының сақталуы

Практикалық тапсырмаларды орындау және міндеттерді шешу арқылы. Өзара бағалау, кері байланыс мұғалімдер

Құндылықтар: басқа оқушылардың жұмыстарын тексеру кезінде өзара сыйластық, топтарда сыйластық және ынтымақтастық.

Өмір тіршілігінің қауіпсіздігі: компьютерде жұмыс істеу кезінде қауіпсіздік техникасын сақтау.

Жалпы баға

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

1:

2:

Сабақты жақсартуға не ықпал ете алады (оқыту туралы да, оқу туралы да ойланыңыз)?

1:

2:

Сабақ барысында сынып туралы немесе жекелеген оқушылардың жетістік/қиындықтары туралы нені білдім, келесі сабақтарда неге көңіл бөлу қажет?