Информатизация инженерного образования (выпуск 1)

ПР И Л О Ж Е Н И Я

15.Ознакомьтесь с шаблоном. Если он Вас устраивает, щелкните на кнопке

. Ознакомьтесь с видом web-страницы Фотоальбом. Если она вас

устраивает, то еще раз щелкните на кнопке .

16. Щелкните на ссылке перейти в раздел «Управление файлами» (см. рис. П.6.1.15). В появившемся окне (рис. П.6.1.16) Вы увидите отображение файлов, только что созданных Вами в корневой папке Вашего сайта.

Итак, Вами созданы шесть отдельных web-страниц, три из которых были ранее сохранены в Вашей рабочей папке и три (главная, гостевая книга и фотоальбом) находятся в корневой папке Вашего сайта. Три web-страницы из Вашей рабочей папки следует загрузить на Ваш сайт.

17.Загрузите в корневую папку Вашего сайта три web-страницы из Вашей рабочей папки. Сначала в корневой папке файла следует создать папки для рисунков

ивспомогательных файлов каждой web-страницы. Для этого щелкните на ссылке Создать папку (рис. П.6.1.16).

18.Введите имя создаваемой папки (рис. П.6.1.17) для одной из web-страниц, в точности совпадающее с тем именем, которая она имеет в Вашей рабочей папке,

ищелкните на кнопке ОК. Подождите, пока на экране не вернется отображение страницы Управление файлами.

19.Аналогично создайте папки для рисунков и вспомогательных файлов двух остальных web-страниц.

20.Загрузите файл z11.htm и два остальных .htm-файла в корневой каталог сайта. Для этого щелкните на ссылке Загрузить файлы (см. рис. П.6.1.16).

21. Для загрузки каждого из трех файлов web-страниц из рабочей папки в появившемся окне (рис. П.6.1.18) следует щелкнуть справа от свободного поля

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

Рис. П.6.1.15. Главная страница сайта

734

П р и л о ж е н и е 6.1

. После этого произойдет загрузка файлов, которая требует некоторого времени. Следует дождаться сообщения об окончании загрузки и возвращения изображения исходного окна.

Теперь следует в соответствующие папки web-страниц загрузить файлы рисунков и вспомогательные файлы.

22. Для каждой из трех web-страниц следует совершить следующие действия. 22.1. Щелкнуть на ссылке Выбрать папку (см. рис. П.6.1.18), выбрать соответ-

ствующую папку и щелкнуть на кнопке .

22.2. Загрузить рисунки и вспомогательные файлы в выбранную папку из соот-

ветствующей папки web-страницы, пользуясь кнопками (см. рис. П.6.1.18). За один раз можно загрузить не более 10 файлов. Если загружаемых файлов больше 10, то загрузку придется выполнить в несколько приемов.

23. После окончания загрузки файлов в папки всех трех web-страниц, щелкните на ссылке Мастерская.

Рис. П.6.1.16. Страница Управление файлами

Рис. П.6.1.17. Создание папки

735

ПР И Л О Ж Е Н И Я

24.Теперь следует вернуться к главной странице, чтобы заполнить на ней ссылки на web-страницы. Для этого щелкните на ссылке Управление файлами и HTMLредактор.

25.Для перехода к редактированию главной страницы в открывшемся окне

(рис. П.6.1.19) щелкните на кнопке в строке index.html.

26.В открывшемся окне (рис. П.6.1.20) щелкните на ссылке Редактор по шаблону.

27.На экране отобразится шаблон главной страницы (см. рис. П.6.1.14). В этом шаблоне следует заполнить поля ссылок. В итоге Вам следует получить нечто, похожее на шаблон с полями ссылок, изображенными на рис. П.6.1.21. Каждая ссылка включает три расположенных в одну колонку поля, слева от которых соответственно записано: Выберите:, или введите:, Текст ссылки в поле Текст ссылки (в дальнейшем будем его называть полем текста ссылки) вводится произвольный текст, говорящий о содержании web-страницы. Этот текст будет виден посетителю Вашего сайта как ссылка, щелчок на которой откроет данную webстраницу. В поле или введите: (его в дальнейшем будем называть полем адреса ссылки) должен находиться адрес web-страницы. Поле Выберите: для web-стра- ниц, созданных по шаблону, позволяет заполнять поле адреса ссылки из списка

