Значение dynamic свойства document-state сообщает роботам, что страницу надо будет индексировать при следующем проходе, потому что ее содержимое может поменяться.
   Дальше два раза задаются ключевые слова свойства keywords: первый раз на русском языке, второй – на английском. При этом язык, на котором написаны ключевые слова, задается с помощью атрибута lang.
   Эффективность сайта напрямую зависит от того, насколько адекватно он отображается в поисковых системах, а это во многом определяется хорошо подобранными ключевыми словами.
   В качестве ключевых нужно использовать слова, имеющие прямое отношение к тексту, расположенному на странице. Это значит, что для каждой страницы вашего сайта надо составлять свой список ключевых слов так, чтобы они наилучшим образом отражали ее содержимое.
   Не стоит повторять ключевые слова по нескольку раз. Если используете словосочетания, не применяйте в них союзы и предлоги, так как они не несут полезной смысловой нагрузки, а только занимают место. Обычно поисковые роботы распознают первые 200–250 символов, определенных в параметре keyword. Порядок слов зависит от их важности, наиболее важные слова следует располагать в начале списка.
   При подборе ключевых слов постарайтесь предположить, какие сочетания и слова будет использовать пользователь при поиске страницы вашей тематики, и используйте в ключевых словах именно их. Для разных страниц сайта, даже если их тематика одинакова, старайтесь использовать разные сочетания ключевых слов, тогда шанс, что пользователь найдет именно ваш сайт, повысится.
   Однако помните, что сейчас поисковые системы ведут поиск не только по ключевым словам – зачастую роботы просматривают всю страницу, чтобы определить ее тематику. Старайтесь создавать страницы, в которых ключевые слова соответствуют содержанию, тогда у вас будет шанс оказаться в первых рядах при поиске.
   Параметр resource-type сообщает поисковому роботу тип страницы и применяется для больших сайтов, где много страниц различного назначения. Страница индексируется, только если в качестве значения resource-type задано document.
   Рассмотрим параметр revisit. Он говорит, что поисковый робот должен вернуться для переиндексации сайта через два дня. Этот параметр надо задавать, если вы регулярно обновляете содержимое страниц, что поспособствует хранению в поисковых системах актуальной информации о вашем сайте.
   Параметр robots дает роботам некоторые управляющие команды. В случае из примера он указывает на то, что текущую страницу индексировать не надо, однако нужно пройти по ссылкам на странице и проиндексировать остальную часть сайта.
   В табл. 1.5 представлены команды, которые можно использовать для управления роботами.
Таблица 1.5. Значения атрибута content для свойства robots
   Встретив строку URL, робот прекратит индексацию текущей страницы и перейдет на страницу с адресом test.ru.
   Из всего, что рассмотрено выше, становится понятна важность элемента META, он отвечает за многие параметры страницы. Далеко не все его возможности будут необходимы постоянно, однако всегда нужно помнить о том, что вы можете сделать с его помощью.
   Вы должны знать, что без возможностей элемента META для раскрутки сайта в поисковых системах не обойтись, но они не спасут, если сайт не будет соответствовать ожиданиям посетителей. Поэтому пользуйтесь ими в качестве дополнения к качественно сделанному сайту.

   <link href="copyrihgt.html" rel="copyright" />
   <link href="help.html" rev="help" />
   <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
   <title>Использование элемента LINK</title>
   </head>
   </html>
 
   В примере из листинга 1.9 элемент LINK использован для прикрепления к текущему документу таблиц стилей, для указания файла, содержащего информацию об авторском праве на данный документ, и для определения файла, в котором хранится справочная информация.
   В табл. 1.6 приведены некоторые возможные значения атрибута rel. За более подробной информацией стоит обратиться к специальной литературе или к спецификации на сайте W3C.

Таблица 1.6. Некоторые значения атрибута rel
 
   Совет
   Использование значения alternate атрибута rel в сочетании с другими атрибутами hreflang и charset, которые задают в элементе LINK язык и кодировку документа, подскажет браузеру, где искать альтернативные версии текущего документа, написанные на других языках.
   Мы разобрались с элементом LINK и выяснили его возможности относительно работы с различными документами и в частности с таблицами стилей. Теперь рассмотрим элемент, который пригодится при работе с другими важными объектами создания сайтов.

