Дидактический проект занятия "Создание макетов Web-страниц с фиксированной шириной при помощи таблиц HTML и CSS"

Дидактический проект занятия кружка «Web-дизайн»

Дата: 10.12.2018

Место проведения: Теоретический лицей «Кирилл и Мефодий»

Кружок: «Web-дизайн»

Руководитель кружка: Малиновская Т.В., дидактическая степень II

Время проведения занятия: 15.00 – 16.35

Год обучения: 2

Тема занятия: Создание макетов страниц с фиксированной шириной при помощи таблиц HTML и CSS.

Тип урока: Комбинированный.

Базовая цель: Знание основных приемов работы с таблицами HTML и CSS, применение их в создании макетов Web-страниц.

Ключевая цель: Создавать макеты страниц при помощи таблиц HTML и CSS.

Операциональные цели:

О1.1. Понимать алгоритм создания таблиц HTML и CSS для макета страницы.

О1.2. Изучить основные CSS правила для создания макета страницы c фиксированной шириной.

О2.1. Создавать таблицу HTML с фиксированной шириной.

О2.2. Редактировать таблицы HTML и CSS.

О2.3. Выводить в окно браузера гипертекст Web-документа, содержащий таблицу HTML.

О3.1 Воспитать точность, внимательность, аккуратность и сосредоточенность выполнения поставленных задач.

О3.2 Развить технические способности для создания макетов Web-страниц.

Форма работы: Фронтальная, индивидуальная

Дидактические технологии: М2 – алгоритмический метод, М3 – поисковый метод, М4 - взаимообучение, А22 – беседа, А2 – рассказ, А3 – самостоятельное наблюдение, А4 – рассуждение, С5 – анализ, С6 – синтез, А8 – самооценивание, А9 – взаимооценивание, А10-объяснение, С8 - обобщение, А12- устный опрос, А13 - письменный опрос, А15- лекция, А16- упражнение, В13- конспектирование, А18 - работа с конспектом, А19- практическая работа, А25 - работа у доски, А26 - постановка конкретных целей, С13 – диалог.

Средства обучения: компьютер, локальная сеть, сеть Интернет, программа Dreamweaver CS5, конспект ученика, тренировочный тест.

Литература: Будилов В.А. Основы программирования для Интернета. – СПб: БХВ-Петербург, 2003. – 736 с.: ил.

Головач Влад. Дизайн пользовательского интерфейса. Usethics – 147 с.

Гончаров А. Самоучитель HTML. — СПб: Питер, 2002. — 240 с.: ил.

Этапы	Цели	Методы	Деятельность учителя	Деятельность ученика	Оценивание	Время
I. Организационный момент	О3.1	С13	Здороваюсь с учениками. Проверка присутствующих. Желаю успехов.	Готовятся к уроку. Отвечают на мое приветствие.	Организация рабочего места.	2
II. Объявление темы и целей урока.	О1.1	А26	Объявляю тему занятия: «Создание макетов страниц с фиксированной шириной при помощи таблиц HTML и CSS». А также объявляю ключевую цель нашего занятия: Создавать макеты страниц при помощи таблиц HTML и CSS.	Внимательно слушают. Записывают тему урока.	Постановка и понимание конкретных целей	1
III. Актуализация знаний, необходимых для изучения новой темы.	О2.1 О2.2	А12 А22 А8 А3	1. Провожу фронтальный опрос среди учеников. Из каких компонентов состоит таблица HTML? Что такое строки? Что такое столбцы? Ребята, а что такое ячейки? Какие операции можно совершать с ячейками, строками и столбцами таблицы? Для каких целей применяются таблицы? В каких программах редактируются HTML-документы? Какие программы необходи-мы для просмотра Web-страниц, Web-документов. Какие браузеры вы знаете? Какова структура HTML -документа? С помощью каких тегов создается таблица, строка, ячейка? Какие атрибуты нужно добавить к тегу table для того, чтобы форматировать внешний вид таблицы? 2. Предлагаю проверить свои знания по теме «Таблицы и Web-дизайн». (Приложение 1)	1. Отвечают на вопросы. Предполагаемые ответы: - Таблица состоит из строк, столбцов и ячеек. - Строки – это горизонтальные ряды. - Столбцы – это вертикальные ряды. - Ячейки – это область пересечения строки и столбца. - Строки, столбцы и отдельные ячейки таблицы можно удалять, разбивать и объединять. - Таблицы применяются для размещения табличных данных и для организации всей структуры HTML-документа, создания макетов Web-страниц. - В простых текстовых редакторах: Блокнот, Textpad, Notepad и др. - Для просмотра Web-страниц нужен браузер – программа, которая отобра-жает содержимое файлов HTML. - Internet Explorer, Mozilla Firefox, Opera, Safari и другие. Заголовок -75% Курсы повышения квалификации Информационная культура и образование Продолжительность 72 часа Документ: Удостоверение о повышении квалификации 4000 руб. 1000 руб. Подробнее Получите комплекты видеоуроков + онлайн версии Электронная тетрадь по информатике 8... Основы алгоритмизации и... Электронная тетрадь по информатике 7... Информатика 8 класс ФГОС Информатика 11 класс (Беларусь) Информатика 2 класс ФГОС Информатика 10 класс (Россия) Информатика 6 класс ФГОС Скачать разработку Сохранить у себя: Дидактический проект занятия "Создание макетов Web-страниц с фиксированной шириной при помощи таблиц HTML и CSS" (87 KB) Уроки по информатике Прочее 0 44 1   Нравится 0 Добавить эту разработку в избранное Похожие файлы Внеклассное мероприятие по информатике "Турнир знатоков" Тема урока: «Компьютер и его основные устройства». Конспект урока информатики в 9 классе по теме: "Как устроен Интернет. IP-адрес компьютера" Рабочая рограмма Исполнитель Робот. Задание ОГЭ 15.1. Составление программы для Робота. 9Г Комментарии 0 Чтобы добавить комментарий зарегистрируйтесь или войдите на сайт Скачивание сейчас начнётся... Не забудьте поделиться материалом в социальных сетях с Вашими коллегами Вы смотрели Дидактический проект занятия "Создание макетов Web-страниц с фиксированной ширин Зарегистрироваться Электронная почта Такой пользователь уже существует, вы можете войти или восстановить пароль Пароль Повторите пароль Я ученик Я учитель Я родитель Регистрируясь Вы соглашаетесь с пользовательским соглашением и политикой конфиденциальности, а также даёте согласие на получение информационных и рекламных писем от ООО “Мультиурок” на указанный Вами e-mail. Отказаться от рассылки Вы сможете в любой момент, кликнув на ссылку "отказаться от рассылки", которая будет в каждом письме. Или войти с помощью аккаунта в соцсети Войти в профиль Электронная почта Пароль Оставаться в системе Вспомнить пароль Войти в кабинет ученика Или войти с помощью аккаунта в соцсети Зарегистрироваться Восстановление пароля Введите вашу электронную почту, чтобы восстановить пароль!