Добавлен: 17.05.2023
Просмотров: 199
Скачиваний: 3
Введение
В работе рассматривается язык разметки гипертекста HTML (Hypertext Markup Language); первая спецификация этого универсального и общедоступного языка разметки - HTML была утверждена в 1991 году. HTML стал стандартом и одновременно «корнем» для всех разрабатываемых Web страничек.
Актуальность темы работы определена тем, что на сегодняшний день HTML остается самым универсальным, даже незаменимым средством разметки гипертекста, а, следовательно, и публикации в Интернет. Написание Web страничек на HTML не требует интерпретации исходного кода в двоичный код.
Современные Web-страницы уже не обходятся одним только HTML. Его гармонично дополняют средства динамического HTML: скрипт языки JavaScript и/или VBScript, каскадные таблицы стилей(CSS), иногда присутствуют Java-апплеты. По сути дела, можно вывести для современной Web-страницы: Web-страница=HTML+DHTML(JavaScript/VBScript, CSS, Java-апплеты)+CGI То есть на любой странице должна присутствовать HTML-верстка - расположение элементов дизайна текста и необходимые скрипты - как расширение HTML в области расположения и описания свойств различных объектов. CGI-скрипты могут играть первостепенную роль, формируя всю страницу, наполняя ее необходимыми, обновленными данными или второстепенную роль, - включаясь в нее.
Цель работы состоит в общей характеристике языка разметки гипертекста HTML. В соответствии с поставленной целью задачи работы сформулированы следующие:
1. обзор основных возможностей HTML
2. анализ практического применения HTML (на примере обучающих программ).
§ 1. Общие сведения о языке разметки гипертекста (HTML)
Гипертекст - текст со вставленными в него словами (командами) разметки, ссылающимися на другие места этого текста, другие документы, картинки и т.д. Во время чтения такого текста (в соответствующей программе, его обрабатывающей и выполняющей соответствующие ссылки или действия) вы видите подсвеченные (выделенные) в тексте слова. Если наехать на них курсором и нажать клавишу или на кнопку (глаз) мышки, то высветится то, на что ссылалось это слово, например, другой параграф той же главы этого же текста. В WWW по ключевым словам можно попасть в совершенно другой текст из другого документа, войти в какую-нибудь программу, произвести какое-либо действие и т.д. В Internet в контексте WWW можно получать доступ к чему угодно, к telnet, e-mail, ftp, Gopher, WAIS, Archie, USENET News и т.п. В WWW можно ссылаться на данные на других машинах в любом месте сети, тогда при активации этой ссылки эти данные автоматически передадутся на исходную машину и вы увидите на экране текст, данные, картинку, а если провести в жизнь идею мультимедиа, то и звук услышите, музыку, речь. Это слегка напоминает Gopher, но фактически это принципиально другое и новое. В Gopher имеется жесткая структура меню, по который вы двигаетесь, как вам угодно. Эта структура не зависит от того, что вы делаете, какой документ пользуете и т.д. В WWW вы двигаетесь по документу, который может иметь какую угодно гипертекстовую структуру. Можно свободно организовать структуры меню в гипертексте. Имея редактор гипертекстов, можно создать любую структуру рабочей среды, включая документацию, файлы, данные, картины, программное обеспечение и т.д., и это не будет новое программное обеспечение, а просто гипертекст.
Современные программы разработки Web-серверов, такие как MS FrontPage или Web Pen для Windows, дают возможность даже новичку без всякого штудирования учебников легко создавать готовые странички. При этом cпециалист по созданию Web-сайтов, называемый Web-мастером, берет готовые файлы (тексты, таблицы, графику, базы данных, звук, анимацию, видеофильмы, программы) и с помощью кнопок и команд меню оформляет страницы сайта. Подобные программы, выполняя команды инструментальных и операционного меню, формируют гипертекст WWW-сервера.
Исходные текстовые, табличные и графические и другие объекты включаются в Web-site посредством тегов (tag = ярлык, этикетка). Тег - это последовательность символов, задающая
). положение объекта на странице сайта,
). внешний вид объекта или
). связь данной страницы с другими страницами этого сайта, а также с любым другим сервером.
Тег называют также управляющим маркером, флагом. Программы типа Web Pen сами расставляют теги, поэтому пользователь таких программ может не знать языка разметки гипертекста (HTML = HyperText Markup Language).
Знание HTML необходимо по пяти причинам. Во-первых, Web-мастер анализирует сайты фирм-конкурентов и просто удачные экземпляры WWW-серверов. Такой анализ, необходимый для совершенствования своего сайта, невозможен без знания языка разметки гипертекста.
Во-вторых, совершенствование своего Web-сервера без полной его переделки (что долго и дорого) удобно производить путем ручной вставки и удаления объектов и тегов.
В-третьих, HTML непрерывно развивается, поэтому программы типа MS FrontPage все время отстают от новейших возможностей языка.
В-четвертых, не следует забывать о достаточно высокой стоимости таких программ.
Наконец, в-пятых, потратив деньги на приобретение программы, нужно еще потратить время на ее освоение.
Используя HTML, Web-мастер определяет структуру гипертекстового документа и вид каждой его страницы. HTML задает синтаксис тегов, в соответствии с которыми программа просмотра отображает содержимое документа: текст, изображения, таблицы и данные других типов. Cами теги программой просмотра не отображаются.
В HTML реализована поддержка механизма специальных гипертекстовых ссылок, которые обеспечивают связь данного документа с другими документами. Последние могут находиться:
) на данном сайте, то есть в папке, содержащей все htm-файлы, графику, звук, анимацию, видеофильмы, программы;
) вне сайта в других в папках на данном компьютере;
) в системе World Wide Web, то есть на других Web-серверах;
) в Internet на серверах других типов(FTP, Gopher).
Применение механизма гипертекстовых ссылок создает всемирное единое информационное пространство, из которого сотрудники торговой фирмы получают нужные им сведения. Стандарт HTML, как и все другие стандарты, имеющие отношение к Web, разрабатывается под эгидой консорциума World Wide Web Consortium (W3C). Спецификации стандартов и проекты новых предложений можно найти по адресу http://www.w3.org. Самая последняя разработка рабочей группы по HTML в W3C - рабочий проект HTML 4.0. Кроме HTML, Web-мастера используют и другие языки, например, Java (Ява), Perl, Си.
Записанные в методичке HTML-тексты содержат сведения, необходимые для создания Web-сайтов. Это позволяет увеличить количество информации, полезной для студентов. Принятая форма изложения имеет еще одно достоинство: обучающийся привыкает читать htm-файлы. Это необходимо для анализа и совершенствования готовых сайтов.
гипертекст hypertext markup language
§ 2. Структура HTML-документа
документ состоит из текстов, графики, таблиц и других объектов, которые представляют собой содержимое документа. Программа просмотра использует при этом теги, которые записаны в HTML-документе для задания структуры расположения объектов и их внешнего вида. Чаще всего HTML-теги записываются парами (начальный и конечный теги), между которыми размещаются текст и другие объекты документа. Имя конечного тега идентично имени начального, но перед именем конечного тега ставится косая черта (/), так называемый слэш. Оформление HTML-документа просто: он начинается тегом и заканчивается тегом . Имя тега может быть записано как строчными, так и прописными буквами.
Запустить приложение Блокнот, используя кнопку “Пуск” на панели задач
ПУСК => ПРОГРАММЫ => СТАНДАРТНЫЕ => БЛОКНОТ
Разместить на рабочем столе одновременно два окна: окно MS Word с данной методичкой и окно Блокнота.
Набрать в поле редактирования Блокнота следующий текст:
Данную программу, как и все последующие, можно не набирать на клавиатуре,а скопировать в поле редактирования Блокнота из этой программы используя команду операционного меню ВИД => ИСТОЧНИК. Неиспользуемые в программаж сноски набраны черным шрифтом.
Здесь записан текст, появляющийся на экране при открытии этого документа.
А этот текст будет записан курсивом.
Если времени не хватает для набора текста, то прочтите Блокнотом файл ris1.htm, находящийся в том же каталоге, из которого Вы прочли данную методичку.
Сохранить документ в рабочем каталоге под именем, например, ris1a.htm (Блокнот закрывать не следует, он пригодится для дальнейшей работы).
В окне рабочего каталога выполнить двойной щелчок левой кнопкой мыши по значку только что созданного документа ris1a.htm и с помощью MS Internet Explorer просмотреть получившийся документ.
Текст документа состоит из элементов заголовок и тело, которые выделяются соответственно тегами <HEAD></HEAD> и <BODY></BODY> В заголовке теги <TITLE> . . . </TITLE> ограничивают текст, используемый как надпись в заголовке окна программы просмотра. Такую же надпись имеет кнопка на панели задач при просмотре документа.
§ 3. Элементы дизайна Web-страниц
Главной проблемой при описании и изучении HTML яатяется определение набора атрибутов и их значений, допустимых для каждого из элементов. Очень часто можно столкнуться с ситуацией, когда некий хорошо известный атрибут не использовался в каком-нибудь элементе, а потом вдруг его использование стало давать эффект при просмотре страницы в новом броузере. Поддержка дополнительных атрибутов - скорее дело совершенствования броузеров, а не языка. Например, фирмы Netscape и Microsoft постоянно развивают свои программы.
Заголовок страницы. Заголовок Web-страницы представляет собой информацию. заключенную внутри 'цемента (секции) HEAD.
<TITLE > это элемент TITLE определяет текст, который появляется в заголовке окна броузера во время просмотра страницы. Этот текст не только служит подсказкой, но может использоваться и поисковыми машинами для анализа страниц. Су шествует три способа для поиска страниц в Интернете па основе текстовых данных: по ключевым словам элемента МЕТА, по тексту, разметенном) на странице. и по строке заголовка внутри элемента TITLE.
STYLE -и - LINK -. Тег STYLE тоже должен располагаться внутри элемента HEAD, Если вы хотите разобраться, какие нестандартные форматы используются на странице, надо просмотреть содержимое этого элемента. В нем будут указаны необходимые форматы. Если таких форматов нет, значит стили страницы записаны в отдельном файле. Ссылка на такой файл должна находиться в элементе LINK.
Секция заголовка может содержать несколько цементов МЕТА, каждый из которых отвечает за определенный набор параметров. Использование элементов МЕТА не является обязательным, но некоторые настройки могут быть весьма важны. Так, например, известно, что броузер в некоторых случаях способен автоматически определить вид кодировки страницы. Пользователь, работая с броузером, может выбрать в меню определенную кодировку. Чтобы исключить неопределенность при просмотре конкретной страницы, на ней целесообразно разместить указание на кодовую страницу.
Информация, сосредоточенная в элементах МЕТА, определяет общие настройки Web-страницы и называется профилем. Профили можно хранить в отдельных файлах и присоединять к определенной странице при помощи специального атрибута элемента HEAD:
<HEAD prorIle=«lJRL»>
Стандартные атрибуты. Существует ряд атрибутов, которые moist использоваться во многих элементах. Часть этих атрибутов очень важна для конструирования Web-страниц, а часть подходит только для решения определенных задач.
Атрибут id выполняет функции уникального имени элемента. В зависимости от типа элемента, этот атрибут выполняет различные функции
Атрибут classid задает программу или объект, которые могут использоваться в определенных элементах.
Атрибут style может использоваться со многими элементами. Он предназначен ятя определения формата конкретного элемента и может принимать самые разные значения.
Похожие функции выполняет атрибут class. Его можно указывать, если в секции HEAD расположен элемент STYLE или использована ссылка на каскадную таблицу стилей (см. ниже раздел «Таблицы стилей»).
Атрибут align используется для выравнивания текста, объектов или элементов целиком. Выравнивание может выполняться относительно границ окна, рамки таблицы и т. д. Каждый элемент позволяет указывать определенные значения для этого атрибута. В общем случае значения могут быть такие:
• left - выравнивание по левому краю;
• right - выравнивание по правому краю;
• justify - выравнивание по ширине (для текста);
• center - выравнивание по центру (по горизонтали):
• middle - выравнивание по центру (по вертикали):
• top - выравнивание по верхней границе;
• bottom - выравнивание по нижней границе.
Атрибут lang определяет, на каком языке набран текст внутри текущего элемента: lang - «код языка»
Атрибут dir теоретически может использоваться в разных элементах, но не все броузеры обеспечивают его работу.
Форматирование текста. Текст - единственный объект Web-страницы, который не требует специального определения. Иными словами, произвольные символы интерпретируются по умолчанию как текстовые данные. Но для форматирования текста существует большое количество элементов. Большинство из них, кроме специальных, поддерживает стандартные атрибуты: id, class, lang. dir, title, sty le и атрибуты событий.
Изначально в HTML было введено меньше возможностей для форматирования текста, чем в обычные текстовые редакторы. В результате авторам гипертекстовых документов приходилось прибегать к различным ухищрениям, чтобы придать тексту заданный вид. Сейчас положение изменилось, но все дополнительные возможности осуществляются за счет применения таблиц стилей. Например, только с помощью свойства text-indent можно задать величину отступа первой строки абзаца.