Элемент SCRIPT

   Элемент SCRIPT позволяет присоединять к документу сценарии. Он требует наличия закрывающего тега, при этом текст сценария может располагаться либо в этом элементе, либо во внешнем файле. Если текст сценария расположен во внешнем файле, то он подключается с помощью атрибутов элемента SCRIPT.
   Рассмотрим атрибуты этого элемента. Основным можно считать атрибут type, который задает язык сценария, присоединяемого к странице. Если этот атрибут задан, он отменяет установленный по умолчанию язык сценариев. На случай подключения внешнего файла со сценариями у элемента SCRIPT есть атрибут src, в качестве значения которого используют место расположения файла со сценариями. Это удобно, если для различных страниц нужно использовать одинаковые сценарии.
   У элемента SCRIPT есть еще один вспомогательный атрибут – defer, который запрещает загружать сценарий до окончания полной загрузки страницы.
   В листинге 1.10 показаны разные примеры подключения сценариев к HTML-документу.
Листинг 1.10. Использование элемента SCRIPT
   <!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01 Transitional//EN»
   "http://www.w3.org/TR/html4/loose.dtd">
   <html>
   <head>
   <script defer="defer" type="text/javascript">
   <!–текст сценария–>
   </script>
   <script type="text/javascript" src="test.js">
   </script>
   <title>Использование элемента SCRIPT</title>
   </head>
   </html>
 
   Количество подключаемых сценариев не ограничено, однако помните, что на их обработку требуется время, так что не стоит загружать браузер больше необходимого.

www.test.test/mytests/test.html для документов, расположенных в Интернете. Если путь к файлу очень длинный и неудобно каждый раз вводить его, то можно задать относительный адрес. Например, чтобы из документа, находящегося по адресу C:\Test\MyTests\test.html, получить доступ к документу C:\Test\test.jpg, достаточно в нем набрать. \test.jpg, при этом знак «.» означает переход на более высокий уровень иерархии каталогов.
   Основным атрибутом элемента BASE является href. В качестве его значения используется адрес базовой папки, относительно которой и будут вычисляться относительные адреса.
   Еще одним полезным атрибутом этого тега является target. Он предназначен для работы с фреймами, то есть с HTML-документами, представляющими собой набор окон, каждое из которых является дочерним к основному, родительскому окну документа. Атрибут target определяет, в какое окно будут загружаться страницы по ссылкам, встречающимся в документе. Этот атрибут может принимать четыре значения:
   • _top – отменяет все фреймы и загружает страницу в полное окно браузера;
   • _blanc – загружает страницу в новое окно;
   • _self – загружает страницу в текущее окно;
   • _parent – загружает страницу во фрейм-родитель.
   При этом можно использовать элемент BASE с указанием только одного из атрибутов.
   В листинге 1.11 представлен пример использования элемента BASE.

Листинг 1.11. Использование элемента BASE
   <!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01 Transitional//EN»
   "http://www.w3.org/TR/html4/loose.dtd">
   <html>
   <head>
   <base href="http://www.test.test/" target="_blank" />
   <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
   <title>Использование элемента BASE</title>
   </head>
   </html>
 
   В примере из листинга 1.11 все относительные адреса будут браться от адреса http://www.test.test/, то есть если в тексте документа будет строка с адресом ../IMG/test.jpg, то браузер будет ее воспринимать как http://www.test.test/IMG/test.jpg. При этом все ссылки будут открываться в новых окнах, если среди параметров самой ссылки не указать другой вариант.
   Мы разобрались со всеми элементами, которые можно использовать внутри элемента HEAD, и от заголовка документа пора перейти к его телу.

   <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
   <title>Использование элемента BODY</title>
   </head>
   <body alink="#00FF00" vlink="red" link="#330000">
   </body>
   </html>
 
   В примере для активной и непосещенной ссылки цвет задан с помощью цифр и букв: они определяют код цвета в шестнадцатеричном формате и записываются в качестве значения соответствующего атрибута после знака #. Для посещенной ссылки цвет задан ключевым словом. Использовать ключевые слова просто. В качестве обозначения цвета с их помощью применяются стандартные названия цветов на английском языке. Указывайте простые названия цветов вроде blue, red, black и не ошибетесь.
   Что касается записи цвета в цифрах, то код для нужного цвета можно определить, используя любой графический редактор.
   Элемент BODY предоставляет большие возможности для управления фоном страницы. Рассмотрим атрибуты, отвечающие за это.
   Для начала надо задать фоновый цвет страницы. Это делается с помощью атрибута bgcolor, значение которого определяет цвет фона. Потом нужно указать фоновый рисунок страницы с помощью атрибута background, значение которого представляет собой адрес файла с рисунком для фона. При этом старайтесь ставить цвет фона, близкий к цветовой гамме фонового рисунка. Это пригодится, если у пользователя не загрузится фоновый рисунок. Когда цвет фона близок к цвету рисунка, не будет дисбаланса в общем виде страницы.
   Следующий атрибут управляет прокруткой фона и называется bgproperties. Он определяет, будет ли фон прокручиваться вместе с текстом. Этот атрибут принимает всего одно значение fixed, позволяющее зафиксировать фон документа и не прокручивать его вместе с текстом. В противоположном случае нужно просто удалить этот атрибут. При выборе параметров прокрутки фона надо действовать очень осторожно и следить за тем, чтобы при прокрутке не терялась читаемость текста.
   В листинге 1.13 представлен пример использования атрибутов элемента BODY, отвечающих за фон документа.
