Metod_rekomendatsii_po_HTML

Федеральное государственное бюджетное образовательное учреждение высшего профессионального образования

«Вятский государственный гуманитарный университет»

Т. Н. Исупова, Н. Л. Караваев

Компьютерные сети и Интернет

Методические рекомендации для студентов по выполнению лабораторных работ

Часть II

Киров

2012

Оглавление

3

Предисловие

Развитие информационного общества предъявляет принципиально новые требования к знаниям и умениям современного человека. Основой этого типа общества служит его информационно-техническая инфраструктура, одним из ключевых компонентов которой являются компьютерные сети. Именно они обеспечивают широкий набор информационно-вычислительных услуг с доступом к локальным и удаленным информационным ресурсам и технологиям. Это в свою очередь побуждает систему образования к формированию новой информационной и интеллектуальной культуры человека (независимо от сферы его деятельности), основанной на знании принципов функционирования компьютерных сетей и умении работать с локальными и глобальными сетями.

Благодаря дисциплинам «Компьютерные сети», «Интернет-технологии», а также другим курсам, пересекающимся с ними в содержании некоторых разделов, возможно целенаправленное формирование знаний, умений и навыков, необходимых для работы с современными компьютерными сетями, и прежде всего с глобальной информационной сетью Интернет как их закономерным проявлением. Лабораторные работы как одно из эффективных средств формирования и актуализации навыков студентов наиболее полно справляются с поставленной выше задачей.

Методические рекомендации составлены по программе дисциплины «Компьютерные сети, Интернет и мультимедиа-технологии», изучаемой на специальностях «Информатика», «Математика», «Физика» и др. Рекомендации также могут быть использованы как основной или дополнительный материал для изучения курсов: «Интернет-технологии» (специальность «Филология»), «Компьютерные сети» (специальности «История», «Торговое дело», «Экономика»), «Архитектура компьютерных сетей» (специальность «Бизнесинформатика»), «Новые информационные технологии» (специальность «Социология»), «Современные информационные технологии» (большинство специальностей) и др.

В силу разнообразия дисциплин, в рамках которых изучаются компьютерные сети и Интернет-технологии, а также различия количества часов, которые отводятся на изучение данной тематики в зависимости от специальности, было решено разделить все лабораторные работы на две части. Первая часть методических рекомендаций направлена на формирование базовых навыков и умений, необходимых современному специалисту для работы с электронными информационными ресурсами, в частности навыков управления информационными процессами: поиском, хранением и обработкой информации с использованием компьютерных и телекоммуникационных технологий. Вторая часть методических рекомендаций предназначена для знакомства с языком разметки гипертекста HTML (от англ. Hypertext Markup Language), который на сегодняшний день является основным средством разработки локальных информа-

4

ционных ресурсов, а также информационных ресурсов, размещаемых в глобальной сети Интернет.

Обе части методических рекомендаций состоят из двух разделов: 1) плана лабораторных работ, 2) инструкций по их выполнению – и библиографического списка. Прежде чем приступить к выполнению заданий, студенту необходимо самостоятельно изучить теоретические аспекты по теме лабораторной работы, опираясь при этом на список литературных источников, указанных для нее. После освоения теории студент может обратиться к инструкции по выполнению лабораторной работы. Следует сказать, что предлагаемые инструкции носят рекомендательный характер и могут не использоваться студентом в процессе работы, если он обладает достаточным уровнем знаний для решения лабораторных заданий. Результатом выполненных в рамках работы заданий служит созданный студентом HTML-документ, который является обязательным этапом выполнения лабораторной работы, на основании которого преподаватель оценивает работу студента.

5

1.План лабораторных работ

Вданном разделе представлены описания лабораторных работ. Для каждой работы указаны цель, приблизительное количество часов, необходимое для

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

По каждой лабораторной работе студентам необходимо сдать один или несколько HTML-документов в зависимости от заданий.

Лабораторная работа № 1

Тема: Структура и форматирование HTML-документа. Время: четыре академических часа.

Цель занятия: научиться создавать HTML-документы и форматировать их содержимое.

Литература: [1, c. 5–31; 2, с. 5–27; 3, c. 17–53; 4, с. 15–58; 5, c. 174–176; 6, c. 12–26; 7, c. 65–74].

Задания:

1. Ознакомьтесь с теоретическим материалом предложенных источни-

ков.

2.Изучите инструкцию для лабораторной работы.

3.Создайте HTML-документ formatting.html по предложенному образцу (рис. 1). Обратите внимание:

страница должна иметь левое, правое и верхнее поля, фоновый рисунок и заголовок «Лабораторная работа № 1 “Структура и форматирование HTML-документа”»;

