Вставка изображений в Web-страницы (Конспект урока 8 кл. ФГОС)
план-конспект урока по информатике и икт (8 класс) на тему
Конспект урока информатики в 8 кл. (ФГОС) Тема: Вставка изображений в Web-страницы. Один из уроков раздела "Основы языка HTML как средства создания Web-страниц"
Скачать:
Вложение | Размер |
---|---|
urok_grafika_na_web-stranitsakh.docx | 136.64 КБ |
Предварительный просмотр:
ИНФОРМАТИКА. 8 класс
Конспект урока
1. Тема урока. Вставка изображений в Web-страницы
1). Реализуемые требования ФГОС ООО к личностным образовательным результатам:
1.1. формирование ответственного отношения к учению, готовности и способности обучающихся к саморазвитию и самообразованию на основе мотивации к обучению и познанию, осознанному выбору и построению дальнейшей индивидуальной траектории образования …, с учётом устойчивых познавательных интересов, а также на основе формирования уважительного отношения к труду …;
1.2. формирование осознанного, уважительного и доброжелательного отношения к другому человеку, его мнению …, готовности и способности вести диалог с другими людьми и достигать в нём взаимопонимания;
1.3. формирование коммуникативной компетентности в общении и сотрудничестве со сверстниками, …; взрослыми в процессе образовательной, …; учебно-исследовательской, творческой и других видов деятельности.
2). Реализуемые требования ФГОС ООО к метапредметным образовательным результатам:
2.1. умение самостоятельно определять цели своего обучения, ставить и формулировать для себя новые задачи в учёбе и познавательной деятельности, развивать мотивы и интересы своей познавательной деятельности;
2.2. умение самостоятельно планировать пути достижения целей, в том числе альтернативные, осознанно выбирать наиболее эффективные способы решения учебных и познавательных задач;
2.3. умение оценивать правильность выполнения учебной задачи, собственные возможности её решения;
2.4. владение основами самоконтроля, самооценки, принятия решений и осуществления осознанного выбора в учебной и познавательной деятельности;
2.5. умение определять понятия, создавать обобщения, устанавливать аналогии, классифицировать, самостоятельно выбирать основания и критерии для классификации, устанавливать причинно-следственные связи, строить логическое рассуждение, умозаключение (индуктивное, дедуктивное и по аналогии) и делать выводы;
2.6. умение создавать, применять и преобразовывать знаки и символы, модели и схемы для решения учебных и познавательных задач;
2.7. умение организовывать учебное сотрудничество и совместную деятельность с учителем и сверстниками; работать индивидуально и в группе: находить общее решение и разрешать конфликты на основе согласования позиций и учёта интересов; формулировать, аргументировать и отстаивать своё мнение;
2.8. умение осознанно использовать речевые средства в соответствии с задачей коммуникации для выражения своих … потребностей; планирования и регуляции своей деятельности…;
2.9. формирование и развитие компетентности в области использования информационно-коммуникационных технологий.
3). Реализуемые требования ФГОС ООО к предметным образовательным результатам:
3.1. развитие умений применять изученные понятия, результаты, методы для решения задач практического характера;
3.2. развитие основных навыков и умений использования компьютерных устройств;
3.3. формирование навыков и умений безопасного и целесообразного поведения при работе с компьютерными программами …, умения соблюдать нормы информационной этики и прав.
Планируемые образовательные результаты –
как уточнение требований ФГОС ООО к образовательным результатам
при изучении данной темы
Планируемые личностные образовательные результаты:
1.1. проявление и развитие познавательного интереса к изучению особенностей компьютерной графики, представленной на Web-страницах;
1.2. участие в коллективном обсуждении дискуссионных вопросов по особенностям графики, представляемой на Web-страницах;
1.3. совместное решение учебных задач при создании и редактировании графических изображений на компьютере для вставки их в Web-страницы.
Планируемые метапредметные образовательные результаты:
2.1. понимание значимости сформированности умений создания графических объектов с помощью компьютера;
2.2. нахождение эффективных способов представления изображений предназначенных для размещения на Web-страницах;
2.3. умение сотрудничать с педагогом и одноклассниками, оценивать деятельность отвечающего школьника и выражать собственное мнение о разработке и размещении графических объектов.
2.4. понимание важности компьютерной графики для применения данных знаний в учебной и познавательной деятельности
2.5. умение обоснованно и точно выражать смысл понятий формата графического изображения, понимание достоинств и недостатков данных видов компьютерного изображения, умение сравнивать и отличать разную компьютерную графику
2.6. применение знаний кодирования информации к новому объекту кодирования – изображению
2.7. умение слаженно работать со сверстниками и педагогом при групповой деятельности по разработке творческих заданий, умение отстоять свою точку зрения
2.8. умение обоснованно и грамотно донести свою току зрения до преподавателя и до своих сверстников
2.9. понимание понятий различных прикладных программ, умение адаптироваться к любом компьютерной среде
Планируемые предметные образовательные результаты:
3.1. использование понятий растрового и векторного изображения для решения задач на кодирование информации
3.2. понимание интерфейса и свойств графических редакторов для будущего умения редактирования растровых и векторных изображений на компьютере при размещении их на Web-страницах;
3.3. умение безопасно и с использованием норм информационной этики работать с компьютерной графикой и графическими редакторами
3. Описание места темы урока в изучаемом курсе (темы курса).
Урок на тему «Вставка изображений в Web-страницы» предусматривается как третий в разделе «Разработка Web-сайтов с использованием языка HTML» школьного курса информатики в 4 четверти (07.04.14-05.05.14) 7 класса:
- Web – страницы и Web-сайты.
- Форматирование текста на Web-страницах
- Вставка изображений в Web-страницы.
- Гиперссылки на Web-страницах
- Творческая работа
- Тип урока - комбинированный урок
5. Рекомендуемая литература по теме урока.
- Учебник Н.Д. Угринович «Информатика. 8 класс». –
М., БИНОМ, 2008, 168с – обратить внимание на страницу 117 - Интерактивный «Учебник HTML»
- Методы обучения на уроке.
По характеру познавательной деятельности:
- Объяснительно-иллюстративный.
- Репродуктивный.
- Проблемный
- Методы обучения на уроке.
По характеру познавательной деятельности:
- Объяснительно-иллюстративный.
- Репродуктивный.
- Проблемный
По источнику информации:
- Словесные (объяснение, рассказ)
- Наглядные (иллюстрация (презентация через проектор))
- Необходимые аппаратные и программные средства информационных технологий.
- проектор;
- экран (интерактивная доска);
- программа Pаint для редактирования изображения
- программа Блокнот для создания Web-страницы
- программа Internet Explorer для просмотра Web-страницы
- Структура урока (основные этапы урока: проверка задания, объяснение нового материала, выполнение упражнений и т.д.).
- Организационный момент.
- Актуализация опорных знаний и практического опыта учащихся.
- Изучение нового материала.
- Закрепление нового материала.
- Первичный контроль результатов учебной деятельности.
- Задание на дом.
- Подведение итогов урока. Рефлексия.
- Опорные понятия и способы деятельности.
Опорные понятия:
- графическая информация,
- графический редактор;
- форматы графических файлов;
- адрес файла;
- Web-страниц и ее структура;
- язык HTML, его назначение, основные теги.
Опорные способы деятельности:
- осуществление основных операций в графическом редакторе «Paint».
- осуществление основных операций в текстовом редакторе «Блокнот».
- Формируемые знания и способы деятельности.
Формируемые понятия:
- форматы графических файлов для Web-страниц (jpg, gif);
- оптимизация графических файлов;;
- теги их атрибуты для работы с изображениями;
- картинки-ссылки;
Формируемые способы деятельности:
- построение и редактирование растровых изображений для Web-страниц;
- построение векторных изображений для Web-страниц;
- гипертекстовая разметка изображения;
- вставка изображения в HTML-документ.
- выбор значений для атрибутов тега IMG
- Типы самостоятельной работы учащихся.
Самостоятельные задания на репродуктивную деятельность
- Какое из этих изображений растровое, а какое векторное?
- Какие графические редакторы используются для создания этих изображений?
- Какие инструменты редактора Paint используются для изменения размера изображения?
- В каких единицах может быть задан размер изображения?
Самостоятельное задание на продуктивную деятельность:
- Из предлагаемого набора картинок (10 шт) выбрать подходящие по формату и размеру для Web-страницы.
Самостоятельное задание на творческую деятельность:
- Создание графического изображения для последующей вставки в HTML-документ
- Виды контроля учебных достижений.
Текущий контроль:
- Устный фронтальный контроль: (для закрепления материала урока)
Какой тег используется для вставки изображения?
Какой обязательный атрибут задает имя файла с картинкой?
Какие необязательные атрибуты могут быть использованы при описании изображения?
- Самоконтроль – нахождение ошибок в списке допустимых для Интернета картинок, который каждый ученик составлял самостоятельно.
- Домашнее задание.
- Создать Web-страничку на тему «Мое любимое животное», содержащее изображение, прислать на почту учителя.
- Подготовиться к тесту для проверки знаний основных тегов HTML
- Деятельность учителя и учащихся по выделенным этапам урока с учетом фактора времени по прилагаемой схеме.
Этап урока | Время | Деятельность учителя | Деятельность учащихся |
Организационный момент | 4 минуты | Войти в класс, поздороваться, отметить отсутствующих. Сообщить ученикам тему и ход урока | Встать поздороваться, отвечать «Я» или поднимать руку во время отмечания отсутствующих. |
Актуализация опорных знаний и практического опыта учащихся. | 7 минут | Задать некоторые вопросы проблемного характера по данной теме, чем самым замотивировать учеников и перевести их мысли на нужную тему. Вопросы: Все вы сталкивались с изображениями на компьютере – фотографировали на камеру или рисовали сами в разных программах. В каких случаях изображение приходится редактировать? | Постараться найди решение проблемы и выразить свою мысль нужными словами. |
Изучение нового материала. | 10 минут | Изложить новый материал ученикам в наглядной форме с использованием проектора и интерактивной доски. (изложение нового материала смотри в п. 15) | Записывать конспект урока в тетрадь |
Закрепление нового материала. | 15 минут | Выполнить задания, указанные учителем (задания указаны в п. 11) | Выполнять задания или внимательно следить за работающим у доски |
Первичный контроль результатов учебной деятельности. | 3 минуты | Пройти и посмотреть ведение тетради, и работу на компьютере. проверить, работал ли ученик на уроке. Выставить оценки отвечающим у доски и с места ученикам. | Предоставить преподавателю тетрадь для проверки. |
Задание на дом. | 3 минуты | Задать домашнее задание, сообщить, что задание будет вынесено в электронный журнал (смотри п. 13) | Записать домашнее задание |
Подведение итогов урока. Рефлексия. | 3 минуты | Спросить детей, какая была тема урока, какие новые понятия мы сегодня изучили. 1) Какие форматы гр. файлов используются для Web-страниц? 2) Какой тег используется для вставки изображения? 3) Какой обяза-тельный атрибут задает имя файла с картинкой Поблагодарить за урок, попрощаться. | Ответить на заключительные вопросы педагога. Правильные ответы: Тема урока: Вставка изображений в . Web-страницы. Изучили новые теги языка HTML 1) для Web-страниц используются форматы (jpg, gif) 2) для вставки изображения используется тег IMG. 3) обязательный атрибут SRC/ |
- Краткий конспект содержания учебного материала по теме урока.
На прошлом уроке мы научились создавать web-страницы с использованием HTML-тэгов. Давайте повторим.
▪ Что такое HTML? (HTML – язык гипертекстовой разметки Web-страниц – является компьютерным языком программирования для разработки Web-страниц. HTML – коллекция управляющих символов -дескрипторов для добавления, форматирования элементов Web-страницы);
▪ Вспомним теги, описывающие структуру Web-страницы.
(учащиеся по порядку называют теги, и объясняют их значение):
( - начало страницы
-оформление заголовка страницы
- текст и основная часть страницы
- Вспомним теги, для форматирования текста.
Парный тег позволяет управлять параметрами шрифта. Он должен
обязательно содержать хотя бы один из атрибутов:
COLOR=”шестнадцатеричный код цвета”,
FACE=гарнитура шрифта,
SIZE размер от 1 до 7.
ваш текст
ALIGN=“left” – выравнивание текста по левой стороне
ALIGN=“right” – выравнивание текста по правой стороне
ALIGN=“center” – выравнивание теста по центру
Изучение нового материала
Итак, мы повторили структуру создания web-страницы и правила сохранения HTML документа. Это будет нам необходимо при изучении новой темы на занятии. Сегодня мы научимся вставлять рисунки и гиперссылки в web-страницы.
Для вставки рисунка в web – страницу используется тег , с его неотъемлемым атрибутом src, которому присваивается значение адреса рисунка, его названия и расширения. Если графический файл находится на локальном компьютере в той же папке, что и файл web-страницы, то в качестве значения атрибута src достаточно указать только имя файла. Например:
Если файл находится в другой папке на данном локальном компьютере, то значением атрибута должно быть полное имя файла, включая путь к нему в иерархической файловой системе. Например:
Следующий атрибут тега - align (выравнивание). Мы уже с ним знакомы. Какие значения он может принимать? Правильно:(left, right, top, middle, bottom).
Например:
Часто рисунки вставлены в рамки, язык HTML тоже позволяет нам сделать обводку, с помощью атрибута border. Этот атрибут может принимать значения от 0 до 10. Чем больше значение, тем толще обводка рисунка.
А теперь рассмотрим размещение гиперссылок в web-страницу. Гиперссылки, размещенные на web-странице, позволяют загружать в браузер другие web-страницы, хранящиеся на локальном компьютере или в интернете. Гиперссылка состоит из двух частей: адреса и указателя ссылки.
Гиперссылка создается с помощью тэга и его атрибута Href, указывающего, в каком файле хранится загружаемая web-страница:
Указателем ссылки может быть текст или рисунок.
IV. Закрепление нового материала
Создать html – страницу про свою семью. Вставить рисунок и гиперссылку. Например,
Моя семья Семья Ивановых
Моя семья очень дружная. Она состоит из четырех человек: папа, мама, сестра Марина и я - Карина. Я очень люблю свою семью
- Карина
- Вторая страница:
Страница Карины Карина
Иванова Карина Александровна родилась 18 июля 1999 года
V. Подведение итога
- сегодня мы с вами научились вставлять изображения и гиперссылки в web-страницу;
- полученные сегодня знания пригодятся нам при создании своего сайта.
VI. Домашнее задание
п.3.7.4, 3.7.5 читать, ответить на вопросы
По теме: методические разработки, презентации и конспекты
План-конспект занятия «"Вставка изображений на WEB-страницы"»
Вставка изображений на WEB-страницы с помощью языка гипертекстовой разметки HTML в текстовом редакторе Блокнот....
Общие сведения о соединениях деталей. Изображение и обозначение резьбы. Конспект урока по инженерной графике
Цель:Познание принципа соединений в сборочных единицах.Задачи:- узнать виды соединений;- узнать о пользе стандартизации и взаимозаменяемости;- иметь общее представление об обозначении резьбы.План урок...
Конспект урока по ФГОС второго поколения. Технология. Тема урока Технология изготовления прихватки в лоскутной технике.
Технологическая карта урока. С применением ИД....
Конспект урока по ФГОС второго поколения. Технология. Технологическая карта урока. Тема урока Подготовка ткани к раскрою. Раскладка и раскрой юбки по своей зарисовке.
Конспект урока по ФГОС второго поколения. Технология.Технологическая карта урока.Данные об учителе Лисичкина Зинаида Александровна учитель высшей категории г. Ржев. МОУ СОШ №9 им .В.Т. Степанченко.Пре...
Конспект урока по ФГОС второго поколения. Технология. Технологическая карта урока 5 класс. Приготовление блюд из варёных овощей. Тепловая обработка овощей..
Ознакомление учащихся с видами тепловой обработки овощей; формирование важных правил тепловой обработки; требования к качеству и оформлению готовых блюд....
ПЛАН - КОНСПЕКТ УРОКА (по ФГОС-2) Урок- практикум Класс: 7 В Тема:«Морфемика.Правило правописания морфем»Тип урока:обобщение и систематизация знаний
Данный урок заключительный в системе уроков по изучению темы «Разделы русской орфографии» в 7 классе. Цели урока были определены в соответствии с требованиями программы, содержанием изучен...
Урок информатики по теме: «Вставка изображений в Web-страницы» Гиперссылки на Web-страницах
Конспект открытого урока в 9 классе . Урок информатики по теме: «Вставка изображений в Web-страницы»Гиперссылки на Web-страницах...