Разработка web-сайтов с использованием языка разметки гипертекста HTML
учебно-методический материал по информатике и икт (8 класс) на тему
На изучение этой темы в учебном плане отводится четыре учебных часа (три теоретических урока и один урок - практическая работа). Данный план-конспект является первым из трёх теоретических уроков по данной теме.
Скачать:
Вложение | Размер |
---|---|
1_urok_html.doc | 36.5 КБ |
Предварительный просмотр:
ПЛАН-КОНСПЕКТ УРОКА № 1.
«Разработка web-сайтов с использованием языка разметки гипертекста HTML»
(На изучение этой темы в учебном плане отводится четыре учебных часа (три теоретических урока и один урок — практическая работа). План-конспект является первым из трёх теоретических уроков по данной теме)
ФИО | Демидова Л.А. | |
Место работы | МБУ школа № 40 | |
Должность | учитель информатики | |
Предмет | информатика | |
Класс | 8 | |
Тема урока | Разработка web-сайтов с использованием языка разметки гипертекста HTML. |
- Цель урока: формирование познавательного интереса, развитие интеллектуальных и творческих способностей в области Web-технологий.
8. Задачи
Обучающие:
- сформировать систему знаний по технологии создания Web-сайтов;
- обучить языку разметки гипертекста HTML для создания сайтов;
- познакомить с этапами проектной деятельности.
Развивающие:
- развить творческие способности к самовыражению, посредством создания сайтов;
- сформировать умение сопоставлять, искать аналог и осуществлять перенос знаний в
новую предметную область Web-технологий;
- развить навыки работы на компьютере
Воспитательные:
развивать:
- добросовестное отношение к работе;
- чувства товарищества и личной ответственности за созданный сайт;
- художественный и эстетический вкус;
- воспитывать грамотного и корректного пользователя сети Интернет.
9. Тип урока: ознакомление учащихся с новым материалом.
10. Формы работы учащихся: фронтальная работа, индивидуальная работа, ИКТ.
11. Необходимое техническое оборудование: доска, ПК по числу групп, тетради, канцелярские принадлежности.
12. Программное обеспечение: стандартное приложение Windows Блокнот, Интернет-браузер.
Ход урока.
I. Организационный момент.
II. Актуализация опорных знаний учащихся
Публикации во Всемирной паутине (World Wide Web) реализуются в форме Web-сайтов. Web-сайт по своей структуре напоминает журнал, который содержит информацию, посвящённую какой-либо теме или проблеме.
III. Изучение нового материала
Общие сведения о Web-сайтах и языке HTML:
Как журнал состоит из печатных страниц, так и Web-сайт состоит из компьютерных Web-страниц, объединённых гиперссылками. Web-страницы могут содержать текст, рисунки, таблицы, мультимедийные и динамические объекты. Создание Web-сайтов можно осуществлять с помощью языка HTML.
HTML – Hyper Text Markup Language - язык разметки гипертекста. HTML ни в коей мере не является языком программирования, он отвечает только за расположение элементов (текста, рисунков) в окне браузера. HTML является языком для создания Web-сайтов во Всемирной паутине. Язык HTML состоит из простых команд – тегов. Теги управляют представлением информации на экране при отображении HTML-документа. Теги заключаются в угловые скобки <>…> и бывают парные и непарные (одиночные <>).
Документ HTML – это текстовый файл с расширением .html или .htm, содержащий набор тегов.
Браузер – (browser) – программа для просмотра Web-страниц. Широко используют браузеры Microsoft Internet Explorer, Opera и др. Браузер при получении документа HTML выполняет его анализ, строит объектную модель документа, затем результат отображает на мониторе.
Структура HTML-документа
Секция заголовка Записываются meta-теги, содержащие информацию о названии страницы, об авторе и др. Тело документа Содержит непосредственно информацию страницы: тексты, рисунки, таблицы |
Форматирование символов
Символы, заключенные между следующими тегами отображают:
…. - полужирный шрифт …… - курсивный шрифт …… - подчеркнутый шрифт | … - нижний индекс … - верхний индекс |
Параметры шрифта
Текст, заключенный между тегами …….. имеет заданный размер, цвет и гарнитуру. Для этого используются атрибуты: SIZE = значение от 1 до 7 и COLOR = цвет (aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, yellow, white), каждому цвету соответствует свой шестнадцатеричный код от 000000 до FFFFFF.
Если в тексте имеется несколько пробелов между словами или символы табуляции, то браузер на экран выводит всего один пробел. Если необходимы дополнительные пробелы то между словами надо добавить - символьный примитив.
Одиночный тег
разрывает текстовый поток и вставляет пустую строку. Несколько таких тегов добавляют несколько пустых строк. Межстрочный интервал – одинарный.
IV. Закрепление нового материала
Практические задания:
1. Работа у доски (формирование HTML-документа). Индивидуальная работа учащегося при поддержке класса.
2. Создание первого HTML-документа. Освоение технологии работы. Индивидуальная и парная работа учащихся на ПК.
V. Подведение итогов
- сегодня мы с вами научились создавать простейшую web-страницу;
- полученные сегодня знания пригодятся нам при создании своего сайта.
- Домашнее задание
п. 3.7
Записать предложенные учителем темы сайтов и начать подбирать материал.
Литература для учителя
- Усенков Д.“Уроки Web-мастера”, Москва, БИНОМ, 2009 г.
- Смирнова И. “Начала Web-дизайна, Санкт-Петербург, БХВ, 2008г.
- Томас А.Пауэл “Web-дизайн. Наиболее полное руководство. В подлинике”, 2-е издание, БХВ-СПБ, 2005 г.
- Захаркина В.В. “Основы создания Web-страниц”, методическое пособие, СПБ, 2000 г.
Литература для ученика
1. Н.Д. Угринович Информатиа и ИКТ: учебник для 8 класса, М: Бином. Лаборатория знаний, 2010г.
2. Усенков Д.“Уроки Web-мастера”, Москва, БИНОМ, 2009 г.
- Смирнова И. “Начала Web-дизайна, Санкт-Петербург, БХВ, 2008г.
Интернет ресурсы
- Блог учителя информатики Демидовой Л.А. demidova68.blogspot.ru
- Создание сайта с нуля http://ab-w.net
- Курс видео уроков по HTML для начинающих http://projs.org/tutorials/free-course-html
По теме: методические разработки, презентации и конспекты
Обобщающий урок «Разработка Веб-сайтов с использованием языка HTML»
Этот урок является заключительном в курсе “Разработка Web-сайтов с использованием языка НТМL” . Он проведится его в форме конкурса. Урок стоит из ...
Открытый урок по информатике на тему "Разработка Web-сайтов с использованием языка разметки гипертекста HTML"
Открытый урок по информатике на тему "Разработка Web-сайтов с использованием языка разметки гипертекста HTML" Цели урока: Повторение основных принципов построения сайтов, структуры HTML-документа...
Разработка Web-сайтов с использованием языка разметки гипертекста HTML
Презентация для 8 класса "Разработка Web-сайтов с использованием языка разметки гипертекста HTML"...
Разработка Web-сайтовс использованием языка разметки гипертекста НТМL.
Ресурс рассказывает об основах языка разметки гипертекса, о структуре web страницы и о том, как можно просто и легко организовать простой сайт из набора страниц, связав его гиперссылками....
Создание сайта с использованием языка гипертекстовой разметки документов
Тема занятия: «Создание сайта с использованием языка гипертекстовой разметки документов». Цель занятия: Ученики создадут Web-сайт, содержащий пять Web-страниц, знакомящий с основными ...
Разработка Web- сайта с использованием языка разметки гипертекста HTML
Раздел программы: Телекоммуникационные технологии.Тема урока: Разработка web- страницы «Профессия будущего»Класс 11Тип урока: Итоговый. (Закрепление полученных знаний)Вид урока...
Конспект занятия по теме: «Создание Web-сайтов с использованием языка гипертекстовой разметки документов HTML».
Цель занятия: воспитанники создадут Web-сайт, содержащий пять Web-страниц, знакомящий с основными тегами языка гипертекстовой разметки документов HTML. Учащиеся должны знать:определение следующих...