- •Рекомендации по проведению занятий
- •1. Общие сведения о языке разметки гипертекста (html)
- •1.1. Структура html-документа
- •1.2. Знакомство с таблицами
- •1.3. Знакомство с графическими объектами
- •1.4. Создание gif-файлов
- •1.5. Цвета в html
- •2. Главное о форматировании текста
- •2.1. Заголовки
- •2.2. Шрифты
- •2.3. Начертание шрифта
- •2.4. Списки
- •2.5. Выравнивание и отступы
- •2.5.1. Выравнивание текста по левому или правому краю
- •2.5.2. Центрирование объектов
- •3. Работа c изображениями
- •3.1. Поля вокруг изображения
- •3.2. Фоновые изображения и фоновый цвет
- •4. Ссылки
- •4.1. Локальные ссылки
- •4.1.1. Ссылка - строка
- •4.1.2. Ссылка - изображение
- •4.1.3. Якорь и ссылка на него
- •4.2. Глобальные ссылки
- •5. Дополнительные возможности форматирования текста
- •5.1. Текст, обтекающий границы объекта
- •5.2. Отображение текста в одной строке (без переноса на другую строку)
- •5.3. Выделение абзацев с помощью списков определений и полей
- •6. Элегантные списки
- •6.1. Красивые нумерованные списки
- •6.2. Смена порядка нумерации в списке
- •7. Теги из разряда неосновных
- •7.1. Красивые толстые и тонкие горизонтальные линии
- •7.2. Вертикальная пунктирная линия с уменьшающейся длиной штриха
- •7.3. Ступеньки
- •7.4. Загрузка html-страниц
- •7.5. Показ html-тегов
- •8. Дополнительные возможности ms Internet Explorer
- •8.1. Бегущая строка
- •8.2. Прослушивание звуковых файлов
- •Задание 8.2.1. Используя документ bgsound.Htm как исходный, записать в рабочую папку файл bgsound1.Htm, в котором увеличить длительность звучания в два раза.
- •9. Дополнительные возможности Netscape Navigator
- •Библиографический список
- •Дорошев в.И., Хахаев и.А., Мошенский с.А. Работа в компьютерной сети internet. / Учебное пособие. Для студентов всех специальностей всех форм обучения. - Спб.: сПбТэи, 1998. - 32 с.
- •Климова р.Н., Сорокина м.В., Хахаев и.А., Мошенский с.А. Информатика торговой фирмы / Учебное пособие. Для студентов всех специальностей всех форм обучения. - Спб.: сПбТэи, 1998. - 32 с.
Министерство торговли Российской Федерации
-------------------------------------------------------------------------------------------------------------
САНКТ-ПЕТЕРБУРГСКИЙ ТОРГОВО-ЭКОНОМИЧЕСКИЙ ИНСТИТУТ =========================================================
Кафедра информатики
Подлежит возврату
Методические указания и задания
к практическим занятиям по теме
“Основы использования HTML”
Для студентов всех специальностей
всех форм обучения
Санкт-Петербург
1999
Составители:
- заведующий кафедрой информатики, кандидат физико-математических наук, доцент Хахаев И.А.,
- доцент Мошенский С.А.
Работа рассмотрена и одобрена на заседании кафедры информатики 15 января 1999 года (протокол №1-99)
В работе рассматривается одно из новейших средств информатики - язык HTML. Она предназначена для первоначального освоения студентами HTML и методов его использования при создании Web-сайта торговой фирмы. Учтен зарубежный опыт разработки сайтов.
Предполагается, что материал данной методички будет использоваться студентами во время практических занятий в компьютерных классах. При этом необходимо внимательно ознакомиться с излагаемыми сведениями и создать страницы сайтов, предлагаемые в тексте. Проработку студентами методички целесообразно проводить после посещения лекций по Internet и изучения пособий:
1)Климова Р.Н., Сорокина М.В., Хахаев И.А., Мошенский С.А. Информатика торговой фирмы / Учебное пособие. Для студентов всех специальностей всех форм обучения. - Спб.: СПбТЭИ, 1998. - 32 с;
2)Дорошев В.И., Хахаев И.А., Мошенский С.А. Работа в компьютерной сети INTERNET. / Учебное пособие. Для студентов всех специальностей всех форм обучения. - Спб.: СПбТЭИ, 1998. - 32 с.
Работа предназначена для студентов старших курсов всех специальностей всех форм обучения, а также для аспирантов и соискателей, получающих подготовку в области компьютерных технологий.
Рекомендации по проведению занятий
Данную работу можно эффективно использовать в электронном варианте. Текстовое пояснение материала при этом, во-первых, может сопровождаться графическим представлением сайта, более качественным (цветным, большим, четким), чем рисунок в брошюре. Например, в тексте имеется рис.1, которому соответствует файл ris1.htm. Текстовый процессор Word-7 позволяет в одном окне читать текст пособия, а в соседнем окне одновременно рассматривать сайт, используя соответствующий htm-файл. Если Word-7 отсутствует у пользователя, то можно читать текст посредством другой программы, а сайт одновременно рассматривать с помощью программы просмотра.
Во-вторых, некоторые рисунки просто нецелесообразно помещать в брошюру. Например, в пункте 7.2 рисунок представляет собой вертикальную пунктирную линию с уменьшающейся длиной штриха. Занимать полстраницы такой линией нелепо. Этот рисунок можно рассмотреть на дисплее, используя файл HR2.htm. В пункте 7.4 изучается страница сайта, загружающая другую страницу; брошюра не может реализовать перезагрузку, обеспечиваемую файлом refresh1.htm. Рисунок в пособии показал бы мгновенное состояние бегущей строки (пункт 8.1), а динамику движения может показать только дисплей. В пункте 8.2 рассмотрен файл BGSOUND.htm, обеспечивающий воспроизведение звука; естественно, что соответствующего рисунка в тексте нет.
В-третьих, изучение материала по электронным методическим указаниям включает в себя эксперименты. Эти эксперименты проводятся студентами во время практических занятий в компьютерных классах. Студенты знакомятся с излагаемыми сведениями и создают свои страницы сайтов. Для этого достаточно посредством текстового редактора Блокнот набрать и сохранить в рабочей папке соответствующий htm-файл. При дефиците времени можно текстовым редактором Блокнот прочесть из той папки, которая содержит данную методичку, готовый файл, например, ris1.htm, внести в него требуемые изменения и записать в рабочую папку новый файл с именем, например, ris1a.htm. Программа просмотра или Word-7 покажет результат эксперимента после чтения нового документа. Такая работа и является выполнением заданий на практическом занятии.
Задания на проведение экспериментов указаны в конце каждого пункта. Тексты заданий и документов, созданных при их выполнении, студенты записывают в свои тетради. Перед выполнением заданий в каждом пункте следует сначала внимательно прочесть этот пункт и понять последовательность действий, которые предстоит осуществить. Чтение удобно проводить при максимизированных размерах окна текстового процессора Word. Затем перед началом работы с текстовым редактором Блокнот следует уменьшить (“восстановить”) размеры окна текстового процессора Word. Это позволит одновременно видеть на дисплее и задание, и текст, редактируемый Блокнотом.
1. Общие сведения о языке разметки гипертекста (html)
Современные программы разработки Web-серверов, такие как MS FrontPage или Web Pen для Windows 95, дают возможность даже новичку без всякого штудирования учебников легко создавать готовые странички. При этом cпециалист по созданию Web-сайтов, называемый Web-мастером, берет готовые файлы (тексты, таблицы, графику, базы данных, звук, анимацию, видеофильмы, программы) и с помощью кнопок и команд меню оформляет страницы сайта. Подобные программы, выполняя команды инструментальных и операционного меню, формируют гипертекст WWW-сервера.
Исходные текстовые, табличные и графические и другие объекты включаются в Web-site посредством тегов (tag = ярлык, этикетка). Тег - это последовательность символов, задающая: 1)положение объекта на странице сайта, 2)внешний вид объекта или 3)связь данной страницы с другими страницами этого сайта, а также с любым другим сервером. Тег называют также управляющим маркером, флагом. Программы типа Web Pen сами расставляют теги, поэтому пользователь таких программ может не знать языка разметки гипертекста (HTML = HyperText Markup Language).
Знание HTML необходимо по пяти причинам. Во-первых, Web-мастер анализирует сайты фирм-конкурентов и просто удачные экземпляры WWW-серверов. Такой анализ, необходимый для совершенствования своего сайта, невозможен без знания языка разметки гипертекста. Во-вторых, совершенствование своего Web-сервера без полной его переделки (что долго и дорого) удобно производить путем ручной вставки и удаления объектов и тегов. В-третьих, HTML непрерывно развивается, поэтому программы типа MS FrontPage все время отстают от новейших возможностей языка. В-четвертых, не следует забывать о достаточно высокой стоимости таких программ. Наконец, в‑пятых, потратив деньги на приобретение программы, нужно еще потратить время на ее освоение.
Используя HTML, Web-мастер определяет структуру гипертекстового документа и вид каждой его страницы. HTML задает синтаксис тегов, в соответствии с которыми программа просмотра отображает содержимое документа: текст, изображения, таблицы и данные других типов. Cами теги программой просмотра не отображаются.
В HTML реализована поддержка механизма специальных гипертекстовых ссылок, которые обеспечивают связь данного документа с другими документами. Последние могут находиться: 1)на данном сайте, то есть в папке, содержащей все htm-файлы, графику, звук, анимацию, видеофильмы, программы; 2)вне сайта в других в папках на данном компьютере; 3)в системе World Wide Web, то есть на других Web-серверах; 4)в 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-файлы. Это необходимо для анализа и совершенствования готовых сайтов.
Рис. 1. Текстовый HTML-документ