Служебные теги HTML с параметрами
Содержание:
Тег META
Элемент META — хотя его наличие в документе не обязательно, он выполняет множество различных функций — таких как кодировка документа, ключевые слова, описание и авторство.
Кодировка документа (charset) — означает установку набора символов для страницы. Каждый способ кодировки можно представить как табличку, в которой каждой букве русского алфавита, как строчной, так и заглавной, поставлен в соответствие некоторый код, которым эта буква представляется в компьютере. Первая кодировка использовалась в Unix-системах, называли ее KOI8-R, другая в среде Windows, поэтому и называется Windows-1251, существуют и другие. Если текст, записанный при помощи одной кодировки, попытаться прочитать при помощи другой, то увидишь беспорядочный набор букв и символов, который никак не похож на нормальный текст.
Указываем в коде страницы способ кодировки content = «text/html; charset = windows-1251». Атрибут http-equiv указывает на поведение страницы, если он будет равен refresh, то браузер перейдет по указанному далее адресу.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <title>! Заголовок web-страницы !</title> </head> </html>
Тег META так же используется для определения ключевых слов (keywords), описания темы сайта (description), а так же указания автора (author). Ключевые слова — это отдельные слова и словосочетания, отражающие самую важную информацию, изложенную на странице, используемые поисковыми роботами.
Записываем код страницы с добавлением ключевых слов name=»keywords».
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <meta name="keywords" content="! Сюда вписываются ключевые слова !"> <title>! Заголовок web-страницы !</title> </head> </html>
Записываем код страницы с добавлением описания name=»description».
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <meta name="keywords" content="! Сюда вписываются ключевые слова !"> <meta name="description" content="! Сюда помещается описание web-страницы !"> <title>! Заголовок web-страницы !</title> </head> </html>
Записываем код страницы с добавлением авторства name=»author».
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta name="author" content="! Автор контента !"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <meta name="keywords" content="! Сюда вписываются ключевые слова !"> <meta name="description" content="! Сюда помещается описание web-страницы !"> <title>! Заголовок web-страницы !</title> </head> </html>
Тег BODY
Последний служебный элемент, который мы рассмотрим — это тег BODY. В нем содержится все, что отображается на странице — текст, рисунки, таблицы. Атрибуты элемента BODY задают параметры оформления для всего документа — цвет фона, цвет текста, цвет фрагментов текста, которые являются ссылками на другие фрагменты или web-страницы. Но об этом чуть позже…
Добавляем в код страницы элемент BODY.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta name="author" content="! Автор контента !"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <meta name="keywords" content="! Сюда вписываются ключевые слова !"> <meta name="description" content="! Сюда помещается описание web-страницы !"> <title>! Заголовок web-страницы !</title> </head> <body> ! Здесь размещается все то, что должно отображаться браузером ! </body> </html>
Сохрани этот код в файле index.html, сюда мы будем добавлять содержимое по ходу рассмотрения материала. Давай проверим, откроем файл в браузере, страница должна быть абсолютно чистой, потому, что внутри элемента BODY ничего нет. НО! Уже после изучения следующего раздела «Добавление текста и ссылок», у тебя бутет, что посмотреть в браузере.
Как я уже упоминал ранее, элемент BODY имеет атрибуты, с помощью которых задаются параметры страницы. Сейчас разберем их подробнее:
- bgcolor — отвечает за цвет фона страницы, может обозначаться как цифровым, так и буквенным значением.
Пример: фон страницы будет — красным.
<body bgcolor="RED"> ! Содержимое страницы ! </body> или так <body bgcolor="FF0000"> ! Содержимое страницы ! </body>
background — с помощью этого атрибута прописывается путь к изображению, которое должно быть фоном.
<body background="! URL - изображения !"> ! Содержимое страницы ! </body>
- bgproperties — указание на то, должен ли двигаться фон при прокрутке страницы (true) или нет (false).
- text — задает цвет текста.
<body text="! Здесь вписывается цвет текста !"> ! Содержимое страницы ! </body>
- link — цвет непросмотренных ссылок,
- vlink — цвет посещенных ссылок,
- alink — цвет ссылок, при наведении на них курсора.
<body link="BLUE" vlink="GREEN" alink="RED"> ! Содержимое страницы ! </body>
А теперь зададим параметры для отображения страницы применив все атирибуты:
<body bgcolor="! Цвет фона !" text="! Цвет текста !" link="BLUE" vlink="GREEN" alink="RED"> ! Содержимое страницы ! </body>
Безопасные цвета
Главное правило, которого нужно придерживаться при выборе цвета фона и цвета текста — они должны быть достаточно контрастны, чтобы текст на этом фоне легко читался и посетителям сайта не приходилось бы напрягать зрение. Не стоит использовать раздражающих сочетаний, типа ярко-зеленый текст на черном фоне или красный текст на зеленом. Ниже приводится таблица с некоторыми основными цветами для использования в HTML.
| NAVY 000080 |
SILVER C0C0C0 |
BLUE 0000FF |
GREEN 008000 |
| TEAL 008080 |
LIME 00FF00 |
AQUA 00FFFF |
MAROON 800000 |
| PURPLE 800080 |
RED FF0000 |
FUCHSIA FF00FF |
OLIVE 808000 |
| GRAY 808080 |
YELLOW FFFF00 |
WHITE FFFFFF |
BLACK 000000 |