2.10. Валидация html-документов
Консорциум W3С обеспечивает службу валидации страниц Web для проверки страницы на соответствие стандартам. Служба валидации W3C доступна по адресу: http://validator.w3.org.
Для корректного отображения Web-страницы в браузере желательно указать, с каким стандартом она согласована. Для этого необходимо указать Определение типа документа (DTD - Document Type Definition) с использованием декларации DOCTYPE, которая должна предшествовать любой разметке в документе. Например:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
DOCTYPE задает тип корневого элемента документа (<html>), публичный идентификатор и системный идентификатор.
Публичный идентификатор (-//W3C//DTD HTML 4.01//EN) показывает кто использовал декларацию типа документа, или DTD, (W3C); название DTD (DTD HTML 4.01); и язык на котором написана DTD (EN, т.е. английский). Обратите внимание, что DTD не указывает на язык самой Web-страницы; там указан язык, на котором составлен DTD.
Системный идентификатор (www.w3.org/TR/html4/strict.dtd) — это путь к используемой DTD.
Варианты DOCTYPE для HTML 4.01:
Строгий (Strict): не содержит элементов, помеченных как «устаревшие» или «не одобряемые» (deprecated).
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Переходный (Transitional): содержит устаревшие теги в целях совместимости и упрощения перехода со старых версий HTML.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
С фреймами (Frameset): аналогичен переходному, но содержит также теги для создания наборов фреймов(см. л.р.№2).
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
Аналогично для XHTML:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
3. Порядок выполнения работы
В процессе выполнения лабораторной работы необходимо реализовать Ваш персональный Web-сайт, имеющий структуру, представленную на рисунке 1.
Рисунок 1 – Структура Web-сайта
Рекомендуется следующее содержимое Web-страниц:
Главная страница:
Меню, содержащее гиперссылки на все страницы сайта;
Фамилия Имя Отчество;
Фотография;
Класс;
Название настоящей лабораторной работы.
Необходимым является использование следующих элементов HTML: блоки, гиперссылки, таблицы, элементы форматирования текста, графические элементы.
Обо мне:
Меню, содержащее гиперссылки на все страницы сайта;
Автобиография в произвольной форме (возможно использование и графического материала);
Необходимым является использование следующих элементов HTML: блоки, гиперссылки, стили.
Мои интересы:
Меню, содержащее гиперссылки на все страницы сайта;
содержание страницы, выполненное в виде списка гиперссылок на якоря внутри этой страницы (например: мое хобби, мои любимые книги, моя любимая музыка, мои любимые фильмы и т.п.);
непосредственно содержимое каждого из разделов;
Необходимым является использование следующих элементов HTML: блоки, заголовки различных уровней, нумерованные и маркированные списки, якоря и гиперссылки на якоря, стили.
Учеба:
Меню, содержащее гиперссылки на все страницы сайта;
Полное название школы;
Полное название класса;
Перечень изучаемых дисциплин, выполненный в виде таблицы.
Необходимым является использование следующих элементов HTML: блоки, таблицы, гиперссылки, стили.
Фотоальбом:
15 фотографий представленных в виде таблицы, по N*) фото в строке; каждое фото должно иметь всплывающую подсказку с его названием, а также подпись с его названием под фото.
гиперссылка на главную страницу.
Необходимым является использование следующих элементов HTML: блоки,, графические элементы, гиперссылки.
Примечания:
1) Заголовок каждой HTML страницы должен содержать название сайта и название данной страницы (например: «Персональный сайт Иванова Ивана. Главная страница.»). Все страницы должны быть выполненными в одном стиле (иметь одинаковый цвет фона (или фоновое изображение) и тп).
2) При выполнении верстки страниц использовать блочный метод. Приветствуется использование CSS фреймворка[9-11]
3) Для задания внешнего вида содержимого веб-страниц использовать CSS[7].
4) Необходимо выполнить валидацию разработанных страниц в соответствии со стандартами HTML 4.01 Strict(или XHTML 1.1) и CSS2.
5) ПРИ ВЫПОЛНЕНИИ ЛАБОРАТОРНОЙ РАБОТЫ ЗАПРЕЩАЕТСЯ ПОЛЬЗОВАТЬСЯ ГРАФИЧЕСКИМИ HTML-РЕДАКТОРАМИ ИЛИ КОНВЕРТЕРАМИ В ФОРМАТ HTML!