3.1. Лабораторная работа №1. Использование html для разработки простого статического Web - сайта

Введение

World Wide Web – это средство представления информации в Интернет. Более точно WWW можно определить как интерактивную мультимедийную гипертекстовую среду, использующую язык разметки и поддерживающую множество протоколов Интернет. Обсудим основные моменты в этом определении.

Мультимедийная среда – возможность размещать в Сети не только и не столько текстовую информацию, но и графику, звук, видеоклипы.

Гипертекстовая среда – возможность использования в тексте ссылок на другие порции информации (текст, графику, звуковые и видеоклипы и т.д.), дополнительные источники. Многообразие таких ссылок и порождает Всемирную паутину WWW!

В Web эти ссылки называют Унифицированным указателем ресурсов URL. Каждый документ или файл в Интернет имеет собственный URL, что позволяет легко ссылаться на него из других документов.

Язык разметки HyperText Markup Language (HTML) является основой World Wide Web. С помощью конструкций языка создаются Web страницы (сайты), которые можно просматривать с помощью специальных программ - обозревателей, или как их еще называют - браузеров. Наиболее известными браузерами являются Microsoft Internet Explorer, Mozilla Firefox, Opera, Google Chrome.

Протоколы Internet. WWW использует собственный протокол связи между отдельными узлами: HTTP (HyperText Transfer Protocol). Любой протокол - это набор правил, которые используются компьютерами для обмена информацией. Кроме HTTP можно использовать и другие протоколы, получая доступ и другим приложениям Internet: UseNet - для доступа к группам новостей, FTP - для загрузки файлов; POP3, SMTP -электронной почте, Skype для телефонного общения и др.

Интерактивная среда - в отличие от телевидения, WWW - это диалоговая среда. Пользователи сами определяют, какой из узлов посещать, как долго изучать полученную информацию. Более того, на Web страницах часто можно ввести диалог с их хозяевами.

Web использует технологию "клиент - сервер". Это означает, что где - то существует компьютер, на котором работает программное обеспечение Web - сервера, управляющее доступом к информации. Различные пользователи со всего мира являются клиентами сервера и получают от него информацию с помощью своих браузеров.

Необходимые программные средства для выполнения работы.

Для выполнения задания 1 потребуется:

1. Любой Web обозреватель (браузер), например, Intenet Explorer, Mozilla Firefox, Opera и др.

2. Так как HTML -документы чисто текстовые, для создания Web - страниц можно использовать практически любой текстовый редактор, от Windows Notepad до Microsoft Word. Одним из наиболее удобных для работы можно считать Notepad++. Скачать Notepad++ можно, пройдя по этой ссылке: http://notepad-plus.sourceforge.net/ru/site.htm

Создание HTML - файлов

Основным понятием языка HTML является понятие тег - инструкция обозревателю, как отображать текст.

Независимо от того, как выглядит ваша домашняя страница, и какую информацию вы хотите отобразить, существует три тега, которые в соответствии со стандартами HTML и WWW должны присутствовать в каждой Web-странице:

• <html> Сообщает браузеру, что документ написан на языке НТМL.

• <head> Отмечает вводную и заголовочную части HTML-документа.

• <body> Отмечает основной текст и информацию.

Эти теги необходимы Web-браузеру для определения различных частей HTML-документа, но они не оказывают прямого влияния на внешний вид Web-страницы. Они необходимы для того, чтобы последующие нововведения в HTML правильно интерпретировали Web - страницу, а также для того, чтобы она выглядела одинаково во всех Web-браузерах. Например, на Web-сервере запущена программа, которая просматривает все HTML-документы и составляет их список. Она просматривает только текст, расположенный внутри тегов <head>, поскольку здесь находится название документа. Таким образом, если в вашей домашней странице нет тегов <head> и </head>, она не будет включена в список. Так работает большинство средств поиска наиболее популярных Web-серверов. Они берут информацию из тегов <head> (и других).

Теги <html> и </html>

Эти теги сообщают браузерам, что текст между ними следует интерпретировать как текст HTML. Поскольку документы HTML чисто текстовые, тег <html> говорит о том, что файл написан на языке гипертекстовых ссылок.

Задание 1.Откройте блокнот и наберите <html> в самом начале файла. Затем наберите его напарника </html>. Теперь весь текст, который появится между этими тегами, будет отмечен как текст формата HTML. Вы обратили внимание на символ “/” во втором теге? Прямая косая черта используется для обозначения закрывающих тегов. Большинство тегов HTML парные, открывающий и закрывающий, они охватывают помечаемый ими текст. Закрывающий тег в паре всегда начинается в прямой косой черты. Сейчас ваша домашняя страница выглядит так:

<html>

</html>

Теги <head> и </head>

Теперь введем теги <head> и </head>. Они служат для размещения в вашем HTML-документе служебной информации..

Задание 2. Наберите <head> на экране между тегами <html>, затем в следующей строке наберите его напарника – тег </head>.

Теги <body> и </body>

Теги <body> и </body>, как и <head>, предназначены для обозначения отдельной части HTML-документа. Текст, охваченный тегами <body>, является основной частью документа.

Сюда войдут большая часть текста и иная информация, составляющие основу документа.

Задание 3. Введите в вашу Web-страницу теги <body> и </body>, и документ примет следующий вид:

<html>

<head>

</head>

<body>

</body>

</html>

Теги <address> и </address>

Теперь рассмотрим еще пару тегов - <address>. Они охватывают информацию о том, к кому нужно обращаться в отношении данной страницы в том случае, если у кого-нибудь возникнут вопросы или замечания.

Теги <address> используются для того, чтобы отделить эту информацию от основного блока.

Задание 4. Между тегами <body> и </body> наберите ваше имя и адрес электронной почты, например: