kopilkaurokov.ru - сайт для учителей

Создайте Ваш сайт учителя Курсы ПК и ППК Видеоуроки Олимпиады Вебинары для учителей

Урок информатики по теме «HTML – язык разметки гипертекстовых документов»«HTML – язык разметки гипертекстовых документов»

Нажмите, чтобы узнать подробности

Разработка урока информатики для учащихся 10 классов по теме «HTML – язык разметки  гипертекстовых документов»«HTML – язык разметки  гипертекстовых документов». К конспекту урока прилагается презентация.

Вы уже знаете о суперспособностях современного учителя?
Тратить минимум сил на подготовку и проведение уроков.
Быстро и объективно проверять знания учащихся.
Сделать изучение нового материала максимально понятным.
Избавить себя от подбора заданий и их проверки после уроков.
Наладить дисциплину на своих уроках.
Получить возможность работать творчески.

Просмотр содержимого документа
«План конспекта урока»

муниципальное бюджетное образовательное учреждение

«Плесецкая средняя общеобразовательная школа»










Тема урока: «HTML – язык разметки гипертекстовых документов»









учитель информатики и математики

Потехина О.А.







Урок информатики в 10 классе:

«HTML – язык разметки гипертекстовых документов»

Тип урока: урок изучения и первичного закрепления нового материала

Вид урока: комбинированный.

Цель: Изучение основ языка разметки гипертекста HTML и использование его при Web-конструировании.

Задачи:

Образовательная: объяснить назначение языка разметки гипертекста HTML, основных тегов и их атрибутов, научиться разрабатывать документы, предназначенные для публикации в Интернете и отработать навыки редактирования web-страниц в кодах HTML;

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

Воспитательная: воспитывать уважение и умение сотрудничать с окружающими людьми, трудолюбие и добросовестность, воспитывать интерес к занятиям информатикой как возможной области будущей практической деятельности.

Оборудование:

  • программное обеспечение: Ms. Power Point

  • мультимедиа-проектор и экран, компьютеры.

Оснащение: Раздаточный материал для обучающихся и учебник.

План урока

  1. Орг.момент. (1 мин.)

  2. Этап подготовки обучающихся к активному сознательному усвоению знаний.(2 мин.)

  3. Выполнение теста «Коммуникационные технологии». (4 мин.)

  4. Этап усвоения новых знаний.(15 мин.)

  5. Закрепление новых знаний. (20 мин)

  6. Подведение итогов урока. (1-2 мин.)

  7. Домашнее задание. (1 мин.)

Ход урока

  1. Организационный момент.

(Проверка готовности учащихся класса уроку и проверка отсутствующих).

Мы живём в современном информационном мире, в котором Интернет – это мир общения, познания, увлечения. В нашей повседневной жизни очень часто приходится иметь дело с глобальной компьютерной сетью, так как современный человек большинство информации черпает из интернета и много времени проводит за компьютером, создавая сайты и персональные страницы. Поэтому возникает необходимость овладеть навыками создания качественных web-страниц для публикации их в сети.

Поэтому тема нашего урока: «HTML – язык разметки гипертекстовых документов»

2.Этап подготовки обучающихся к активному сознательному усвоению знаний.

Беседа с учащимися по основным понятиям.

Предлагаю вспомнить некоторые понятия. Что такое web-страница? Всемирная паутина? Браузер?

Web-страница (англ. Web page) — документ или информационный ресурс Всемирной паутины, доступ к которому осуществляется с помощью веб-браузера (Википедия).

Всеми́рная паути́на (англ. World Wide Web) — распределенная система, предоставляющая доступ к связанным между собой документам, расположенным на различных компьютерах, подключенных к Интернету.

Веб-обозрева́тель, обозрева́тель, бра́узер— программное обеспечение для просмотра веб-сайтов, то есть для запроса веб-страниц.

3. Выполнение теста «Коммуникационные технологии»

4. Этап изучения и усвоения новых знаний.

Учитель: Записываем в своих тетрадях число и тему урока.

- Как вы думаете с помощью чего можно создать web-страницу для публикации в сети?

Очень часто возникает необходимость форматировать введенные данные непосредственно в Блокноте, где представлена программа языка гипертекстовой разметки HTML (Hyper Text Markup Language).

Если даже нет необходимости в создании страницы на языке HTML нужно знать основные тэги для того, чтобы вносить необходимые изменения в уже готовую программу.

Для работы с HTML документом необходимо:)

  1. Создать персональную папку, где обязательным является использование для имени папки латинских букв;

  2. Создать текстовой документ блокнот;

  3. Открыть документ и сохранить его под новым именем с расширением .html или .htm.

  4. Закрыть документ;

  5. Открыть html –документ;

  6. Открыть блокнот, выполнив команду Вид/в виде html.

  7. В папке должны находиться два файла: текстовый документ и документ html.

  8. Текстовой файл можно будет удалить после создания html-документа.

