 |
Объяснение нового материала
|
|
|
|
Итак, сайт – это группа взаимосвязанных Web-страниц, объединённых или единой тематикой, или единым авторством, или единым владельцем. Сайт состоит из Web- страниц. Каждая Web-страница представляет собой HTML-документ, т.е. документ, написанный в специальном формате HTML (HyperText Markup Language) (слайд 3).
И тема нашего сегодняшнего урока – «Способы создания сайтов. Понятие о языке HTML. Структура HTML-документа». Запишите себе в тетради сегодняшнее число и тему (учащиеся делают запись в тетради) (слайд 4).
Что же такое HTML? Согласно определению: HTML - язык разметки гипертекста (слайд 5) (учащиеся записывают)
- Давайте вспомним, а что такое гипертекст? (это текст, содержащий гиперссылки, т.е. некоторое слово или объект для перехода на другой фрагмент документа или на другую Web-страницу) (слайд 6)
Т.е. язык разметки гипертекста HTML позволяет создавать Web-страницы, которые можно разместить в сети Интернет.
- А при помощи чего можно просматривать Web-страницы?
Основным понятием языка HTML является тег. ТЕГ - инструкция браузеру, указывающая способ отображения информации (слайд 9). Атрибут -компонент тега, содержащий указания о том, как браузер должен воспринять и обработать тег (слайд 10).
Теги могут быть парные и одиночные. Парные делятся на открывающие и закрывающие (слайд 11). Контейнеры - это парные теги, содержащие открывающий и закрывающий тег (слайд 12).
(слайд 14) Но даже если мы выучим все теги языка HTML, этого будет недостаточно, если мы не будем знать структуру построения HTML-документа. Это всё равно, что иметь все нужные для строительства дома материалы, но не знать, как строить и с чего вообще начать. Поэтому важно знать структуру HTML-документа. Рассмотрим структурные теги.
|
|
|
(слайд 15-16) Тег <html> (<html> … </html>) Этот тег помещают в начало и конец документа, сообщая браузеру, что весь документ составлен на HTML. Обратите внимание: этот тег – парный или одиночный? (парный).
Тег <head> (<head>... </ head >) Тег <head> определяет заголовок, то есть часть документа, которая содержит информацию о документе. Тег не имеет собственных атрибутов, он используется в качестве контейнера для других тегов заголовка, таких как <base>, <meta> и <title>, которые заключаются между тегами <head> и </head>.
Тег <title> определяет название документа, которое появится в верхней строке окна браузера.
Тег<body> (body>…</body>) Тег <body> определяет начало и конец основной части (тела) HTML-документа. В теле документа находится его содержимое (часть документа, которая выводится в окно браузера). Атрибуты этого тега оказывают влияние на весь документ.
Это основные структурные теги. Помимо них существует множество других – для форматирования текста, добавления изображения, создание гиперссылки и т.д., благодаря которым можно полностью настроить содержание и внешний вид WEB-страницы. Таким образом, «ручное» написание кода на языке разметки гипертекста HTML, является одним из способов создания сайтов (слайд 18). Другой способ – создание сайта с помощью конструкторов сайтов (движков), размещенных в Интернете и доступных в режиме on-line. Конструктор сайтов – это система услуг, позволяющая пользователям создавать сайт из набора графических элементов и различных шаблонов отдельных модулей (панели навигации, ленты новостей, форм регистрации и т.д.)(слайд 19).
И еще один из существующих способов – использование специальных программных продуктов для создания и управления сайтом (например, визуальные HTML-редакторы Microsoft Front Page, Macromedia Dreamweaver или профессиональные системы для разработки сайтов 1C-Битрикс, MODx и др.)(слайд 20).
|
|
|
(слайд 21) Язык HTML является основой любого гипертекстового документа, даже если документ был создан в одном из конструкторов сайтов или визуальном редакторе. Просто в этом случае код на языке HTML генерируется автоматически либо движком, либо программой. Поэтому можно создать основу сайта (макет) с использованием визуального редактора, а затем доработать его, внеся непосредственно изменения с HTML-код. (слайд 22) В любом случае, знание языка HTML позволит лучше разобраться в структуре сайта и в случае необходимости внести в него коррективы вручную.
2. Проведение теста. Индивидуальное выполнение теста по индивидуальным карточкам. Карточки раздаются учащимся, учащиеся выполняют задания и затем карточки сдаются учителю на проверку (слайд 23)
1. Web- страница (документ HTML) представляет собой:
А. Текстовый файл с расширением txt или doc
В. Текстовый файл с расширением htm или html
С. Двоичный файл с расширением com или exe
D. Графический файл с расширением gif или jpg
2. Для просмотра Web- страниц в Интернете используются программы
А. Microsoft Word или Word Pad В. Microsoft Access или Microsoft Works
С. Internet Explorer или Google Chrome D. HTML Pad или Front Page
3. Как называется пара тегов, содержащая открывающий и закрывающий тег?
Файл Ящик Корзина Контейнер
4. Тег <title> используется для:
задания заголовка документа; отображения размера документа;
задания имени файла; отображения колонтитула документа.
5. Укажите тег, который указывает на начало основного содержания (тела, видимой части) web-страницы:
<html>; <head>; <body>; <img>.
6. Закрывающий тег начинается со знака:
\\; /; "; #.
7. Тег, с которого начинается web-страница – это:
<html>; <head>; <body>; <img>.
|
|
|
