Добавить материал и получить бесплатное свидетельство о публикации в СМИ
Эл. №ФС77-60625 от 20.01.2015
Инфоурок / Информатика / Другие методич. материалы / Создание HTML документа

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


До 7 декабря продлён приём заявок на
Международный конкурс "Мириады открытий"
(конкурс сразу по 24 предметам за один оргвзнос)

  • Информатика

Поделитесь материалом с коллегами:

Тема урока Создание 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 документа


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


57 вебинаров для учителей на разные темы
ПЕРЕЙТИ к бесплатному просмотру
(заказ свидетельства о просмотре - только до 11 декабря)

Краткое описание документа:

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Автор
Дата добавления 29.05.2015
Раздел Информатика
Подраздел Другие методич. материалы
Просмотров305
Номер материала 294899
Получить свидетельство о публикации
Похожие материалы

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