|
Bog BOS: sitelife: безопасный HTML |
Последнее изменение файла: 2007.08.08
Скопировано с www.bog.pp.ru: 2024.11.21
Какой стандарт выбрать? |
Стандарт HTML (HyperText Markup Language) разрабатывается и принимается Консорциумом WWW. Последняя версия 4.01 принята 24 декабря 1999 (около 400 страниц). К сожалению, даже новейшие версии браузеров не поддерживают данный стандарт в полном объеме (причем разработчики даже не сообщают какие элементы поддерживаются, а какие - нет!). К тому же многие люди пользуются старыми (иногда очень старыми версиями браузеров). Браузеры обрабатывают теги, не вошедшие в стандарт или исключенные из него. Так что новые возможности (CSS) будут недоступны владельцам старых браузеров, а старые (FONT) будут несовместимы с новыми "правильными" реализациями. Так какими же возможностями HTML можно пользоваться в реальной жизни (ограничиться HTML 2.0 не предлагать :)? Можно ориентироваться на статистику использования браузеров. Для себя я решил, что надо ориентироваться на MS IE 4+ и Netscape 4+ (т.е. HTML 4.0 и CSS1). Полезно также посмотреть как выглядит сделанная страница в Opera и Lynx/Links (примерно также ваша страница будет "видна" поисковому роботу).
HTML 4 предлагает варианты:
К сожалению, Netscape 4 не полностью поддерживает CSS1 (в частности, шрифты), поэтому приходится пользоваться transitional версией HTML 4.
Браузеры (особенно MS IE) снисходительно относятся к синтаксическим ошибкам, но отображение документа может не соответствовать Вашим ожиданиям :).
Проще всего начать кодирование страницы с копирования шаблона пустой страницы и заполнения его. Например для моего сайта она выглядит так
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/tr/REC-html40/loose.dtd">
<html lang="ru">
<head>
<title>заголовок страницы</title>
<link rel=stylesheet href="таблица_стилей.css" type="text/css">
<meta name="Author" content="Sergey E Bogomolov">
<meta name="keywords" content="ключевые, слова, через, запятую">
<meta http-equiv="Content-Type" content="text/html">
</head>
<body alink="#ff0000" bgcolor="#ffffff" link="#0000ff" text="#000000" vlink="#0000aa">
<!--#include file="navbar.html" -->
<h1>заголовок страницы</h1>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td bgcolor="#0086b2" width="100%"><p class="h2">заголовок раздела</p></td>
</tr>
</table>
<p class="abzac">текст раздела</p>
<!--#include file="navbar.html" -->
<!--#include file="footer.html" -->
Я использую механизм стилей (CSS) и включения файлов на сервере (SSI) для сокращения кодирования. Файл footer.html содержит информацию об авторском праве и "закрывающие скобки" HTML:
</body> </html>
Синтаксис |
HTML является приложением SGML, т.е. синтаксис HTML определяется DTD. В первой строке должна быть ссылка на соответствующий DTD (см. строку DOCTYPE выше). Или
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 4.0 //EN"
"http://www.w3.org/tr/REC-html40/strict.dtd">
или
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 4.0 Frameset//EN"
"http://www.w3.org/tr/REC-html40/frameset.dtd">
Остальной текст состоит из иерархически вложенных элементов. Элемент состоит из открывающего тэга, содержимого и закрывающего тэга. Открывающий тэг состоит из имени тэга в угловых скобках. Закрывающий тэг перед именем содержит слэш (/). Содержимое элемента может включать текст и другие элементы. Тэги можно рассматривать как поименованные скобки. Открывающий тэг может содержать список имен атрибутов и (после знака равенства) значений через пробел. Некоторые элементы не имеют закрывающего тэга. Имена тэгов и атрибутов задаются DTD HTML. Головным элементом HTML является элемент с именем html:
<html lang="ru"><head></head><body></body></html>
Имена тэгов и атрибутов могут записываться как прописными, так и строчными буквами, но для упрощения перехода к XML рекомендуется использовать строчные. По той же причине рекомендуется заключать значения атрибутов в кавычки и вставлять закрывающие тэги даже если это необязательно (<p> или <li>).
Дополнительные пробелы и пустые строки в содержимом элемента не влияют на отображение документа (интерпретатор HTML заменяет несколько подряд идущих пробельных символов и переводов строки на один пробел).
Комментарии оформляются следующим образом (текст комментария не может содержать два тире подряд, дескрипторы внутри комментария не обрабатываются):
<!-- текст комментария -->
Общеупотребительные атрибуты |
Следующие атрибуты можно использовать почти в любом элементе:
Некоторые специальные символы (entities) |
Не все специальные символы есть в текущей таблице шрифтов. Иногда вместо них будет отображено что-то похожее, а иногда и вовсе перевернутый вопросительный знак. Обязательно использовать специальные символы вместо "<", ">" и "&".
|
|
Полный список
Шапка документа |
Документ состоит из ссылки на DTD и элемента html. Элемент html содержит элементы head и body.
Атрибуты элемента html:
Элемент head описывает характеристики документа и может содержать элементы:
Элемент body включает содержательную часть документа и может иметь атрибуты:
Форматирование текста |
Списки |
Списки могут быть вложенными на любую глубину и содержать другие блочные элементы:
<ol>
<li>элемент списка</li>
...
</ol>
элементы <li> и <ol> имеют атрибут value (start), указывающий
номер в списке (обязательно натуральное число!), и атрибут type, указывающий тип нумерации
<ul>
<li>элемент списка</li>
...
</ul>
элементы <li> и <ul> имеют атрибут type, указывающий тип маркера ("disc",
"circle", "square").
<dl>
<dt>термин</dt>
<dd>определение</dd>
...
</dl>
Ссылки |
Что такое URL, URI, схема, относительный URI, базовый URI, фрагмент.
Типы ссылок:
Часто употребляемые схемы URI:
Размещение ссылки: <a href="адрес ресурса">поясняющий текст или изображение</a>
Определение идентификатора фрагмента (см. также атрибут id): <a name="имя">...</a>
Задание базового URI:
<head> ... <base href="базовый URI"> ... </head>
Картинки |
Таблицы |
Фреймы |
Формы |
|
Bog BOS: sitelife: безопасный HTML |