Создание 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 документа
Преподаватель Алгалиева Б.Т.