19
Язык HTML был разработан британским учёным Тимом Бернерсом-Ли приблизительно в 1991--1992 годах в стенах Европейского совета по ядерным исследованиям в Женеве (Швейцария). HTML создавался как язык для обмена научной и технической документацией, пригодный для использования людьми, не являющимися специалистами в области вёрстки. HTML успешно справлялся с проблемой сложности SGML путём определения небольшого набора структурных и семантических элементов (размечаемых «тегами»), служащих для создания относительно простых, но красиво оформленных документов. Помимо упрощения структуры документа, в HTML внесена поддержка гипертекста. Мультимедийные возможности были добавлены позже. Изначально язык HTML был задуман и создан как средство структурирования и форматирования документов без их привязки к средствам воспроизведения (отображения). В идеале, текст с разметкой HTML должен был без стилистических и структурных искажений воспроизводиться на оборудовании с различной технической оснащенностью (цветной экран современного компьютера, монохромный экран органайзера, ограниченный по размерам экран мобильного телефона или устройства и программы голосового воспроизведения текстов). Однако, современное применение HTML очень далеко от его изначальной задачи. Например, тег <TABLE>, использованный для форматирования страницы, предназначен для создания в документах самых обычных таблиц, но, как можно убедиться, здесь нет ни одной таблицы.
С течением времени, основная идея платформонезависимости языка HTML была отдана в своеобразную жертву современным потребностям в мультимедийном и графическом оформлении
Возможности HTML:
Язык HTML позволяет размечать в тексте:
1. Смысловую роль текстового блока (например: логическое ударение, заголовок (от первого до шестого уровня), параграф, пункт списка и др.), который обрабатывается браузером в соответствии со смыслом (например, в голосовых браузерах -- изменение интонации, в графических -- выделением курсивом, и т. п.) или настройками пользователя.
2. Гипертекстовые ссылки, которые значительно упрощают чтение множества связанных документов, ибо позволяют запросить документ с адресом, указанным в коде ссылки, простым щелчком мыши.
Эти управляющие коды используются для кодирования выделенных цветом либо подчеркиванием фрагментов текста или графических изображений, перехода с помощью выделенных слов к другому документу, другому текстовому блоку или рисунку. В качестве примера можно привести запись:
<A HREF="URL "> Фрагмент текста </A>
где «Фрагмент текста» - это часть документа, видимая пользователем в окне просмотра браузера, а URL - «место назначения» гипертекстовой связи. Адрес этого «места» может быть абсолютным - с заданием полного имени сервера и именем файла документа назначения; относительным, при котором предполагается, что имя сервера и начальный каталог те же, что и у документа, содержащего гипертекстовую ссылку. В HTML реализована поддержка механизма специальных гипертекстовых ссылок, которые обеспечивают связь данной публикации с другими публикациями. Гипертекстовая ссылка - это адрес другого HTML-документа или информационного ресурса Internet, который тематически, логически или каким-либо другим способом связан с публикацией, в которой эта ссылка определена. Ссылка состоит из двух частей. Первая их них - это то, что визуализируется в поле WEB-страницы. Она называется «указатель ссылки» (anchor). Вторая часть, дающая инструкцию браузеру, называется адресной частью ссылки (Universe Resource Locator или URL-адрес).
Пример:
<A HREF = "http://polyn.net.kiae.su/ altai/index.html">
Здесь тег - контейнер <A> (anchor), использует атрибут HREF, обозначающий гипертекстовую ссылку, для записи этой ссылки в форме URL. Указатель может быть как относительным, так и абсолютным. Данная ссылка указывает на документ с именем "index.html" в каталоге "altai" на сервере "polyn.net.kiae.su", доступ к которому осуществляется по протоколу "http". Возможно использование локального адреса в том случае, если файл находится на ПЭВМ, где запущена программа просмотра WWW, а не на сервере WWW. Между кодами <A> и </A> можно поместить текст любого объема, код <IMG> для вставки графики или сочетание того и другого.
Кроме ссылок на другие документы часто используются ссылки на разные части текущего документа. Например, большой документ читается лучше, если он имеет оглавление со ссылками на соответствующие разделы. Для построения внутренней ссылки сначала нужно создать указатель, определяющий место назначения. Например, сделать ссылку на текст определенной главы документа. Сначала размещается указатель и присваивается имя при помощи параметра name тега <a>. При этом параметр href не используется и браузер не выделяет содержимое тега <a>. Например:
<a name=chapter_5></a>
Теперь создается сама ссылка. Для этого в параметре href указывается имя ссылки с префиксом #, свидетельствующим о том, что это внутренняя ссылка.
<a href="#chapter_5">Глава 5</a>
Если пользователь щелкнет кнопкой мыши на словах «Глава 5», браузер выведет соответствующую часть документа в окно просмотра.
При использовании гипертекстовых связей программа просмотра извлекает документ, форматирует его и затем показывает начиная с верхней части окна просмотра. Однако код связи позволяет также немедленно "прокрутить" документ до метки в документе назначения. Код гипертекстовой связи такого рода имеет вид:
<A HREF="URL #метка"> Фрагмент текста </A>
Метка должна находиться в HTML-документе назначения:
<<A NAME="метка"> текст, видимый пользователю </A>
Гипертекстовые связи могут изменять положение просматриваемого документа на экране ПЭВМ:
<<A HREF="#метка"> Текст <A/>
Гипертекстовые связи такого типа позволяют начинать просмотр документа с его общего плана (упорядоченного или неупорядоченного списка), где каждый элемент представляет собой код гипертекстовой связи, адресующий к соответствующему разделу документа.
3. Гарнитуру, кегль, начертание, цвет шрифта для визуального вывода. (форматирование текста)
<P ALIGN=CENTER/LEFT/RIGHT >...</P> - тег нового абзаца, используется в формате одиночного тега или контейнера. При использовании в форме одиночного тега концом абзаца считается начало следующего т.е следующий тег <P>. Атрибут ALIGN задает выравнивание элементов абзаца, значение по умолчанию LEFT
|
<P>...</P> или <P> |
Этот абзац выравнивается по левому краю. И этот абзац тоже. |
|
|
<P ALIGN=CENTER> |
Этот абзац выравнивается по центру. |
|
|
<P ALIGN=RIGHT> |
Этот абзац выравнивается по правому краю. |
<BR>,<NOBR>...</NOBR>, <WBR> - теги управления разрывами и переносом строк в тексте документа. При разрыве строки межстрочный интервал не увеличивается.
|
<BR> |
Используется для указания места принудительного разрыва. Пример: <P>ФИО: <BR> Иванов С.С.</P> Будет выглядеть так: ФИО:Иванов С.С. |
|
|
<NOBR>...</NOBR> |
Используется для запрета разрыва текста, помещенного в данный контейнер. Пример: <NOBR>Это лучше не разрывать</NOBR> при необходимости переноситься на новую строку целиком, а не так: Это лучшене разрывать |
|
|
<WBR> |
Используется для указания рекомендуемого места для разрыва строки. Может быть вложенным в контейнер <NOBR>...</NOBR>. Пример: <NOBR>42301<WBR>810600000000001</NOBR> - номер счета заданный таким образом при помещении в поле уже своей ширины, разорвется после балансового счета: 42301810600000000001 |
<H1>...</H1>, ... ,<H6>...</H6> - контейнерные теги шестиуровневых заголовков документа. Имеют атрибут ALIGN ( по умолчанию LEFT) для выравнивания заголовка.
|
<H1>...</H1> |
Заголовок 1 уровня |
|
|
<p>...</p> |
Заголовок 2 уровня |
|
|
<H3>...</H3> |
Заголовок 3 уровня |
|
|
<H4 ALIGN=LEFT>...</H4> |
Заголовок 4 уровня по левому краю |
|
|
<H5 ALIGN=CENTER >...</H5> |
Заголовок 5 уровня по центу |
|
|
<H6 ALIGN=RIGHT>...</H6> |
Заголовок 6 уровня по правому краю |
Контейнеры для смыслового выделения заключенного в них текста на Web-страницах. Способ выделения зависит от типа используемого броузера, но главное назначение этих тегов передача читателям логики автора.
|
<CODE>...</CODE> |
Компьютерный код - Function Sum(a,b); |
|
|
<CITE>...</CITE> |
Выделение цитат - Цитата |
|
|
<KBD>...</KBD> |
Клавиатурный шрифт - Клавиатура |
|
|
<SAMP>...</SAMP> |
Выделение примеров -Пример |
|
|
<STRONG>...</STRONG> |
Выделение важных фрагментов - Важно |
|
|
<VAR>...</VAR> |
Выделение имен (i, j, k ) переменных |
|
|
<DFN>...</DFN> |
Выделение определений - Определение |
|
|
<EM>...</EM> |
Расставить акценты - Акцент |
|
|
<BLOCKQUOTE>...</BLOCKQUOTE> |
Выделение фрагмента текста в большом блоке текстовом блоке на странице. Вот фрагмент который мы хотели выделить из текстового блока в документе. Таким образом выделенные фрагменты текста отображаются броузером. |
Данная группа контейнерных тегов применяется для стилистического выделения элементов текста. Допускается любая комбинация нижеперечисленных тегов.
|
<B>...</B> |
Выделение полужирным шрифтом |
|
|
<I>...</I> |
Выделение курсивом |
|
|
<TT>...</TT> |
Выделение телетайпным шрифтом |
|
|
<U>...</U> |
Выделение подчеркиванием |
|
|
<STRIKE>...</STRIKE> |
|
|
|
<SUP>...</SUP> |
Шрифт в верхнем индексе |
|
|
<SUB>...</SUB> |
Шрифт в нижнем индексе |
|
|
<SMALL>...</SMALL> |
Мелкий шрифт |
|
|
<BIG>...</BIG> |
Крупный шрифт |
<HR> - тег вставки линии-разделителя. Применяется для визуального разделения текста, при помощи горизонтальных линий (не путайте с графическими изображениями в форме разделителей). При отображении линии-разделителя в документе, до и после нее, броузер добавляет разделение абзацев. Формат линии-разделителя задается при помощи следующих атрибутов:
· ALIGN - выравнивание (LEFT / RIGHT / CENTER);
· WIDTH - ширина линии (пикселы или проценты к ширине окна WIDTH=50%);
· SIZE - высота линии (пикселы);
· COLOR - цвет линии;
· NOSHADE - отключить эффекты 3-х мерности;
При использовании различных шрифтов для оформления текста следует помнить, что у пользователя может не оказаться шрифта, использованного вами для создания документа. Если вы используете редкие или нестандартные шрифты, то броузер пользователя может не подобрать шрифт для корректного отображения документа.
Для определения шрифта текста в HTML документах применяется контейнер <FONT>...</FONT> и одиночный тег <BASEFONT>.
Тег <BASEFONT> задает базовые параметры шрифта, общие для всего документа. Действие базовых установок может быть отменено атрибутами нового тега <BASEFONT>.
Kонтейнер <FONT> применяется для изменения параметров шрифта отдельных элементов документа, которые необходимо отобразить шрифтом отличным от базового. Действие его атрибутов ограничивается фрагментом документа, заключенным в данный контейнер, и он может быть вложенным по отношению к другим тегам форматирования текста.
Для задания характеристик шрифта в тегах <FONT>...</FONT> и <BASEFONT> используются следующие атрибуты:
· FACE - Задает имя шрифта (или перечня шрифтов - по мере убывания предпочтения) на компьютере пользователя. В случае отсутствия текст отображается шрифтом, заданным по умолчанию в броузере пользователя. Например:
<FONT FACE="Arial">Пример Arial</FONT> - Пример Arial
· SIZE - абсолютный или относительный размер шрифта. Относительный размер это размер шрифта относительно стиля Normal (SIZE=3) или размера заданного тегом <BASEFONT>. Минимальное абсолютное значение размера шрифта 1, максимальное 7. Например:
<FONT SIZE=4>4 абсолютный шрифт</FONT> - 4 абсолютный шрифт
<FONT SIZE=+1>4 относительный шрифт</FONT> - 4 относительный шрифт
· COLOR - цвет шрифта. Например:
<FONT COLOR=RED>Красный шрифт</FONT> - Красный шрифт
<FONT COLOR=#FF0000>Красный шрифт</FONT> - Красный шрифт
Полученные в данном разделе навыки, по форматированию текста, закрепим конкретным примером:
4. Специальные символы (выходящие за рамки ASCII символы пунктуации, математические символы, греческие и готические буквы, стрелки и т. п.)
5. Формы для введения пользователем данных, которые позднее подвергаются обработке. Формы и другую информацию можно обрабатывать с помощью специальных серверных программ (например, на языках PHP или Perl).
6. Открытие мультимедийных файлов, выводимых как непосредственно браузером (например, изображения в форматах JPEG, GIF или PNG; аудиофайлы MIDI и др.), так и внешними приложениями, «встраиваемыми» в окно браузера (Flash-анимация, Java-апплеты и прочее).
Использование графики в документах позволяет повысить привлекательность ваших Web-страниц, делает изложенный материал более доступным для восприятия, а в некоторых случаях (искусство, реклама) без нее просто не обойтись.
Web-броузеры поддерживают множество графических форматов, но наиболее часто используются GIF и JPEG (некоторые форматы требуют установки дополнительных программных компонентов броузера).
Для вставки изображения в документ используется одиночный тег <IMG>. Местоположение изображения на странице и его выравнивание относительно текста задается следующими атрибутами:
· SRC - URL изображения;
· ALIGN - выравнивание текста относительно изображения (режимы с обтеканием текста: LEFT - изображение слева, текст обтекает справа / RIGHT-изображение справа, текст обтекает слева; режимы без обтекания текстом: TOP - по верхнему краю изображения / MIDDLE - по центру изображения / BOTTOM - по нижнему краю );
· WIDTH - ширина изображения (пикселы);
· HEIGHT - высота изображения (пикселы);
· ALT - текстовое описание-альтернатива, для тех кто отключил загрузку изображений;
· BORDER - ширина рамки (по умолчанию BORDER=1);
· HSPACE - пустое поле от изображения по горизонтали;
· VSPACE - пустое поле от изображения по вертикали;
· ISMAP - признак карты-ссылок (обработка сервером);
· USEMAP - признак карты-ссылок (обработка клиентом);
Примеры тега <IMG>:
<IMG SRC="pic1.gif" ALIGN=MIDDLE>
<IMG SRC="pic2.jpg" HSPACE=20 VSPACE=20 ALT="Здесь изображение офиса нашей компании">
<IMG SRC="pic3.jpg" WIDTH=120 HEIGHT=160 ALIGN=LEFT BORDER=5>
ВОЗМОЖНОСТИ XML
XML начал вызывать огромный интерес и поддержку с того момента, как о нем было впервые заявлено в 1996 году. Он обеспечивает стандартный способ кодирования содержания, обеспечивая гибкий способ создания структур данных. В XML для разметки содержания на основе правил, составляемых разработчиком документа, используются теги. Этот набор правил называется описанием типа документа (Document Type Definition, DTD), и он позволяет разработчикам, применяющим XML, размечать различные документы. Сейчас документы всех этих типов можно создавать при помощи XML, для отображения содержания применяя HTML и Dynamic HTML (DHTML). XML также позволяет переназначать, переопределять и отображать содержание из одного источника при помощи других механизмов отображения. Например, хранить единую базу данных на сервере и поскольку сами данные отделены от информации об их представлении, одни и те же данные XML (будь то кулинарное меню или назначение врача) могут быть представлены различным образом на экранах компьютеров пользователей. Они могут быть отображены также на экране устройства, умещающегося в руке. Сам по себе XML-документ не указывает, будет ли, и каким образом, информация отображена на экране. XML-документ содержит лишь данные. С помощью механизма таблиц стилей HTML отображает данные. Как Web-сервер, так и браузер управляют преобразованием XML-данных в формат HTML. К тому же данные XML могут обновляться автоматически, без обновления всей страницы в целом. Такое фрагментарное обновление XML делает HTML-страницы более эффективными и динамичными. ображать выделенные данные на нескольких разных устройствах.
Возможности XML:
§ Лучший контроль над размещением информации.
§ Меньшая загрузка Web-сервера благодаря возможностям по доступу к информации на клиентской стороне. (независимость от сервера)
§ Применение различных типов гиперссылок (hyperlinks).
§ Возможность распространения различных видов информации в Internet и intranet.
§ Меньшее количество проблем, возникающих при отображении больших страниц (long pages).
Лучший контроль над размещением информации
В XML информация о компоновке располагается отдельно от непосредственного содержания, таким образом, когда дизайнер примет решение изменить компоновку сайта, он просто вносит изменения в используемую таблицу стилей. Содержание при этом остается неизменным. В этом заключается главное отличие от концепции HTML, что позволяет различным механизмам использовать значительно более гибкий формат обмена информации. Таблицы стилей могут применяться для форматирования содержания документов в различных приложениях.
XML позволяет сопоставлять стили с конкретными структурными элементами. Это означает, что разработчик может быстро применить стилевой формат для определения структурных элементов, например, сущностей, содержащих объявления изображений, особенных форматов абзацев, и даже стилей для различных типов механизмов связывания (linking mechanisms).
Одной из наиболее важных функциональных возможностей XML является то, что документы не нуждаются в жесткой привязке к серверам. Используя так называемую объектную модель документа (Document Object Model, DOM) можно создавать XML-документы, в которых отображаются либо все данные, либо лишь часть этих данных. Предположим, что вы создаете ХМL документ -- простую адресную книгу. При помощи HTML вы могли создать форму, позволяющую находить имя в адресной книге. Разумеется это бы потребовало пересылки поискового запроса из формы к серверу всякий раз, когда пользователю необходимо обратиться к тому или иному им ни в адресной книге.
Благодаря применению DOM в XML в документе может содержаться весь полный список, и если подключена таблица стилей, то из этого списка будет отображаться лишь затребованная информация. Все другие элементы документа могут быть при этом скрыты. Если же пользователю нужна более полная информация, то вместо того, чтобы посылать запрос к серверу, понадобится лишь отобразить остальную часть скрытой информации с помощью скрипта, выполняемого браузером. Такой механизм таблиц стилей позволяет работать с адресной книгой как в Internet, так и вне его.
Вы когда-нибудь пытались просмотреть большую Web-страницу при помощи современных браузеров? HTML не позволяет отметить и выбрать с отдельный раздел для просмотра.
XML позволяет просто решить эту проблему, поскольку все XML-документы структурированы и правильно оформлены. В XML вам не придется "срезать острые углы", как в HTML, применяя различные элементы разделов, вы можете разбить единый документ на разделы. Такая многоуровневая структура напоминает иерархическое представление папок (folders) в Windows Explorer. Из этого следует, что XML обеспечивает возможность поиска по всему документу, не прибегая к созданию отдельных скриптов.
XML предоставляет стандартную модель связывания, основанную на собственной спецификации -- расширяемом языке связывания (Extensible Linking Language, Xlink). B HTML в качестве указателя связи, или URL, могут применяться лишь символьные типы данных. Сущности не применяются. В URL не могут содержаться условные обозначения (notations), разделяющие различные типы данных. А внутренние связи, применяемые для связи с другими ссылками в том же самом документе, используют атрибут NAME типа элемента, например, <А NAME="bottom">. Это относительно простое связывание.
Связывание в XML является, однако, более сложным, чем в HTML. Благодаря XLL (extensible Link Language) -- языку описания связей для внедрения других документов XML и двунаправленных ссылок -- XML предлагает развитые механизмы связывания, которые:
§ Предоставляют управление семантикой связи.
§ Применяют спецификацию расширенных связей (extended links), благодаря которой обеспечивается более двух связей.
§ Поддерживают указатели на внешние ресурсы, благодаря применению спецификации расширенных указателей (extended pointers, Xpointers)
Не прибегая к профессиональной терминологии, можно сказать, что опции расширенного связывания обеспечивают документы XML:
§ двухсторонними связями;
§ внешним управлением связями (то есть такими связями, которыми можно управлять, находясь за пределами содержания данного документа);
§ связями, которые обеспечивают доступ к кольцу сайтов (ring of sites) или позволяют открывать множество окон;
§ связями с различными источниками;
§ атрибутами связей.
СПИСОК ИСПОЛЬЗОВАННОЙ ЛИТЕРАТУРЫ
1. about-html.narod.ru
2. doc.aceweb.ru
3. freebsd.org.ua
4. kunging.narod.ru
| ! |
Как писать рефераты Практические рекомендации по написанию студенческих рефератов. |
| ! | План реферата Краткий список разделов, отражающий структура и порядок работы над будующим рефератом. |
| ! | Введение реферата Вводная часть работы, в которой отражается цель и обозначается список задач. |
| ! | Заключение реферата В заключении подводятся итоги, описывается была ли достигнута поставленная цель, каковы результаты. |
| ! | Оформление рефератов Методические рекомендации по грамотному оформлению работы по ГОСТ. |
| → | Виды рефератов Какими бывают рефераты по своему назначению и структуре. |