Основными элементами документа являются тэги.

Тэги – это управляющие символы, определяющие вид Web-страницы при её просмотре в браузере.

  • Тэг - элемент HTML, представляющий из себя текст, заключенный в угловые скобки .

  • Тэг является активным элементом, изменяющим представление следующей за ним информации. Тэг может иметь некоторое количество атрибутов.

  • Обычно используются два тэга – открывающий () и закрывающий ().

  • *** / - имеет название СЛЭШ

Контейнеры – это парные тэги, содержащие открывающий и закрывающий тэг, которые указывают на начало и конец форматирования определенного блока.

Программа состоит из двух частей. В первой части задается заголовок страницы (он отображается в заголовке окна) и первым загружается при просмотре страницы.

Особое значение следует уделить выбору названия заголовка, т.к. именно по заголовку индексируется страница в поисковых системах. Название заголовка должно отражать суть информационного наполнения страницы.

Общий вид программы (структура):

html
head
titleНазвание страницыtitle
head
body Тело документа body
html

Основное содержание программы помещается между тэгами bodybody.

Рассмотрим основные тэги.

(Каждому ученику раздается данная таблица)

Для того чтобы создать свою первую страницу недостаточно знать основные тэги. В первую очередь необходимо научиться форматировать текст соответствующим образом. Для этого используются тэги для форматирования текста.

Тэги состоят из ключевых слов и могут быть дополнены атрибутами, которые разделяются пробелами. Недопустимо описание атрибутов без использования ключевых слов.

Закрепление материала:

Задание 1.

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

Составить программу из готовых тэгов, вставив в неё заголовок страницы и содержание программы.

Задание 2.

Задание выполняется устно.

Дана программа на языке HTML. Определите, какие тэги в ней используются и каково их назначение

html
head
title Устройства компьютера title
head
body
i Внешние устройства i
pb Принтер bp
body
html

  1. Домашнее задание: Разработать страницу на свободную тему с использованием тэгов для форматирования текста.

6. Подведение итогов урока.

Сегодня на уроке мы с вами познакомились с языком разметки гипертекста, узнали, что такое теги, браузеры и контейнеры, а также научились составлять программы на языке HTML.

- Итак, что сегодня было для вас новым?

- Можете ли вы объяснить термины: тег, контейнеры, браузер?

Урок окончен! Спасибо за урок! До свидания, ребята.






8



Просмотр содержимого презентации
«Язык разметки HTML»

Выполнила учитель информатики Потехина О.А.

Выполнила учитель информатики Потехина О.А.

Цели урока: объяснить назначение языка разметки гипертекста HTML, основных тегов и их атрибутов, научиться разрабатывать документы, предназначенные для публикации в Интернете; отработать навыки редактирования web-страниц в кодах HTML.

Цели урока:

  • объяснить назначение языка разметки гипертекста HTML, основных тегов и их атрибутов,
  • научиться разрабатывать документы, предназначенные для публикации в Интернете;
  • отработать навыки редактирования web-страниц в кодах HTML.

«HTML - язык разметки гипертекстовых документов»

«HTML - язык разметки гипертекстовых документов»

Web-страница (англ. Web page)

Web-страница (англ. Web page)

  • документ или информационный ресурс Всемирной паутины, доступ к которому осуществляется с помощью веб-браузера
Всеми́рная паути́на (англ. World Wide Web)

Всеми́рная паути́на (англ. World Wide Web)

  • распределенная система, предоставляющая доступ к связанным между собой документам, расположенным на различных компьютерах, подключенных к Интернету
Браузер – это  специальная программа для просмотра и создания Web-страниц

Браузер –

это специальная программа для просмотра и создания Web-страниц

Для работы с HTML документом необходимо: Создать папку, где обязательным требованием является использование для имени папки латинских букв; Создать текстовой документ блокнот; Открыть документ и сохранить его под новым именем с расширением .html или .htm Закрыть документ; Открыть html –документ; Открыть блокнот, выполнив команду Вид/в виде html. В папке должны находится два файла: один созданный в Блокноте, другой – имеет расширение .htm Текстовой файл можно будет удалить после создания html-документа.

Для работы с HTML документом необходимо:

  • Создать папку, где обязательным требованием является использование для имени папки латинских букв;
  • Создать текстовой документ блокнот;
  • Открыть документ и сохранить его под новым именем с расширением .html или .htm
  • Закрыть документ;
  • Открыть html –документ;
  • Открыть блокнот, выполнив команду Вид/в виде html.
  • В папке должны находится два файла: один созданный в Блокноте, другой – имеет расширение .htm
  • Текстовой файл можно будет удалить после создания html-документа.

Создание web-страницы 3 4 1 2 Выполнить действия 1,2,3,4

Создание web-страницы

3

4

1

2

Выполнить действия 1,2,3,4

WEB-страничка готова!  Удалить

WEB-страничка готова!

Удалить

Тэг -  является активным элементом, изменяющим представление следующей за ним информации.  Тэг  - элемент HTML, представляющий из себя текст, заключенный в угловые скобки . Обычно используются два тэга –  открывающий () и закрывающий (). *** / - имеет название СЛЭШ

Тэг - является активным элементом, изменяющим представление следующей за ним информации.

Тэг - элемент HTML, представляющий из себя текст, заключенный в угловые скобки .

Обычно используются два тэга – открывающий () и закрывающий ().

*** / - имеет название СЛЭШ

Контейнеры – это парные тэги, содержащие открывающий и закрывающий тэг.

Контейнеры – это парные тэги, содержащие открывающий и закрывающий тэг.

Программа состоит из двух частей:     В первой части задается заголовок страницы (он отображается в заголовке окна) и первым загружается при просмотре страницы.     Основное содержание программы помещается между тэгами ….

Программа состоит из двух частей:

В первой части задается заголовок страницы (он отображается в заголовке окна) и первым загружается при просмотре страницы.

Основное содержание программы помещается между тэгами ….

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

Общий вид программы (структура):

название страницы тело программы

Основные тэги для  создания Web-страницы :

Основные тэги для создания Web-страницы :

  • - определяет формат документа
  • - содержит название страницы и справочную информацию о ней
  • - содержит название страницы, которое отображается в верхней строке браузера
  • - отображает в браузере содержимое страницы
Для того чтобы создать свою первую страницу недостаточно знать основные тэги.    В первую очередь необходимо научиться форматировать текст соответствующим образом.

Для того чтобы создать свою первую страницу недостаточно знать основные тэги.

В первую очередь необходимо научиться форматировать текст соответствующим образом.

Тэги состоят из ключевых слов и могут быть дополнены атрибутами, разделенным пробелами. Недопустимо описание атрибутов без использования ключевых слов

Тэги состоят из ключевых слов и могут быть дополнены атрибутами, разделенным пробелами. Недопустимо описание атрибутов без использования ключевых слов

АТРИБУТ  Атрибут  – это компонент тега, содержащий указания о том, как браузер должен воспринять и обработать тег. Синтаксис тега с атрибутом:

АТРИБУТ

Атрибут – это компонент тега, содержащий указания о том, как браузер должен воспринять и обработать тег.

Синтаксис тега с атрибутом:

Задание 1.   Составить программу из тэгов, вставив в неё заголовок страницы и содержание программы , используя текст Меня зовут ____. Я учусь в ____ классе. Это моя первая Web-страница. Тут я могу писать любой текст. Я размещу эту страницу в Интернете

Задание 1.

Составить программу из тэгов, вставив в неё заголовок страницы и содержание программы , используя текст

Меня зовут ____. Я учусь в ____ классе.

Это моя первая Web-страница.

Тут я могу писать любой текст.

Я размещу эту страницу в Интернете

Открываем документ Задание.txt     Название Web-страницы       Меня зовут ____. Я учусь в ___ классе. Это моя первая Web-страница. Тут я могу писать любой текст. Я размещу эту страницу в Интернете.

Открываем документ Задание.txt

Название Web-страницы

Меня зовут ____. Я учусь в ___ классе.

Это моя первая Web-страница.

Тут я могу писать любой текст.

Я размещу эту страницу в Интернете.

Задание 2. Дана программа на языке HTML . Определите, какие тэги в ней используются и каково их назначение        Устройство компьютера         Внешние устройства     Принтер
  • Задание 2.
  • Дана программа на языке HTML . Определите, какие тэги в ней используются и каково их назначение
  • Устройство компьютера Внешние устройства

    Принтер

Домашнее задание:    Разработать страницу на свободную тему с использованием тэгов для форматирования текста.

Домашнее задание:

Разработать страницу на свободную тему с использованием тэгов для форматирования текста.

Спасибо за внимание!

Спасибо за внимание!


Получите в подарок сайт учителя

Предмет: Информатика

Категория: Уроки

Целевая аудитория: 10 класс

Автор: Потехина Оксана Александровна

Дата: 23.11.2014

Номер свидетельства: 134253




ПОЛУЧИТЕ СВИДЕТЕЛЬСТВО МГНОВЕННО

Добавить свою работу

* Свидетельство о публикации выдается БЕСПЛАТНО, СРАЗУ же после добавления Вами Вашей работы на сайт

Удобный поиск материалов для учителей

Ваш личный кабинет
Проверка свидетельства