Ростелеком

Языки гипертекстовой разметки SGML. XML. HTML. Средства гипертекстовой разметки Язык разметки гипертекста называется

В 1989 году гипертекст представлял новую многообещающую технологию, которая имела относительно большое число реализаций, с одной стороны, а с другой стороны, делались попытки построить формальные модели гипертекстовых систем, которые носили скорее описательных характер и были навеяны успехом реляционного подхода описания данных.

HTML – это язык гипертекстовой разметки, используемый для кодирования документов. Язык HTML представляет собой набор команд, в соответствии с которыми браузер отображает содержимое документа, команды HTML не отображаются. В языке HTML реализован механизм гипертекстовых ссылок, который обеспечивает связь одного документа с другими. Эти документы могут находиться на том же сервере, что и страница, с которой на них делается ссылка, а могут быть размещены на другом сервере.

Идея HTML - пример чрезвычайно удачного решения проблемы построения гипертекстовой системы при помощи специального средства управления отображением.

Наиболее эффективной формой организации гипертекста были признаны контекстные гипертекстовые ссылки, а кроме того, было признано деление на ссылки, ассоциированные со всем документом в целом и с отдельными его частями.


Все документы HTML имеют одну и ту же структуру, определяемую фиксированным набором тегов структуры. Документ HTML всегда должен начинаться с тега < HTML > и заканчиваться соответствующим закрывающим тегом (). Внутри документа выделяются два основных раздела: раздел заголовков и тело документа, - идущих именно в таком порядке. Раздел заголовков содержит информацию, описывающую документ в целом, и ограничивается тегами и . В частности, раздел заголовков должен содержать общий заголовок документа, ограниченный парным тегом .

). Тем не менее, при создании документа HTML опускать структурные теги не рекомендуется. Простейший правильный документ HTML содержащий все теги, определяющие структуру, может выглядеть следующим образом:

< TITLE > Заголовок документа < /TITLE >

Текст документа

Элементы HTML.

Для парных тегов область влияния определяется частью документа между открывающим и закрывающим тегом. Такую часть документа рассматривают как элемент языка HTML. Так, можно говорить об «элементе BODY», включающем тег , основное содержание документа и закрывающий тег . Весь документ HTML. можно рассматривать как «элемент HTML.». Для непарных тегов элемент совпадает с тегом, который его определяет.

Большинство элементов языка HTML. описывает части содержания документа и помещается между тегами . и , то есть внутрь структурного элемента BODY. Такие элементы делят на блочные и текстовые. Блочные элементы относятся к частям текста уровня абзаца. Текстовые элементы описывают свойства отдельных фраз и еще болей мелких частей текста.

Теперь можно сформулировать правила вложения элементов.

Элементы не должны пересекаться. Другими словами, если открывающий тег располагается внутри элемента, то и соответствующий закрывающий тег должен располагаться внутри этого же элемента.

Блочные элементы могут содержать вложенные блочные и текстовые элементы.

Текстовые элементы могут содержать вложенные текстовые элементы.

Текстовые элементы не могут содержать вложенные блочные элементы.

Функциональные блочные элементы.