созданных по шаблону web-страниц, который раскрывается щелчком на кнопке , находящейся справа в поле Выберите.

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

.

Рис. П.6.1.18. Загрузка файлов в корневой каталог

736

Пр и л о ж е н и е 6.1

28.Сначала следует заполнить поля ссылок на гостевую книгу и созданный Вами по шаблону фотоальбом.

Начните с гостевой книги. Гостевая книга позволяет посетителю сайта сделать

вней запись, которую сможете видеть Вы, а также другие посетители Вашего

сайта. В разделе 1 ссылка кнопкой , расположенной справа в поле Выберите, раскройте выпадающий список и щелчком выберите в нем Гостевая книга. Поле адреса ссылки заполнять не нужно, адрес в нем появится автоматически. Поле текста ссылки также будет заполнено автоматически. Заполнение первой ссылки закончено.

29. Аналогично в разделе 2 ссылка заполните ссылку для фотоальбома (photoalbum.html).

Рис. П.6.1.19. Содержание корневого каталога сайта

Рис. П.6.1.20. Свойства файла

737

П Р И Л О Ж Е Н И Я

30. Теперь осталось заполнить поля трех ссылок на ранее созданные Вами и загруженные на сайт web-страницы, которые в рассматриваемом примере имеют имена z11.htm, z03.htm и z04.htm. Начните с web-страницы z11.htm. В разделе 3 ссылка введите адрес web-страницы z11.htm в поле адреса ссылки. В рассматриваемом примере следовало бы ввести http://student132.narod.ru/z11.htm. Вам же в этом адресе следует заменить часть адреса student132 на Ваш логин. В поле текста ссылки введите краткое название, отражающее содержание web-страницы.

31. Аналогично заполните поля ссылок для оставшихся двух web-страниц

и щелкните на кнопке . Вам будет предложено ознакомиться с созданной главной страницей сайта. Поочередно щелкните на ссылках и раскройте каждую из своих web-страниц. Если у Вас появилась необходимость продолжить

редактирование, то щелкните на кнопке , если же все в порядке, то щелкните на кнопке .

Рис. П.6.1.21. Пример заполнения ссылок

738

Пр и л о ж е н и е 6.1

32.В Вашем фотоальбоме еще нет фотографий? Поместите туда несколько штук. Если нет оцифрованных фотографий, в учебных целях подойдут любые рисунки, например из файлов mpei.jpg и foto.jpg, находящихся по адресу K:\FP\Inf\Кладовка. С этой целью приступите к редактированию web-страницы Фотоальбом. Для вставки каждой фотографии (рисунка) в фотоальбом, щелкнув

на кнопке , выберите соответствующий файл, щелкните на кнопке

, введите подпись под фотографией и щелкните на кнопке

. После этого следует немного подождать до появления фотографии (рисунка) в фотоальбоме. Завершите добавление фотографий щелчком на кнопке

. Ознакомьтесь с итоговым видом фотоальбома, если все в порядке,

Вы ведь записали адрес своего сайта? Для рассмотренного выше примера это http://student132.narod.ru. Адрес Вашего сайта отличается от этого только логином. Посмотрите также, как выглядит главная страница Вашего сайта. Проверьте, как работают все ссылки на web-страницах.

34.Отправьте из своего почтового ящика в ОСЭП сообщение Вашему преподавателю с адресом Вашего сайта и с приглашением его посетить.

35.Если Вы не рассчитываете дальше поддерживать свой сайт, то удалите его после того, как Вы получите ответ преподавателя с положительной оценкой Вашего сайта. Для этого в Мастерской перейдите по ссылке Удалить регистрацию.

Для тех, кто собирается в дальнейшем поддерживать свой сайт, в Мастерской имеется много средств, чтобы сделать Ваш сайт интересным и посещаемым. Например, Вы можете выставить свой сайт в каталог для посетителей сайта Народ.

36. Закончив работу по созданию сайта, удалите свою рабочую папку.

Дополнительные полезные средства сайта Народ. При создании сайта Вы, возможно, не пользовались некоторыми средствами, о существовании которых полезно знать. Речь будет идти о средствах работы с файлами и папками, которые доступны в разделе Мастерская \ Управление файлами. К ним относятся следующие средства.

