Создание HTML документа

Тема урока Создание HTML документа

Цель урока: дать сведения о языке гипертекстовой разметки HTML,научить создавать HTML документы, знанию функции тегов

Методы обучения словесные, наглядные, частично-поисковые

Использованная литература Мержевич В. Создание Web страниц

Полонская Е.П. Самоучитель HTML
Наглядные пособия_______ раздаточные материалы, слайды____________

Технические средства обучения проектор,IBM PC Pentium IV____

Ход урока и содержания

І. Организационный момент: приветствие, проверка явки учащихся, готовность аудитории к уроку

ІІ. Проверка домашнего задания

1)Опрос домашнего задания

2) Мини-проект

Группа была разделена на 3 команды, которым были даны задания:

обсудить в своей команде основные части исследовательского проекта «Интернет-польза и вред »

1-команда- Польза Интернета для общества

2-команда - Вред Интернета для людей

3-команда -Все об Интернете

ІІІ. Объяснение нового материала (с помощью презентации ):

Все видели сайты, когда были в интернете. Так вот все они написаны на языке гипертекстовой разметки HTML. (HTML - Hyper Text Markup Language).

Очень часто мне задают вопрос зачем нужен HTML есть же масса автоматических редакторов веб страниц Front Page, DreamWeaver и другие, которые позволяют нам набросать страничек в автоматическом режиме соединить их таким же образом между собой и сайт готов. Но не тут то было, вы можете конечно же попробовать создать свой сайт не зная HTML, но при этом я гарантирую вам, что далеко вы не уйдете и при первом же сбое работы страницы вам все-таки придется взять в руки книгу HTML. HTML - основа которую обязательно нужно знать если вы собрались создавать свой сайт.

В языке HTML нет каких то сверхестественных сложностей. Все очень просто. Тем более, что для работы нам понадобится лишь малая часть всех команд данного языка. Части текста берутся в специальные элементы языка html тэги (своеобразные скобки) с целью предоставления этого элемента в том или ином виде, определения того или иного элемента. Тегов не так уж много, тем более что чаще всего используется в основном их определенная часть, а не все. Тегами выделяются абзацы, таблицы, списки и другие элементы. Особенностью написания тегов в языке HTML является то, что практически все теги являются парными, открываются и закрываются. Это делается для того чтобы указать область действия тега. Примером одиночного тега является тег
-- возврат коретки, переход на следующую строку без вставки пустой строки.

Примеры тегов

Какой-то текст, … и др.

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

Браузер преобразует html код в понятный нам текст и картинки и в зависимости от написанных в коде тегов и стилей предоставляет нам материал в каком то конкретном виде. Браузеры бывают разные и т.к. компании которые создают эти программы имеют некоторые свободы то документ (сайт) в разных браузерах будет отображаться по разному.

Структура html документа.

Каждая html страница начинается тегом начала html страницы и заканчивается тегом её закрытия .
HTML страница состоит из двух частей:
Невидимой части (… ) - в ней расположены заголовок, метатеги, скрипты, подключение стилей.
Видимая часть (…) - в которой расположены непосредственно элементы веб страницы: абзацы, таблицы, рисунки и т.д.

Таким образом получаем структуру HTML документа:

Невидимая части- в ней расположены заголовок, скрипты, метатеги, подключение стилей.

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

Большинство тегов имеют атрибуты, при помощи которых можно, например, задать размер и цвет шрифта, высоту и ширину картинки и т.д. Записываются атрибуты в виде пары имя-значение, например, для тега можно задать значения для изменения размера, цвета и семейства шрифта: Привет, Мир!

HTML - это язык разметки.

Mark-up - это разметка

ІV Разминка

1. Дайте определение команд на русском языке

2. Найти названия:

А) мультимедийных устройств

Б) современной цифровой техники

V. Работа с новым материалом

1) Цифровой диктант. Работа с текстом. Вашему вниманию заданы правильные и неправильные утвержденияі. Если вы согласны, то ставьте цифру 1, если не согласны, то - цифру 0.

1. Бывают одиночные теги и парные теги.

2. Тег - это элемент языка разметки гипертекста.

3.….. - видимая часть, в которой расположены непосредственно элементы веб страницы: абзацы, таблицы, рисунки и т.д.

4. Поисковые системы предназначены для поиска информации.

5. WWW-всемирная паутина.

6.HTML -это язык программирования

7.Интернет -это сеть сетей

2) Игра в домино. Последовательно надо найти значение тегов

VІ. Закрепление нового материала

Попробовать самостоятельно набрать свою первую страничку с приветствием.

VІІ. Проставка оценок_______________________________________________

VІІІ. Домашнее задание _______ Создание HTML документа

Преподаватель Алгалиева Б.Т.