Листинг 1.13. Параметры фона
   <!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01 Transitional//EN»
   "http://www.w3.org/TR/html4/loose.dtd">
   <head>
   <base href="http://www.test.test/" target="_blank" />
   <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
   <title>Использование элемента BODY</title>
   </head>
   <body background="test.jpg" bgcolor="#0033CC" bgproperties="fixed">
   </body>
   </html>
 
   В примере из листинга 1.13 файл test. jpg оформлен в синих тонах, поэтому и цвет фона взят из синей гаммы. Прокрутка фона вместе с текстом запрещена.
   После того как мы разобрались с фоном, можно задать положение содержимого страницы относительно границ окна браузера.
   За отступ от границ окна отвечают следующие атрибуты элемента BODY:
   • bottommargin – определяет расстояние от нижнего края окна браузера до содержимого страницы;
   • leftmargin – указывает расстояние от левого края окна браузера до содержимого страницы;
   • topmargin – задает расстояние от верхнего края окна браузера до содержимого страницы.
   Расстояние для всех атрибутов устанавливается в пикселах.
   В листинге 1.14 приведен пример указания расстояния до содержимого страницы с помощью атрибутов элемента BODY.
Листинг 1.14. Установка расстояния от границ окна до содержимого страницы
   <!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01 Transitional//EN»
   "http://www.w3.org/TR/html4/loose.dtd">
   <head>
   <base href="http://www.test.test/" target="_blank" />
   <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
   <title>Использование элемента BODY</title>
   </head>
   <body topmargin="10" leftmargin="20" bottommargin="10">
   </body>
   </html>
 
   В примере расстояние сверху и снизу будет по 10 пикселов, а слева – 20 пикселов.
   У элемента BODY есть еще два атрибута, которые могут нам пригодиться. Атрибут text отвечает за цвет текста в документе. Когда задаете цвет текста, следите, чтобы он не сливался с фоном страницы.
   Атрибут scroll определяет, будет ли в окне документа вертикальная полоса прокрутки. У него всего два значения: yes и no, обозначающие разрешить и запретить прокрутку соответственно. На самом деле запрещать прокрутку не стоит, потому что документ, который у вас на экране виден полностью без проблем, у пользователя с низким разрешением монитора может не поместиться на экране. В итоге без полосы прокрутки он просто не увидит часть документа.
   Мы рассмотрели элемент BODY, его возможности и функции. Все параметры, определяемые в этом элементе, влияют на общий вид документа.
   Когда вы создаете большие сайты, то со временем можете забыть, что именно делает та или иная часть кода страницы. Комментарии помогут избежать этого.

Комментарии

   Комментарии могут располагаться в любом месте страницы, потому что не отображаются браузером. В качестве текста комментариев можно задавать пояснения к коду страницы. Это удобно, если код большой или с текстом работают несколько человек.
   Комментарии заключаются в тег: <! – текст комментария – >. Текст, расположенный внутри этого тега, не будет отображаться.

Резюме

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

Глава 2
Ввод и оформление текста

   2.1. Создание заголовков
   2.2. Создание абзацев
   2.3. Создание обрывов строк
   2.4. Создание списков
   2.5. Ссылки
   2.6. Форматирование текста
 
   Ввод текстовой информации на сайт осуществляется внутри элемента BODY. Однако чаще всего простое расположение текста внутри элемента BODY неприемлемо, необходимо его оформлять, например разделять на абзацы или создавать заголовки. Для оформления текста HTML предоставляет много возможностей: для любого абзаца или заголовка можно задать уникальный внешний вид. Язык HTML также позволяет создавать списки с маркерами любого типа. Можно менять цвет, размер и шрифт текста. В общем, у создателя сайта есть возможность оформить свой текст очень красочно.