1.Просмотр файла. Для просмотра файла следует щелкнуть на его имени.

2.Перемещение файла дереву каталогов. Если Вам требуется посмотреть содержание папки, то для этого следует щелкнуть на ее имени (см. рис. П.6.1.19). Например, если Вы щелкните на имени папки z03.files, то Вы сможете увидеть файлы, находящиеся в этой папке (рис. П.6.1.22).

Для выхода из открытой папки и перехода по дереву каталогов на один уровень

вверх следует щелкнуть на ссылке , которая расположена в левом верхнем углу окна слева от ссылки Корневая папка.

3. Удаление файла и папки, если она не содержит файлов. Для удаления файла (папки) его следует отметить флажком в окошке слева от имени файла (папки),

щелкнуть на кнопке (см. рис. П.6.1.19). Система потребует подтверждения Вашего намерения. В ответ следует еще раз щелкнуть на кнопке

739

П Р И Л О Ж Е Н И Я

и подождать сообщения системы о завершении выполнения удаления,

атакже подождать возврата в раздел Мастерская \ Управление файлами.

4.Копирование файла. Для копирования файла его следует отметить флажком в

окошке слева от имени файла, щелкнуть на кнопке (см. рис. П.6.1.22). В открывшемся окне (рис. П.6.1.23) следует выбрать папку, в которую Вы собирае-

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

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

Рис. П.6.1.22. Содержание папки z03.files

Рис. П.6.1.23. Выбор папки для копирования файла

740

Пр и л о ж е н и е 6.1

6.Переименование (описание) файла или папки. Для переименования (описа-

ния) файла (папки) следует щелкнуть на кнопке , находящейся в правой части строки с именем файла (папки). В открывшемся окне (см. рис. П.6.1.20) в левой колонке щелкните на ссылке Имя и описание. В открывшемся окне Управление именем и описанием переименуйте файл (папку). Если считаете полезным, то введите описание файла. Закончить переименование и (или) описание файла

следует щелчком на кнопке .

7. На сайте Народ есть каталог персональных сайтов. Если Вы хотите, чтобы Ваш сайт был доступен не только тем, кому Вы сообщили его адрес, его следует выставить в каталог. Для этого откройте свойства главной страницы сайта. В окне свойств выберите Каталог. В открывшемся окне Управление размещением страницы в каталоге выберите подходящую рубрику и щелкните на кнопке

.

8.Ваш персональный сайт может иметь более сложную структуру, по сравнению с рассмотренной в этом задании. Ссылки главной страницы index.html могут адресоваться к другим главным страницам (имеющим уникальное имя), которые

всвою очередь могут адресоваться к файлам или главным страницам следующего ниже уровня иерархии. Здесь под главной страницей понимается web-страница с оглавлением (ссылками).

9.Редактирование файла в HTML редакторе. Если в тексте web-страницы Вы обнаружили ошибку, то для ее устранения не обязательно заменять всю web-стра- ницу новой. Текст легко поправить непосредственно на сайте, открыв web-стра-

ницу в HTML редакторе. Для этого щелкните на кнопке , находящейся справа в строке с именем файла web-страницы. В открывшемся окне пролистайте HTMLкод файла, найдите нужный текст и отредактируйте его. Для сохранения отредак-

тированного файла щелкните на кнопке . Дождитесь сообщения о том, что сохранение завершено.

Для более глубокого редактирования достаточно иметь элементарное представление о правилах построения HTML-кода. При преобразовании текста с таблицами, ссылками и изображениями в HTML-код в него помещается служебная информация. Чтобы эта информация не смешивалась с основной, ее заключают в специальные скобки, роль которых играют теги. Тегом называются последовательности символов, которые управляют отображением текстовой или иной информации, но при этом не отображаются обозревателем. Большинство тегов используются попарно: <…> — открывающий тег, </…> — закрывающий тег.

Далее будут рассмотрены некоторые конструкции языка HTML, позволяющие отформатировать вводимый текст: Для выделения части текста жирным шрифтом, ее необходимо между тегами <B> и </B>. Например, необходимо выделить слова «Обратите внимание!» жирным шрифтом. Для этого в окне редактирования текста следует написать:

<B>Обратите внимание!</B>

В обозревателе это будет выглядеть:

Обратите внимание!

741

П Р И Л О Ж Е Н И Я

