Cправочник web-дизайнера / Lab
.htmMy home page Методические указания к лабораторным и практическим работам Общие положения Курс лабораторных работ по дисциплине "Современные информационные технологии" предназначен для получения первичных практических навыков работы в локальных и глобальных компьютерных сетях и является способом закрепления теоретических знаний, полученных студентами на лекциях и в процессе самостоятельной работы.
Цель лабораторного практикума Помочь студенту овладеть навыками работы в сети Internet и освоить принципы создания документов и приложений для Internet.
В результате выполнения лабораторного практикума студент должен УМЕТЬ:
Использовать различные ресурсы сети Internet: электронную почту, телеконференции, информационные серверы, World Wide Web;
Создавать несложные HTML-документы;
Включать в HTML-документы фрагменты, созданные на языке JavaScript.
Содержание и объем подготовки Теоретические знания студент получает на протяжении семестра на аудиторных занятиях и в процессе самостоятельной подготовки. Методические рекомендации по выполнению каждой лабораторной работы изложены в настоящем Руководстве.
Материалы по лабораторным работам студент оформляет в виде отчетов на бумажных или магнитных носителях (дискетах). Защита лабораторных работ проводится во время итоговых занятий по теме и курсу дисциплины. Требования к отчетному материалу и контрольные вопросы приведены в методических разделах по каждой теме лабораторных работ.
Темы лабораторных занятий по курсу сведены в таблицу 1.
Номер темы по курсу дисциплины Тема лабораторной работы Количество учебных часов 1 Взаимодействие между пользователями в сети. Работа с броузерами WWW. 6 2 Создание документов HTML. 12 3 Разработка программ на JavaScript. 12 4 Защита лабораторно-практических работ 2 Всего 32 Лабораторная работа №1 Тема: Взаимодействие между пользователями в сети. Работа с броузерами WWW.
Цель:Получить практику работы с сетевыми приложениями и броузерами WWW.
Время:6 часов.
Место проведения:лаборатория ВТ.
Содержание заданий и порядок их выполнения 1. Зарегестрироваться в сети используя Login и Password по указанию преподавателя.
2. Загрузите Web-броузер.
3. Просмотрите с помощью броузера:
локальный диск ПК;
диск файл-сервера;
ресурсы orld Wide Web, указанные преподавателем;
создайте почтовое сообщение (отправка по указанию преподавателя);
распечатайте (сохраните в файл) ресурс Web по указанию преподавателя.
4. Завершите сеанс связи (работы в сети).
Контрольные вопросы Порядок регистрации и освобождения сети.
Оконный интерфейс Web-броузера.
Использование Web-броузера для навигации по диску и ресурсами Internet.
Методические указания Войдите в сеть и загрузите Netscape Navigator. Введите в поле ввода URL-адрес в формате:
File:///Диск\/путь/имя файла.
Для перемещения между документами используйте манипулятор мышь, кнопки на панели инструментов имеют следующий символ:
Кнопка Действия Back Возвращает к предыдущему документу Forward Переводит к следующему документу из списка, уже просмотренных в текущем сеансе работы Home Переход к домашней странице Reload Перегрузка текущего документа Images Загрузка встроенных в документ изображений Open Вызывает окно диалога для ввода URL-адреса документа Print Печать текущего документа Find Поиск строки в текущем документе Stop Останавливает процесс загрузки доумента Пользователь сети может иметь следующие права на работу с файлами и каталогами.
Право доступа Позволяет пользователю Read Считывать файлы (запускать программы) Write Записывать в существующие файлы Create Создавать файлы Erase Удалять файлы Access control Права администратора каталога File sean Просматривать список файлов каталога Modify Изменить атрибуты и имена файлов Supervisor Права администратора сети Сетевая операционная система делает разделение ресурсов безопасным и упрощает работу в сети. На IBM совместных компьютерах диски файлового сервера выглядят также, как и собственные локальные. В большинстве случаев обозначение дисков сервера начинается с буквы F. Можно создать сценарий входа (login script), который при входе в систему будет автоматически создавать нужные обозначения. Для работы с файлами и каталогами на дисках файлового сервера можно использовать почти стандартные команды DOS.
Каталоговая система локальной сети (например, NDS - Netware Directory Services) обеспечивает способ организации сетевых ресурсов (файловых серверов, дисковых томов, сетевых принтеров) таким образом, чтобы их можно было легко найти и использовать. База данных NDS в Netware отображается в виде дерева каталогов (Directory Tree). Как правило, она организуется так, чтобы соответствовать структуре предприятия. Верхний уровень иерархии называется корневым каталогом или корнем (root). Под ним находятся каталоги, содержащие файлы и подкаталоги.
Корневой каталог обозначается пиктограммой планеты Земля. Все сетевые ресурсы называются объектами (Objects). Для упорядочивания списка объектов создаются специальные типы объектов - контейнеры (container object), предназначенные для группировки взаимосвязанных объектов.
Серверы, пользователи, принтеры и дисковые тома в дереве каталогов именуются листьями (leaf object). Кроме списка самих контейнеров и листьев NDS хранит информацию об этих объектах, т.е. атрибуты и свойства (properties) объектов. Атрибуты пользователя могут включать, например, его полное имя, почтовый адрес и номер телефона.
Сервер локальной сети выполняет четыре категории функций: разделение диска, управление коммуникацией, обеспечение основных функций операционной системы и запуск программ на сервере.
Главный ресурс файлового сервера - разделяемое дисковое пространство. Сервер позволяет рабочим станциям с разнородными файловыми системами использовать совместно пространство одних и тех же дисковых томов. На сервере могут храниться файлы рабочих станций DOS, Windows, UNIX, OS/2. Эта задача решается за счет использования пространства имен (name spaces). Программные модули сетевой ОС (например, Netware), запускаемые на сервере, расширяют его файловую систему для стыковки с системами именования файлов, отличными от DOS.
Большинство серверов могут работать практически с любой существующей коммуникационной топологией, причем один сервер может иметь различные типы сетевых адаптеров. Если на сервере расположены два и более сетевых адаптера, подключенных к разным сетям, то сервер может работать в качестве маршрутизатора - связующего звена между сетями. При этом, сетевая операционная система может использовать различные коммуникационные протоколы, (например, серверы Netware) по умолчанию пользуются протоколами IPX/SPX, но можно установить и ICP/IP и AppleTalk.
Сервер позволяет различным типам рабочих станций разделять общее дисковое пространство и выступает в роли общего коммуникационного пункта, посылающего и принимающего пакеты от различных рабочих станций. Управление функциями сервера осуществляет сетевая операционная система.
Операционная система не обязательная единственная программа, работающая на сервере. На нем могут быть запущены и другие программы, расширяющие его возможности и добавляющие новые средства. Это особый тип программ, т.н. загружаемые модули (например, для Netware - NLM (Netware Loadable Modules)). Каждый модуль обеспечивает выполнение широкого набора функций, например, управление БД или антивирусную защиту.
Лабораторная работа №2 Тема: Создание документов в HTML.
Цель: Освоить создание гипертекстовых документов с помощью HTML.
Время:12 часов.
Место проведения:лаборатория ВТ.
Содержание заданий и порядок их выполнения В результате лабораторной работы по данной теме стедент должен создать гипертекстовый документ с помощью HTML, предоставляющий собой презентацию (домашнюю страницу). Тематика HTML-документа определяется пользователем самостоятельно. Для этого необходимо выполнить следующую последовательность заданий.
№ задания Задание Расчет учебного времени (час) 1 Разработать и набрать текст документа, отформатировать его средствами HTML. 4 2 Ввести в HTML-документ интерактивные формы. 2 3 Добавить в документе элементы графики 2 4 Разместить в HTML-документе локальные ссылки 2 5 Оформить отчет и защитить лабораторную работу 2 Всего 12 Примерное содержание HTML-документа Создать Web-страничку, предоставляющую Машиностроительный техникум ПГТУ.
Заглавная страница должна содержать: название вуза, адрес, элементы графического оформления и ссылки на другие страницы документа, отражающие следующую информацию:
перечень и краткая характеристика специальностей, по которым проводится обучение в МТ ПГТУ;
правила приема и расписание работы приемной комиссии;
характеристику учебно-методической базы техникума со ссылками на видовые картинки лабораторий, спортплощадки и т.п.
Создать презентацию художественной выставки в картинной галерее им. Куинджи
Заглавная страница должна содержать: название и адрес галереи, название выставки, переход на страницы документа отражающие следующую информаци:
сведения о художниках, принимающих участие в выставке;
описание экспозиции картин и их отображение;
общую информацию о картинной галерее и план мероприятий на 1 квартал 1999 г.
Создать Web-страничку коммерческого предприятия, занимающегося продажей и обслуживанием вычислительной техники.
Заглавная страница должна содержать название и реквизиты фирмы, элементы графического оформления и ссылки на последующие странички со следующей информацией:
краткая характеристика фирмы и описание ее деятельности;
перечень товаров и услуг;
прайс-лист на компьютерную технику;
формы для заполнения заказа на поставку ВТ.
Создайте собственную домашнюю Web-страничку.
Заглавная страница должна содержать: фамилию, имя, отчество, фото, название и реквизиты фирмы, элементы графического оформления, адрес, телефон, ссылки на другие странички со следующей информацией:
образование и сфера интересов в области компьютерных технологий, общие личные сведения;
любимые виды отдыха и увлечения в свободное время;
ближайшие, а может и перспективные творческие, производственные, жизненные планы.
На заглавной странице поместите гиперссылку с адресом своей E-mail.
Создайте презентацию репертуара Мариупольского драматического театра.
На заглавной странице поместите: полное название театра, адрес, телефон, элементы графического оформления и перечень ссылок на следующие страницы с информацией:
краткая справка о театре, время работы театральных касс и начала спектаклей;
репертуар театра на следующий месяц;
презентацию (краткие описания) спектаклей;
представление актеров театральной группы.
Создайте Web-страничку "Центра занятости" Ильичевского (Жовтневого или др.) района г. Мариуполя.
На заглавной странице поместите название организации, адрес, телефон, элементы графического оформления, сделайте ссылки на адрес электронной почты, а также ссылки для перехода к другим страничкам со следующей информацией:
описание порядка регистрации безработных;
общие сведения по законодательству Украины о труде;
формы заполнения для регистрации на бирже труда.
Методические указания по выполнению Тема HTML-документа выбирается студентом самостоятельно. Содержание документа должно по объему и сложности задания соответствовать приведенным в Руководстве примером.
Для создания исходного текста документа используйте любой текстовый редактор Windows. Просмотр HTML-документа пролизводится с помощью броузера Netscape Navigator или Internet Explorer.
В качестве примера используйте демонстрационный HTML-документ, приложение к настоящему Руководству. Пиктограмма документа находится на рабочем столе Windows 95, сам документ загружается при включении Internet Explorer по умолчанию.
Требования к содержанию отчета Указать тему и цель выполнения лабораторной работы.
В разделе "Постановка задачи" описать содержание HTML-документа.
Привести исходный текст документа.
Лабораторная работа №3 Тема: Разработка программ на JavaScript.
Цель: Получить практику создания скриптов для обработки HTML-документов.
Время:12 часов.
Место проведения:лаборатория ВТ.
Содержание заданий и порядок их выполнения В результате выполнения цикла лабораторных работ по данной теме студент должен создать динамический HTML-документ с использованием сценариев, написанных на языке JavaScript. Общий план работы приведен в таблице:
№ п/п Задание Расчет учебного времени 1 Разработать схему включения сценариев в HTML-документ, разметить документ и отладить. 2 2 Создать сценарий с использованием стандартных объектов и свойств JavaScript в соответствии с заданием. 4 3 Подключить обработчик событий и отладить обработку документа 4 4 Оформить отчет и защитить лабораторную работу 2 Всего 12 Методические указания Используйте HTML-документ, созданный Вами во время выполнения лабораторной работы №2, или создайте новый, более подходящий к теме задания.
Формы HTML обеспечивают поддержку JavaScript, такие объекты, как поля ввода текста, контрольные переключатели, селекторные кнопки и поля списка, генерируют события JavaScript. Большинство тегов HTML рассматриваются как объекты.
Если в выполняемой программе на языке JavaScript обнаружена ошибка, выводится окно сообщений. Для продолжения работы нажмите кнопку OK и запомните строку программы, в которой произошла ошибка.
Поместите в HTML-файл контейнер <script>...</script> и поместите в него текст программы на языке JavaScript. После этого HTML-файл можно загрузить в броузер для просмотра результата работы.
Для совместимости с другими Web-броузерами текст программы на JavaScript следует помещать в контейнере <script>...</script> между тегами комментария <!--и-->.
Хотя данное требование и не обязательно, рекомендуется ставить точку с запятой (;) после каждого оператора JavaScript.0
В атрибутах обработки событий используйте одинарные и двойные кавычки вперемешку или ставьте перед одинаковыми кавычками символ "обратный слеж" (\).
Для просмотра и отладки программ используйте Netscape Navigator или Internet Explorer. Внимательно изучите контрольные примеры.
Объем заданий Разместить в Вашем HTML-документе сценарий на языке JavaScript:
Выводящий на экран часы реального времени и текущую дату.
Организовать бегущую строку, отражающую содержание документа.
Имеется 5 рекламных банеров. Нужно сделать так, чтобы при открытии странички случайным образом выбирался один из банеров, а при нажатии на него открывалась соответствующая ссылка.
Допустим, существует большой информационный сайт. Для облегчения навигации по нему необходимо сделать поиск по введенному слову. Для этого каждой страничке присваиваются ключевые слова для поиска.
На странице расположено несколько кнопок. Нужно, чтобы при наведении на кнопку (в виде картинки) мышкой:
кнопка изменяла свой вид (подсвечивалась, надавливалась, меняла размер и т.д.);
выводила в окне подсказку (например, в отдельном фрейме писала, что ожидает того, кто нажмет на эту кнопку).
Содержание отчета Указать тему и цель лабораторной работы.
В разделе "Постановка задачи" привести описание и алгоритм программы на JavaScript.
Исходный код JavaScript-программы с подробными комментариями.