1. Принципы создания html-документов Цель – познакомиться с

реклама
1. Принципы создания html-документов
Цель – познакомиться с понятием языка гипертекстовой разметки html, освоить
технологию написания html-кода и построения html-файлов.
После изучения данного раздела Вы сможете:


Описать общую структуру html-файлов.
Создавать простейшие документы формата html, используя html-код.
Web-страница (web-документ) – документ или информационный ресурс Всемирной
паутины, доступ к которому осуществляется с помощью web-браузера. Web-страницы
обычно создаются на языках разметки html или xhtml и могут содержать гиперссылки для
быстрого перехода на другие страницы [1].
Браузер (интернет-обозреватель) – программа, которая применяется для поиска и
просмотра документов в сети Internet. Браузер интерпретирует html-код и отображает
html-документ в его форматированном виде. Наиболее распространенными браузерами
являются Internet Explorer, Mozilla Firefox, Opera, Google Chrome.
HTML-код — текст программы, написанной на языке html.
1.1 Введение в язык гипертекстовой разметки html
HTML (от англ. HyperText Markup Language - «язык разметки гипертекста») — стандартный
язык разметки документов во Всемирной паутине. Большинство web-страниц создаются
при помощи языка html (или xhtml). Язык html интерпретируется браузером и
отображается в виде документа, в удобной для человека форме [1]. Конструкции самого
языка при этом от пользователя скрыты. Они нужны, по сути, для того, чтобы
отформатировать содержимое документа, разместить в нужных местах рисунки, текст,
приложения и другое. Без использования соответствующих элементов языка html
содержимое документа будет отображаться браузером сплошным текстом в один абзац.
Любой html-код представляет собой набор элементов.
Элемент - это конструкция языка html, содержащая какие-то данные, например:
<BODY> текст </BODY> - это элемент, в котором можно выделить три части:



<BODY> - открывающий тег;
текст - содержимое элемента (тега);
</BODY> - закрывающий тег.
Почти все теги в html парные, т.е. имеют открывающий и закрывающий тег. Теги
начинаются символом "<" и заканчиваются символом ">", а закрывающий тег отличается
от открывающего наличием символа "/". Пара тегов <BODY> </BODY> называется
контейнером. Открывающий тег может содержать так называемые параметры или
атрибуты, которые также как и сами теги предназначены для форматирования
содержимого тега. Например: <BODY color="blue">. В этом примере: color –атрибут
(параметр), blue – значение атрибута (параметра). Данный атрибут тега <BODY> даёт
команду браузеру окрасить весь текст документа в синий цвет.
1.2 Структура html-документов
Любой html-документ состоит из контейнера <HTML></HTML>, внутри которого
располагаются еще два контейнера <HEAD></HEAD> и <BODY></BODY>.
Элемент <HTML></HTML> указывает браузеру на то, что документ разработан с помощью
языка разметки html. Все содержимое html-страницы должно помещаться в этот
контейнер, начинаясь с тега <HTML> и заканчиваясь тегом </HTML>.
Элемент <HEAD></HEAD> - «головной контейнер», содержащий внутренние сведения о
документе (название, автора, ключевые слова). В «головной контейнер» входит
обязательный элемент <TITLE></TITLE>, предназначенный для указания имени
электронного документа, и мета-теги <META>, содержащие служебную информацию о
внутренних свойствах документа.
Элемент <BODY></BODY> указывает на начало "тела" (основной части) web-страницы. В
этом разделе размещается весь материал (текст, графика, таблицы и другие элементы
содержимого документа), который увидят пользователи, обратившиеся к html-странице.
Общую структуру всех html-страниц можно представить в виде:
<HTML>
<HEAD>
<TITLE>Название страницы</TITLE>
</HEAD>
<BODY>
Текст страницы
</BODY>
</HTML>
Для создания html-файлов можно использовать любые текстовые редакторы, такие как
Блокнот или Word. Достаточно прописать в документе html-код и сохранить файл с
расширением .htm или .html. Открыть полученный html-документ необходимо с помощью
браузера (см. глоссарий).
1.3 Практикум
Задание 1. Откройте программу Блокнот. Перепишите общую структуру html-страницы,
приведенную выше. Сохраните файл, поменяв расширение .txt на .htm (или .html).
Откройте сохраненный файл с помощью браузера.
Примечание. При сохранении html-файла название файлу рекомендуется присваивать
латинскими буквами во избежание возможных проблем при регистрации или
размещении в Интернет учебного издания. А также имя файла целесообразно давать
исходя из его содержания.
Задание 2. Откройте Ваш файл с помощью Блокнота. В html-коде поменяйте «Текст
страницы» и «Название страницы» на любой другой текст и сохраните изменения.
Откройте файл с помощью браузера. Проанализируйте результат.
Задание 3. Зайдите в интернет и откройте любую web-страницу. В браузере в зависимости
от его версии выберите одну из предложенных команд «Вид/Исходный код страницы»
или «Страница/Просмотр HTML-кода».
Таким образом в интернете
понравившейся web-страницы.
реализуется
возможность
Библиографический список
1. http://ru.wikipedia.org
2. Иванов Г.Ф. Технология создания электронных учебных пособий.
просмотра
html-кода
Скачать