HTML бетінде CSS кодын қолдану ашық сабағы

Есикский гуманитарно-экономический колледж

Открытый урок

Тема: Использование CSS кода в HTML странице

Группа: 311

Преподаватель: Аманкулов А.Т

Есик-2017 г

План урока № 8

ВРЕМЯ: 20.11.2017г

Группа: 311

Предмет: WEB- программирование и интернет технология

ТЕМА УРОКА: Использование CSS кода в HTML странице.

Цель урока – работа студентов с основными приемами, и назначением каскадных таблиц стилей, с основными принципами оформления текста с помощью CSS; основными задачами языка разметки гипертекста HTML и показать некоторые возможности в овладении этих приемов на примере программ блокнот и браузер. Освоение методологии и технологии создания сайтов и ссылок на сайтах. Разработка web-страниц и оформление интерфейса.

Задачи урока:

Образовательные: закрепить понятия использование СSS; рассказать о способах выполнения действий с командами-тэгами для создания web-страниц, развитие умения работать по алгоритму, развитие умения создавать гипертекстовые документы.

Развивающие: развитие умения работать по инструкции, развитие умения применять полученные знания на практике.

Воспитательные: придавать студентам навыки самостоятельной работы, активизация их творческого воображения и мышления.

Воспитывать аккуратность, внимательность, вежливость и дисциплинированность, бережное отношение к своему здоровью.

ТИП УРОКА: смешанный занятие

ОБОРУДОВАНИЕ И НАГЛЯДНОСТИ УРОКА: Персональные компьютеры, интерактивная доска ActivStudio, ПО Activinspire, стандартная программа Блокнот, язык HTML, раздаточные карточки, практикумы, бумага А3, фломастеры, жетоны для оценки, лист оценки, флипчарт, смайлики.

ПРОГРАММНОЕ ОБЕСПЕЧЕНИЕ: операционная система SHIP-2014. Windows 7, язык разметки гипертекста HTML, браузер, программное обеспечение интерактивной доски ActivinspireStudio, программы Блокнот, MS PowerPoint, MS Excel.

МЕТОДЫ УРОКА: Групповая работа, диалог, мозговой штурм, музыкальная разминка, интерактивный метод, исследовательская беседа, самооценка, SWOT-анализ.

МЕЖПРЕДМЕТНАЯ СВЯЗЬ: Информатика, педагогика, использование интерактивных технологии, изобразительное искусство, основы алгоритмизации и программирования, компьютерные сети.

ПЛАН УРОКА:

Организационный момент. Приветствие, проверка посещаемости, деление на группы. (5 мин)

Проверка домашнего задания. Защита презентации. (10-15 мин.):

3.Вопросы-Ответы «Мозговой штурм». (5-10 мин.)

4. Новости «Новости ИТ технологий». (10 мин.)

5.Практическая часть. Создание страницы для веб-сайта на тему: «CSS». (30 мин).

6. Закрепление урока. (10 мин.)

7. Aнализ по теме: «CSS и Web-сайты. Зачем они нужны». (5мин.)

8. Итог урока. Оценка студентов. (3 мин). Домашнее задание. (2 мин.)

ХОД УРОКА

ОРГАНИЗАЦИОННЫЙ МОМЕНТ. (2 мин.)

1.1. Приветствие и проверка студентов по журналу. Объявление темы и цели урока.

1.2.Студенты вместе с преподавателем громко читают эпиграф Аристотель: Ум заключается не только в знании, но и в умении прилагать знание на деле.

1.3. Студенты все вместе читают стихи про знание:

Учись! Прошу, чтоб свет знанью

Твой путь житейский озарил,Любя добро, без колебаньяДля пользы родины ты жил.Учись! Лишь в знанье только – сила!И повторял тебе отецДля тебя родины светила,И счастья даст тебе знания! Белоусов В.

1.4.Деление на группы:

II. ПОВТОРЕНИЕ ИЗУЧЕННОГО МАТЕРИАЛА

Проверка домашнего задания.

Работа с интерактивной доской и PowerPoint, ПО ActivStudio, Activinspire –Представители с каждой группы защищают свою презентацию подготовленные дома по заданным темам:

I группа - ВИРУС – «Что такое CSS?

Правила CSS

Классы

Идентификаторы

Группировка свойств»,

II группа - ИТ – «Использование в веб-страницах

Встроенные стили

Внедренные стили

Связанные таблицы стилей

Аппаратно-зависимые стили»,

3.III группа -ЭВМ – «Свойства CSS. Позиционирование элементов».

Менеджеры с каждой группы оценивают друг-друга и ставать кармашкам смайлики.

3.«Мозговой штурм». Вопросы-Ответы.

Задаются вопросы по пройденным материалам. Студенты должны быстро ответить на вопросы. Менеджеры группы оценивают друг-друга и записывают на лист оценки.

Что такое – CSS? СSS- технология описания внешнего вида документа, оформленного языком разметки.