Чтобы отцентрировать участок текста его необходимо поместить между тегами <CENTER> и </CENTER>.

Например: <CENTER>Обратите внимание!</CENTER> Для выделения абзаца применяются теги <P> и </P>.

Чтобы поместить на страницу ссылку, используются теги <A HREF=«адрес нужной страницы»>Текст ссылки</A>.

Например, ссылка на сайт МЭИ выглядит следующим образом: <A HREF=«http://www.mpei.ru»>Сайт МЭИ</A>

Для вставки изображения применяются теги <IMG>, таблиц — тег <TABLE>.

Вопросы для контроля

1.Из каких компонентов состоит web-страница, сохраненная в Word в формате web-страница?

2.Каково назначение темы?

3.Как web-страница в отличие от документа соотносится с проблемой экономии бумаги?

4.Какие средства имеются в Мастерской сайта Народ для создания web-страниц?

5.Как по шаблону создается главная страница сайта?

6.Для создания каких web-страниц имеются шаблоны на сайте Народ?

7.Как выполнить загрузку файлов на сайт?

8.Как строится адрес корневой папки персонального сайта?

9.Как удалить файл из сайта?

10.Что произойдет, если Вы, находясь в разделе, Мастерская\Управление файлами, щелкните на имени web-страницы или на имени папки?

З а н я т и е 5 . П о р т а л М Э И ( Т У )

Интернет-портал МЭИ (ТУ) является его официальным представительством в Интернет. Основная задача портала — создание и поддержка единой среды для ежедневной работы студентов, аспирантов и сотрудников МЭИ (ТУ) со всевозможными университетскими ресурсами (базы данных и информационные системы) и информационными ресурсами Интернет. Часть ресурсов является закрытой для анонимного пользования из соображений безопасности и становится доступна только после подтверждения полномочий (прав доступа) на странице входа. Права доступа при входе на портал определяют набор сервисов и информации, доступных пользователю: часть из них доступна всем посетителям (общая информация о вузе, подразделениях и персоналиях), часть — всему контингенту МЭИ (ТУ) (правила внутреннего распорядка, шаблоны документов), часть — только сотрудникам (устав, приказы, положения, иерархический поиск сотрудников) и т.д.

1.Запустите обозреватель IE и откройте ссылку www.mpei.ru.

2.Для входа в систему щелкните на ссылке Вход или откройте вкладку Вход. Наберите в соответствующих полях логин и пароль, которые Вам были присвоены при регистрации в ОСЭП и нажмите кнопку Вход (рис. П.6.1.24).

Система должна Вас опознать и вывести в ответ страницу Профиль. Ознакомьтесь с ее содержанием. Обратите внимание, на этой странице предусмотрены следующие возможности:

742

П р и л о ж е н и е 6.1

•изменение пароля;

•редактирование личной информации;

•ознакомление со своим расписанием учебных занятий;

•выход из системы.

3.Откройте вкладку Главная. Внимательно ознакомьтесь с ее содержанием.

4.Ознакомьтесь с находящимися в разделе Обратите внимание ссылками. Ссылка Расписание открывает страницу, на которой можно ознакомиться с расписанием учебных занятий преподавателя. Ссылка Осенний семестр 2003 открывает станицу с календарным графиком учебного процесса.

5.Откройте вкладку Персоналии. Выполните поиск персоналии по Ф.И.О.

В списке персоналий для каждой из них присутствуют несколько ссылок (рис. П.6.1.25).

6.Откройте официальную информацию о персоналии. Обратите внимание, на состав представленных сведений о персоналии.

7.Откройте личную информацию.

8.Переход по ссылке Написать письмо создаст сообщение на указанный адрес.

9.Снова откройте вкладку Персоналии и выполните поиск персоналии по структуре. При поиске по структуре для раскрытия структуры следует нажать на

соответствующую кнопку , находящуюся слева от названия структуры (рис. П.6.1.26). Для сворачивания структуры следует нажать на соответствующую

кнопку .

10. Откройте список учебных групп по Вашему выбору любого курса института. Обратите внимание, Вам доступно расписание учебных занятий группы

Рис. П.6.1.24. Вход в систему

Рис. П.6.1.25. Вкладка «Персоналии»

Рис. П.6.1.26. Фрагмент структуры

743