Работа на компьютере по созданию страниц

Лабораторные работы №7-10

Создание HTML-документов

Самым выдающимся достижением ХХ века признан Интернет – Всемирная Информационная Сеть (World Wide Web), или WWW.

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

В настоящее время все разнообразные знания, накопленные че­ловечеством, активно переводятся в электронную форму. Появились новые формы представления информации. Наиболее популярны сей­час Web-страницы.

Основу любой Web-страницы составляет гипертекст, т. е. текст, в котором содержатся гиперссылки. Они связывают информацию, вызы­вая рисунки, фотографии, аудио- и видеовставки. Гиперссылка позво­ляет одним щелчком перейти от одного к другому листу просматри­ваемого документа так же легко, как и к документу, размещенному на сервере в другом конце света. Каждый документ обычно связан со следующим и т. д.

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

Кирпичиками WWW являются Web-страницы, которые, в свою очередь, создаются при помощи языка разметки гипертекста (Hyper Text Markup Language), или HTML.

Хотя многие говорят о нем, как о языке программирования, на са­мом деле HTML таковым не является. HTML представляет собой только то, что заключено в его названии – язык маркировки, или раз­метки.

В основу разметки положена дескриптовая (тeговая) модель описа­ния документа, позволяющая представить документ в виде совокупно­сти элементов.

Цель методических указаний– познакомить студента с основными дескрипторами HTML и порядком их использования для создания соб­ственных несложных Web-страниц.

БАЗОВАЯ СТРУКТУРА HTML-СТРАНИЦЫ. ПРОСТЕЙШИЙ ДОКУМЕНТ HTML. ТЕКСТОВЫЕ АТРИБУТЫ.

РАБОТА НА КОМПЬЮТЕРЕ ПО СОЗДАНИЮ СТРАНИЦ

Документ HTML всегда имеет определенные границы. Эти гра­ницы состоят из трех наборов контейнерных дескрипторов.

Дескриптор (тег) – это простой элемент разметки, который всегда начинается с левой угловой скобки «<» и заканчивается правой угло­вой скобкой «>». Между скобками записывается идентификатор деск­риптора и, если необходимо, дополнительные аргументы. Все деск­рипторы по их назначению и области действия можно разделить на пять основных групп:

– общего назначения;

– определения структуры текста;

– определение атрибутов текста;

– навигации и гипертекстовых ссылок;

– задания специальных эффектов и форматов данных.

Большая часть дескрипторов используются вместе с закрывающей парой, которая сигнализирует об окончании области действия соответ­ствующего назначения. Закрывающая пара после левой угловой скобки содержит символ «/». Например, для дескриптора курсивного шрифта <I> закрывающая пара представляет собой </I>.

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

HTML-страницы всегда начинаются с дескриптора <HTML>, кото­рый указывает на начало страницы. Он сообщает считывающему бро­узеру, что имеет дело с HTML-страницей. Последней строкой в документе должна быть закрывающая пара </HTML>, которую можно интерпретировать как «конец HTML-страницы». Таким образом, каж­дая HTML-страница должна содержать строки:

<HTML>

</HTML>

Следующие дескрипторы разделяют документ на две части: голову и тело. Для определения части головы добавляется дескриптор <HEAD> с закрывающей парой </HEAD>. С учетом этого HTML-страница принимает вид:

<HTML>

<HEAD>

</HEAD>

</HTML>

В части тела вводится текст и все то, что фактически должно поя­виться на HTML-странице. Для определения тела применяется деcк­риптор <BODY> с закрывающей парой </BODY>, помещаемой после дескрипторов головы:

<HTML>

<HEAD>

</HEAD>

<BODY>

</BODY>

</HTML>

В части головы документа задается заглавие, которое показывает общий смысл HTML-страницы. Его не следует путать с именем файла. При просмотре HTML-страницы в броузере Internet Explorer заглавие появится в строке заголовка окна броузера. Для определения заглавия HTML-страницы применяется дескриптор <TITLE> с закрывающей парой </TITLE>.

Например, чтобы назвать страницу Моя первая страничка, нужно добавить дескриптор <TITLE> и поместить его в дескриптор <HEAD>:

<HTML>

<HEAD>

<TITLE> Моя первая страничка </TITLE>

</HEAD>

<BODY>

</BODY>

</HTML>

Для придания большей выразительности HTML-страницам приме­няются следующие дескрипторы и их закрывающие пары:

для исполь­зования жирного (bold) написания <B> и </B>;

для курсива (italic) <I> и </I>;

для режима подчеркивания (underline)<U> и </U>.

Для переноса текста на другую строку (разрыва строки) используется дескриптор <BR>, он не требует закрывающей пары.

Для разбивки текста на абзацы используют открывающий дескрип­тор абзаца <P>, поместив его в начало каждого нового абзаца. Закрывающий </P> не обязателен.

Для написания кода HTML-страницы используется текстовой ре­дактор Блокнот (Notepad). Код, написанный на языке HTML, не нуж­дается в традиционной компиляции, другими словами, не переводится в машинные коды. Он передается с компьютера на компьютер в виде текста. Текстовые файлы, созданные на языке HTML в Notepad, сохра­няются с расширением .html. Получив текст, размеченный с помощью HTML, броузер сам отформатирует его в соответствии с командами, оформив заголовки, абзацы, определит количество слов в строке, вы­делит место под рисунок и т. д. Все это будет сформировано в зависи­мости от разрешения монитора и его цветности, наличия шрифтов, размеров экрана и т.п.

В качестве броузера (программа для просмотра Web-страниц) ис­пользуют Internet Explorer (возможны и другие программы).

После создания и сохранения кода документа, написанного на языке HTML, окно Notepad не закрывается (так как еще пригодится).

Разгружается окно Internet Explorer и открывается код документа, написанного на языке HTML (Файл → Открыть → Кнопка обзор → Имя документа → ОК).

Изменения, вносимые в код документа, сохраняются, а в броузере (Internet Explorer) нажимается кнопка Обновить.

Если просматриваем броузером какую-либо Web-страницу, то код ее, написанный на языке HTML, всегда можно просмотреть прямо из броузера Internet Explorer (Вид → В виде HTML), при этом откроется новое окно для Notepad.

Задание 1.1.Напишите HTML-код для вывода нижеследующего текста и присвойте заглавие для документа Моя первая страничка:

Веселые гуси

Вытянули шеи, –

У кого длиннее?

Один серый, другой белый –

У кого длиннее?

Задание 1.2.1.Измените HTML-код с целью придания большей выразительности своей Web-странице, выровняв по центру заголовок Веселые гуси (дескриптор <Center> и закрывающая пара </Center>).

2. Первую строку Вытянули шеи отобразить жирным шрифтом, вторую – курсивом, третью – подчеркните, а четвертую – оставьте без изменения (рис. 1).

работа на компьютере по созданию страниц - student2.ru

Рис. 1.

Наши рекомендации