Веб-сайт, веб-страница, веб-браузер, гиперссылка, язык HTML

Рассмотрим более подробно, что же такое World Wide Web (WWW) или Всемирная паутина. Всемирная паутина (World Wide Web, WWW) — это система связанных между собой документов. Каждый отдельный документ, имеющий собственный адрес, называется Web-страницей.

Web-страница (документ) может содержать самую разную информацию: текст, рисунок, звукозапись. Каждая страница хранится в отдельном файле, имя которого имеет расширение htm или html.

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

Гиперссылка — это некоторое ключевое слово или объект в документе, с которым связан указатель для перехода на другую страницу в «паутине». Обычно изображение гиперссылки каким-то образом выделяется на странице, например цветом или подчеркиванием. При подведении к гиперссылке указателя мыши он принимает вид руки с указывающим пальцем. Если при этом щелкнуть левой кнопкой мыши, то произойдет переход по указателю к связанному документу. Текст, в котором используются гиперссылки, называется гипертекстом.

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

Сайт принадлежит некоторому лицу или учреждению. Web-сайт организуется на Web-сервере провайдера сетевых услуг.

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

Взаимодействие клиент-сервер происходит по протоколу HTTP (англ. HyperText Transfer Protocol — протокол передачи гипертекста). Принцип взаимодействия WWW-клиента и WWW-сервера на основе протокола HTTP предполагает следующую последовательность действий:

— клиент формирует сообщение-запрос и передает серверу;

— сервер получает сообщение, анализирует и обрабатывает запрос, формирует сообщение-ответ и направляет его клиенту.

Возникает вопрос: как сконструировать Web-страницу с ее текстами, рисунками, шрифтовым, цветовым и звуковым оформлением? Надо создать текстовый файл, содержащий описание страницы на языке HTML — языке разметки гипертекста. Вообще говоря, HTML-документ может быть создан при помощи любого текстового редактора, хотя нередко используются специализированные HTML-редакторы и так называемые конвертеры. Выбор редактора, который будет применяться для создания HTML-документов, зависит исключительно от личных пристрастий автора. Для этих целей можно использовать стандартное приложение Блокнот.

А теперь давайте проанализируем самую простую страницу, описанную с помощью этого языка.

<НТМL_>

<HEAD_>

<TITLE> Это моя страница </TITLE>

</HEAD>

Добро пожаловать на мою страничку

<BR>

</FONT>

</CENTER>

</BODY>

</HTML>

Мы встречаем слова, взятые в своеобразные скобки из знаков <и>. На самом деле эти скобки сигнализируют программе просмотра, что внутри их стоят так называемые теги — управляющие словосочетания, указывающие браузеру на то, как надо оформлять ваш электронный документ.

Рассмотрим, к примеру, тег <CENTER>. Он означает, что все дальнейшие элементы оформления документа будут расположены строго по центру окна, выделенного программе просмотра. А отменяется это центрирование с помощью другого тега </CENTER>. Вообще косая палочка в теге означает отмену какого-либо элемента оформления. Тег <НЗ> заставляет программу просмотра весь дальнейший текст писать крупными буквами, так называемым заголовочным шрифтом третьего уровня. Всего существует шесть уровней шрифтов. Им соответствуют теги <Н1>, <Н2>, <НЗ>, <Н4>, <Н5> и <Н6>. Первый уровень самый крупный.

Каждая пара тегов <CENTER> и </CENTER>, <H1> и </Н1> и т. п. образует так называемый контейнер, придающий новые свойства тексту, который в него попадает.

Познакомимся с другими тегами, присутствующими на странице.

<BR> — текст будет располагаться на новой строке (но без отступа, известного вам как «красная строка»). Такой тег не имеет отмены </BR>, а значит, и не образует контейнера.

<HTML> — указатель начала описания электронного документа на языке HTML.

<HEAD> — тег, располагающийся еще до описания самой страницы документа, в его заголовке. Текст внутри контейнера <TITLE>... </TITLE> выводится программой просмотра страниц в верхней заголовочной части уже готового экрана с документом и помогает ориентироваться при поиске нужных документов.

<BODY> — указатель начала описания собственно странички документа. В нем присутствуют достаточно важные атрибуты. И один из них — BGCOLOR — определяет фон нашей странички.

Фоном может быть не просто цвет, но и любая картинка, которая сохранена в формате JPG или GIF. Для создания такого фона нужно использовать атрибут BACKGROUND (например, BACKGROUND="klen.gif").

