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с.
I . Основные сведения об HTML .
За последние годы разработки для Интернета эволюционировали от статических страниц до динамических информационных систем. Некоторое время назад создание современных Web-страниц не требовало практически ничего, кроме совершенного владения языком разметки гипертекста (Hypertext Markup Language, HTML).
HTML представляет собой простой язык обработки текстов; на этом языке при помощи набора тегов (tags ) создается документ, который можно просматривать специальной программой просмотра Web (browser ).
HTML - не язык программирования в том смысле, как C++ или Visual Basic; он больше напоминает средства форматирования документов с использованием управляющих последовательностей. Кодирование на HTML часто сравнивают с созданием документа в формате Microsoft Word путем набивки кодов форматирования прямо в Notepad. Очевидно, что функциональность этого крайне мала.
Под гипертекстовым документом понимают документ, содержащий ссылки на другой документ. Реализовано все это через протокол передачи гипертекста HTTP (Hyper Text Transfer Protocol).
Информация в документах Web может быть найдена по ключевым словам. Это означает, что каждый обозреватель Web содержит определенные ссылки, через которые образуются гиперсвязи, позволяющие миллионам пользователей Internet вести поиск информации по всему миру.
Гипертекстовые документы создаются на базе языка HTML (Hyper Text Markup Language). Этот язык весьма прост, управляющие коды его, которые, собственно, и компилируются обозревателем для отображения на экране, состоят из текста ASCII. Ссылки, списки, заголовки, картинки и формы называются элементами языка HTML .
В настоящее время существует масса редакторов Web-страниц, которые не требуют от вас знаний основ HTML. Но для того чтобы уметь профессионально подготавливать гипертекстовые документы, вы должны знать их внутреннее строение, то есть код документа HTML.
HTML позволяет вам формировать различную гипертекстовую информацию на основе структурированных документов.
Обозреватель определяет сформированные ссылки и, через протокол передачи гипертекста HTTP, открывает доступ к вашему документу другим пользователям Internet. Разумеется, для успешной реализации всего этого необходим софт, полностью совместимый с WWW и поддерживающий HTML.
II. Описание HTML
HTML-документ - это обычный текстовой файл . Используя любой Web-обозреватель, вы можете просмотреть результат вашей работы, просто загрузив в него созданный на основе синтаксиса HTML текстовой файл.
Гипертекстовый язык предоставляет только информацию для чтения . Это означает, что редактировать Web-страницы может лишь тот, кто их создал, а не простой пользователь Сети.
Самый главный элемент гипертекстового языка - это ссылки . В мировой паутине вы просто нажимаете на ссылку и мгновенно оказываетесь в другой точке земного шара на выбранной вами страничке.
Тэги.
Тэг - оформленная единица HTML-кода .
Тег HTML состоит из следующих друг за другом в определенном порядке элементов:
- левой угловой скобки < (такого же, как "меньше чем" символа)
- необязательного слэша /, который означает, что тег является конечным тегом, закрывающим некоторую структуру . Таким образом в этом контексте Вы можете читать символ /, как конец...
- имени тега, например TITLE или PRE
- необязательных, если даже тег может иметь их, атрибутов . Тег может быть без атрибутов или сопровождаться одним или несколькими атрибутами, например: ALIGN=CENTER
- правой угловой скобки > (такой же, как символа "больше чем").
Большинство тегов имеют открывающий элемент <> и закрывающий . Между ними и находятся коды , которые распознает Web-обозреватель
В таких случаях два тега и часть документа, отделенная ими, образуют блок, называемый HTML элементом . Некоторые теги, например
, являются элементами HTML сами по себе, и для них соответствующий конечный тег неверен.
Для каждого тега определяется множество возможных атрибутов . Большинство тегов допускает один или несколько атрибутов, однако атрибутов может и совсем не быть. Спецификация атрибута состоит из расположенных в следующем порядке:
- имени атрибута, например WIDTH
- знак равенства (=)
- значения атрибута, которое задается строкой символов, например, "80".
Всегда полезно заключить значение атрибута в кавычки , используя либо одинарные ("80"), либо двойные кавычки ("80"). Строка в кавычках не должна содержать такие же кавычки внутри себя . Так, если дата заключена в двойные кавычки, используйте одинарные кавычки для последующего заключения в кавычки, и наоборот. Вы можете также опустить кавычки для значений атрибутов, которые состоят только из следующих символов:
- символов английского алфавита (A - Z, a - z)
- цифр (0 - 9)
- промежутков времени
- дефисов (-)
