Атрибуты языка
Не действительны в элементах base, br, frame, frameset, hr, iframe, param и script.
| dir | ltr | rtl | Задает направление вывода текста |
| lang | код_языка | Задает код языка |
Атрибуты клавиатуры
| accesskey | символ | Задает клавишу быстрого доступа для элемента |
| tabindex | число | Задает для элемента порядок перехода по клавише табуляции |
Атрибуты событий формы
Действительны только в элементах form.
| onchange | сценарий | Сценарий, который выполняется при изменении элемента |
| onsubmit | сценарий | Сценарий, который выполняется при отправке формы |
| onreset | сценарий | Сценарий, который выполняется при сбросе формы |
| onselect | сценарий | Сценарий, который выполняется при выборе элемента |
| onblur | сценарий | Сценарий, который выполняется, когда элемент теряет фокуса |
| onfocus | сценарий | Сценарий, который выполняется, когда элемент получает фокус |
Атрибуты событий клавиатуры
Не действительны в элементах base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, title.
| onkeydown | сценарий | Что делать, когда нажата клавиша |
| onkeypress | сценарий | Что делать, когда клавиша нажата и отпущена |
| onkeyup | сценарий | Что делать, когда клавиша отпущена |
Атрибуты событий мыши
Не действительны в элементах base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, title.
| onclick | сценарий | Что делать при щелчке мыши |
| ondblclick | сценарий | Что делать при двойном щелчке мыши |
| onmousedown | сценарий | Что делать, когда нажата клавиша мыши |
| onmousemove | сценарий | Что делать, когда перемещается указатель мыши |
| onmouseout | сценарий | Что делать, когда указатель мыши покидает элемент |
| onmouseover | сценарий | Что делать, когда указатель мыши проходит над элементом |
| onmouseup | сценарий | Что делать, когда кнопка мыши отпущена |
Атрибуты событий окна
Действительны только в элементах body и frameset.
| onload | сценарий | Сценарий, который выполняется при загрузке документа |
| onunload | сценарий | Сценарий, который выполняется при выгрузке документа |
является возможность для событий
Новым в HTML 4. 0 является возможность для событий HTML запускать действия браузера, такие как запуск JavaScript, когда пользователь щелкает на элементе HTML.
Ниже представлен список атрибутов, которые можно использовать в тегах HTML для определения действий событий.
Чтобы больше узнать о программировании с помощью этих событий, почитайте учебники по JavaScript и DHTML.
Базовые атрибуты
Не действительны в элементах base, head, html, meta, param, script, style, и title.
| class | class_rule или style_rule | Класс элемента |
| id | номер_id | Уникальный id элемента |
| style | определение_стиля | Определение встроенного стиля |
| title | текст_подсказки | Текст, выводимый в качестве подсказки |
Добавление сценария на страницу HTML
Сценарий в HTML определяют с помощью тега <script>. Обратите внимание, что для определения языка сценария необходимо использовать атрибут type.
<html> <head> </head> <body>
<script type="text/javascript"> document.write("Всем привет!") </script>
</body> </html>
Пример выполнения данного HTML-кода
Этот сценарий создаст следующий вывод:
Всем привет!
Примечание: Чтобы узнать больше о сценариях в HTML, почитайте соответствующий учебник по JavaScript.
Использование шрифтов в HTML
Тег <font> в HTML использовать не рекомендуется. Предполагается, что он будет удален в будущей версии HTML.
Даже если его использует множество людей, лучше стараться его избегать и использовать вместо этого стили.
С помощью следующего кода HTML можно определить как размер шрифта, так и тип вывода в браузере:
<html> <body>
<p> <font size="2" face="Verdana"> Это параграф. </font> </p>
<p> <font size="5" face="Times"> Это другой параграф. </font> </p>
</body> </html>
Пример выполнения данного HTML-кода
| size="число" | size="2" | Определяет размер шрифта |
| size="+число" | size="+1" | Увеличивает размер шрифта |
| size="-число" | size="-1" | Уменьшает размер шрифта |
| face="название шрифта" | face="Times" | Определяет название шрифта |
| color="значение цвета" | color="#eeff00" | Определяет цвет шрифта |
| color="название цвета" | color="red" | Определяет цвет шрифта |
Тег <font> НЕ должен использоваться.
Тег <font> не рекомендуется использовать в последних версиях HTML (HTML 4 и XHTML).
Консорциум World Wide Web (W3C) удалил тег <font> из своих рекомендаций. В будущих версиях HTML, для определения свойств компоновки и вывода элементов HTML будут использоваться таблицы стилей (CSS).
Правильно будет использовать стили - Примеры
Задание шрифта текста
<html> <body> <h1 style="font-family:verdana">Заголовок </h1> <p style="font-family:courier">Параграф</p> </body> </html>
Пример выполнения данного HTML-кода
Задание размера шрифта текста
<html> <body> <h1 style="font-size:150%">Заголовок</h1> <p style="font-size:80%">Параграф</p> </body> </html>
Пример выполнения данного HTML-кода
Задание цвета шрифта текста
<html> <body> <h1 style="color:blue">Заголовок </h1> <p style="color:red">Параграф</p> </body> </html>
Пример выполнения данного HTML-кода
Задание для текста шрифта, его размера и цвета
<html> <body> <p style="font-family:verdana;font-size:80%;color:green"> Это параграф, содержащий некоторый текст. Это текст, содержащийся в параграфе. Это все тот-же параграф с текстом. </p> </body> </html>
Пример выполнения данного HTML-кода
Прежде всего: Дочитайте до конца это учебное руководство по HTML!!! В последующих лекциях будет показано, почему некоторые теги, такие как <font>, должны быть удалены из рекомендаций HTML, и как использовать таблицы стилей в документе HTML.
Чтобы больше узнать о таблицах стилей, найдите хороший учебник.
Зачем использовать HTML 4.0?
HTML предназначался для других целей!
Исходный HTML не предполагалось использовать для форматирования документа. Теги HTML должны были определять содержимое документа, например:
<p>Это параграф</p>
<h1>Это заголовок</h1>
Когда в спецификацию HTML 3.2 были добавлены такие теги как <font> и атрибуты цвета, то для разработчиков Web начался просто кошмар. Разработка больших Web-сайтов, где информацию о шрифтах и цвете добавлять на каждую Web-страницу, стала длительным, дорогим и чрезмерно болезненным процессом.
В чем достоинство HTML 4.0 ?
В HTML 4.0 все форматирование можно удалить из документа HTML и хранить в отдельной таблице стилей.
Так как HTML 4.0 отделяет представление от структуры документа, мы получили то, что всегда требовалось: полный контроль за компоновкой представления без потери содержимого документа.
Не используйте атрибуты представления в тегах HTML, если этого можно избежать. Начните использовать стили! Прочтите учебник по CSS, чтобы познакомиться с таблицами стилей.
Не используйте не рекомендованные теги. Просмотрите полный справочник по HTML 4.01, чтобы узнать, какие теги и атрибуты не рекомендовано использовать.
Готовьтесь к использованию XHTML
XHTML является "новым" HTML. Самая важная вещь, которую можно сделать на данном этапе, -- начать писать действительный HTML 4.01 код. Начните также записывать свои теги в нижнем регистре. Всегда закрывайте свои теговые элементы. Никогда не заканчивайте параграф без завершающего </p>.
Примечание: Официальный HTML 4.01 рекомендует использовать теги в нижнем регистре.
Если вы хотите больше узнать о XHTML, почитайте соответствующий учебник.
Проверяйте свои файлы HTML на соответствие HTML 4.01
Документ HTML проверяется согласно Определению типа документа (DTD). Прежде чем файл HTML можно будет проверить, необходимо добавить в качестве первой строки файла правильный DTD.
DTD Strict (строгий) для HTML 4.01 включает элементы и атрибуты, которые рекомендованы к использованию и не появляются в наборах фреймов:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
DTD Transitional (переходный) для HTML 4. 01 включает все из строгого DTD плюс не рекомендованные элементы и атрибуты:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
DTD Frameset (набор фреймов) для HTML 4.01 включает все из переходного DTD плюс также фреймы:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
Проверьте свой файл HTML с помощью средства проверки W3C
Введите адрес своей страницы в поле формы, показанной ниже:
<html> <head> <form method="get" action="http://validator.w3.org/check" target="_blank"> Введите адрес своей страницы в расположенное ниже поле <br /> <br /> <input name="uri" size="50" /> <br /><br /> <input type="submit" value="Validate the page" /> </form> </body> </html>
Пример выполнения данного HTML-кода
Использование стилей в HTML
В HTML 4.0 все форматирование можно переместить из документа HTML в отдельную таблицу стилей.
<html> <head> <style type="text/css"> h1 {color: red} h3 {color: blue} </style> </head>
<body> <h1>Это заголовок 1</h1> <h3>Это заголовок 3</h3> </body> </html>
Пример выполнения данного HTML-кода
Этот пример показывает, как форматировать документ HTML с помощью информации о стилях, добавленной в раздел заголовка <head>.
<html> <body>
<a href="lastpage.htm" style="text-decoration:none"> ЭТО НЕПОДЧЕРКНУТАЯ ССЫЛКА! </a>
</body> </html>
Пример выполнения данного HTML-кода
Этот пример показывает, как с помощью атрибута style сделать ссылку, которая не подчеркивается.
<html> <head> <link rel="stylesheet" type="text/css" href="styles.css" > </head>
<body> <h1>Я отформатирован с помощью присоединенной таблицы стилей</h1> <p>Я тоже!</p> </body> </html>
Пример выполнения данного HTML-кода
Этот пример показывает, как использовать тег <link> для соединения с внешней таблицей стилей.
JavaScript и VBscript
JavaScript это разработанный корпорацией Netscape межплатформенный объектно-ориентированный язык сценариев. Язык JavaScript основан на языке Java, а VBscript - на Visual Basic. JavaScript содержит набор основных объектов и набор элементов языка. Используя его можно на лету менять внешний вид документа, в зависимости от изменения каких-либо условий, проводить первичную обработку информации отправляемой через формы и многое другое.
Язык VBscript является "изобретением" компании Microsoft. Язык VBscript проще и понятней для начинающих программистов и Web-дизайнеров. Но несомненным преимуществом JavaScript является его всесторонняя поддержка, а также легкость и удобство кода, унаследованные из Java и C/C++. Практически все широко распространенные браузеры имеют встроенную поддержку JavaScript, так что нет необходимости беспокоиться, будет ли ваша интерактивная страница работать.
Элемент head
Элемент head содержит общую информацию,называемую также мета-информацией, о документе. Мета означает "информация о чем-то".
Можно сказать, что мета-данные означают информацию о данных, или мета-информация означает информацию об информации.
Элементы внутри элемента head не выводяться браузером. Согласно стандарту HTML, внутри раздела head допустимы только несколько тегов. Это теги <base>, <link>, <meta>, <title>, <style>, и <script>.
Посмотрите на следующую незаконную конструкцию:
<head> <p>Это какой-то текст</p> </head>
В этом случае у браузера есть две возможности:
Вывести текст, потому что он находится внутри элемента параграфаСкрыть текст, потому что он находится внутри элемента заголовка
Если поместить элемент HTML, такой как <h1> или <p>, внутрь элемента head, как в этом случае, большинство браузеров его выведут, даже если это незаконно.
Должны ли браузеры прощать подобные ошибки? Наверно, это неправильно.
| <head> | Определяет информацию о документе |
| <title> | Определяет заглавие документа |
| <base> | Определяет базовый URL для всех ссылок на странице |
| <link> | Определяет ссылку на ресурс |
| <meta> | Определяет мета-информацию |
| <!DOCTYPE> | Определяет тип документа. Этот тег идет перед начальным тегом <html>. |
Как использовать стили
Когда браузер считывает таблицу стилей, он форматирует документ согласно этой таблице. Существует три способа использования таблицы стилей.
Как работать со старыми браузерами
Браузер, который вообще не распознает тег <script>, будет выводить содержимое тега <script> в виде текста на странице. Чтобы браузер этого не делал, необходимо спрятать сценарий в тегах комментария. Старый браузер (который не распознает тег <script>) проигнорирует комментарий и не будет выводить содержимое тега на странице, в то время как более новые браузеры поймут, что скрипт необходимо выполнить, даже если он окружен тегами комментария.
JavaScript:
<script type="text/javascript"> <!-- document.write("Всем привет!") //--> </script>
VBScript:
<script type="text/vbscript"> <!-- document.write("Всем привет!") '--> </script>
Каскадные таблицы стилей (CSS)
CSS используются для одновременного управления стилями и компоновкой множества страниц Web. Используя CSS Вам не придется раз за разом описывать внешний вид одинаковых элементов, и постоянно держать в голове их описание, достаточно сделать это один раз в отдельном, файле и подключить его ко всем гипертекстовым страницам, и браузер сам отформатирует текст в соответствии с вашими рекомендациями.
CSS обеспечивает полный контроль за компоновкой, не теряя при этом содержимое документа. Иными словами, в html файле хранится только логическая структура документа, а все оформление вынесено в отдельный документ. И если вдруг возникнет необходимость изменить внешний вид какого-либо элемента, уже не придется править все страницы сайта, а достаточно будет лишь изменить описание в таблице стилей.
Компоновка документа в HTML
Выше были рассмотрены основные теги HTML. Используя их уже можно создавать свои страницы. Но создание страницы это не только верстка материалов, но и компоновка всех элементов (меню, заголовок страницы, основное информационное наполнение, банеры и др.) на странице HTML документа. Если все элементы должны располагаться один за другим тогда понятно как поступить - размещаем все блоки последовательно друг за другом и получаем результат. А как быть если два элемента должны размещаться на одном уровне по горизонтали? Например, меню должно находиться слева или справа от текста? Ответ очевиден, использовать свойство HTML тегов, позволяющее вкладывать один тег в другой.
Наиболее распространенным способом компоновки страницы является использование таблиц. Ниже будет рассмотрен этот способ.
Компоновка HTML - использование таблиц
Как известно тег <table> используется для отображения таблиц в HTML документах. У этого тега имеется атрибут border, указывающий толщину границы. И если его значение равно нулю, то граница не видна, видно лишь содержимое ячеек. Это и используется для компановки страниц. В распоряжении дизайнера появляется не одна большая область для вставки элементов, а бесконечное число более мелких зон.
Наберите следующий пример.
<html> <body> <p>Часть этой страницы отформатирована с помощью двух столбцов, как газетная страница. Все что находится ниже этого текста располагается в двух ячейках таблицы. Как можно видеть, есть левый столбец и правый столбец.</p> <table border="0" width="100%"> <tr><td width="50%" valign="top">Этот текст выводится в левом столбце.</td><td width="50%" valign="top">А этот текст выводится в правом столбце.</td></tr> </table> </body> </html>
Пример выполнения данного HTML-кода
В этом примере тег HTML <table> используется для деления части Web-страницы на два столбца, причем в данном случае ширина столбцов одинакова. Однако это не является обязательным условием, что показано в следующем примере.
<html> <body> <p>Часть этой страницы отформатирована с помощью двух столбцов, как газетная страница. Все что находиться ниже этого текста располагается в двух ячейках таблицы. Как можно видеть, есть левый столбец и правый столбец.</p> <table border="0" width="100%"> <tr><td width="20%" valign="top">Этот текст выводится в левом столбце. Ширина этого столбца 20%</td><td width="80%" valign="top">А этот текст выводится в правом столбце. Ширина столбца 80%</td></tr> </table> </body> </html>
Пример выполнения данного HTML-кода
Особенность состоит в использовании таблицы без видимой рамки и возможно небольшого дополнительного отступа внутри ячеек таблицы.
Не имеет значения сколько текста будет размещено на этой странице, он будет оставаться в пределах своего столбца.
После добавления таблицы для разметки страницы мы получаем несколько независимых областей с которыми мы можем работать независимо, задавать цвет фона шрифты, добавлять вложеные таблицы для разбиения ячеек полученой части еще на более мелкие элементы. Однако создавать большую вложенность таблиц не рекомендуется - так увеличивается размер страницы. Гораздо рациональнее использовать объединение ячеек.
<html> <body> <p>Часть этой страницы отформатирован с помощью двух столбцов, как газетная страница, и общего заголовка. Все что находиться ниже этого текста располагается в трех ячейках таблицы, причем для верхней ячейки указан атрибут colspan="2". Как можно видеть, есть левый столбец и правый столбец, а также общий заголовок. Для каждой ячеки указан свой цвет фона.</p> <table border="0" width="100%" cellpadding="0" cellspacing="0"> <tr height="150px"><td width="100%" valign="top" colspan="2" bgcolor="#cccccc"> Этот текст выводится в верхней ячейке таблицы.</td></tr> <tr height="500px"><td width="20%" valign="top" bgcolor="#dddddd"> Этот текст выводится в левом столбце. Ширина этого столбца 20%</td><td width="80%" valign="top" bgcolor="#eeeeeee">А этот текст выводится в правом столбце. Ширина столбца 80%</td></tr> </table> </body> </html>
Пример выполнения данного HTML-кода
Этот же эффект можно получить и применив две таблицы вложенных одна в другую.
<html> <body> <p>Часть этой страницы отформатирован с помощью двух столбцов, как газетная страница, и общего заголовка. Все что находиться ниже этого текста располагается в ячейках таблицы, причем здесь применяется вложенностть одной таблицы в другую. Как можно видеть, есть левый столбец и правый столбец, а также общий заголовок. Для каждой ячеки указан свой цвет фона.</p>
<table border="0" width="100%" cellpadding="0" cellspacing="0"> <tr height="150px"><td width="100%" valign="top" bgcolor="#cccccc"> Этот текст выводится в верхней ячейке таблицы.</td></tr>
<tr height="500px"><td width="100%"> <table border="0" width="100%" height="100%" cellpadding="0" cellspacing="0"> <tr><td width="20%" valign="top" bgcolor="#dddddd"> Этот текст выводится в левом столбце. Ширина этого столбца 20%</td><td width="80%" valign="top" bgcolor="#eeeeeee"> А этот текст выводится в правом столбце. Ширина столбца 80%</td></tr></table> </td></tr> </table>
</body> </html>
Пример выполнения данного HTML-кода
Как можно видеть мы получили одинаковый результат, однако в первом случае размер кода получился значительно меньше, и кроме того сам исходный код более понятен.
Краткое заключение
Этот учебник научил вас, как использовать HTML для создания своего собственного Web-сайта. Еще лет десять назад, этих знаний было бы достаточно, но в современных условиях это уже не так. Если вы посмотрите на любой популярный сайт в сети, то можете заметить, что зачастую на сайте присутствуют не только статические элементы языка html, но различные динамические элементы, flash-клипы, сценарии, и много другое, что украшает сайт, делает его более удобным. Если вы хотите сделать небольшой сайт рассказывающий о себе, этих знаний будет достаточно, но для того чтобы работать профессионально, вам придется изучить еще очень многое.
HTML является универсальным языком разметки для Web. Он позволяет форматировать текст, добавлять графику, создавать ссылки, формы ввода, фреймы, и т.д. и сохранять все это в текстовом файле, который может прочитать и воспроизвести любой браузер.
Ключевым моментом в HTML являются теги, которые указывают, какое далее следует содержимое.
Мета-информация в HTML
Описание документа
<html> <head>
<meta name="author" content="Иван Петров"> <meta name="revised" content="Иван Петров,16/10/05"> <meta name="generator" content="Microsoft FrontPage 4.0">
</head> <body> <p> Атрибуты meta этого документа определяют автора и использованную программу редактора.</p> </body> </html>
Пример выполнения данного HTML-кода
Информация внутри элемента meta описывает документ.
Ключевые слова документа
<html> <head>
<meta name="description" content="примеры HTML"> <meta name="keywords" content="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript">
</head> <body> <p>Атрибуты meta этого документа описывают документ и его ключевые слова.</p> </body> </html>
Пример выполнения данного HTML-кода
Информация внутри элемента meta описывает ключевые слова документа.
Перенаправление пользователя
<html> <head> <meta http-equiv="Refresh" content="5;url=http://www.intuit.ru"> </head>
<body> <p> Извините! Мы переехали! Новый URL: <a href="http://www.intuit.ru">http://www.osp.ru</a> </p>
<p> Вы будете перенаправлены на новый адрес через пять секунд. </p>
<p> Если вы видите это сообщение более 5 секунд, щелкните, пожалуйста, на приведенной выше ссылке ссылке! </p>
</body> </html>
Пример выполнения данного HTML-кода
Этот пример показывает, как перенаправить пользователя, если адрес сайта изменился.
Элемент meta
Как было показано в предыдущей лекции, элемент head содержит общую информацию (мета-информацию) о документе.
HTML имеет также элемент meta, который помещается внутри элемента head. Элемент meta предназначен для предоставления мета-информации о документе.
Наиболее часто элемент meta используется для предоставления информации, которая имеет отношение к браузерам или поисковым машинам, описывающая содержание документа.
Примечание: Консорциум W3C заявляет в документе http://www.w3.org/TR/html4/struct/global.html#adef-http-equiv, что "Некоторые агенты пользователей поддерживают использование META для обновления текущей страницы после указанного количества секунд, с возможностью заменить ее другим URI. Авторы не должны использовать эту технику для пересылки пользователей на другие страницы, так как это делает страницу недоступной для некоторых пользователей. Вместо этого автоматическое перенаправление страницы должно делаться с помощью перенаправления на сервере".
Ключевые слова для поисковых машин
Некоторые поисковые машины в WWW будут использовать атрибуты name и content тега meta для индексации страницы.
Этот элемент meta определяет описание страницы:
<meta name="description" content="Бесплатные Web- учебники по HTML, CSS, XML, и XHTML">
Этот элемент meta определяет ключевые слова для страницы:
<meta name="keywords" content="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript">
Назначение атрибутов name и content состоит в описании содержимого страницы.
Однако, так как многие вебмастера использовали теги meta для недобросовестной рекламы, увеличивая количество повторений ключевых слов, чтобы страница получила более высокое положение, некоторые машины поиска полностью перестали использовать этот тег.
О машинах поиска можно почитать в учебнике по созданию Web-сайтов.
Неизвестные атрибуты meta
Иногда можно встретить атрибуты meta, которые могут оказаться совершенно незнакомыми, например:
<meta name="security" content="low">
Тогда необходимо просто принять для себя, что это является чем-то уникальным для сайта или для автора сайта и не имеет, вероятно, к вам никакого отношення.
Весь список атрибутов элемента meta можно найти в Полном справочнике тегов HTML 4.01 в конце книги.
с помощью двух столбцов, как
Часть этой страницы отформатирована с помощью двух столбцов, как газетная страница. Все что находиться ниже этого текста располагается в двух ячейках таблицы. Как можно видеть, есть левый столбец и правый столбец.
| Этот текст выводиться в левом столбце. | А этот текст выводиться в правом столбце. |
Раздел заголовка HTML
Заглавие документа
<html>
<head> <title>Название документа не выводится</title> </head>
<body> <p>Выводится этот текст</p> </body>
</html>
Пример выполнения данного HTML-кода
Информация о названии документа в элементе заголовка не выводится в окне браузера.
Одно место назначения для всех ссылок
<html> <head> <base target="_blank"> </head>
<body>
<p> <a href="http://www.intuit.ru" target="_blank">Эта ссылка </a> будет загружаться в новом окне, так как атрибут target задан как "_blank". </p>
<p> <a href="http://www.osp.ru"> Эта ссылка</a> также будет загружаться в новом окне, даже без атрибута target. </p>
</body> </html>
Пример выполнения данного HTML-кода
Этот пример показывает, как использовать тег base, чтобы все ссылки на странице открывались в новом окне.
Сценарии в HTML
Сценарии на страницах HTML позволяют сделать их более динамичными и интерактивными.
<html> <body>
<script type="text/javascript"> document.write("<h1>Всем привет!</h1>") </script>
</body> </html>
Пример выполнения данного HTML-кода
Этот пример показывает, как использовать сценарий в документе HTML.
Работа с браузерами, не поддерживающими сценарии
<html> <body>
<script type="text/javascript"> <!-- document.write("Если этот текст виден, то браузер поддерживает сценарии!") //--> </script>
<noscript>Нет поддержки JavaScript!</noscript>
<p> Браузер без поддержки JavaScript выведет текст из элемента noscript. </p>
</body> </html>
Пример выполнения данного HTML-кода
Этот пример показывает, как работать с браузерами, которые не поддерживают сценарии.
Схемы обращения к ресурсу URL
Несколько примеров наиболее распространенных схем обращения к ресурсу:
| file | файл на локальном ПК |
| ftp | файл на сервере FTP |
| http | файл на сервере WWW |
| gopher | файл на сервере Gopher |
| news | группа новостей Usenet |
| telnet | соединение Telnet |
| WAIS | файл на сервере WAIS |
Доступ к группе новостей. Следующий код HTML:
<a href="news:alt.html">HTML Newsgroup</a>
создает ссылку на группу новостей вида "HTML Newsgroup".
Загрузка с помощью FTP. Следующий код HTML:
<a href="ftp://www.osp.ru/ftp/winzip.exe">Загрузить WinZip</a>
создает ссылку для загрузки файла следующего вида: "Загрузить WinZip". (Эта ссылка не работает. Это просто пример.)
Ссылка на почтовую систему. Следующий код HTML:
<a href="mailto:info@intuit.ru">info@intuit.ru</a>
создает ссылку на вашу собственную почтовую систему.
Ссылки в HTML
Во время щелчка мышью на ссылке в документе HTML нижележащий тег <a> указывает на определенное место (адрес) в Web с помощью значения атрибута href, например, следующим образом:
<a href="lastpage.htm">Последняя</a>.
Ссылка "Последняя" в этом примере является ссылкой относительно Web-сайта, который вы просматриваете, а браузер создаст для доступа к странице полный адрес Web вида http://www.osp.ru/html/lastpage.htm.
Теги HTML могут иметь атрибуты.
Теги HTML могут иметь атрибуты. Специальные атрибуты для каждого тега перечислены в описании каждого тега, Перечисленные здесь атрибуты являются базовыми и атрибутами языка, которые стандартны для всех тегов (с небольшими исключениями):
Тег <noscript>
Кроме скрытия сценария внутри комментария можно добавить также тег <noscript>.
Тег <noscript> используется для определения заменяющего текста, если сценарий НЕ выполняется. Этот тег используется для браузеров, которые распознают тег <script>, но не поддерживают расположенный внутри сценарий, поэтому эти браузеры будут выводить вместо этого текст внутри тега <noscript>. Однако, если браузер поддерживает сценарий внутри тега <script>, то он проигнорирует тег <noscript>.
JavaScript:
<script type="text/javascript"> <!-- document.write("Hello World!") //--> </script> <noscript>Ваш браузер не поддерживает JavaScript!</noscript>
VBScript:
<script type="text/vbscript"> <!-- document.write("Hello World!") '--> </script> <noscript>Ваш браузер не поддерживает VBScript!</noscript>
| <script> | Определяет сценарий |
| <noscript> | Определяет заменяющий текст, если сценарий не выполняется |
| <object> | Определяет встроенный объект |
| <param> | Определяет для объекта настройки времени выполнения (параметры) |
| <applet> | Не рекомендуется. Используйте вместо этого <object> |
Теперь вы знаете HTML, что дальше?
Следующим шагом должно стать изучение XHTML и CSS, а также следует обратить внимание на JavaScript и VBscript.
Универсальные указатели ресурсов
Для адресации документа (или других данных) в WWW используется так называемый Универсальный указатель ресурса (URL - Uniform Resource Locator). Полный адрес в Web, такой как http://www.osp.ru/html/lastpage.htm следует следующим правилам синтаксиса:
scheme://host.domain:port/path/filename scheme определяет тип службы Интернет. Наиболее распространенным типом является http.domain определяет имя домена Интернет, например, osp.ru.host определяет хост домена. Если он отсутствует, то по умолчанию для http используется хост www.:port определяет номер порта на хосте. Номер порта обычно отсутствует. По умолчанию для http используется порт с номером 80.path определяет путь доступа (подкаталог) на сервере. Если путь доступа отсутствует, то ресурс (документ) должен быть расположен в корневом каталоге сайта Web.filename определяет имя документа. По умолчанию может использоваться имя файла default.asp, или index.html или что-то еще, в зависимости от настроек Web-сервера.
Внешняя таблица стилей
Внешняя таблица стилей является идеальной, когда стиль применяется к нескольким страницам. С помощью внешней таблицы стилей можно изменить внешний вид всего Web-сайта, изменяя один файл. Каждая страница должна соединяться с таблицей стилей с помощью тега <link>. Тег <link> находится в разделе заголовка <head>.
<html> <head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head> </html>
Пример выполнения данного HTML-кода
Внутренняя таблица стилей
Внутренняя таблица стилей должна использоваться, когда один документ использует единый стиль. Внутренние стили определяют в разделе заголовка с помощью тега <style>.
<html> <head> <style type="text/css"> body {background-color: red} p {margin-left: 20px} </style> </head> </html>
Пример выполнения данного HTML-кода
Встроенные стили
Встроенный стиль должен использоваться, когда особый стиль должен быть применен к единственному появлению элемента.
Чтобы использовать встроенные стили, используется атрибут style в соответствующем теге. Атрибут style может содержать любое свойство CSS. Следующий пример показывает, как изменить цвет и левое поле параграфа:
<html> <body> <p style="color: red; margin-left: 20px"> Это параграф </p> </body> </html>
Пример выполнения данного HTML-кода
Чтобы больше узнать о стилях, почитайте учебник о CSS.
| Тег | Описание |
| <style> | Задает определение стиля |
| <link> | Задает ссылку на ресурс |
| <div> | Определяет раздел в документе |
| <span> | Определяет раздел в документе |
| <font> | Не рекомендуется. Используйте вместо этого стили. |
| <basefont> | Не рекомендуется. Используйте вместо этого стили. |
| <center> | Не рекомендуется. Используйте вместо этого стили. |
XHTML
XHTML является "новым" HTML. Самыми последними рекомендациями по HTML является версия HTML 4.01. Это последняя и окончательная версия HTML.
HTML будет заменен XHTML, который является более строгой и четкой версией HTML.
Другие элементы
<!-- Это комментарий -->
<blockquote> Текстовая цитата из некоторого источника. </blockquote>
<address> Город <br> Адрес 1<br> Адрес 2<br> </address>
Физические стили
<b>Этот текст жирный</b> <i>Этот текст наклонный</i>
Формы
<form action="http://www.example.com/test.asp" method="post/get">
<input type="text" name="lastname" value="Петров" size="30" maxlength="50"> <input type="password"> <input type="checkbox" checked="checked"> <input type="radio" checked="checked"> <input type="submit"> <input type="reset"> <input type="hidden">
<select> <option>Яблоки <option selected>Бананы <option>Вишня </select>
<textarea name="Комментарии" rows="60" cols="20"></textarea>
</form>
Фреймы
<frameset cols="25%,75%"> <frame src="page1.htm"> <frame src="page2.htm"> </frameset>
Элементы текста
<p>Это параграф</p> <br> (перенос строки) <hr> (горизонтальная линейка) <pre>Этот текст заранее отформатирован</pre>
Элементы заголовка
<h1>Самый крупный заголовок</h1> <h2> . . . </h2> <h3> . . . </h3> <h4> . . . </h4> <h5> . . . </h5> <h6>Самый мелкий заголовок</h6>
Логические стили
<em>Этот текст выделен </em> <strong>Этот текст акцентирован</strong> <code>Это некоторый программный код</code>
Неупорядоченный список
<ul> <li>Первый элемент</li> <li>Следующий элемент</li> </ul>
Символьные объекты
< то же самое что < > то же самое что > © то же самое что ©
Список определений
<dl> <dt>Первый термин</dt> <dd>Определение</dd> <dt>Следующий термин</dt> <dd>Определение</dd> </dl>
Ссылки, анкеры, и элементы изображений
<a href="http://www.example.com/">Это ссылка</a> <a href="http://www.example.com/"><img src="URL" alt="заменяющий текст"></a> <a href="mailto:webmaster@example.com">Пошлите e-mail</a>
Именованный анкер: <a name="tips">Раздел полезных советов</a> <a href="#tips">Переход в Раздел полезных советов</a>
Структура документа HTML
<html> <head> <title>Здесь находится название документа</title> </head> <body> Здесь находится выводимый текст </body>
</html>
Таблицы
<table border="1"> <tr> <th>какой-то заголовок</th> <th>какой-то заголовок</th> </tr> <tr> <td>какой-то текст</td> <td>какой-то текст</td> </tr> </table>
Упорядоченный список
<ol> <li>Первый элемент</li> <li>Следующий элемент</li> </ol>
Кодировка URL от %00 до %8f
| ж | %00 | 0 | %30 | ` | %60 |
| %01 | 1 | %31 | a | %61 | |
| %02 | 2 | %32 | b | %62 | |
| %03 | 3 | %33 | c | %63 | |
| %04 | 4 | %34 | d | %64 | |
| %05 | 5 | %35 | e | %65 | |
| %06 | 6 | %36 | f | %66 | |
| %07 | 7 | %37 | g | %67 | |
| backspace | %08 | 8 | %38 | h | %68 |
| tab | %09 | 9 | %39 | i | %69 |
| linefeed | %0a | : | %3a | j | %6a |
| %0b | ; | %3b | k | %6b | |
| %0c | < | %3c | l | %6c | |
| c return | %0d | = | %3d | m | %6d |
| %0e | > | %3e | n | %6e | |
| %0f | ? | %3f | o | %6f | |
| %10 | @ | %40 | p | %70 | |
| %11 | A | %41 | q | %71 | |
| %12 | B | %42 | r | %72 | |
| %13 | C | %43 | s | %73 | |
| %14 | D | %44 | t | %74 | |
| %15 | E | %45 | u | %75 | |
| %16 | F | %46 | v | %76 | |
| %17 | G | %47 | w | %77 | |
| %18 | H | %48 | x | %78 | |
| %19 | I | %49 | y | %79 | |
| %1a | J | %4a | z | %7a | |
| %1b | K | %4b | { | %7b | |
| %1c | L | %4c | | | %7c | |
| %1d | M | %4d | } | %7d | |
| %1e | N | %4e | ~ | %7e | |
| %1f | O | %4f | %7f | ||
| space | %20 | P | %50 | € | %80 |
| ! | %21 | Q | %51 | %81 | |
| " | %22 | R | %52 | ‚ | %82 |
| # | %23 | S | %53 | ѓ | %83 |
| $ | %24 | T | %54 | „ | %84 |
| % | %25 | U | %55 | … | %85 |
| & | %26 | V | %56 | † | %86 |
| ' | %27 | W | %57 | ‡ | %87 |
| ( | %28 | X | %58 | € | %88 |
| ) | %29 | Y | %59 | ‰ | %89 |
| * | %2a | Z | %5a | Љ | %8a |
| + | %2b | [ | %5b | ‹ | %8b |
| , | %2c | \ | %5c | Њ | %8c |
| - | %2d | ] | %5d | %8d | |
| . | %2e | ^ | %5e | Ћ | %8e |
| / | %2f | _ | %5f | %8f |
Кодировка URL от %90 до %ff
| %90 | А | %c0 | р | %f0 | |
| ‘ | %91 | Б | %c1 | с | %f1 |
| ’ | %92 | В | %c2 | т | %f2 |
| " | %93 | Г | %c3 | у | %f3 |
| " | %94 | Д | %c4 | ф | %f4 |
| • | %95 | Е | %c5 | х | %f5 |
| – | %96 | Ж | %c6 | ц | %f6 |
| — | %97 | З | %c7 | ч | %f7 |
| _ | %98 | И | %c8 | ш | %f8 |
| ™ | %99 | Й | %c9 | щ | %f9 |
| љ | %9a | К | %ca | ъ | %fa |
| › | %9b | Л | %cb | ы | %fb |
| њ | %9c | М | %cc | ь | %fc |
| %9d | Н | %cd | э | %fd | |
| ћ | %9e | О | %ce | ю | %fe |
| џ | %9f | П | %cf | я | %ff |
| %a0 | Р | %d0 | |||
| Ў | %a1 | С | %d1 | ||
| ў | %a2 | Т | %d2 | ||
| Ј | %a3 | У | %d3 | ||
| %a4 | Ф | %d4 | |||
| Ґ | %a5 | Х | %d5 | ||
| | | %a6 | Ц | %d6 | ||
| § | %a7 | %d7 | |||
| Ё | %a8 | Ш | %d8 | ||
| © | %a9 | Щ | %d9 | ||
| Є | %aa | Ъ | %da | ||
| " | %ab | Ы | %db | ||
| ¬ | %ac | Ь | %dc | ||
| Ї | %ad | Э | %dd | ||
| ® | %ae | Ю | %de | ||
| Ї | %af | Я | %df | ||
| ° | %b0 | а | %e0 | ||
| ± | %b1 | б | %e1 | ||
| І | %b2 | в | %e2 | ||
| і | %b3 | г | %e3 | ||
| ґ | %b4 | д | %e4 | ||
| µ | %b5 | е | %e5 | ||
| ¶ | %b6 | ж | %e6 | ||
| • | %b7 | з | %e7 | ||
| ё | %b8 | и | %e8 | ||
| № | %b9 | й | %e9 | ||
| є | %ba | к | %ea | ||
| " | %bb | л | %eb | ||
| ј | %bc | м | %ec | ||
| Ѕ | %bd | н | %ed | ||
| ѕ | %be | о | %ee | ||
| ї | %bf | п | %ef |
Информационный сервер Интернет (IIS)
Встроенный в Windows 2000 Web-сервер IIS облегчает создание больших приложений для Web. Как PWS, так и IIS включают ASP, стандарт серверных сценариев, которые можно использовать для создания динамических и интерактивных Web-приложений. IIS доступен также для Windows NT.
Дополнительно об ASP можно узнать в соответствующем учебнике.
Дополнительная информация об IIS находится в документации.
Как опубликовать свою работу?
Отформатировать страницы сайта с помощью HTML это только половина работы, созданный сайт еще необходимо где-то разместить, чтобы он был доступен пользователям сети.
Как установить персональный Web-сервер (PWS):
Проверьте свою установку Windows, чтобы убедиться, что персональный сервер PWS не был уже установлен.Если он не установлен, то установите PWS из каталога PWS на компакт-диске дистрибутива Windows.Следуйте инструкциям по установке и запуску своего персонального Web-сервера.
Дополнительно о персональном Web-сервере PWS компании Microsoft можно прочитать в документации.
Примечание: Microsoft Windows XP Home Edition не имеет возможности превратить ваш компьютер в персональный Web-сервер!
Первый шаг: Персональный Web-сервер
Ваш собственный ПК может действовать в качестве Web-сервера, если он соединен с сетью. Причем соединение с сетью должно быть высокоскоростным, а не через модем. И кроме того компьютер должен иметь реальный IP адрес, а не быть закрытым прокси-серверами.
В настоящее время существует большое количество Web-серверов. Для домашнего использования под операционной системой Windows подойдет один из серверов поставляемых на диске совместно с ОС. При работе в Windows 98 можно использовать PWS (Personal Web Server) -- Персональный Web-сервер. Он находиться в папке PWS компакт-диска дистрибутива Windows. А в Windows 2000 и XP можно использовать IIS.
Кроме того можно воспользоваться одним из продуктов сторонних разработчиков, например, сервером Apache. Данный продукт является бесплатным и на сегодняшний день этот сервер используется на большинстве web серверов по всему миру. Хотя установка этого сервера может быть выполнена также легко, как и серверов Microsoft, но настройка может оказаться для новичка затруднительной. Настройка сервера осуществляется путем правки конфигурационного файла. Поэтому здесь мы его рассматривать не будем, а остановимся на серверах IIS и PWS. Персональный Web-сервер (PWS)
PWS превращает любой компьютер с Windows в Web-сервер. PWS легко установить и он идеально подходит для разработки и тестирования Web-приложений. PWS был оптимизирован для использования на рабочих станциях, но удовлетворяет всем требованиям полноценного Web-сервера. Он поддерживает также Активные серверные страницы (ASP -- Active Server Pages), как и его старший брат IIS.
Следующий шаг: Профессиональный Web-сервер
В настоящее время мало кто использует свой персональный компьютер в качестве web сервера. Это обуславливается, прежде всего, необходимостью наличия высококачественных каналов связи, необходимостью постоянного поддержания работоспособности сервера, боле тонкой настройкой безопасности системы. И как правило сайты на собственных web-серверах размещают только крупные организации, у которых имеются выделенные каналы Интернет и собственные выделенные сервера.
Остальные же обычно арендуют сервера у специализированных компаний, размещают сайты на бесплатных серверах или серверах своего провайдера Интернет. При этом один физический сервер обслуживает несколько web сайтов. Для небольших проектов этот вариант является оптимальным с точки зрения соотношения цены и объема предоставляемых услуг. В этом случае вы получаете доступ к частичной настройке своего виртуального сервера, как правило, это осуществляется через web интерфейс.
Для больших же проектов потребуется выделенный сервер, который будет отвечать только за один сайт, в этом случае у вас будет полный доступ по протоколу SSH к настройке всего сервера. Тут тоже имеется два варианта аренда сервера у хостинг-провайдера или покупка своего сервера и установка его в дата-центре хостера.
По функциональным группам
NN: указывает самую раннюю версию Netscape, которая поддерживает этот тегIE: указывает самую раннюю версию Internet Explorer, которая поддерживает этот тегDTD: указывает в каком DTD XHTML 1.0 разрешен этот тег. S=Strict, T=Transitional, and F=Frameset
| <!DOCTYPE> | Определяет тип документа | STF | ||
| <html> | Определяет документ html | 3.0 | 3.0 | STF |
| <body> | Определяет элемент тела | 3.0 | 3.0 | STF |
| <h1> -- <h6> | Определяет заголовки размера с 1 по 6 | 3.0 | 3.0 | STF |
| <p> | Определяет параграф | 3.0 | 3.0 | STF |
| <br> | Вставляет перенос одной строки | 3.0 | 3.0 | STF |
| <hr> | Определяет горизонтальную линейку | 3.0 | 3.0 | STF |
| <!--...--> | Определяет комментарий | 3.0 | 3.0 | STF |
| <b> | Определячет жирный текст | 3.0 | 3.0 | STF |
| <font> | Не рекомендуется. Определяет шрифт, размер и цвет текста | 3.0 | 3.0 | TF |
| <i> | Определяет наклонный текст (курсив) | 3.0 | 3.0 | STF |
| <em> | Определяет выделенный текст | 3.0 | 3.0 | STF |
| <big> | Определяет увеличенный текст | 3.0 | 3.0 | STF |
| <strong> | Определяет акцентированный текст | 3.0 | 3.0 | STF |
| <small> | Определяет уменьшенный текст | 3.0 | 3.0 | STF |
| <sup> | Определяет текст как верхний индекс | 3.0 | 3.0 | STF |
| <sub> | Определяет текст как нижний индекс | 3.0 | 3.0 | STF |
| <bdo> | Определяет направление вывода текста | 6.2 | 5.0 | STF |
| <u> | Не рекомендуется. Определяет подчеркнутый текст | 3.0 | 3.0 | TF |
| <pre> | Определяет заранее отформатированный текст | 3.0 | 3.0 | STF |
| <code> | Определяет текст кода программы | 3.0 | 3.0 | STF |
| <tt> | Определяет текст телетайпа | 3.0 | 3.0 | STF |
| <kbd> | Определяет текст с клавиатуры | 3.0 | 3.0 | STF |
| <var> | Определяет переменную | 3.0 | 3.0 | STF |
| <dfn> | Задает термин определения | 3.0 | STF | |
| <samp> | Определяет образец программного кода | 3.0 | 3.0 | STF |
| <xmp> | Не рекомендуется. Определяет форматированный заранее текст | 3.0 | 3.0 | |
| <acronym> | Определяет акроним | 6.2 | 4.0 | STF |
| <abbr> | Определяет сокращение | 6.2 | STF | |
| <address> | Определяет элемент адреса | 4.0 | 4.0 | STF |
| <blockquote> | Определяет длинную цитату | 3.0 | 3.0 | STF |
| <center> | Не рекомендуется. Определяет центрированный текст | 3.0 | 3.0 | TF |
| <q> | Определяет короткую цитату | 6.2 | 4.0 | STF |
| <cite> | Определяет цитату | 3.0 | 3.0 | STF |
| <ins> | Определяет вставленный текст | 6.2 | 4.0 | STF |
| <del> | Определяет удаленный текст | 6.2 | 4.0 | STF |
| <s> | Не рекомендуется. Определяет зачеркнутый текст. | 3.0 | 3.0 | TF |
| <strike> | Не рекомендуется. Определяет зачеркнутый текст | 3.0 | 3.0 | TF |
| <a> | Определяет анкер | 3.0 | 3.0 | STF |
| <link> | Определяет ссылку на ресурс | 4.0 | 3.0 | STF |
| <frame> | Определяет подокно (фрейм) | 3.0 | 3.0 | F |
| <frameset> | Определяет набор фреймов | 3.0 | 3.0 | F |
| <noframes> | Определяет раздел noframe | 3.0 | 3.0 | TF |
| <iframe> | Определяет встроенное подокно (фрейм) | 6.0 | 4.0 | TF |
| <form> | Определяет форму | 3.0 | 3.0 | STF |
| <input> | Определяет поле ввода | 3.0 | 3.0 | STF |
| <textarea> | Определяет текстовую область | 3.0 | 3.0 | STF |
| <button> | Определяет кнопку | 6.2 | 4.0 | STF |
| <select> | Определяет список с возможностью выбора | 3.0 | 3.0 | STF |
| <optgroup> | Определяет группу вариантов | 6.0 | 6.0 | STF |
| <option> | Определяет элемент в поле списка | 3.0 | 3.0 | STF |
| <label> | Определяет метку для элемента управления формы | 6.2 | 4.0 | STF |
| <fieldset> | Определяет набор полей | 6.2 | 4.0 | STF |
| <legend> | Определяет заголовок набора полей | 6.2 | 4.0 | STF |
| <isindex> | Не рекомендуется. Определяет поле ввода из одной строки | 3.0 | 3.0 | TF |
| <ul> | Определяет неупорядоченный список | 3.0 | 3.0 | STF |
| <ol> | Определяет упорядоченный список | 3.0 | 3.0 | STF |
| <li> | Определяет элемент списка | 3.0 | 3.0 | STF |
| <dir> | Не рекомендуется. Определяет список каталогов | 3.0 | 3.0 | TF |
| <dl> | Задает список определений | 3.0 | 3.0 | STF |
| <dt> | Задает термин определения | 3.0 | 3.0 | STF |
| <dd> | Задает описание определения | 3.0 | 3.0 | STF |
| <menu> | Не рекомендуется. Определяет список меню | 3.0 | 3.0 | TF |
| <img> | Определяет изображение | 3.0 | 3.0 | STF |
| <map> | Определяет карту ссылок | 3.0 | 3.0 | STF |
| <area> | Определяет область внутри карты ссылок | 3.0 | 3.0 | STF |
| <table> | Определяет таблицу | 3.0 | 3.0 | STF |
| <caption> | Определяет заглавие таблицы | 3.0 | 3.0 | STF |
| <th> | Определяет заголовок таблицы | 3.0 | 3.0 | STF |
| <tr> | Определяет строку таблицы | 3.0 | 3.0 | STF |
| <td> | Определяет ячейку таблицы | 3.0 | 3.0 | STF |
| <thead> | Определяет верхний заголовок таблицы | 4.0 | STF | |
| <tbody> | Определяет тело таблицы | 4.0 | STF | |
| <tfoot> | Определяет нижний заголовок таблицы | 4.0 | STF | |
| <col> | Определяет атрибуты для столбцов таблицы | 3.0 | STF | |
| <colgroup> | Определяет группы столбцов таблицы | 3.0 | STF | |
| <style> | Задает определение стиля | 4.0 | 3.0 | STF |
| <div> | Определяет раздел документа | 3.0 | 3.0 | STF |
| <span> | Определяет раздел документа | 4.0 | 3.0 | STF |
| <head> | Задает информацию о документе | 3.0 | 3.0 | STF |
| <title> | Определяет заглавие документа | 3.0 | 3.0 | STF |
| <meta> | Определяет мета-информацию | 3.0 | 3.0 | STF |
| <base> | Определяет базовый URL для всех ссылок на странице | 3.0 | 3.0 | STF |
| <basefont> | Не рекомендуется. Определяет базовый шрифт | 3.0 | 3.0 | TF |
| <script> | Определяет сценарий | 3.0 | 3.0 | STF |
| <noscript> | Определяет раздел noscript | 3.0 | 3.0 | STF |
| <applet> | Не рекомендуется. Определяет апплет | 2.0 | 3.0 | TF |
| <object> | Определяет встроенный объект | 3.0 | STF | |
| <param> | Определяет параметр для объекта | 3.0 | 3.0 | STF |
Сообщения о состоянии HTTP
Когда браузер запрашивает обслуживание на Web-сервере, могут возникать ошибки.
Ниже представлен список сообщений о состоянии HTTP, которые могут возвращаться сервером:
| 100 Continue | Продолжить. Только часть запроса была получена сервером, но пока он не был отвергнут, клиент должен продолжать запрос. |
| 101 Switching Protocols | Переключение протоколов. Сервер переключает протокол. |
| 200 OK | Запрос был успешно выполнен. |
| 201 Created | Создан. Запрос завершен, и создан новый ресурс. |
| 202 Accepted | Принято. Запрос принят для обработки, но обработка еще не завершена. |
| 203 | Недостоверная информация. |
| 204 | Нет содержимого |
| 205 | Сбросить содержимое. |
| 206 | Частичное содержимое. |
| 300 Multiple Choices | Множественный выбор. Список ссылок. Пользователь может выбрать ссылку и перейти в это место. Допустимо максимум пять адресов. |
| 301 Moved Permanently | Перемещена постоянно. Запрошенная страница перемещена в новый url |
| 302 Found | Найдена. Запрошенная страница временно перемещена в новый url |
| 303 See Other | Смотри другой. Запрошенную страницу можно найти в другом url |
| 304 Not Modified | Не модифицирован. |
| 305 Use Proxy | Используйте прокси-сервер. |
| 306 Unused | Не используется. Этот код использовался в предыдущей версии. Он больше не используется, но код зарезервирован. |
| 307 Temporary Redirect | Временно перемещена. Запрошенная страница временно перемещена в новый url |
| 400 Bad Request | Испорченный запрос. Сервер не понял запрос. |
| 401 Unauthorized | Неавторизовано. Запрошенная страница требует имя пользователя и пароль. |
| 402 Payment Required | Требуется платеж. Этот код зарезервирован для будущего использования. |
| 403 Forbidden | Запрещено. Доступ к запрошенной странице запрещен. |
| 404 Not Found | Не найдено. Сервер не может найти запрошенную страницу. |
| 405 Method Not Allowed | Метод не разрешен. Метод, указанный в запросе, не разрешен. |
| 406 Not Acceptable | Не приемлем. Сервер может сгенерировать только такой ответ, который клиент не может принять. |
| 407 Proxy Authentication Required | Требуется аутентификация на прокси-сервере. Необходимо аутентифицироваться на прокси-сервере, прежде чем этот запрос можно будет обслужить. |
| 408 Request Timeout | Истекло время ожидания запроса. Запрос потребовал больше времени, чем сервер был готов ждать. |
| 409 Conflict | Конфликт. Запрос невозможно завершить в связи с конфликтом. |
| 410 Gone | Удален. Запрошенная страница больше недоступна. |
| 411 Length Required | Требуется длина. Значение "Content-Length" не определено. Сервер без него не примет запрос. |
| 412 Precondition Failed | Предусловие неверно. Предусловие, заданное в запросе, оказалось ложным при проверке сервером. |
| 413 Request Entity Too Large | Объект запроса слишком большой. Сервер не пример запрос, потому что объект запроса слишком большой. |
| 414 Request-url Too Long | url запроса слишком длинный. Сервер не примет запрос, потому что url слишком длинный. Происходит при преобразовании запроса "post" в запрос "get" с длинной информацией запроса. |
| 415 Unsupported Media Type | Неподдерживаемый тип среды передачи. Сервер не примет запрос, так как тип среды передачи не поддерживается. |
| 416 | -- |
| 417 Expectation Failed | Ожидания не оправдались. |
| 500 Internal Server Error | Внутренняя ошибка сервера. Запрос не был завершен. Сервер столкнулся с непредвиденным условием. |
| 501 Not Implemented | Не реализовано. Запрос не был завершен. Сервер не поддерживает запрошенные функции. |
| 502 Bad Gateway | Ошибка шлюза. Запрос не был завершен. Сервер получил недопустимый ответ от другого сервера. |
| 503 Service Unavailable | Служба недоступна. Запрос не был завершен. Сервер временно перегружен или отключен. |
| 504 Gateway Timeout | Истекло время ожидания от шлюза. |
| 505 HTTP Version Not Supported | Сервер не поддерживает данную версию "протокола http" |
Справочник по 7-битным кодам ASCII в HTML
HTML и XHTML используют стандартный 7-битный код ASCII при передаче данных через Web.
7-битный код ASCII представляет 128 различных значений символов (0-127).
7-битные печатные символы ASCII
| пробел |   | |
| ! | восклицательный знак | ! |
| " | знак двойной кавычки | " |
| # | знак номера | # |
| $ | знак доллара | $ |
| % | знак процента | % |
| & | амперсанд | & |
| ' | апостроф | ' |
| ( | левая скобка | ( |
| ) | правая скобка | ) |
| * | звездочка | * |
| + | знак плюс | + |
| , | запятая | , |
| - | дефис | - |
| . | точка | . |
| / | наклонная черта | / |
| 0 | цифра 0 | 0 |
| 1 | цифра 1 | 1 |
| 2 | цифра 2 | 2 |
| 3 | цифра 3 | 3 |
| 4 | цифра 4 | 4 |
| 5 | цифра 5 | 5 |
| 6 | цифра 6 | 6 |
| 7 | цифра 7 | 7 |
| 8 | цифра 8 | 8 |
| 9 | цифра 9 | 9 |
| : | двоеточие | : |
| ; | точка с запятой | ; |
| < | меньше | < |
| = | равно | = |
| >> | больше | > |
| ? | знак вопроса | ? |
| @ | знак at | @ |
| A | A | A |
| B | B | B |
| C | C | C |
| D | D | D |
| E | E | E |
| F | F | F |
| G | G | G |
| H | H | H |
| I | I | I |
| J | J | J |
| K | K | K |
| L | L | L |
| M | M | M |
| N | N | N |
| O | O | O |
| P | P | P |
| Q | Q | Q |
| R | R | R |
| S | S | S |
| T | T | T |
| U | U | U |
| V | V | V |
| W | W | W |
| X | X | X |
| Y | Y | Y |
| Z | Z | Z |
| [ | левая квадратная скобка | [ |
| \ | обратная косая черта | \ |
| ] | правая квадратная скобка | ] |
| ^ | каре | ^ |
| _ | подчеркивание | _ |
| ` | гравис | ` |
| a | a нижнего регистра | a |
| b | b | b |
| c | c | c |
| d | d | d |
| e | e | e |
| f | f | f |
| g | g | g |
| h | h | h |
| i | i | i |
| j | j | j |
| k | k | k |
| l | l | l |
| m | m | m |
| n | n | n |
| o | o | o |
| p | p | p |
| q | q | q |
| r | r | r |
| s | s | s |
| t | t | t |
| u | u | u |
| v | v | v |
| w | w | w |
| x | x | x |
| y | y | y |
| z | z | z |
| { | левая фигурная скобка | { |
| | | вертикальная черта | | |
| } | правая фигурная скобка | } |
| ~ | тильда | ~ |
| NUL | пустой символ | � |
| SOH | начало заголовка |  |
| STX | начало текста |  |
| ETX | конец текста |  |
| EOT | конец передачи |  |
| ENQ | запрос |  |
| ACK | подтверждение |  |
| BEL | звонок |  |
| BS | возврат на одну позицию |  |
| HT | горизонтальная табуляция | 	 |
| LF | перевод строки | |
| VT | вертикальная табуляция |  |
| FF | перевод страницы |  |
| CR | возврат каретки | |
| SO | на верхний регистр |  |
| SI | на нижний регистр |  |
| DLE | смена канала данных |  |
| DC1 | управление устройством 1 |  |
| DC2 | управление устройством 2 |  |
| DC3 | управление устройством 3 |  |
| DC4 | управление устройством 4 |  |
| NAK | отрицательное подтверждение |  |
| SYN | синхронизация |  |
| ETB | конец передачи блока |  |
| CAN | отмена |  |
| EM | конец носителя |  |
| SUB | подстановка |  |
| ESC | уход |  |
| FS | разделитель файлов |  |
| GS | разделитель групп |  |
| RS | разделитель записей |  |
| US | разделитель элементов |  |
| DEL | удалить (стереть) |  |
поддерживает набор символов ISO
HTML 4. 01 поддерживает набор символов ISO 8859-1 (Latin-1).
Нижняя часть ISO-8859-1 (коды 0-127) является исходным 7-битным стандартом ASCII. Большинство этих символов можно использовать без символьной ссылки.
Верхнюю часть ISO-8859-1 (коды 160-255) можно всю использовать с помощью имен символьных объектов.
Отметим, что имена объектов зависят от регистра символов.
Объекты ASCII с новыми именами объектов
| " | двойная кавычка | " | " |
| ' | апостроф | ' (не работает в IE) | ' |
| & | амперсанд | & | & |
| < | меньше | < | < |
| > | больше | > | > |
| Неразрывный пробел | |   | |
| Ў | перевернутый восклицательный знак | ¡ | ¡ |
| ¤ | валюта | ¤ | ¤ |
| ў | цент | ¢ | ¢ |
| Ј | фунт стерлингов | £ | £ |
| Ґ | йена | ¥ | ¥ |
| ¦ | разорванная вертикальная черта | ¦ | ¦ |
| § | параграф | § | § |
| Ё | умлаут | ¨ | ¨ |
| © | авторское право | © | © |
| Є | порядковый индикатор ж.р. | ª | ª |
| " | угловая кавычка (левая) | « | « |
| ¬ | отрицание | ¬ | ¬ |
| мягкий дефис | ­ | ­ | |
| ® | зарегистрированная торговая марка | ® | ® |
| ™ | торговая марка | ™ | ™ |
| Ї | знак долготы | ¯ | ¯ |
| ° | градус | ° | ° |
| ± | плюс-минус | ± | ± |
| І | верхний индекс 2 | ² | ² |
| і | верхний индекс 3 | ³ | ³ |
| ґ | ударение | ´ | ´ |
| µ | микро | µ | µ |
| ¶ | параграф | ¶ | ¶ |
| • | средняя точка | · | · |
| ё | седиль | ¸ | ¸ |
| № | верхний индекс 1 | ¹ | ¹ |
| є | порядковый индикатор м.р. | º | º |
| " | угловая кавычка (правая) | » | » |
| ј | дробь 1/4 | ¼ | ¼ |
| Ѕ | дробь 1/2 | ½ | ½ |
| ѕ | дробь 3/4 | ¾ | ¾ |
| ї | перевернутый знак вопроса | ¿ | ¿ |
| Ч | умножение | × | × |
| ч | деление | ÷ | ÷ |
| А | a большая, гравис | À | À |
| Б | a большое, акут | Á | Á |
| В | a большое, циркумфлекс | Â | Â |
| Г | a большое, тильда | Ã | Ã |
| Д | a большое , умлаут | Ä | Ä |
| Е | a большое, кружок | Å | Å |
| Ж | ae большое | Æ | Æ |
| З | c большое, седиль | Ç | Ç |
| И | e большое, гравис | È | È |
| Й | e большое, акут | É | É |
| К | e большое, циркумфлекс | Ê | Ê |
| Л | e большое, умлаут | Ë | Ë |
| М | i большое, гравис | Ì | Ì |
| Н | i большое, акут | Í | Í |
| О | i большое, циркумфлекс | Î | Î |
| П | i большое, умлаут | Ï | Ï |
| Р | eth большое, исландское | Ð | Ð |
| С | n большое, тильда | Ñ | Ñ |
| Т | o большое, гравис | Ò | Ò |
| У | o большое, акут | Ó | Ó |
| Ф | o большое, циркумфлекс | Ô | Ô |
| Х | o большое, тильда | Õ | Õ |
| Ц | o большое, умлаут | Ö | Ö |
| Ш | o большое, перечеркнуто | Ø | Ø |
| Щ | u большое, гравис | Ù | Ù |
| Ъ | u большое, акут | Ú | Ú |
| Ы | u большое, циркумфлекс | Û | Û |
| Ь | u большое, умлаут | Ü | Ü |
| Э | y большое, акут | Ý | Ý |
| Ю | THORN большой, исладский | Þ | Þ |
| Я | s малое, немецкое | ß | ß |
| а | a малое, гравис | à | à |
| б | a малое, акут | á | á |
| в | a малое, циркумфлекс | â | â |
| г | a малое, тильда | ã | ã |
| д | a малое, умлаут | ä | ä |
| е | a малое, с кружком | å | å |
| ж | ae малое | æ | æ |
| з | c малое, седиль | ç | ç |
| и | e малое, гравис | è | è |
| й | e малое, акут | é | é |
| к | e малое, циркумфлекс | ê | ê |
| л | e малое, умлаут | ë | ë |
| м | i малое, гравис | ì | ì |
| н | i малое, акут | í | í |
| о | i малое, циркумфлекс | î | î |
| п | i малое, умлаут | ï | ï |
| р | eth малое, исландское | ð | ð |
| с | n малое, тильда | ñ | ñ |
| т | o малое, гравис | ò | ò |
| у | o малое, акут | ó | ó |
| ф | o малое, циркумфлекс | ô | ô |
| х | o малое, тильда | õ | õ |
| ц | o малое, умлаут | ö | ö |
| ш | o малое, перечеркнутое | ø | ø |
| щ | u малое, гравис | ù | ù |
| ъ | u малое, акут | ú | ú |
| ы | u малое, циркумфлекс | û | û |
| ь | u малое, умлаут | ü | ü |
| э | y малое, акут | ý | ý |
| ю | thorn малый, исландский | þ | þ |
| я | y малое, умлаут | ÿ | ÿ |
| Њ | OE большое, связанное | Œ | Œ |
| њ | oe малое, связанное | œ | œ |
| Љ | S большое с короной | Š | Š |
| љ | S малое с короной | š | š |
| џ | Y большое с тремой | Ÿ | Ÿ |
| € | циркумфлекс | ˆ | ˆ |
| _ | малая тильда | ˜ | ˜ |
| ? | пробел en |   |   |
| ? | пробел em |   |   |
| ? | тонкий пробел |   |   |
| non-joiner | ‌ | ‌ | |
| joiner | ‍ | ‍ | |
| знак слева направо | ‎ | ‎ | |
| знак справа налево | ‏ | ‏ | |
| – | штрих en | – | – |
| — | штрих em | — | — |
| ‘ | левая одиночная кавычка | ‘ | ‘ |
| ’ | правая одиночная кавычка | ’ | ’ |
| ‚ | одиночная нижняя кавычка | ‚ | ‚ |
| " | левая двойная кавычка | “ | “ |
| " | правая двойная кавычка | ” | ” |
| „ | двойная нижняя кавычка | „ | „ |
| † | крестик | † | † |
| ‡ | двойной крестик | ‡ | ‡ |
| … | три точки | … | … |
| ‰ | промилле | ‰ | ‰ |
| ‹ | одиночная угловая левая кавычка | ‹ | ‹ |
| › | одиночная угловая правая кавычка | › | › |
| € | евро | € | € |
В алфавитном порядке
NN: указывает самую раннюю версию Netscape, которая поддерживает этот тегIE: указывает самую раннюю версию Internet Explorer, которая поддерживает этот тегDTD: указывает в каком DTD XHTML 1.0 разрешен этот тег. S=Strict, T=Transitional и F=Frameset
| <!--...--> | Определяет комментарий | 3.0 | 3.0 | STF |
| <!DOCTYPE> | Определяет тип документа | STF | ||
| <a> | Определяет анкер | 3.0 | 3.0 | STF |
| <abbr> | Определяет сокращение | 6.2 | STF | |
| <acronym> | Определяет акроним | 6.2 | 4.0 | STF |
| <address> | Определяет элемент адреса | 4.0 | 4.0 | STF |
| <applet> | Не рекомендуется. Определяет апплет | 2.0 | 3.0 | TF |
| <area> | Определяет область внутри карты ссылок | 3.0 | 3.0 | STF |
| <b> | Определяет жирный текст | 3.0 | 3.0 | STF |
| <base> | Определяет базовый URL для всех ссылок на странице | 3.0 | 3.0 | STF |
| <basefont> | Не рекомендуется. Определяет базовый шрифт | 3.0 | 3.0 | TF |
| <bdo> | Определяет направление вывода текста | 6.2 | 5.0 | STF |
| <big> | Определяет увеличенный текст | 3.0 | 3.0 | STF |
| <blockquote> | Определяет длинную цитату | 3.0 | 3.0 | STF |
| <body> | Определяет элемент тела | 3.0 | 3.0 | STF |
| <br> | Определякет перенос одной строки | 3.0 | 3.0 | STF |
| <button> | Определяет кнопку | 6.2 | 4.0 | STF |
| <caption> | Определяет заглавие таблицы | 3.0 | 3.0 | STF |
| <center> | Не рекомендуется. Определяет центрированный текст | 3.0 | 3.0 | TF |
| <cite> | Определяет цитату | 3.0 | 3.0 | STF |
| <code> | Определяет текст кода программы | 3.0 | 3.0 | STF |
| <col> | Определяет атрибуты для столбцов таблицы | 3.0 | STF | |
| <colgroup> | Определяет группы столбцов таблицы | 3.0 | STF | |
| <dd> | Определяет описание определения | 3.0 | 3.0 | STF |
| <del> | Определяет удаленный текст | 6.2 | 4.0 | STF |
| <dir> | Не рекомендуется. Определяет список каталогов | 3.0 | 3.0 | TF |
| <div> | Определяет раздел документа | 3.0 | 3.0 | STF |
| <dfn> | Задает термин определения | 3.0 | STF | |
| <dl> | Определяет список определений | 3.0 | 3.0 | STF |
| <dt> | Задает термин определения | 3.0 | 3.0 | STF |
| <em> | Определяет выделенный текст | 3.0 | 3.0 | STF |
| <fieldset> | Определяет набор полей | 6.2 | 4.0 | STF |
| <font> | Не рекомендуется. Определяет шрифт, размер и цвет текста | 3.0 | 3.0 | TF |
| <form> | Определяет форму | 3.0 | 3.0 | STF |
| <frame> | Определяет подокно (фрейм) | 3.0 | 3.0 | F |
| <frameset> | Определяет набор фреймов | 3.0 | 3.0 | F |
| <h1> до <h6> | Определяют заголовки с 1 по 6 размер | 3.0 | 3.0 | STF |
| <head> | Определяет информацию о документе | 3.0 | 3.0 | STF |
| <hr> | Определяет горизонтальную линейку | 3.0 | 3.0 | STF |
| <html> | Определяет документ html | 3.0 | 3.0 | STF |
| <i> | Определяет наклонный текст (курсив) | 3.0 | 3.0 | STF |
| <iframe> | Определяет встроенное подокно (фрейм) | 6.0 | 4.0 | TF |
| <img> | Определяет изображение | 3.0 | 3.0 | STF |
| <input> | Определяет поле ввода | 3.0 | 3.0 | STF |
| <ins> | Определяет вставленный текст | 6.2 | 4.0 | STF |
| <isindex> | Не рекомендуется. Определяет поле ввода из одной строки | 3.0 | 3.0 | TF |
| <kbd> | Определяет текст с клавиатуры | 3.0 | 3.0 | STF |
| <label> | Определяет метку для элемента управления формы | 6.2 | 4.0 | STF |
| <legend> | Определяет заголовок в наборе полей | 6.2 | 4.0 | STF |
| <li> | Определяет элемент списка | 3.0 | 3.0 | STF |
| <link> | Определяет ссылку на ресурс | 4.0 | 3.0 | STF |
| <map> | Определяет карту ссылок | 3.0 | 3.0 | STF |
| <menu> | Не рекомендуется. Определяет список меню | 3.0 | 3.0 | TF |
| <meta> | Определяет мета-информацию | 3.0 | 3.0 | STF |
| <noframes> | Определяет раздел noframe | 3.0 | 3.0 | TF |
| <noscript> | Определяет раздел noscript | 3.0 | 3.0 | STF |
| <object> | Определяет встроенный объект | 3.0 | STF | |
| <ol> | Определяет упорядоченный список | 3.0 | 3.0 | STF |
| <optgroup> | Определяет группу вариантов | 6.0 | 6.0 | STF |
| <option> | Определяет вариант в раскрывающемся списке | 3.0 | 3.0 | STF |
| <p> | Определяет параграф | 3.0 | 3.0 | STF |
| <param> | Определяет параметр для объекта | 3.0 | 3.0 | STF |
| <pre> | Определяет заранее отформатированный текст | 3.0 | 3.0 | STF |
| <q> | Определяет короткую цитату | 6.2 | STF | |
| <s> | Не рекомендуется. Определяет зачеркнутый текст | 3.0 | 3.0 | TF |
| <samp> | Определяет образец программного кода | 3.0 | 3.0 | STF |
| <script> | Определяет сценарий | 3.0 | 3.0 | STF |
| <select> | Определяет список с возможностью выбора | 3.0 | 3.0 | STF |
| <small> | Определяет уменьшенный текст | 3.0 | 3.0 | STF |
| <span> | Определяет раздел документа | 4.0 | 3.0 | STF |
| <strike> | Не рекомендуется. Определяет зачеркнутый текст | 3.0 | 3.0 | TF |
| <strong> | Определяет акцентированный текст | 3.0 | 3.0 | STF |
| <style> | Задает определение стиля | 4.0 | 3.0 | STF |
| <sub> | Определяет текст как нижний индекс | 3.0 | 3.0 | STF |
| <sup> | Определяет текст как верхний индекс | 3.0 | 3.0 | STF |
| <table> | Определяет таблицу | 3.0 | 3.0 | STF |
| <tbody> | Определяет тело таблицы | 4.0 | STF | |
| <td> | Определяет ячейку таблицы | 3.0 | 3.0 | STF |
| <textarea> | Определяет текстовую область | 3.0 | 3.0 | STF |
| <tfoot> | Определяет нижний заголовок таблицы | 4.0 | STF | |
| <th> | Определяет заголовок таблицы | 3.0 | 3.0 | STF |
| <thead> | Определяет верхний заголовок таблицы | 4.0 | STF | |
| <title> | Определяет заглавие документа | 3.0 | 3.0 | STF |
| <tr> | Определяет строку таблицы | 3.0 | 3.0 | STF |
| <tt> | Определяет текст телетайпа | 3.0 | 3.0 | STF |
| <u> | Не рекомендуется. Определяет подчеркнутый текст | 3.0 | 3.0 | TF |
| <ul> | Определяет неупорядоченный список | 3.0 | 3.0 | STF |
| <var> | Определяет переменную | 3.0 | 3.0 | STF |
| <xmp> | Не рекомендуется. Определяет заранее отформатированный текст | 3.0 | 3.0 |
