Разработка web сайта на основе HTML с использованием JavaScript

Имя может заключаться  в кавычки.

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

 

Запрограммировать переход  по метке. 
В месте перехода нужно написать команду <A href=#метка>текст</A>. 
Здесь:

# -- ключевой символ;

метка -- выбранное имя  для метки;

текст -- запись, которая  будет выглядеть на экране браузера как ссылка.

 

Установить тег с меткой в нужном месте HTML-программы. 
Перед фрагментом HTML-программы, на который должен выполниться переход записать команду-метку <A name=метка></A>. 
При этом:

имя метки должно быть то же самое, что и в команде, задающей переход;

на экране тег-метка <A name=метка> никаких изображений не строит.

Переход к другому документу

Для того, чтобы браузер  загрузил в свое окно новый HTML-документ, нужно записать в программе ссылку при помощи команды <A> с атрибутом href=имя_файла.

Общий вид программы
... <A href=имя_файла>текст</A> ...	Выполнить файл "имя_файла". На экран выводится ссылка: текст   При щелчке пользователя на ссылке браузер строит на экране документ по программе, заданной в файле "имя_файла".

Документ 
Программа (файл doc1.htm) 
Программа, на которую настроена ссылка в документе (файл doc2.htm)

Переход к метке другого  документа

Мы научились решать такие задачи:

передавать управление в другую часть документа;

передавать управление в другую программу (HTML-файл).

Эти два метода можно  объединить и передать управление из одного документа к метке внутри другого.

Общий вид программы
Первый HTML-файл ... <A href=имя_файла#метка>текст</A> ...       Второй HTML-файл ... <A name=метка></A> ...	Приступить к показу фрагмента с меткой "метка" в файле "имя_файла". На экран выводится ссылка: текст.     При щелчке пользователя на ссылке браузер строит на экране документ по программе, заданной в файле "имя_файла", начиная с фрагмента с меткой "метка".

Документ 
Программа (файл doc3.htm) 
Программа, на которую настроена ссылка в документе (файл doc4.htm)

Имена файлов и ссылки на них

Имена файлов с HTML-программами  имеют расширение htm или html.

Без необходимости обозначение html лучше не использовать, так как  не все операционные системы понимают 4 символа в расширении имени файла.

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

Если, например, ваш многофайловый  гипертекст имеет иерархическую структуру, старайтесь в обозначениях учитывать иерархию. Так, основной файл с оглавлением можно назвать 00.htm (или index.htm). Файл с первой главой -- 01.htm и так далее (быть может до 99.htm). Когда главы имеют файлы-параграфы, их имена получаются из имени главы добавлением двузначного номера параграфа. Так же поступают и с файлами-пунктами параграфа.

Предлагаемая нотация  позволяет по имени файла определить его принадлежность. Например, файл 0205.htm -- описывает построение пятого параграфа второй главы, а файл 111299.htm -- 99-ый пункт 12-ого параграфа 11-ой главы.

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

указывать в ссылке полный путь к файлу, начиная с имени  дисковода;

указывать в ссылке путь по отношению к файлу со ссылкой.

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

Пусть, например, ваш гипертекст расположен в каталоге BOOK корневого каталога диска C. В самом каталоге BOOK расположен файл с оглавлением 00.htm. Остальные  файлы помещены в подкаталоги 01, 02, 03, 04 в соответствии с принадлежностью  к той или иной главе документа.

Как можно сослаться  из файла 00.htm на файл 02.htm?

C:/BOOK/02/02.htm (абсолютная адресация)

./02/02.htm (относительная адресация)

Первый способ приводит к непереносимости вашего продукта. Стоит вам перезаписать, например, каталог BOOK на диск D, как ссылки перестают  работать.

Вторая запись предлагает браузеру ориентироваться на текущий  каталог -- об этом говорит указание "./". Можно перемещать каталог BOOK в любое место и даже переименовывать  его - ссылки работать будут.

Относительная ссылка из файла 02.htm в файл 00.htm запишется так: ../00.htm. Символы "../" указывают на родительский каталог.

Замечание

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

<BASE>

 

Элемент для задания базового адреса (URL) для ссылок. Это позволяет опускать начальную часть адреса в ссылках документа. Для использования этого элемента необходимо использовать следующую конструкцию:

<BASE href =”http:// компьютер/путь 1”>

Фрагмент адреса путь1 не является обязательным. При формировании полного адреса он будет отброшен. Если в тексте документа встретится относительная ссылка

<A href =”путь 2/имя документа. Htm “ >Видимый текст ссылки</a>,

то она будет соответствовать  URL

http: // компьютер/путь 2/имя документа. Htm

В том случае, когда надо задать базовый адрес для локального диска (например, D), должна быть использована такая конструкция:

<BASE href =file://D:\путь\>

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

