Практикум по созданию сайта.
1. Язык html.
1.1 Общие сведения о языке.
HTML - это язык, в котором инструкции по форматированию, называемые тэгами (tags) или дескрипторами, встроены в текст документа.
Процесс создания HTML - документа заключается во включении тэгов внутрь неформатированного текста, несущего информационную нагрузку.
Тэги HTML (или дескрипторы) - это последовательности символов, начинающиеся знаком “меньше” (<) и заканчивающиеся знаком “больше” (>). Открывающий тэг активирует данный эффект, а закрывающий - выключает его. Текст, находящийся внутри закрывающего тэга, всегда предваряется символом “обратная косая черта”.
Например, для того, чтобы указать, что строка должна быть напечатана жирными символами, надо написать: <b> Эта строка будет напечатана жирным текстом </b>
Если такую строку записать в файл с расширением htm (рис.1), а затем дважды щёлкнуть по нему мышью, на экране браузер воспроизведёт (рис.2).
Рис.1. Контейнер с текстом в файле “Primer1”..
Рис.2. Воспроизведение на экране контейнера HTML из файла “Primer1”.
Структура html-документа
Каждый документ HTML имеет граничные тэги: <HTML> и </HTML>.
Тэг <HTML> должен располагаться в первой строке файла, а тэг </HTML> - в последней (рис.3). Эта пара тэгов заключает в себе все другие тэги Web-страницы и все информационное содержание документа.
Рис.3. HTML–текст с граничными тэгами.
Каждый HTML-документ содержит заголовок документа и его тело.
Заголовок документа идентифицирует документ. Он должен идти сразу после тэга <HTML>. Начинается с <HEAD> и заканчивается </HEAD>.
Внутри заголовка HTML-документа содержится служебная информация, образующая контейнеры:
-
Заглавие экрана тег <TITLE>;
-
Базовый URL-адрес, используемый при обработке относительных адресов (тег <BASE>);
-
Дополнительную информацию об HTML-документе (тег <META>);
-
Дескриптор, используемый для связи HTML-документа с другими источниками информации (тег <LINK>).
В заголовке документа обязательно должны присутствовать название документа и его базовый URL-адрес.
Заглавие экрана образуется тегами <TITLE> … </TITLE> - это строка символов, которая отображается в заголовке окна браузера.
Например, создадим файл “Primer2” (рис.4):
Рис.4. HTML-файл “Primer2” с контейнером <TITLE>.
При просмотре этого файла браузером на экран будет выведен текст из контейнера <b>, а в самой верхней строке окна браузера появится заглавие – содержимое тега <TITLE> (рис.5). Название встречается в строке заголовка окна браузера, в списках журнала (History) и “Избранных стрницах” (Favorites).
Рис.5. Экран браузера с заглавием.
К заглавию предъявляются следующие требования:
-
Длина названия не должна превышать 40 символов.
-
Название документа должно быть информативным, отражать содержание документа, чтобы его можно было идентифицировать.
Базовый 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.
Тело документа содержится в контейнере <BODY> … </BODY>. Тело документа содержит весь текст, несущий информацию и все тэги HTML, используемые для форматирования текста. Оно начинается сразу же после заголовка.
Полная структура HTML-документа при этом будет выглядеть, как на рис.6.
Рис. 6. Полная структура HTML-документа.
Гипертекстовые ссылки состоят из двух частей: указателя и URL. Указатель - это текст, по которому пользователь должен щелкнуть для того, чтобы куда-то переместиться.
URL указывает адрес, с которого браузер будет загружать документ, когда пользователь щелкнет по указателю.
Текстовые указатели в графических браузерах обычно подчеркнуты и выделены цветом. В чисто текстовых браузерах они выделяются жирным шрифтом. В качестве указателя может использоваться любой текст, независимо от его размеров и особенностей форматирования. Указатель может состоять из нескольких букв, слов или даже строк текста. Указателем может так же являться рисунок или его часть.
Формат указателя:
<A HREF = “URL”> текст указателя </A> ,
где буква А в тэге <A HREF> означает указатель (anchor), а HREF - гипертекстовую ссылку (Hypertext REFerence).
Все, что находится между тэгами <A HREF = “URL”> и </A> является текстом указателя, который выводится на экран подчеркнутым или жирным шрифтом.
Вместе с гипертекстовыми указателями могут быть использованы другие форматирующие коды. Например:
<A HREF = “URL”> <I> Переход к более подробному изложению </I> </A>
или
<I> <A HREF = “URL”> Переход к более подробному изложению </A> </I>
Большинство функций форматирования в HTML специфицирует логические, а не физические стили. Например, тэги заголовков, которые обычно обозначают больший размер букв, не указывают, какой именно размер надо использовать. Браузер (который выполняет роль клиентской программы) выбирает размер текста для заголовков, превышающий обычный. Этот подход позволяет избавиться от платформы - документ, созданный на Macintosh может быть использован UNIX или Windows. Недостатком является то, что на разных платформах документ выглядит по-разному.