|
|
|
|
|
 |
|
|
|
|
|
|
01. HTML и CSS
Версия HTML 1.0 была предельно проста — кроме тегов для записи гипертекстовых переходов (для контекстной связи документов друг с другом), она предусматривала лишь несколько тегов для логической разметки текста и один тег для записи ссылок на файлы с картинками-иллюстрациями. Таким образом, изначально на HTML возлагалась лишь задача структурной разметки текста без каких либо указаний на то, как должен выглядеть тот или иной элемент на экране. Структурная разметка указывает границы частей документа и их соподчинение (заголовки Hn, абзацы P, цитаты CITE, выделения EM, сильные выделения STRONG, гиперссылки A, ссылки на файлы с картинками IMG). Задача представления элементов на экране возлагалась на браузеры.
Благодаря такому разделению размеченный текст может без труда
выводиться на любое мыслимое устройство вывода. Например,
браузер на компьютере с текстовым монитором может обрамлять выделенный текст
знаками подчёркивания (это _выделение_), на графический
монитор выводить текст курсивом (это выделение), а на
компьютере с голосовым выводом произносить выделенный текст с
повышенной интонацией.
Развитие графических средств вывода информации провоцировало появлению в следующих версиях HTML многочисленных тегов, позволяющих непосредственно управлять видом элемента на экране: тег I для оформления курсивом, тег B для полужирного начертания, тег FONT для задания гарнитуры шрифта и кегля… Смесь из структурной и визуальной разметки стала здорово перегружать код страницы мешаниной тегов с их многочисленными атрибутами. Помимо утяжеления страниц, килобайтный вес которых напрямую определяет посещаемость сайта (чем быстрее страница грузится, тем охотнее её просматривают в Сети), совмещение визуальных указаний со структурной разметкой существенно усложняет модификацию дизайна сайта.
В самом деле, если разработчик принял решение выводить текст
рубленым шрифтом пониженного размера вместо ранее
используемого серифного шрифта, он должен внимательно отредактировать
сотни страниц сайта, заменяя всюду тег
<FONT face=Journal>, тегом
<FONT face=Verdana Автоматизировать такую замену нельзя, ведь исходные теги FONT могут содержать и другие атрибуты, например, color. Приходится выполнять правки вручную, лишь частично упрощая жизнь автоматическим поиском по ключу font. Работа большая, как и вероятность ошибки: легко можно пропустить правку тега или даже целого файла. Описанием стандартов HTML, начиная с версии 2.0 (1994 год), стала заниматься международная организация W3C (от англ. World Wide Web Consortium — Консорциум Всемирной паутины). В 1995 году Консорциум ввёл в HTML версии 3.0 поддержку иерархических стилевых спецификаций CSS (от англ. Cascading Style Sheets — каскадные таблицы стилей). CSS — это попытка разрешить противоречие между идеологией структурной разметки и потребностями разработчиков в гибких и богатых средствах визуального представления элементов на экране. Язык CSS имеет свой собственный синтаксис и позволяет задавать визуальные параметры представления любого элемента HTML. Таким образом, CSS берёт на себя задачу объяснить браузеру, как отображать элементы на экране и позволяет тем самым отделить структурную разметку документа (в HTML-коде) от описаний визуальных свойств объектов (в CSS-коде). Заканчивая разговор о версиях HTML можно упомянуть версию 4.0, стандарт которой W3C опубликовала в 1997. Затем, в 1999 году был опубликован стандарт HTML 4.01. На этом развитие языка HTML заканчивается, новых версий не планируется. На смену HTML в 2000 году пришла спецификация XHTML 1.0. Буква “X” здесь означает XML (англ. eXtensible Markup Language — расширяемый язык разметки, компактное упрощённое подмножество языка SGML). XHTML — это попытка обеспечить описания данных с помощью выразительных средств сложного XML, сохранив при этом простоту и удобство HTML. Завершение эпохи совершенствования HTML не означает отказ разработчиков от использования этого языка. HTML продолжает свою жизнь, и в качестве подмножества XHTML, и в “чистом” виде, — как простой инструмент разработки сайтов. На уровне первой версии язык XHTML не даёт практически никаких преимуществ по сравнению с последней версией языка HTML, но синтаксические требования в языке XHTML существенно выше, что усложняет использования этого языка разметки. Язык CSS решает задачу представления информации на устройствах вывода, как с паре с HTML, так и в паре с XHTML. CSS-свойства можно указывать прямо в теге HTML (вместо обычных атрибутов). Ниже, в примере, для второго абзаца определён большой размер шрифта (значение xx-large свойства font-size) и красный цвет (значение red свойства color):
CSS-код можно записывать в головной части HTML-программы. Ниже, в примере, для тега P определён большой размер шрифта и красный цвет. Это указание действует на все абзацы документа:
CSS-код можно помещать в отдельный стилевой файл (с расширением css). Ниже, в примере, в стилевом файле style.css для тега P определён большой размер шрифта и красный цвет. Это указание действует на все HTML-файлы, в которых в головной части указан путь к файлу style.css. Файл style.css
P
{
color:red;
font-size:xx-large;
}
Файл 01.htm
Файл 02.htm
Хранение стилевых описаний в отдельном файле является обычной практикой. Такой способ расположения стилевых определений очень удобен. На один и тот же стилевой файл могут ссылаться много HTML-документов. Изменения в этом единственном файле скажутся на внешнем виде сотен документов, составляющих большой сайт. Использование CSS позволяет:
Кроме того, CSS предлагает гораздо больше свойств и значений, чем атрибуты HTML.
Например, при помощи CSS можно отображать элементы на экране,
используя реальные координаты, отсчитываемые от левого верхнего угла
окна браузера и многослойное пространство
(
|
|
|
Язык HTML был разработан британским учёным Тимом Бернерсом-Ли (Tim
Berners-Lee) в 1991–1992 гг., в то время, когда он работал в ЦЕРН
(CERN) — Европейский совет по ядерным исследованиям в
Женеве (Швейцария).