В большинстве документов основными функциональными элементами являются заголовки и абзацы. Язык HTML. поддерживает шесть уровней заголовков. Они задаются при помощи парных тегов от до . При отображении Web-документы ются при помощи таким образом; тегом (документа на экране компьютера эти элементы показываются при помощи шрифтов разного размера.

Обычные абзацы задаются с помощью парного тега . Язык HTML. не содержит средств для создания абзацного отступа («красной строки»), поэтому при отображении на экране компьютера абзацы разделяются пустой строкой. Закрывающий тег рассматривается как необязательный. Подразумевается, что он стоит перед тегом, который задает начало очередного абзаца документа. Например:

Заголовок

Первый абзацВторой абзац

Заголовок второго уровня

Следствием наличия специального тега, определяющего абзац, является тот факт, что обычного символа конца строки, вводимого по нажатию клавиши ENTER, для создания абзацного отступа недостаточно. Язык HTML. рассматривает символы конца строки и пробелы особым образом. Любая последовательность; состоящая только из пробелов и символов конца строки, при отображении документа рассматривается как одиночный пробел. Это, в частности, означает, что символ конца строки даже не осуществляет перехода на новую строку (для этой цели используется текстовый элемент, задаваемый непарным тегом
.

В качестве ограничителя абзацев может также использоваться горизонтальная линейка. Этот элемент задается непарным тегом . При отображении документа на экране линейка разделяет части текста друг от друга. Ее длина и толщина задается атрибутами тега .

Этот тег создает горизонтальную линейку шириной в 10 пикселов, занимающую половину ширины окна и расположенную справа.


Создание сайтов - одна из широко доступных возможностей современной Интернет-индустрии. Собственно создание сайтов в принципе не намного сложнее создания личных электронных ящиков и электронных визиток.

Для создания сайта, прежде всего, необходим сервер, подключенный к Интернет, на котором можно размешать необходимые гипертексты. Кроме того, необходима регистрация имени сайга у провайдера, обслуживающего выбранный сервер.

В Интернет можно найти провайдеров, предлагающих бесплатное открытие сайтов на своих серверах. Бесплатные сайты можно открыть на отечественных серверах narod.ru, boom.ru, hotmail.ru и на зарубежных серверах, например geocities.com, tripod.com.

На указанных серверах можно зарегистрировать доменные имена вида:

. narod.ru

имя>.boom.ru,

Примеры зарегистрированных доменных имен:

wdu.da.ru- сайт электронного университета;

wduniv.newmail.ru - сайт распределенного университета.

После регистрации доменного имени сайта на нем можно размещать гипертексты. Размещение гипертекстов на сайте производится с помощью специальных программ, позволяющих создавать, редактировать, накапливать и копировать самые различные гипертексты. Сразу после размещения самой первой (главной) гипертекстовой страницы ее информация может читаться с помощью браузера в любой стране с любого компьютера, подключенного к Интернет. Для этого в окошке браузера указывается адрес сайта в Интернет. Например: http://bak.boom.ru

Все размещаемые файлы должны быть гипертекстами, записанными в формате HTML и имеющими идентификаторы вида .html.

HTML - это язык разметки гипертекстов (hypertext markup language).

По структуре гипертекст - это текст со ссылками на другие гипертексты, размещенные на данном сервере, либо на других серверах. При нажатии мышкой на такую ссылку браузер автоматически загружает на экран компьютера страницу гипертекста независимо от того, на каком сервере и в какой стране он находится.

С помощью указанных средств и программ в Интернет могут быть созданы самые разнообразные информационные сайты и системы - личные сайты, фирменные сайты, электронные газеты, журналы, электронные книги, энциклопедии, а также электронные архивы и библиотеки.

Разница между сайтами состоит в объеме информации, их структуре и процедурах обновления. В целом для сайтов в Интернет, как и для любой организации, можно говорить о жизненных циклах их создания, развития, модернизации и ликвидации.

Объем информации определяется владельцами - людьми или организациями, создавшими сайты и размещающими на них свою информацию. Объем информации на сайтах может составлять от нескольких килобайт до нескольких гигабайт (миллионов килобайт).

Структура сайтов может быть самой разнообразной. Простейшая структура - это главная страница со ссылками на набор текстов. Эти ссылки могут находиться в тексте главной страницы либо выделяться в оглавлении в ее начале.

Каждая страница сайта может быть снабжена названием, которое появляется на верхней строке экрана при загрузке сайта браузером.

Кроме того, в главной странице сайта можно указать список ключевых слов для поисковых систем.

Поисковые системы еженедельно просматривают все серверы в сети Интернет и записывают адреса всех найденных сайтов и гипертекстов вместе с выделенными в них ключевыми словами. По этим причинам не позже чем через неделю любая информация, опубликованная в Интернет, может быть найдена но содержащимся в них ключевым словам.

Продолжаем цикл статей об основах веб-языков и разработках в этой области. Ранее мы с основами гипертекстового языка HTML, его особенностями и методами разметки текста (тегами).

Также нам стало известно, что язык HTML иесно взаимодействует с такими программными разработками, как стили CSS и Javascript и для чего необходимо такое сотрудничество языков. Сегодня мы в подробностях будем рассматривать структуру построения документов на HTML5. Блочное построение документа, его структура – тема сегодняшней статьи. Но вначале нужно понять, что такое HTML5.

Язык программирования HTML5 (от английского HyperText Markup Language) – это пятая версия языка. Как и все предыдущие версии, предназначен для выстраивания структуры документов и представления их в сети. На данный момент версия HTML5 находится в стадии разработки. Цель, преследуемая созданием пятой версии HTML – улучшение языка в области его работы с документами мультимедиа (аудио- и видеоприложениями).

Добавление некоторых синтаксических новшеств, таких, как , и , позволит минимизировать логические и синтаксические ошибки при работе HTML5 с мультимедийными файлами. Также для обогащения семантического содержимого документа (семантика – изучение значения языковых единиц) вводятся и новые значение, такие, как , , и . Некоторые из атрибутов будут удалены или изменены. Вводятся новые возможности для обработки недопустимых документов, так что все браузеры будут способны работать с такого рода документами.

Что такое DOCTYPE?

Любой документ на HTML-языке всегда начинается именно с этого слова. Все предыдущие версии HTML публиковали это объявление приблизительно следующим образом:

где PUBLIC обозначало доступность документа к прочтению, а DTD обозначает тип публикующихся документов (Document Type Definition). Определение DOCTYPE в HTML5 намного упрощено — < !DOCTYPE HTML>. Это все – разметка готова.

Так за какие действия отвечает объявление DOCTYPE? Этот тег предназначен для сообщения браузерам о том, какой стандарт языка использовать – от определения версии HTML будет зависеть визуализация страницы в целом, её рендеринг. Стандарты разработки HTML строго регламентированы и следуют определенным правилам, поэтому работа с чужими кодами, их чтение и отображение в браузере за счет использования стандартов заметно упрощается.

Первоначально объявление DOCTYPE переключало браузер в стандартный режим, и это позволяло пользоваться более новыми стандартами. Для тех документов, которые были написаны с применением старого стандарта, возможно использование режима совместимости, что позволяет добиться нормальной работы браузера. Новое объявление DOCTYPE на сегодняшний день поддерживается почти всеми существующими браузерами, одновременно переключая их в режим работы со стандартами. То есть, каждый вновь создаваемый документ должен содержать атрибут DOCTYPE и соответствовать разработанным стандартам. При этом проверяется весь код документа на его соответствие стандартам.

Условно можно разделить всю страницу, написанную на HTML, на несколько подразделов. Корень основного кода всей страницы – тег . То есть, между тегами и можно расположить практически все, что угодно. Схематично страница на языке HTML представлена так:

Например:

< !DOCTYPE HTML>< !-Любой текст, изображения, таблицы и т.д. -->

В нашем случае тег вмещает в себя атрибут, определяющий язык документа – русский. Для облегчения работы с документом необходимо указывать язык документа. Все содержимое страницы находится именно между тегами …. , кроме объявления DOCTYPE.

Тег так называемая голова документа. Все необходимые данные о странице (как для работы браузера, так и информативные данные для разработчика) располагаются между и . Заголовок страницы, её код – например, UTF-8, meta-данные, такие, как ключевые слова, описание страницы, имя автора и т.д. – все подобные данные находятся именно между тегами и . Здесь же можно подключить внешние файлы, скрипты и библиотеки.

Что такое meta-теги?

В них, как было сказано выше, заключается вся информация о странице. Основные мета-теги описаны ниже:

1. Тип кодировки страницы – Charset. В большинстве случаев используется UTF8, но можно задействовать и другие кодировки, например – windows-1251, KOI-8, ISO и т.д. Такой атрибут, как Charset, определяет, какую кодировку использовать для чтения страницы. В HTML5 этот атрибут выглядит следующим образом:

Как видите, новая версия языка намного упрощает управление страницей, облегчает и ускоряет её прочтение.

Мета-тег Description, то есть – краткое содержание страницы. Например:

Применение этого тега необязательно, но желательно для защиты содержимого страницы от копирования.

Мета-тег, обозначающий заголовок страницы или записи на странице – title. Выглядит тег таким образом:

Определение HTML и структура языка. | vashsite.com

Отображается заголовок в названии открывающегося окна или вверху страницы.

Мета-теги link и script используются для подключения к исполнению файлы стилей, внешние файлы и библиотеки. Например, таблицы стилей CSS и JavaScript, а также библиотека jQuery. Выглядят строки подключения этих файлов так:

1

То есть, для понимания сути этих строк можно представить себе такую ситуацию – файлы CSS и JavaScript на сервере лежат, но без этих строк в документе они просто не будут работать. Небольшой нюанс для использования этих тегов – файлы могут быть как на локальном сервере, так и на удаленном. В последнем случае в мета-тегах необходимо указать полный путь к файлам. В нашем примере мета-тег link используется для подключения файла CSS и использует ссылочные отношения (link relation). Эта подпись дает знать браузеру, что данный файл является файлом стилей. Тег rel имеет также множество других значений.

Альтернативой первому варианту подключения файла стилей может быть такая строка:

1 2 3 4 a { text-decoration : underline ; } p { color : #000000 ; }

a { text-decoration: underline; } p { color: #000000; }

Такой способ напрямую подключает стиль к странице, без подключения файла стилей.

Самый значимый тег в HTML документе – тег . Он также имеет закрывающее окончание . Все данные, которые содержатся внутри этого тега, определяют содержимое страницы – её контент, изображения на странице, всю ссылочную массу, содержащуюся в тексте и т.д. Таким образом, вся информация, которая располагается до тега , можно заключить в своего рода неизменяемый шаблон. Содержимое же тела — может редактироваться, заменяться, улучшаться.

После рассмотрения всех составляющих HTML-документа пятой версии можно попробовать собрать все отдельные части в одно целое, которое и будет законченным HTML-документом, то есть – страницей некоего сайта. Вот так будет выглядеть страница в законченном виде:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 < !DOCTYPE HTML> Design Shack

< !DOCTYPE HTML> Design Shack

Если схематично представить структуру HTML страницы, то она будет выглядеть так:

Это так называемая объектная модель документа HTML (DOM).

В следующих публикациях планирую более подробное изучение таблиц CSS, и более детально разобрать структуру HTML5 также будет полезно для правильной работы с любыми версиями HTML-языка.

Гипертекстовая разметка применяется для указания, в какой части экрана и каким образом должен быть отображен текст и как связаны между собой тексты, составляющие гипертекстовую базу данных. С этими целями в те кст вв одятся специальные управляющие символы. Текст с управляющими символами хранится в обычном текстовом файле в кодах ASCII и может быть обработан практически любым текстовым редактором.

Язык гипертекстовой разметки HTML был предложен Тимом Бернерсом-Ли в 1989г. К моменту создания создания HTML существовал стандарт языка разметки печатных документов - SGML (Standart Generalised Markup Language), который и был взят в качестве основы HTML . Предполагалось, что такое решение поможет использовать существующее программное обеспечение для интерпретации нового языка.

В качестве элемента гипертекстовой базы данных для HTML был выбран обычный текстовый файл, который хранится средствами файловой системы операционной Среды ЭВМ.

Таким образом, гипертекстовая база данных в концепции WWW -это набор текстовых файлов, написанных на языке HTML , который определяет:

Форму представления информации (разметка);

Структуру связей файлов между собой (гипертекстовые ссылки). Такой подход предполагает наличие еще одной компоненты

технологии - интерпретатора языка. В WWW функции интерпретатора разделены между сервером гипертекстовой базы данных и интерфейсом пользователя. Сервер, кроме доступа к документам и обработки гипертекстовых ссылок, осуществляет так же препроцессорную обработку документов, тогда, как интерфейс пользователя осуществляет интерпретацию конструкций языка, связанных с представлением информации.

В 1990г. появилась нулевая версия HTML 0.

Первая версия (HTML 1.0) была направлена на представление языка как такового, где описание его возможностей носило скорее рекомендательный характер.

Прогнозирования являются стержнем любой торговой системы, поэтому отлично составленные могут сделать вас бешено богатым.

Вторая версия (HTML 2.0) фиксировала практику использования конструкций языка и явилась стандартом для построения WWW .

Версия ++ HTML ++ представляла новые возможности по представлению научной информации и таблиц, улучшения стиля компоновки текста и изображений.

Третья версия (HTML 3.0) упорядочила все нововведения и формализовала интерфейс пользователя гипертекстовой распределенной системы.

В 1996г. выпущена новая версия языка: HTML 3.2 ,включающая средства для создания таблиц, конструкции языка Java , карты-изображения (располагающиеся на машине-клиенте) и новые типы форматирования текста.

HTML - это текстовый язык, в котором инструкции по форматированию, называемые тэгами (tags), встроены в текст документа.

Процесс создания HTML - документа заключается во включении тэгов внутрь неформатированного текста, несущего информационную нагрузку.

Тэги HTML - это последовательности символов, начинающиеся знаком “меньше” ().

Большинство функций форматирования в HTML специфицирует логические, а не физические стили. Например, тэги заголовков, которые обычно обозначают больший размер букв, не указывают, какой именно размер надо использовать. Браузер (который выполняет роль клиентской программы) выбирает размер текста для заголовков, превышающий обычный. Этот подход позволяет избавиться от платформы - документ, созданный на Macintosh может быть использован UNIX или Windows . Недостатком является то, что на разных платформах документ выглядит по-разному.

Браузеры WWW при анализе предложений HTML работают по следующим правилам:

Пробелы и другие “невидимые” символы игнорируются;

Все тэги могут быть разделены на группы: базовые тэги, тэги форматирования, структурные тэги, указатели, и т.д.;

Тэги форматирования могут быть написаны строчными и/или прописными буквами;

Большинство тэгов форматирования пишутся парами. Открывающий тэг активирует данный эффект, а закрывающий -в ыключает его. Пара тэгов иногда называется контейнером, поскольку эффект, который они включают и выключают проявляется на тексте, расположенном внутри них. Например, для того, чтобы указать, что строка должна быть напечатана жирными символами, надо написать: < B > Эта строка будет напечатана жирным текстом

Текст, находящийся внутри закрывающего тэга, всегда предваряется символом “обратная косая черта”. Среди базовых тэгов HTML исключением из этого правила являются: < BASE > (основная информация), < BR > (конец строки), < HR > (горизонтальная линейка), и < IMG > (изображение). Эти тэги существуют в единичном экземпляре.

Каждый документ HTML имеет граничные тэги: < HTML > и . Эта пара тэгов заключает в себе все другие тэги Web -страницы и все информационное содержание документа. Фактически они декларируют, что все содержимое контейнера является кодом HTML . Тэг < HTML > должен располагаться в первой строке файла, а тэг - в последней.

Каждый HTML -документ содержит заголовок документа и его тело.

Заголовок документа идентифицирует документ. Он должен идти сразу после тэга < HTML > и начинаться с < HEAD >. Заканчивается заголовок тэгом .

В заголовке документа обязательно должны присутствовать название документа и его базовый URL -адрес.

Название документа располагается между тэгами < TITLE > и . Оно используется браузером и Web -сервером. Длина названия не должна превышать 40 символов. Название документа должно быть информативным, отражать содержание документа, чтобы его можно было идентифицировать. Название встречается в строке заголовка Internet Explorer , в списках журнала (History) и “Избранных стрницах” (Favorites).

Базовый URL должен быть полным (абсолютным) и содержать протокол, адрес компьютера в Internet и имя файла. Он указывается в тэге < BASE HREF = “базовый_URL”>. Все остальные URL в документе могут указываться относительно базового. Например, если базовый URL имеет адрес: http://www.microsoft.com/products/office/word/datasheets.html и необходимо указать URL файла features . html , расположенного в каталоге / products / office / excel на том же сервере, можно указать: ../ excel / features . html , а не набирать полный адрес.

Символы. ./ указывают, что нужно перейти на один уровень каталогов вверх относительно базового адреса.

Наличие базового адреса облегчает перенос документа на другой сервер, так как если все остальные URL в документе относительные, то при переносе необходимо изменить только имя сервера в базовом URL .

Тело документа содержит весь текст, несущий информацию и все тэги HTML , используемые для форматирования текста. Тело документа начинается сразу же после заголовка и ограничивается тэгами < BODY > и .

Пример HTML -документа:

< TITLE > Название документа

< BASE HREF = “базовый_URL” >

Тэги, используемые в теле документа, позволяют указывать следующие элементы разметки текста:

Начало абзаца и конец строки

Стили заголовков

Физические стили -л огические стили

Специальные символы.

Гипертекстовые ссылки состоят из двух частей: указателя и URL . Указатель - это текст, по которому пользователь должен щелкнуть для того, чтобы куда-то переместиться. URL указывает адрес, с которого браузер будет загружать документ, когда пользователь щелкнет по указателю.

Текстовые указатели в графических браузерах обычно подчеркнуты и выделены цветом. В чисто текстовых браузерах они выделяются жирным шрифтом.

В качестве указателя может использоваться любой текст, независимо от его размеров и особенностей форматирования. Указатель может состоять из нескольких букв, слов или даже строк текста.

Формат указателя:

< A HREF = “ URL ”> текст указателя ,

где буква А в тэге < A HREF > означает указатель (anchor), а HREF -гипертекстовую ссылку (Hypertext REFerence). Все, что находится между тэгами < A HREF = “ URL ”> и является текстом указателя, который выводится на экран подчеркнутым или жирным шрифтом.

Вместе с гипертекстовыми указателями могут быть использованы другие форматирующие коды. Например:

< A HREF = “ URL ”> < I > или

< I > < A HREF = “ URL ”> Переход к более подробному изложению

3. Язык гиппертекстов HTML

Гипертексты должны начинаться со слова и заканчиваться словом. Слова в угловых скобках в языке HTML называются тэгами, а в программировании - дескрипторами. Почти все тэги HTML парные - и, и и т.д.

Парные тэги выделяют некоторый фрагмент гипертекста - «заглавие», «тело» и т. д. Первый тэг начинает фрагмент, а второй - завершает его. В закрывающих дескрипторах перед именем ставится знак дроби / .

Общая структура гипертекстов, записанных в языке HTML:

гипертекст::= заглавие тело

заглавие::= титул

титул::= название

тело::= текст

В соответствии с правилами HTML гипертексты обязаны иметь «заглавие» и «тело». Как публикации гипертексты могут и должны содержать сведения об авторах и владельцах авторских прав (сайтов).

В заглавии гипертекста должно содержаться «название», которое браузерами отображается на самой верхней строке экрана ЭВМ. Название должно выражать главную идею публикации (страницы). Гипертекст без названия - это как статья без названия.

«Тело» гипертекста должно содержать тексты, таблицы, фотографии и иллюстрации. Отличие электронных гипертекстов от обычных бумажных текстов - включение гиперссылок, нажатие на которые вызывает загрузку новых гипертекстом.

Пример гипертекста и результат его отображения браузером на экране ЭВМ:

Гипертекст: Результат:

Результат работы браузера - загрузка и вывод на экран ЭВМ гипертекста, хранящегося на сайте по адресу, указанному в окне браузера. Если гипертекст слишком велик, то браузер выводит кнопки протяжки гипертекста справа или внизу экрана.

Размеры экранов ЭВМ имеют следующий спектр. Минимальный размер экрана - 640 х 480 пикселей. Далее стандартные размеры экранов - 800 х 600, 1024 х 768 и 1280 х 1024 пикселей. Поэтому на разных экранах гипертексты могут вы глядеть по-разному.

Общая структура гипертекстов и их отображения на экране ЭВМ:

Гипертекст: Результат:

Текстовая часть может состоять из строк и абзацев с заголовками и без заголовок, со списками, таблицами и меню.

тело::- текст

текст::= заголовок { текст } |

список { текст } |

таблица { текст } |

Заголовки в гипертекстах оформляются в следующем виде:

заголовок::=

название

заголовок::=

название

заголовок::=

название

где тэги H2, ... , h6 задают размер заголовков по отношению к основному тексту.

Абзацы в гипертекстах начинаются с дескриптора

гипертекст |

|

Переход на новую строку и абзацах указывается дескриптором . Конец абзаца р> не обязателен, но необходим при использовании параметров в дескрипторе абзаца.

Основной параметр абзацев - align - выравнивание текстов на экране ЭВМ. Выравнивание текстов производится браузерами автоматически в соответствии с размерами экрана ЭВМ:

align=center- по центру экрана:

align=left- к левому краю;

align=right - к правому краю;

align=justify - на весь экран.

Для выравнивания абзацев должен быть выбран единый общий стиль, который необходимо применять ко всем во всех гипертекстах на сайте.

Для оформления гипертекстов язык разметки HTML имеет богатый спектр шрифтов, стилей и ресурсов. Наиболее простое средство оформления - выделение слов в целях привлечения внимания читателей сайтов к отдельным частям текстов.

Для выделения слов в гипертекстах можно использовать жирный шрифт или подчеркивание с помощью следующих тэгов:

Большие символы

жирный шрифт

курсив i>

подчеркивание

перечеркивание

маленькие символы

Шрифтовое выделение в гипертекстах задается тэгом : шрифты:: = текст font>

Параметры шрифтов - их размер и тип. Размеры шрифта задаются параметром size = размер.

Размер указывается явно от 1 до 6, либо в форме увеличения +1, +2 или уменьшении - 1, - 2.

Тип шрифта задается параметром

face = шрифт

Здесь шрифт - один из стандартных шрифтов: «Times», «Courier» и т. д.

Цвет шрифта задается параметром со1ог = цвет, где цвет - цвет выделенного фрагмента гипертекста. Например - выделение текста красным цветом:

текст font >

Стандартные названия цветов в языке НТМL:

red - красный, green - зеленый, blue – синий, black-черный,

white - белый, gold - золотой, yellow-желтый и т. д.

Для оформления гипертекстов лучше всею взять за образец хорошую книгу или журнал, изданные профессиональным издательством, либо чью-то профессионально оформленную электронную книгу, газету или сайт в Интернет.

Единый стиль оформления - это важное свойство любой публикации в книгах, журналах и на сайтах. В дальнейшем лучше всего придерживаться принятого эталона и стиля оформления на весь период создания и сопровождения сайта.

Фрагменты гипертекстов могут размешаться на одном и том же сайте либо на нескольких сайтах или даже на нескольких серверах. Во внешних гиперссылках указываются имена соответствующих файлов на сайте, сервере или в сети Интернет:

Общая форма внешних гиперссылок:

где «адрес» - это адрес гипертекста внутри сайта или на другом сервере сети Интернет.

Примеры внешних гиперссылок:

а)адрес сайта в Интернет:

http: // bак2.naгоd.гu

б)адрес страницы на сайте:

http: // bак2.naгоd.гu / inrogl.html.

в)адрес страницы в папке сайта;

http: // bак2.naгоd.гu / tests / test2.html.

тесты 2 а>

С помощью аппарата гиперссылок на сайтах организуется размещение всех рисунков, фотографий и других графических иллюстраций. Для этого на сайт предварительно записываются все файлы с графическими иллюстрациями.

Графические файлы обычно размешаются на сайтах и отдельной папке с именем image. Загрузка иллюстраций на экраны пользовательских ЭВМ проводится браузерами с помощью операторов :

Общая форма операторов загрузки графических иллюстраций:

Расположение иллюстраций на экране ЭВМ задается параметрами выравнивания: align=left- по левому краю, align=right - по правому краю экрана. Текст при этом обтекает иллюстрации соответственно справа пли слепа.

Иллюстрации могут быть прижаты к верхнему или нижнему краю экрана, что задается параметрами: align =top - к верхнему краю, align=bottom - к нижнему краю экрана, либо выровнены по середине экрана - align = middle.

Для расположения иллюстрации па экране ЭВМ в операторе загрузки могут быть указаны их ширина и высота:

высота:= height= «высота»

ширина:= width= «длина»

Размеры иллюстраций задаются числом точек экрана (в пикселах) либо в процентах от высоты или ширины экрана ЭВМ. В последнем случае на разных экранах иллюстрации будут иметь различные размеры. Рассчитав расположение иллюстраций для экранов минимальных размеров, можно быть уверенным в их размещении на экранах любого, другого размера.

Размеры иллюстраций обычно выбирают так, чтобы они были видны целиком даже на экранах ЭВМ с минимальным размером. Если кран ЭВМ больше, то иллюстрации будут занимать только его часть.

Гипертекстовые списки - это перечни с нумерацией или выделением элементов списков. Все элементы начинаются тэгами

  • . Нумерованные списки начинаются тэгом и заканчиваются тэгом . Ненумерованные списки ограничиваются тэгами .

    Гипертекстовые списки – удобное средство для организации оглавлений в сложных сайтах и больших гипертекстов. Элементами в таких списках являются адреса соответствующих разделов сайтов (глав, параграфов разделов электронных книг и библиотек).

    Заключение

    HTML - это язык разметки гипертекстов (hypertext markup language).

    Все размещаемые файлы должны быть гипертекстами, записанными в формате HTML и имеющими идентификаторы вида.html.

    Язык HTML - это язык разметки гипертекстов, хранящихся на Web-серверах и отображаемых браузерами на экранах ЭВМ. Язык HTML определяет правила описания гипертекстов и отображения их браузерами на экранах компьютеров.

    На разработку языка гипертекстовой разметки существенное влияние оказали два фактора: исследования в области интерфейсов гипертекстовых систем и желание обеспечить простой и быстрый способ создания гипертекстовой базы данных, распределенной в сети.

    Основные правила вложения элементов:

    Элементы не должны пересекаться;

    Блочные элементы могут содержать вложенные блочные и текстовые элементы;

    Текстовые элементы могут содержать вложенные текстовые элементы;

    Текстовые элементы не могут содержать вложенные блочные элементы.

    Строго говоря, все правила языка HTML. можно рассматривать исключительно как «пожелания». Средство, используемое для отображения Web-документа, сделает все возможное, чтобы истолковать разметку наиболее разумным образом. Тем не менее, гарантию правильного воспроизведения документа дает только неукоснительное следование требованиям спецификации языка.

    Список литературы

    «Экономическая информатика» /Под. ред. П.В. Конюховского и Д.Н. Колесова, СПб: Питер, 2000, 560с.

    Каймин В.А., «Информатика», учеб.4-е изд. М.:,2003-285с.

    «Информатика», базовый курс, 2-е издание /Под. ред. С.В. Симоновича, СПб.: 2003, 640с.

  • Технология WWW

    Служба World Wide Web (WWW) – самая популярная служба Internet. WWW – это единое информационное пространство, состоящее из сотен миллионов взаимосвязанных электронных документов, хранящихся на Web-серверах. Отдельные документы, составляющие пространство Web, называют Web-страницами. Группы тематически объединенных Web-страниц называют Web-узлами (Web-сайт).Один физический Web-сервер может содержать достаточно много Web-узлов, каждому из которых отводится отдельный каталог на жестком диске сервера.

    От обычных текстовых документов Web-страницы отличаются тем, что они оформлены без привязки к конкретному носителю. Например, оформление Word-документа, напечатанного на бумаге привязано к параметрам печатного листа, который имеет определенную высоту, ширину и размер полей. Электронные Web-документы предназначены для просмотра на экране ПК, причем заранее не известно на каком. Поэтому Web-документы не могут иметь жесткое форматирование. Оформление выполняется во время их воспроизведения на ПК клиента и производится оно в соответствии с настройками программы, выполняющей просмотр (браузера). Браузер выполняет отображение документа в соответствии с теми командами, которые записаны в тексте Web-документа. Команды могут записываться либо непосредственно автором документа, либо внедряться автоматическими средствами подготовки Web-документов.

    Такие команды называются тегами. Теги заключаются в скобки . Большинство тегов используются парами: открывающий тег и закрывающий.

    текст

    Сложные теги кроме ключевого слова имеют дополнительные атрибуты и параметры. Правила записи тегов содержатся в спецификации специального языка разметки гипертекста – HTML (Hyper Text Markup Language). Т. е. Web-документ представляет собой обычный текстовый документ, размеченный тегами HTML.

    Наиболее важной чертой Web-документов являются гипертекстовые ссылки. Гиперссылку можно установить на любой фрагмент текста. Для создания гиперссылки используется парный тег . Этот тег содержит обязательный атрибут HREF, который задает адрес URL документа, на который указывает ссылка.

    Адрес может быть задан в абсолютной и в относительной форме. Адрес в абсолютной форме начинается с указания протокола и адреса Web-узла. Такая запись используется, когда необходимо направить посетителя на другой Web-узел, и рассматривается как внешняя ссылка. При использовании относительного адреса в ссылке задается только относительный путь поиска для документа. При этом предполагается использование того же протокола и того же Web-узла, а ссылка рассматривается как внутренняя. Внутренняя ссылка сохраняет свою работоспособность в случае изменения адреса Web-узла как целого (например, на другой сервер). Полный формат гиперссылки включает возможность ссылки на определенное место внутри страницы. Но это можно сделать только для страниц собственной разработки. Для этого место, на которое ставится ссылка помечается с помощью специального элемента- якоря. Якорь задается с помощью парного тега c обязательным атрибутом NAME. Значением этого атрибута является произвольная последовательность латинских букв и цифр – имя якоря. Для ссылки на якорь его имя указывается в конце адреса URL после символа #.



    Глоссарий

    Браузер будет искать документ на данном сервере в текущей папке

    Midi-музыка

    Браузер выполнит переход на сайт http://www.midi.ru.

    Совокупность огромного числа гипертекстовых документов, хранящихся на серверах WWW, образует своеобразное пространство гипердокументов, между которыми возможно перемещение. Произвольное перемещение между документами называют Web-серфингом, а целенаправленное (выполняется с целью поиска нужной информации) – Web-навигацией.

    Гипертекстовая связь между огромным количеством документов, хранящихся на физических серверах Internet, является основой существования логического пространства WWW.

    Рассмотрим аппаратные и программные средства, которые в совокупности об­разуют Веб.

    · Клиенты и серверы. Веб-сервер - это подключенный к Интернету компьютер, на котором выполняется специальная программа, также называемая веб-сервером. В задачи этой програм­мы входит хранение, поиск и распределение определенных файлов в Веб. Клиент Веб - это браузер, запрашивающий файлы из Веб. Когда клиентский компьютер хочет получить доступ к одному из файлов, запрос направляется на веб-сервер. Сервер отыскивает указан­ный файл и отправляет его клиентскому компьютеру, передавшему запрос. Тысячи компьютеров, которые образуют Веб, представляют собой самые разнообразные сочетания аппаратных и программных средств. Когда компьютер-клиент запрашивает какой-либо файл, он практически ничего не знает ни об особенностях сервера, где хранится искомый файл, ни о других компьютерах, которые будут передавать файл друг другу на его пути от сервера к клиенту. Чтобы такая система работала, она должна использовать набор языков и протоколов, не зависящих от аппаратных средств или операционных систем.

    · URL и протоколы передачи данных. Если фрагменты документа разбросаны по всему миру, а вы хотите предоставить его пользователю в виде цельного, выдержанного в едином стиле документа» понадобится очень хорошая адресная система. Каждый файл в Интернете имеет адрес, называемый URL (Uniform Resource Locator - унифицированный указатель информационного ресурса). Например, URL сайта Европейской федерации футбола - http://ru.uefa.com.

    Первая часть URL определяет метод, посредством которого компьютер получает доступ к файлу, то есть коммуникационный протокол. К большинству веб-страниц доступ осуществляется с помощью протокола HTTP (Hypertext Transfer Protocol - протокол передачи гипертекстовых документов). Вот почему веб-адрес обычно указывают с использованием букв «http», а браузеры автоматически вставляют эти буквы перед вводимым пользователем веб-адресом. Нередко часть адреса http:// в начале URL опускается.

    Следующая часть адреса - это хост-имя веб-сервера. Система доменных имен направит ваш запрос веб-серверу где бы он ни находился.

    Некоторые URL содержат информацию, указываемую вслед за хост-именем веб-сервера. Эти данные точно определяют файл, который вы хотите просмотреть и каталог, где он хранится. Если имена каталога и файла не указаны, на экран выводится веб-страница этого веб-сервера, заданная по умолчанию.

    · HTML (Hypertext Markup Language - язык разметки гипертекстовых до-нтов) является универсальным языком Веб. Он используется для компоновки страниц, на которых может быть воспроизведена информация, размещенная в Веб: текстовая, графическая, а также аудио- и видеоинформация.

    · Java и JavaScript. ЯзыкJava предназначен для пересылки через Веб небольших приложений (называемых апплетами или Java-приложениями). А язык JavaScript расширяет возможности НTML с целью встраивания небольших программ (или сценариев) в веб-страницы. Основное назначение апплетов и сценариев состоит в повышении интерактивности веб-страниц - вместо взаимодействия с удаленным веб-сервером вы работаете с апплетом и сценарием, которые выполняются на вашем компьютере.

    Существуют также Java-апплеты и сценарии JavaScript для построения анимации, они пересылаются веб-сервером по сети, чтобы быть выполненными на компьютере пользователя; они позволяют избежать передачи кадров анимации по Интернету. Описанные процессы обычно происходят незаметно для пользователя.

    · VBScript и элементы управления ActiveX. Язык VBScript и элементы управления ActiveX - это стандартные средства, под­держиваемые браузером Internet Explorer.

    VBScript представляет собой упрощенную версию языка Visual Basic, разрабо­танного компанией Microsoft. С его помощью можно создавать сценарии, кото­рые придают веб-страницам динамичность. Таким образом, по своим возможно­стям VBScript аналогичен языку JavaScript.

    Элементы управления ActiveX, подобно Java-апплетам, применяются для встраи­вания выполняемых программ в веб-страницы. Когда Internet Explorer встречает веб-страницу, где используются элементы управления ActiveX, он проверяет, ус­тановлен ли конкретный элемент управления на вашем компьютере, и если нет -инсталлирует его.

    · XML и другие расширенные языки Веб. XML (Extensible Markup Language - расширенный язык описания документов) представляет собой очень мощный язык, который должен заменить HTML в ка­честве языка разработки приложений для Веб. В отличие от HTML, XML не со­держит никаких инструкций о том, как должны отображаться описанные в XML-документе данные. Способ их отображения задается языком описания стилей, ко­торый играет для XML примерно ту же роль, что каскадные таблицы стилей для HTML. Консорциум W3C работает с двумя спецификациями таблиц стилей: XSL (Extensible Style Language - расширенный язык стилей) и CSS (Cascading Style Sheets - каскадные таблицы стилей). Другое принципиальное отличие XML от HTML состоит в том, что он может содержать любые теги, которые со­чтут нужным использовать создатели XML-словаря.

    Более совершенной версией HTML является язык DHTML (Dynamic HTML -динамический HTML), включающий три компонента - HTML, JavaScript и CSS.

    · Графические объекты. Рисунки, чертежи, карты, диаграммы и другие графические изображения, пред­ставленные в Веб, могут иметь множество форматов. Наиболее распространен­ными форматами отображения графической информации являются JPEG и GIF.

    · Аудио- и видеофайлы. Веб предоставляет множество аудио- и видеофайлов, которые воспроизводятся по­средством интегрированных программных модулей обозревателя. Существует два способа передачи таких данных: браузер может либо загрузить их в виде целого файла (тогда воспроизводить придется весь объем информации, что займет нема­ло времени, поскольку звуковые файлы имеют большие размеры, а видеофай­лы - просто огромны), либо взять только ту часть файла, которую необходимо воспроизвести в данный момент. Второй метод называется потоковым аудио или потоковым видео.

    HyperText Markup Language (HTML) – язык разметки гипертекста – предназначен для написания гипертекстовых документов, публикуемых в World Wide Web.

    Гипертекстовый документ – это текстовый файл, имеющий специальные метки, называемые тегами, которые впоследствии опознаются браузером и используются им для отображения содержимого файла на экране компьютера. С помощью этих меток можно выделять заголовки документа, изменять цвет, размер и начертание букв, вставлять графические изображения и таблицы. Но основным преимуществом гипертекста перед обычным текстом является возможность добавления к содержимому документа гиперссылок – специальных конструкций языка HTML, которые позволяют щелчком мыши перейти к просмотру другого документа.

    Существует два способа создания гипертекстовых документов. Можно воспользоваться одним из WYSIWYG HTML-редакторов (например, Microsoft FrontPage, или др.), для работы с которыми не требуется специальных знаний о внутренней структуре создаваемого документа. Этот способ позволяет создавать документы для WWW без знания языка HTML. HTML-редакторы автоматизируют создание гипертекстовых документов, избавляют от рутинной работы. Однако их возможности ограничены, они сильно увеличивают размер получаемого файла и не всегда полученный с их помощью результат соответствует ожиданиям разработчика. Но, безусловно, этот способ незаменим для новичков в деле подготовки гипертекстовых документов.

    Альтернативой служит создание и разметка документа при помощи обычного редактора текста (NotePad). При этом способе в текст вручную вставляются команды языка HTML. Создавая документы таким способом, вы точно знаете, что делаете.

    Как уже отмечалось, HTML-документ содержит символьную информацию. Одна ее часть - собственно текст, т. е. данные, составляющие содержимое документа. Другая – теги (markup tags), называемые также флагами разметки , – специальные конструкции языка HTML, используемые для разметки документа и управляющие его отображением. Именно теги языка HTML определяют, в каком виде будет представлен текст, какие его компоненты будут исполнять роль гипертекстовых ссылок, какие графические или мультимедийные объекты должны быть включены в документ. Графическая и звуковая информация, включаемая в HTML-документ, хранится в отдельных файлах. Программы просмотра HTML-документов (браузеры) интерпретируют флаги разметки и располагают текст и графику на экране соответствующим образом. Для файлов, содержащие HTML-документы, приняты расширения.htm или.html.

    Прописные и строчные буквы при записи тегов не различаются. В большинстве случаев теги используются парами. Пара состоит из открывающего (start tag) и закрывающего (end tag) тегов. Синтаксис открывающего тега:

    Прямые скобки, используемые в описании синтаксиса, означают, что данный элемент может отсутствовать. Имя закрывающего тега отличается от имени открывающего лишь тем, что перед ним ставится наклонная черта:

    Атрибуты тега записываются в следующем формате:

    имя[="значение"]

    Кавычки при задании значения аргумента не обязательны и могут быть опущены. Для некоторых атрибутов значение может не указываться. У закрывающего тега атрибутов не бывает.

    Действие любого парного тега начинается с того места, где встретился открывающий тег и заканчивается при встрече соответствующего закрывающего тега. Часто пару, состоящую из открывающего и закрывающего тегов, называют контейнером , а часть текста, окаймленную открывающим и закрывающим тегом, – элементом .

    Последовательность символов, составляющая текст, может состоять из пробелов, табуляций, символов перехода на новую строку, символов возврата каретки, букв, знаков препинания, цифр, и специальных символов (например, +, #, $, @), за исключением следующих четырех символов, имеющих в HTML специальный смысл: < (меньше), > (больше), & (амперсенд) и " (двойная кавычка). Если необходимо включить в текст какой-либо из этих символов, то следует закодировать его особой последовательностью символов.