Важно помнить, что контейнеры должны располагаться строго один внутри другого. Пример верной записи:

<CENTER> ….

<H1> …

……….

</Н1> …

</CENTER>

И пример записи неверной:

<CENTER> ….

<H1> …

……….

</CENTER> …

</Н1> …

Рассмотрены только некоторые элементы языка HTML. Подробное описание этих и других тэгов легко найти в любом справочнике по HTML.

HTML — один из так называемых «веб-стандартов» («стандартов Web»), предназначен, прежде всего, для логической разметки документа. Оформление современных веб-сайтов задаётся с помощью стилевых файлов. Ещё одним из «веб-стандартов» является технология CSS (англ. Cascading Style Sheets — каскадные таблицы стилей) — формальный язык описания внешнего вида документа, составленного с использованием языка разметки. Каскадные таблицы стилей предназначены для облегчения оформления веб-страниц. Вынесение оформления в отдельную структуру позволяет накладывать его на различные веб-страницы и легко менять весь дизайн, редактируя только стили и не затрагивая сам документ. Другое преимущество CSS состоит в том, что стили предлагают намного больше возможностей для форматирования, нежели простой HTML. Кроме того, стили могут храниться во внешнем файле.

Эта технология позволяет принципиально разделить содержание и представление документа:

— описание содержания и логической структуры веб-страницы производится с помощью HTML или других языков разметки;

— описание внешнего вида веб-страницы производится с помощью CSS.

Такое разделение позволяет применять единый заранее разработанный стиль оформления для многих схожих документов, также быстро изменять оформление документов за счёт измененияэтого стиля, хранящегося в отдельном CSS-файле. Перенос правилпредставления данных в отдельный файл ведёт к уменьшению времени загрузки страниц сайта — описание представления данных загружается браузером только один раз, а далее, при переходе с одной страницы сайта на другую, браузер загружает только структуру страницы и хранимые на ней данные.

Заключительный и очень важный этап в создании сайтов — это размещение сайта в Интернете, или публикация Web-сайта. Для того чтобы разместить сайт в Интернете, необходимо найти подходящее место на одном из его серверов. Размещение сайта в Интернете может быть как платным, так и бесплатным. Крупные компании обычно размещают свои сайты на платных хостингах. В этом случае они получают удобный для запоминания и прочтения домен второго уровня и, как правило, обслуживание размещенного сайта, то есть техническую поддержку. Однако в Интернете существует множество провайдеров, которые позволяют своим клиентам размещать Web-сайты бесплатно (бесплатный хостинг). Например, к ним относятся многие почтовые сервера.

Когда вы выбрали сервер, на котором будете размещать свой сайт, вам необходимо от провайдера Интернет-услуг получить следующие сведения:

1. URL-адрес сервера, на котором будет размещен сайт.

2. Имя пользователя и пароль для доступа к серверу (обычно они те
же, что и для подключения к Интернету).

3. Имя каталога сервера для размещения вашего сайта.

Обычно провайдер инструктирует пользователей о том, как можно осуществить публикацию. Для этих целей можно использовать средства браузера, FTP-клиенты, а также специальные программные средства для публикации Web-страниц.

Практическое задание:

1. Установите соответствие между вопросом и термином.

1) процессор 2) языки программирования высокого уровня 3) Программный продукт, который позволяет создавать Web-страницы вручную называется... 4) Dreamweaver 5) Паскаль 6) текстовый редактор 7) редактор 8) Front Page 9) ассемблер 10) конструктор 11) Для создания Web-страниц используют язык... 12) CSS (Cascading Style Sheets) — это... 13) Программа, обеспечивающая интерактивное взаимодействие пользователей называется...

A. браузер B. язык разметки HTML C. язык стилей D. блокнот E. Сбросить ответы

2. Установите соответствие между элементами двух множеств.

контент элементы управления тэг навигация

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

3. Подчеркните верные названия.

Тэги могут быть: закрывающими, главными, автономными, одиночными, парными, авторитетными.

4. Подчеркните, что из следующего относится к публикации сайта.

Проверить правильность работы гиперссылок.

· Запустить сайт на нескольких разных браузерах.

· Получить от провайдера логин и пароль для редактирования сайта.

· Получить от провайдера URL-адрес вашего сайт.

· Найти в Интернете сервер, на котором можно разместить сайт.

· Проверить, хорошо ли читается текст на выбранном фоне.

· Выложить сайт на сервер.

Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями: