Устройство HTML-страниц

В предыдущем разделе мы познакомились с автоматическим индексом - поисковой системой, которая ищет слова в специальной, ею же созданной базе данных. Чтобы правильно пользоваться автоматическим индексом, нужно знать, что именно хранит он в этой базе, а для этого необходимо подробнее познакомиться с устройством странички, то есть с языком HTML, о котором уже шла речь в разделе "Устройство Интернета". Итак, любая страница в Интернете построена на основе HTML - специального языка разметки, который подсказывает браузеру, как отобразить тот или иной текст. Делается это с помощью тегов - специальных меток, которые понимает браузер. "<"HTML">" НЕАD /HEAD BODY BGCOLOR="#FFFFFF" /BODY /HTML Как видим, все теги заключены между двумя угловыми скобками - открывающей и закрывающей. Чаще всего теги, как и скобки, встречаются парами. Есть открывающий тег, и есть закрывающий тег. То есть действие тега начинается, когда браузер встретит открывающий тег, и кончается, когда появится тег закрывающий. Открывающему тегу НТМL соответствует закрывающий тег / НТМ - он отличается тем, что в самом его начале стоит косая черта. Есть и другие основные теги. Это теги HEAD.../HEAD, обрамляющие место, где помещаются заголовок странички, комментарии и служебная информация, а также теги BODY.../BODY, между которыми помещается сам текст странички, видимый в окне браузера. Открывающие теги могут содержать дополнительную информацию, задаваемую атрибутами. Тег BODY содержит атрибут BGCOLOR. Значение этого атрибута "#FFFFFF" задает цвет фона странички, в нашем случае - белый. Страница пустая, потому что между тегами BODY.../ BODY ничего нет. Посмотрим теперь, как выглядит более сложная страница. HTML НЕАО /HEAD BODY BGCOLOR="#FFFFFF" Н1 ПРИМЕР СТРАНИЧКИ /Н1 а href="http://www.yandex.ru" yandex /a IMG SRC=logo.gif АLТ="Логотип системы Яндекс" а href="http://www.yandex.ru" IMG SRC=logo.gif /a /BODY /HTML Эта страница не обязательно должна быть частью какого-то сайта в Интернете, ее можно посмотреть прямо на своем компьютере. Чтобы показать ее вам, я переписал ее текст в файл под названием example.htm и поместил этот файл на диск G: своего компьютера в папку \!!!sebook\htms\. В ту же папку я переписал и графический файл logo.gif. Чтобы теперь посмотреть страничку, нужно вызвать Проводник, выбрав кнопку Пуск в левом нижнем углу рабочего стола правой кнопкой мыши. Затем нужно переместиться в папку g:\! !!sebook\htms\и выбрать файл example двойным щелчком левой кнопки мыши. Запустится браузер Internet Explorer, который автоматически вызывается для просмотра файлов с расширением .htm, и вот что мы увидим . Прежде всего обратим внимание на слова "ПРИМЕР СТРАНИЧКИ" в верхней части рисунка. Браузер показал их крупным шрифтом, потому что в исходном тексте странички они обрамлены тегами Н1.../Н. Чуть ниже видно подчеркнутое слово flndex. Это слово - живое: если соединиться с Интернетом, подвести к нему указатель мыши и нажать левую кнопку, в окне браузера через некоторое время появится главная страница поисковой системы Яндекс. Эти слова называются ссылкой, и не будет лишним еще раз посмотреть, как выглядит ссылка в исходном тексте странички: а href="http://www.yandex.ru" flndex /a Слово flndex обрамлено тегами а.../а. В открывающем теге а есть атрибут href=http: //www.yandex, ru, задающий адрес, по которому отправится браузер, когда ссылка будет выбрана мышью. В нашем примере это адрес российского сайта, но с тем же успехом тут можно поставить адрес австралийского, бразильского или канадского сайта, потому что Интернет един, не знает государственных границ, и каждый подключенный к нему компьютер может соединиться с любым другим. Теперь пришел черед следующей строчки в исходном тексте страницы: IMG SRC=logo.gif АLТ="Логотип системы Яндекс" Эта строчка - пример крайне важного тега, который вставляет в страничку, показываемую браузером, графический файл logo.gif. Картинку эту мы уже видели на сайте www.yandex.ru. Заметим, что тег IMG не имеет пары - закрывающего тега. Атрибут SRC указывает, откуда взять картинку. В нашем случае она должна располагаться там, где и сам исходный текст странички example.htm. Хочется особо подчеркнуть, что HTML-страницы состоят только из текста, а картинки вставляются в них извне, причем совершенно не обязательно, чтобы они находились на том же компьютере, что и сама страница. Текст страницы может быть в России, а картинку можно взять, скажем, в Португалии, указав в атрибуте SRC соответствующий адрес. Например, так: img src=http://адрес.компьютера.рt./имя_картинки Невозможно поверить, но это правда - страницу можно собрать из частей, разбросанных по разным странам и континентам. Единственное, о чем все-таки стоит помнить, - это время загрузки отдельных фрагментов. Не везде есть хорошие каналы связи, и передача картинки из Бразилии займет больше времени, чем переписывание точно такой же картинки с компьютера, расположенного у вас в городе. А пока картинка загружается, в окне браузера будет виден прямоугольник с надписью, заданной атрибутом ALT. В нашем случае это Логотип системы Яндекс. Нам осталось разобрать последнюю строчку из листинга 1.3: а href="http://www.yandex.ru" IMG SRC=logo.gif /a Это тоже ссылка, но теперь уже не с живой надписью, а с живой картинкой. Подведенный к ней указатель мыши превратится в изображение руки, а в строке состояния браузера появится адрес каталога - http://www.yandex.ru. А если еще и нажать левую кнопку мыши, браузер соединится с Яндексом и начнет загружать в свое окно главную страницу поисковой системы. Слегка коснувшись устройства HTML-страниц, мы теперь способны лучше понять работу автоматического индекса. В разделе "Яндекс" я говорил, что автоматический индекс старается поместить в базу данных каждую встреченную им страничку. Это так. Но теперь становится понятней, как он это делает, - он читает каждую страницу и запоминает все встреченные ссылки (они обрамлены тегами а.../а), после чего отправляется по всем адресам, переписывает новые страницы, читает новые ссылки - и так далее. Работы хватает. Причем учтите - не всегда автоматический индекс может что-то найти на том месте, куда указывает ссылка. Ведь автор страницы мог ошибиться, и даже если он был аккуратен, ссылка просто могла устареть, потому что хозяева время от времени переделывают свои сайты, создают новые документы, перемещают в другие места старые. Да и сам сайт может переехать по новому адресу со всем содержимым. Поэтому перед автоматическим индексом стоит очень сложная задача: он должен все время работать, снова и снова обходить свои владения, чтобы пытаться поспеть за вечно меняющимся Интернетом. К сожалению, Интернет меняется так быстро, что за ним не угонится ни одна поисковая система. Поэтому иногда вместо нужного документа мы видим сообщение об ошибке, которое браузер получает и высвечивает в своем окне, когда на сайте не оказывается нужного документа. Мы узнали в этом разделе, что web-страница состоит из текста, а картинки хранятся отдельно и не обязательно на том же сайте. Очень важно понимать, что автоматический индекс хранит у себя только тексты страничек. Дело в том, что картинки бесполезны для поиска, мы ведь ищем какие-то слова, комбинации букв и цифр. Но в картинках нет ни букв, ни цифр, поэтому найти можно только то, что содержится в тексте странички.