заголовки должны быть оформлены с использованием соответствующих тегов;

заголовок «Возможности языка HTML» оформлен в виде бегущей строки красного цвета, движущейся слева направо и меняющей свое направление на противоположное при достижении края окна;

для определения значений цветов необходимо использовать Приложение I «Веб-палитра цветов»;

для вставки символов следует использовать коды специальных символов, приведенные в Приложении II «Таблица замены специальных символов»;

перечисления должны быть оформлены в виде соответствующих (нумерованных и маркированных) списков.

4.Покажите преподавателю созданный HTML-документ.

6

Рис. 1. Образец HTML-документа лабораторной работы № 1

Лабораторная работа № 2

Тема: Графика в HTML-документе. Время: два академических часа.

Цель занятия: научиться размещать графические элементы на вебстраницах и форматировать их.

Литература: [1, c. 31–36; 2, с. 28–34; 3, c. 55–69; 4, с. 96–125; 5, c. 177– 178; 6, c. 27–29; 7, c. 74–78].

7

Задания:

1. Ознакомьтесь с теоретическим материалом предложенных источни-

ков.

2.Изучите инструкцию для лабораторной работы.

3.Создайте HTML-документ pictures.html по образцу (рис. 2). Учтите:

страница должна иметь поля и заголовок «Лабораторная работа № 2 “Графика в HTML-документе”»;

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

для центрального рисунка во втором абзаце следует задать обрамляющую его рамку.

4.Покажите преподавателю созданный HTML-документ.

Рис. 2. Образец HTML-документа лабораторной работы № 2

8

Лабораторная работа № 3

Тема: Гиперссылки в HTML-документе. Время: два академических часа.

Цель занятия: научиться создавать и форматировать гиперссылки. Литература: [1, c. 37–41, 60–67; 2, с. 43–51; 3, c. 81–92; 4, с. 59–63; 5, c.

177; 6, c. 30–33; 7, c. 78–82].

Задания:

1. Ознакомьтесь с теоретическим материалом предложенных источни-

ков.

2.Изучите инструкцию для лабораторной работы.

3.Создайте HTML-документ links.html по образцу (рис. 3). Учтите:

страница должна иметь поля и заголовок «Лабораторная работа № 3 “Гиперссылки в HTML-документе”»;

страница содержит текстовые гиперссылки, ведущие:

на HTML-документы, подготовленные в лабораторных работах № 1 и 2;

официальный сайт ВятГГУ (http://www.vggu.ru), открывающийся в новом окне или новой вкладке;любой адрес электронной почты;

конец и начало текущего HTML-документа;

страница содержит графическую гиперссылку (баннер), ведущую на сайт ВятГГУ или любой другой сайт в сети Интернет;

каждая гиперссылка имеет соответствующую подсказку, появляющуюся при наведении на нее курсора мыши;

для текстовых гиперссылок цвета заданы следующим образом: непосещенные ссылки должны быть темно-синего цвета, активные ссылки – красного, посещенные – фиолетового.

4.Покажите преподавателю созданный HTML-документ.

Рис. 3. Образец HTML-документа лабораторной работы № 3

9

Лабораторная работа № 4

Тема: Таблицы в HTML-документе. Время: четыре академических часа.

Цель занятия: научиться использовать и форматировать таблицы для размещения в них содержимого HTML-документов.

Литература: [1, c. 42–59; 2, с. 35–42; 3, c. 70–80; 4, с. 78–95; 6, c. 34–39; 7, c. 83–91].

Задания:

1. Ознакомьтесь с теоретическим материалом предложенных источни-

ков.

2.Изучите инструкцию для лабораторной работы.

3.Создайте HTML-документ table.html по образцу (рис. 4). Обратите внимание:

страница должна иметь поля и заголовок «Лабораторная работа № 4 “Таблицы в HTML-документе”»;

для ячеек таблицы использовать цветной фон или фоновый рисунок и подходящий цвет текста.

4.Создайте мини-сайт по образцу (рис. 5), демонстрирующий возможности языка HTML, которые вы уже изучили. Учтите:

содержимое каждого из HTML-документов formatting.html, pictures.html, links.html, table.html, полученного в результате выполнения лабораторных работ № 1–4, следует разместить в таблицах размерностью 1 2;

основное содержимое страниц размещается в правой колонке таблицы, а меню сайта – в левой и представляет собой гиперссылки на соответствующие HTML-документы;

границы таблиц должны быть невидимыми.

5.Покажите преподавателю созданные HTML-документы.

Рис. 4. Образец HTML-документа лабораторной работы № 4

10