В выражении абсолютной ссылки можно  также опустить указание на схему  доступа (file://) В этом случае будет учитываться только левая часть абсолютной ссылки до первого левого символа “\”, то есть имя локального диска.

Правила синтаксиса

 

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

Существуют группы элементов, которые  используются совместно. К ним относятся  элементы для создания таблиц, списков, фреймов. В этом случае порядок вложения элементов определяется логикой  создания того или иного объекта  на странице. Таблицы и фреймы часто  используются для того, чтобы разместить детали страницы (рисунки, текст и  др.) в определённом порядке. Например, располагая рисунок внутри ячейки таблицы, можно добиться определённого его положения.

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

Например, есть два абзаца (первый в зелёной рамке) и таблица:

<P style = “border: 3px solid green”> Текст абзаца 1</p>

<TABLE>…</ table>

<P> Текст абзаца 2 </p>

Таблица в данном случае – независимый  элемент. Её можно, например, выравнивать  независимо от остального текста.

Можно использовать другой код:

<P style = “border: 3px solid green “>Текст абзаца 1

<TABLE>…</table>

<P> текст абзаца 2</p>

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

И наоборот, элемент P может находиться внутри таблицы: например, один элемент ячейки TD может содержать несколько абзацев P.

Правила синтаксиса распространяются и на использование стартового и  конечного тегов, атрибутов и  содержимого элемента. Нельзя путать понятия «элемент» и «тег». Элемент – это контейнер, содержащий атрибуты внутри стартового тега и полезную информацию между стартовым и конечным тегами. Тег – это конструкция, заключённая в угловые скобки и используемая для обозначения области действия элемента.

Некоторые элементы не имеют конечного  тега. Элементу BR, обозначающему конец строки, не нужен конечный тег. Некоторые элементы могут использоваться с конечным тегом и без него. Элемент абзаца P может иметь конечный тег , но если тег не задан, то признаком окончания действия элемента служит следующий элемент, который может логически определить конец текущего абзаца: другой элемент P, элемент рисунка IMG, элемент списка UL, элемент таблицы TABLE и др.

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

Кодирование символов

 

Основным языком Интернета является английский язык. Но для гипертекстовых документов предусмотрено использование  национальных алфавитов. Стандартным  режимом отображения является кодировка  ISO Latin 1 (ISO 8859-1). Она подходит как для MS-DOS (набор символов ASCCII), так и для Windows. В тоже время браузеры поддерживают набор символов Unicode 2.0 (ISO10646), что позволяет использовать национальные алфавиты. Это означает, что символы могут кодироваться однобайтовым числом (коды в пределах 0-255) или двухбайтовым (0-65 535). В первом случае для использования национального алфавита необходим атрибут charset, так как одни и те же коды символов могут быть интерпретированы по-разному для различных кодовых страниц.

Кириллица (Windows) и/или Кириллица (Кои8-Р) – это две наиболее популярные в нашей стране кодировки.

Если в документе есть указание на определённую кодовую страницу, то выбор шрифта будет предопределён. Коды 32-127, то есть знаки препинания, цифры и буквы латинского алфавита, отображаются правильно, а коды 128-255 могут отображаться по-разному.

Если кодовая страница указана  неправильно, то, например, при создании гипертекстовых документов в MS FrontPage Express в текст страницы автоматически добавляется конструкция типа charset =xxxxx, которая не позволяет использовать кириллицу. В этом случае необходимо правильно указать значение атрибута: charset =windows-1251.

Если документ использует кодировку  Unicode, то для работы с ним подойдут такие средства, как Блокнот, Norton Commander или WordPad, и придётся остановиться на гипертекстовом редакторе. В этом случае русская буква А будет выглядеть в режиме «источника» так &#1040 (в десятичной кодировке). Такую страницу будет сложно читать и редактировать. Поэтому каждый новый редактор надо тестировать на возможность использования русских букв: набрать небольшой текст, сохранить документ, а затем просмотреть его в режиме источника.

Использование символов

 

В HTML и в браузерах реализована возможность прорисовки символов по их кодам. Символы могут быть общепринятыми, нестандартными и используемыми в HTML в качестве служебных символов. Их называют спецсимволами. Первый способ ввода спецсимвола заключается в указании его кода. Например, латинскую букву А можно задать так: &#65. Для некоторых символов предусмотрена мнемоническая кодировка.

Часто используемые спецсимволы (по стандарту  ISO 8859 – 1):

 

Код символа	Числовой код	Мнемонический код	Название	Символ
34	&#34	&quot	Прямая кавычка	“
38	&#38	&amp	Амперсанд	&
60	&#60	&lt	знак «меньше»	<
62	&#62	&gt	Знак «больше»	>
153	&#153	&trade	Троговая марка	™
160	&#160	&nbsp	Неразрывный пробел
162	&#162	&cent	Цент	¢
163	&#163	&pound	Фунт	£
164	&#164	&curren	Знак валюты	¤
165	&#165	&yen	Йена	¥
166	&#166	&brvbar	Вертикальная строка	¦
167	&#167	&sect	Знак параграфа	§
169	&#169	&copy	Знак копирайта	©
171	&#171	&laquo	Левая типографская кавычка	«
172	&#172	&not	Знак отрицания	¬
174	&#174	&reg	Знак “зарегестрировано”	®
176	&#176	&deg	Знак градуса	°
177	&#177	&plusmn	Знак “плюс минус»	±
178	&#178	&sup2	Степень 2	²
179	&#179	&sup3	Степень 3	³
181	&#181	&mikro	Знак «микро»	µ
182	&#182	&para	Знак абзаца	¶
183	&#183	&middot	Точка-маркер	·
185	&#185	&sup1	Степень 1	¹
187	&#187	&raquo	Правая типографская кавычка	»
188	&#188	&frac14	Одна четвёртая	¼
189	&#189	&frac12	Одна вторая	½
215	&#215	&times	Знак умножения / кавычки/	*
247	&#247	&divide	Знак деления	/