Коммуникации в глобальной сети Интернет. Изучение основных тэгов языка HTML

Разделы: Информатика, МХК и ИЗО


Тема урока: изучение основных тэгов языка HTML.

Цель: сформировать знания об основных элементах языка.

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

  • Дать представление об основных средствах языка HTML.
  • Научить пользоваться языком HTML.

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

Форма урока: Лекция, комбинированный.

Структура урока:

  1. Организационный момент – проверка присутствующих на уроке ( до 2 мин)
  2. Мотивация – Объяснение темы урока, целей урока, план проведения урока (до 5 мин)
  3. Актуализация опорных знаний и способов действий (20 минут)
  4. История языка HTML
  5. Структура простейшего HTML документа
  6. Практическая работа – создание домашней странички “Басни Крылова” (20 минут)
  7. Подведение итогов урока, задание на дом (до 2 минут)

ХОД УРОКА

Здравствуйте, ребята. Тема нашего сегодняшнего урока: “Язык программирования HTML”.

Цели занятия

  • Получить представление об основных тегах языка HTML
  • Научится пользоваться языком HTML

Активизация - повторение

Структурой и форматированием HTML документа управляют теги. Теги всегда располагаются в угловых скобках. Практически все теги являются парными, т.е. открывающему тегу соответствует закрывающийся, который пишется с чертой “/” после скобки: “</”.

В случае нашего простейшего примера документ начинается с открывающего тега <html>и заканчивается закрывающим тегом </html>. Они очерчивают границы документа.

Затем следует “голова документа” ограниченная тегами <head> и </head>.

1. Изложение нового материала

Физическое и логическое форматирование текста

  1. Физическая разметка документа – это явное указание браузеру, как должен выглядеть тот или иной фрагмент текста – размер шрифта, курсив и т.п.
  2. Логическая разметка учитывает смысл выделенного фрагмента – цитата, сведения об авторе и т.п.

Современные стандарты языка HTML советуют использовать по-возможности логическую разметку, хотя физическое форматирование еще никто не отменял.

Дополнительные теги заголовка:

<meta> - содержит дополнительные данные о документе, используемые поисковыми серверами;

<base> и <link> - определяют базовый адрес документа и некоторые другие

Все, что находится между<body> и </body>, называется содержимым тела документа.

Тег <body> может содержать 3 группы параметров:

  1. Управление внешним видом документа.
  2. Атрибуты программирования – по событию, таблицы стилей и пр.
  3. Атрибуты ссылок и идентификации.

Bgcolor – изменяет цвет фона. Цвет задается словом или кодом RGB

<body bgcolor = “red”>

<body bgcolor = “#FF0000”>

Text – задает цвет текста.

<body bgcolor = “red” text=“blue”>

Background – помещает в качестве фона изображение из файла с картинкой.

<body background = “dog.gif”>

Оформление текста Заголовки

Существует 6 уровней заголовков:

<h1> . . . </h1>, …,

<h6> . . . </h6>

Атрибут – align – выравнивание

Значения: Left (по умолчанию)

Right

Center

Тег <p> указывает на начало нового абзаца и вставляет пустую строку перед абзацем. Атрибут align.

Тег <br> - разрыв строки. Используется для записи текстов стихов и песен.

Атрибут clear позволяет продолжить поток текста после (ниже) рисунка или таблицы. Значения left, right, all - продолжают вывод текста там, где указанный в атрибуте край или оба края свободны от таблиц и рисунков. Этот атрибут имеет смысл только с выровненными влево или вправо рисунками или таблицами.

<hr> - горизонтальная линия отделяет заголовок от остального текста

2 часть урока – практическая

Давайте разберем структуру будущей страницы.(ученики разбирают структуру простейшей веб-страницы)

Сегодня на уроке вы должны выполнить следующую работу –

  • 1 этап - оформить главную страничку – заголовком и отделить его горизонтальной линией от всего остального текста.
  • 2 этап – создать еще одну страничку с заголовком и сохранить ее под именем с соответствующим расширением. В тело этой странички внести соответствующую информацию.

Сохранить в правильном формате. В каком?

3. Домашнее задание: прочитать параграф 5.7.2 и 5.7.3 на стр 209-212 (учебник Угринович Н. 9 класс. )

Итог урока: подведение итогов, оценки с комментариями за выполненную работу.