АЛМАТИНСКИЙ ИНСТИТУТ ЭНЕРГЕТИКИ И СВЯЗИ

Кафедра инженерной кибернетики

ИНФОРМАЦИОННЫЕ ТЕХНОЛОГИИ

В ЭНЕРГЕТИКЕ

Программа, методические указания

и контрольные задания
для студентов специальности 210440 –
Электроснабжение заочной формы обучения

Алматы 2006

СОСТАВИТЕЛЬ: В. М. Тарасов. Информационные технологии в энергетике. Программа, методические указания и контрольные задания для студентов специальности 210440 – Электроснабжение заочной формы обучения. – Алматы: АИЭС, 2006. –26 с.

Представлена программа курса «Информационные технологии в энергетике», методические указания и задания для контрольной работы. Приведены основные сведения по языку создания web-сайтов HTML. Приведены примеры создания web-страниц на этом языке в приложениях блокнот и Word.

Рецензент: канд. физ-мат. наук, доцент М. У. Зияханов.

Печатается по плану издания Алматинского института энергетики и связи на 2006 год.

Содержание

Введение...................................................................................................................................... 6

1 Рабочая программа.............................................................................. 6

2 Содержание дисциплины..................................................................... 6

3 Установочные лекции.......................................................................... 7

4 Лабораторные работы......................................................................... 7

5 Индивидуальные задания к контрольной работе............................... 7

6 Указания к выполнению контрольной работы.................................... 8

7 Примеры выполнения web-страниц..................................................... 9

7.1 Создание простой web-страницы...................................................... 9

7.2 Форматирование текста. Гиперссылки............................................ 10

7.3 Домашняя страница......................................................................... 11

7.4 Создание простых таблиц............................................................... 12

7.5 Таблицы с объединенными ячейками............................................. 13

7.6 Создание фреймов........................................................................... 14

7.7 Создание HTML-документов в Word.............................................. 16

Приложение А................................................................................................ 24

Приложение Б................................................................................................. 26

Приложение В................................................................................................ 27

Список литературы............................................................................................................... 31

Введение

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

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

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

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

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

Объем курса: всего – 60 часов, аудиторных часов – 12, лекций – 4 часа, лабораторных работ - 8 часов, самостоятельных работ - 48 часов, 1 контрольная работа. Дисциплина изучается на пятом курсе.

1 Рабочая программа

Целью преподавания дисциплины является обучение студентов методике постановки, подготовки и решения задач на персональных компьютерах, связанных с новейшими информационными технологиями.

Основными задачами дисциплины являются:

- освоение студентами основных понятий современных информационных технологий;

- ознакомление с технологией создания документов для Internet;

- ознакомление с возможностями различного программного обеспечения для создания web-сайтов.

2 Содержание дисциплины

2.1 Как появился Интернет. Принципы работы Интернета. Система адресации в Интернете. Доменная система имен. Электронная почта. Сквозные шлюзы и протоколы. Доступ к Интернету. Личная свобода и частная собственность в Интернете. (4 часа).

2.2 Назначение языка HTML. Программы, применяемые для создания web-страниц и web-узлов. Браузеры. Сервер, сайт, домашняя страница. Кодировки русского и казахского языков. Транслит. Другие web-технологии (Java, CGL, SSI, Macromedia Flash, Xhtml). Web-хостинг. (4 часа).

2.3 Введение в web-дизайн. Необходимый инструментарий. Технологии web-дизайна. Логическая и физическая структура сайта. Домашняя страница. (5 часов).

2.4 Язык HTML. Теги и атрибуты. Регистр записи команд. Escape последовательности. Комментарии. Цветовые спецификации. Базовые теги разметки гипертекста. Элемент Font. Атрибуты тега Body. Заголовки. Списки. Гиперссылки. Закладки (5 часов).

2.5 Сетевые графические форматы. Оптимизация графических изображений. Включение графики в web-страницу. Gif анимация. (5 часов).

2.6 Мета определители. Формы и их элементы. Таблицы. Объединение ячеек. Фреймы. Назначение баннера. (5 часов).

2.7 Особенности создания web-сайтов в Word, Publisher, FrontPage. Шаблоны. Стили. Шаблоны для домашней страницы. (5 часов).

2.8 Поисковые системы. Каталоги. Составление запросов для поиска информации. Слова и символы для составления сложных запросов. Поиск картинок и фотографий. Регистрация в поисковых системах. (5 часов).

2.9 Системы «клиент - сервер». Кабельные каналы. Линии. оптоволоконные Беспроводные каналы. (5 часов).

2.10 Локальные сети Arcnet, Token Ring, Ethernet. (5 часов).

3 Установочные лекции

3.1 Понятие об Internet. Назначение языка HTML. Программы, применяемые для создания web-узлов. Назначение браузера и его настройка. История и принцип работы Internet. Протокол IP. (1 час).

3.2 Передача данных. Узел. Маршрутизаторы. Доменная система имен и IP адрес. Модемы. Оптоволоконный кабель. Доступ в Internet. Личная свобода и частная собственность в Internet. (1 час).

3.3 Кодировки символов. Транслит. Графические форматы. Оптимизация графических файлов. Поиск информации. (1 час).

3.4 Знакомство с сетями. Типы сетей. Топология сетей. Шлюзы. Другие web- технологии. (1 час).

4 Лабораторные работы

Перечень лабораторных работ приведен для выполнения в различных приложениях: блокноте, Word-97, Word-2002, Word-2003, Publisher, FrontPage. Первые 4-5 работ выполняются в блокноте, с целью изучения возможностей языка HTML. Поскольку в компьютерных классах или у студента может быть установлено различное программное обеспечение, то остальные лабораторные работы выполняются на том программном обеспечении, которое установлено. Конкретные работы выбираются из приведенного ниже перечня.

4.1 Лабораторная работа № 1. Основы языка HTML.

4.2 Лабораторная работа № 2. Форматирование текста. Гиперссылки.

4.3 Лабораторная работа № 3. Создание домашней страницы.

4.4 Лабораторная работа № 4. Простые таблицы. Таблицы сложные.

4.5 Лабораторная работа № 5. Фреймы.

4.6 Лабораторная работа № 6а. Создание web-страниц в Word-97.
Лабораторная работа № 6б. Создание web-сайта в Word-2002.
Лабораторная работа № 6в. Создание web-сайта в Word-2003.
Лабораторная работа № 6г. Создание web-сайта в Publisher.

4.7 Лабораторная работа № 7. Создание формы в Word.

4.8 Лабораторная работа № 8. Разработка персонального сайта на FrontPage.

4.9 Лабораторная работа № 9. Разработка web-сайта фирмы на FrontPage.

5 Индивидуальные задания к контрольной работе

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

Перед выполнением контрольной работы проработайте приведенные примеры выполнения web-документов.

Рекомендуемая последовательность выполнения работы:

1. Создайте домашнюю страницу по приведенному примеру, но для вашей фирмы или организации, в которой вы работаете.

2. Создайте web-страницу расписания в блокноте, согласно вашему варианту, приведенному в приложении Б, с надписями над и под таблицей.

3. Создайте остальные страницы, согласно вашему варианту контрольной работы.

4. Создайте web-узел с фреймами, состоящий из страницы с содержанием (с гиперссылками на другие страницы), домашней страницы и дополнительных страниц.

6 Указания к выполнению контрольной работы

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

Язык HTML (язык разметки гипертекста) используют для создания web-страниц, пересылаемых в сети Internet. Файлы web-страниц – это текстовые файлы, которые можно создавать с помощью любых текстовых редакторов, в том числе в блокноте, но сохраненный файл должен иметь расширение htm, чтобы программа просмотра файла браузер (например, Internet Explorer) могла правильно его отобразить на экране. Существует также много специальных редакторов для создания web-страниц.

Основы языка HTML составляют теги (или тэги), которые могут быть парными (открывающий и закрывающий) или непарными. Действие парных тегов и их атрибутов продолжается от открывающего тега до закрывающего тега. Непарный тег выполняется полностью сразу. Между парными тегами располагаются атрибуты тегов, информация или другие теги. Язык HTML не чувствителен к регистру символов тегов. Пробелы после угловой скобки “<” и перед скобкой “>” недопустимы.

Для художественного отображения текста применяются специальные команды форматирования. Изменение фона всей страницы определяется атрибутом bgcolor тега Body, например <Body bgcolor="Yellow"> . Текст также может быть цветным. Возникает вопрос о гармоничном сочетании цветов фона страницы и цвета текста. Для решения этой задачи в Internet распространяется бесплатная программа BGColor Wizard-216.htm. Она позволяет по выбранному цвету текста подобрать цвет фона просто передвижением мышки по предлагаемым цветам фона. Значения цветов палитры RGB высвечиваются в специальном поле.

О применении специальных редакторов

Применение специальных редакторов (Word, FrontPage, Publisher), с одной стороны, естественно ускоряет и упрощает процесс создания отдельных web-страниц, но в текст файла добавляется автоматически дополнительный код, часто не несущий никакой смысловой нагрузки. Дополнительный код увеличивается в геометрической прогрессии при повторном исправлении страницы в основном окне редактора. Кроме того, в текст файла добавляются мета команды, в которых записаны сведения, необходимые для поисковых серверов, например ключевые слова, а также много ненужных различных сведений, связанных с самой программой, которые следует удалить. Дополнительный код не отражается на внешнем виде страницы, но увеличивает время открытия файла по Internet, что крайне нежелательно. Генерацию части дополнительного можно отключить настройками редактора. Поэтому мастера при создании web-страниц, согласно литературным данным, либо просто все печатают в блокноте, либо, создав текстовой файл в специальном редакторе, стирают затем дополнительный код и большинство мета команд. Трудно сказать, что легче использовать блокнот или специальный редактор и затем стирать лишний код. Кроме того, в специальном редакторе нельзя создать многие эффекты, которые мастер хотел бы внести в web-страницу.

Специальный редактор - это интегрированная среда, предназначенная для создания и размещения web-сайтов, объединяющая в одной оболочке редактор web-страниц, модули управления структурой узла и инструменты публикации узла на сервере. Он обеспечивает построение web-сайтов любой сложности. Web-сайт представляет собой набор папок и файлов в формате HTML, связанных друг с другом гиперссылками. Один из файлов web-сайта назначается главным. Он представляет собой домашнюю страницу (home page) обычно с именем index.htm или home page.htm и открывается в браузере пользователя первым при подключении к web-сайту на одном из фреймов. Остальные web-страницы открываются на окне браузера по мере перехода к ним по гиперссылкам файла с оглавлением. Кроме файлов HTML, в состав узла входит набор графических объектов форматов gif, jpg или png, предназначенных для графического оформления страниц.

Отметим, что такие символы как табуляция, конец строки или несколько пробелов подряд браузер не воспринимает и заполняет открытое окно браузера текстом в соответствии с его шириной без учета этих символов. Несколько пробелов подряд можно ввести спецсимволами “ ” для каждого пробела, отступ тегом <blockquote>.

Внимание! Имена файлам следует давать информативные. Писать их предпочтительно маленькими латинскими буквами, без пробелов. Допустимы в именах цифры и знак подчеркивания. Это связано с тем, что существуют в Интернете операционные системы и программы, не поддерживающие русские буквы и чувствительные к регистру буквы. Вследствие этого возможны ошибки при работе небрежно написанных гиперссылок.

7 Примеры выполнения web-страниц

При изучении примеров смотрите назначение тегов и их атрибутов в приложении В.

7.1 Создание простой web-страницы

Откройте блокнот и напечатайте приведенный ниже текст.

<Html><Head><Title> Моя страница (Заголовок окна) </Title></Head>

<Body><H2> Структура нашего института </H2>

<Hr>

</Body></Html>

Создайте папку с указанием группы и фамилии и сохраните в нее созданный файл. Для первого сохранения файла выберите команду «Сохранить как…», в поле Тип файла выберите пункт Все файлы, затем напечатайте имя файла и добавьте через точку расширение htm, например aipet.htm, для вашего файла. Закройте блокнот и откройте свою папку. Если все правильно, то значок у файла должен получиться в виде большой голубой буквы «е», если такого значка нет, то переименуйте файл, правильно написав расширение.

Дважды щелкнув по имени файла, просмотрите его в браузере. Так он будет выглядеть в Интернете. Выбрав в браузере команду Вид – Просмотр HTML кода, вы вновь увидите свой файл, отображенный в блокноте. Продолжите создание web-страницы в блокноте, дополняя текст файла между тегами <Body> и </Body> текстом, приведенным ниже. После добавления каждой строки сохраняйте файл в блокноте командой Файл - Сохранить и, не сворачивая блокнот, перейдите в окно браузера, примените команду браузера Вид – Обновить (F5) для просмотра обновленного файла в нем. После просмотра вернитесь в блокнот для продолжения редактирования файла.

Такой порядок рекомендуется потому, что интерпретатор браузера обрабатывает файл по строкам. Если теги или их атрибуты записаны не верно, то сообщение об ошибках не выдается, а теги просто игнорируются.

<H3 Align="Center" > Факультеты нашего института </H3>

<br><P Align="Left"><font color="red"> Теплоэнергетический факультет

<br> Электроэнергетический факультет

<br> Факультет радиотехники и связи

<br> Факультет заочного отделения и переподготовки специалистов

</font></P><hr size="20" width="50%" color="#99ffaa" align="center">

7.2 Форматирование текста. Гиперссылки

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

<Html><Head><Title> Моя 2-я страница </Title></Head>

<Center> <H2> Форматирование текста </H2> </Center></Body></html>

Сохраните файл с именем format.htm в своей папке. Просмотрите его в браузере и продолжите набор следующих тегов, вставляя их между тегами <Body> и </Body>:

<B> Полужирный текст. Размер шрифта стандартный</B>

<Br><Center> <i> Наклонный текст, расположенный по центру окна </i></Center>

<Br> <U> Подчеркнутый текст, прижатый к левому краю </U>

<P align="right"><Font color="red"> Текст красного цвета справа </Font><Br><Font size="5" color="blue"> Размер этого текста на 5 кеглей больше стандартного </Font>

<Br><Font size="-5" color="green"> Размер текста на 5 кеглей меньше стандартного </Font></P>

<Br><Big> Это текст размера Big </Big>

<Br><Small> Это текст размера Small </Small>

<Br><Font Face="Arial"> Это текст выведен шрифтом Arial </Font>

</Body></Html>

Гиперссылка пишется с помощью следующего тега: <A Href= "имя_файла.htm"> Текст на гиперссылке </A>.

Для демонстрации гиперссылок создайте новый файл с оглавлением, состоящий из следующих строк:

<Html><Head><Title> Оглавление </Title></Head>

<A Href="aipet.htm"> Гиперссылка для перехода на страницу "Наш институт" </A>

<Br><Br><A Href="format.htm"> Гиперссылка для перехода на страницу "Форматирование текста" </A>

</Body></html>

Внимание! В гиперссылке при указании имени файла необходимо обязательно писать его расширение. Вместо текста "имя_файла.htm" следует писать имя реального файла из вашей папки.

Сохраните файл под именем index_1.htm, подобное имя является фактическим стандартом для файла с оглавлением. Имя файла в гиперссылку рекомендуется вставлять с помощью копирования имени в буфер обмена и вставки в текст файла. Для копирования имени файла его следует выделить, нажать на кнопку F2. Затем щелкнуть правой кнопкой мыши по имени файла и выбрать команду Копировать.

В файл aipet.htm и в файл format.htm добавьте после тега <Body> по строке:

<A Href="index_1.htm"> Гиперссылка для перехода на оглавление </A>

7.3 Домашняя страница

Наберите в блокноте текст домашней страницы личного web-сайта.

<html><head><title> Домашняя страница </title></head>

<H3> Здравствуйте! Это моя домашняя страница </H3></Marquee>

<br> <center> <font color="#CC0000"> Добро пожаловать на мою страницу! </font> </center>

Мне тоже захотелось создать свою домашнюю страницу для моих новых виртуальных друзей. Хочу, чтобы они могли посмотреть мою фотографию, и хочу рассказать о своих увлечениях и планах на жизнь. Мне 20 лет. Я учусь в Алматинском институте энергетики и связи на 4-м курсе, на энергетическом факультете.

</p> </body></html>

Когда файл будет отображаться правильно в браузере, после тега бегущей строки вставьте строку с гиперссылкой на файл aipet.htm: <A Href="aipet.htm"> Мой институт </A>

Сделайте возврат на домашнюю страницу из файла aipet.htm, включив в него гиперссылку:

<A Href="index.htm"> Гиперссылка для перехода на домашнюю страницу" </A>

Аналогично создайте гиперссылку на файл format.htm и возврат из него на домашнюю страницу.

Внимание! В гиперссылке для имени файла необходимо обязательно писать расширение и имя реального файла из вашей папки.

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

7.4 Создание простых таблиц

Таблица на web-странице - это основной элемент (сетка) для показа данных в строках и столбцах. Ячейки таблицы могут содержать любые HTML-элементы, такие, как заголовки, списки, абзацы, фигуры, графику. Границы ячеек и бордюр самой таблицы принимают нулевого размера. Это жестко фиксирует расположение информации в окне браузера, и страница смотрится одинаково при любом разрешении экрана и размерах окна браузера, говорят «не плывет».

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

В приложении блокнот создайте web-страницу для простой таблицы и сохраните этот файл с именем tab_1.htm в своей папке.

<html><head><title> Таблица </title></head>

<H2 align=”center”> Самая простая таблица</H2>

<tr> <th> Заголовок 1 столбца</th> <th> Заголовок 2 столбца</th>

<th> Заголовок 3 столбца</th> </tr>

<tr><td> Первая ячейка</td> <td bgcolor="green"> <br></Td>

<td> Третья ячейка</td> </tr>

<td> Четвертая ячейка</Td> <td>Пятая ячейка</td>

<td>Шестая ячейка</td> </tr>

<tr bgcolor="#bb9999"> <th> <h3>Заголовок строки</h3></Th>

<td>Седьмая ячейка</td> <td>Восьмая ячейка</td>

</tr></table></body></html>

Для просмотра результата нажмите кнопку Пуск, выберите Документы, щелкните в списке по названию только что созданного вами документа tab_1.htm. Этим автоматически вызывается браузер Internet Explorer, который откроет ваш файл. У вас должна получиться приведенная ниже таблица (цвета не показаны). Обратите внимание, что размеры ячеек определяются вставленным текстом или рисунком, поскольку жестко не задана ширина ячеек в пикселях.

У вас должна получиться таблица, показанная на рисунке 7.2.

Рисунок 7.2 – Простая таблица

7.5 Таблицы с объединенными ячейками

Наберите в блокноте приведенную ниже web-страницу, сохраните ее под именем tab_2.htm и проверьте через браузер.

<Html><Head><Title> Таблица </Title></Head>

<H2 align="center"> Сложная таблица (надпись по центру окна) </H2>

<Caption Align="Top"> Надпись над таблицей по ее центру </Caption>

<Caption align="bottom"> Надпись под таблицей </Caption>

<Td> Маленькая ячейка 1</Td> <Td> Маленькая ячейка 2 </Td> </Tr>

<Td> Маленькая ячейка 4 </Td> </Tr>

<Tr> <Td align="center"> Мал. ячейка С </Td>

<Td align="center"> Мал. ячейка D </Td>

<Th ColSpan="2"> Длинная ячейка в 2 столбца Е </Th> </TR>

</Table></Body></Html>

У вас должно получиться таблица, показанная на рисунке 7.3.

Рисунок 7.3 – Таблица с объединенными ячейками

7.6 Создание фреймов

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

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

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

Прямоугольная выноска: left

Web-страницы во фреймы открываются с помощью гиперссылок. Фрейм, в котором будет открываться страница, определяется значениями атрибута target. Например, target=“lower ”, где lower – имя фрейма, присвоенное ему при создании атрибутом Name=”lower ”.

Внимание! В атрибуте target различаются большие и маленькие буквы.

На рисунке 7.4 на выносках приведены присвоенные имена фреймов, которые нужно указывать в атрибуте target.

Для создания web-страницы с фреймами в блокноте наберите следующий текст.

<html><head><title> Фреймы </title></head>

</frameset> </html>

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

Создайте страницу с оглавлением, вставляя web-страницы, существующие в вашей папке, вместо страниц указанных ниже. В случае отсутствия подходящих файлов в вашей папке, создайте небольшие тематические страницы с именами файлов institut.htm, kadry.htm, nauka.htm и partnery.htm для демонстрации правильной работы фреймов.

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

<html><head><title> Содержание </title></head>

<H4> Cодержание </H4>

<a href="institut.htm" target="lower">Институт </a>

<br> <a href="kadry.htm" target="lower">Кадры</a>

<br> <a href="nauka.htm" target="lower">Наука</a>

<a href="partnery.htm" target="lower">Партнеры</a>

</body> </html>

Сохраните файл под именем index.htm в своей папке. Согласно этой программе по гиперссылке в оглавлении любая страница будет открываться во фрейме с именем lower.

Создайте страницу для баннера.

<html><head> <title>Баннер</title></head>

<h3> Нетрадиционные источники - будущее энергетики! </h3>

</body></html>

Сохраните под именем banner.htm этот файл в своей папке.

Если домашняя страница не существует, создайте ее имитацию.

<html><head><Title>Домашняя страница</title></head>

<H3 align=”center”> Здесь должна быть домашняя страница студента электроэнергетического факультета </H3></Font></p>

</body></html>

Сохраните файл под именем home_page.htm в своей папке.

7.7 Создание HTML-документов в Word

7.7.1 Создание web-узла с помощью шаблонов

Создайте web-сайт, содержащий следующие страницы: домашняя страница, наши достижения, наши сотрудники.

Создание домашней страницы

Домашняя страница предприятия создается на основе шаблона личная основная страница. В домашней странице используйте закладки (bookmarks) по аналогии с приведенным ниже образцом. Гиперссылки и закладки в шаблоне уже расставлены. Строки «Возврат в начало» служат гиперссылками для возврата в начало страницы на закладку «Оглавление» Выберите стиль и цвет текста. Строки страницы, имеющие текст, совпадающий с текстом в оглавлении, служат закладками. Созданные гиперссылки автоматически подчеркиваются. Выше оглавления вставьте бегущую строку «ЭНЕРГОПРОМ».

Ниже приведен примерный текст домашней страницы

Оглавление

Прямоугольная выноска: Ссылки на закладки в других частях этой же страницы Избранные ссылки

Адреса

Текущие проекты

Работа фирмы

Основное направление: производство и распределение электроэнергии.

Должность президента занимает Кречетов С.Т.

Основные обязанности фирмы - гарантированное качество отпускаемой электроэнергии.

Отдел сбыта работает с 9 до 18 часов.

Избранные ссылки

Вопросы и ответы

Наши сотрудники

Наши достижения

Прямоугольная выноска: Ссылка на закладку «Оглавление» Возврат в начало

Адреса

Адрес электронной почты aprom@almaty.kz

Адрес Интернета http://www.aprom.kz

Служебный телефон 786787

Возврат в начало

Прямоугольная выноска: Гиперссылки на другие страницы (не реализовано)

Текущие проекты

Среднеазиатская энергосистема

Реконструкция подстанции №453

Улучшение качества электроэнергии

Возврат в начало

Создание страницы наши достижения

Страница наши достижения выполняется на основе шаблона пустая страница. На странице напечатайте текст о создании и работе фирмы и вставьте рисунки с подписями. Пример приведен ниже.

Переход на домашнюю страницу

Наша фирма создана в 1990 году. В настоящее время она является ведущим предприятием энергоснабжения в Средней Азии…

Наш президент Микросхема защиты от К.З Наши печатные труды

Создание страницы наши сотрудники

Страница наши сотрудники выполняется на основе шаблона пустая страница. Создайте страницу, содержащую гиперссылку для перехода на домашнюю страницу и таблицу с данными о сотрудниках. Фотографии в таблицу вставляйте в формате jpg.

Переход на домашнюю страницу

Наши сотрудники

ФИО	Фото	Должность	Подразделение
Кунанбаев К.Т.	Вставьте фото	Вице-президент	Администрация
Серегин С.С.	Вставьте фото	Гл. энергетик	Энергетический

7.7.2 Создание web-узла с помощью мастера web-страниц

В Word 2002 после выполнения команд Файл – Создать, в окне Создание документа можно выбрать команду Мастер web-страниц.

Мастер, показанный на рисунке 7.5, поможет создать многостраничный web-сайт, дополненный средствами перехода, защитой и профессионально разработанным стилем (темой). Создадим web-сайт, содержащий фреймы, и следующие страницы: домашняя страница, наша деятельность, наши сотрудники, наш институт.

Команды создания страниц:

- команда Начало. Начало работы мастера;

- команда Размещение. Вводится название узла, например, Web_3. Мастер создает папку с таким же именем;

- команда Способ перехода. Выбираем способ размещения ссылок вертикальный, с двумя вертикальными фреймами (рамками). Этим самым выбирается место появления выбранных по гиперссылкам страниц в правом фрейме.

- команда Страницы. Удаляются или добавляются страницы по выбранным шаблонам. Программа предлагает следующие страницы: личная web-страница и две пустые страницы с именами новая страница 1, новая страница 2. Добавим новую страницу. Нажмем на кнопку Существующий файл и выберем файл про наш институт;

- команда Ссылки. Создаются гиперссылки на другие страницы. Выполняется переименование страниц. Переименуйте страницы: странице личная web-страница дайте название домашняя страница, странице новая страница 1 дайте название наши достижения, странице новая страница 2 дайте название наши сотрудники, файлу про институт дайте название мой институт;

- команда Тема. Выбирается художественное оформление страницы по шаблонам;

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

Далее программа предлагает шаблоны создания новых дополнительных рамок (фреймов). Новые рамки вставляются в ту рамку, в которой находится курсор. Для ввода рамки с эмблемой web-сайта установите курсор в левую рамку и вставьте фрейм сверху. Вставьте в него рисунок из файла. Кнопка Свойства рамки позволяет установить размер рамки в сантиметрах и цвет границ рамки. Установите их по собственному выбору. Закройте окно с рамками. Сохраните web-сайт.

Примерный вид разработанного web-сайта, показан на рисунке 7.6.

Приложение А

Состав web-сайта

Номера страниц	Наименование страниц	Номера страниц	Наименование страниц
1	Оглавление вертикальное	8	Текущие проекты
2	Оглавление горизонтальное	9	Наши услуги
3	Домашняя страница	10	Наши товары
4	Расписание	11	Как нас найти
5	Кадры	12	Наши филиалы
6	Наука	13	Абонентский отдел
7	Партнеры	14	Наши достижения

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

Содержание домашней страницы должно соответствовать деятельности выбранной фирмы, то есть род занятий фирмы определяет состав домашней страницы.

Расписание (четвертая страница) выполняется на один день расписания в соответствии с указанным вариантом, например 4-пн, то есть требуется выполнить расписание на понедельник.

Страницы сайта	Вариант контрольной работы
	1	2	3	4	5	6	7	8	9	10	11	12	13	14	15	16	17
	1	1	1	1	1	1	1	1	1	1	1	1	1	1	1	1	1
	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3
	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт
	5	6	7	8	9	6	7	8	9	5	7	8	9	5	6	8	9
	10	11	12	13	14	11	12	13	14	10	12	13	14	10	11	13	14

Страницы сайта	Вариант контрольной работы
	18	19	20	21	22	23	24	25	26	27	28	29	30	31	32	33	34
	1	1	1	1	1	1	1	1	2	2	2	2	2	2	2	2	2
	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3
	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт
	5	6	7	9	5	6	7	8	5	6	7	8	9	6	7	8	9
	10	11	12	14	10	11	12	13	10	11	12	13	14	11	12	13	14

Продолжение приложения А

Страницы сайта	Вариант контрольной работы
	35	36	37	38	39	40	41	42	43	44	45	46	47	48	49	50
	2	2	2	2	2	2	2	2	2	2	2	2	2	2	2	2
	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3
	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт
	5	7	8	9	5	6	8	9	5	6	7	9	5	6	7	8
	10	12	13	14	10	11	13	14	10	11	12	14	10	11	12	13

Страницы сайта	Вариант контрольной работы
	51	52	53	54	55	56	57	58	59	60	61	62	63	64	65	66	67
	2	2	2	2	2	2	2	2	2	2	2	2	2	2	2	2	2
	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3
	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт
	5	7	9	11	13	5	6	9	10	13	5	6	7	8	9	10	11
	6	8	10	12	14	7	8	11	12	14	8	9	10	11	12	13	14

Страницы сайта	Вариант контрольной работы
	68	69	70	71	72	73	74	75	76	77	78	79	80	81	82	83	84
	2	2	2	2	2	2	2	2	1	1	1	1	1	1	1	1	1
	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3
	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт
	5	6	7	8	9	10	5	7	9	11	13	5	6	9	10	13	5
	9	10	11	12	13	14	6	8	10	12	14	7	8	11	12	14	8

Страницы сайта	Вариант контрольной работы
	85	86	87	88	89	90	91	92	93	94	95	96	97	98	99	100
	1	1	1	1	1	1	1	1	1	1	1	1	1	1	1	1
	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3	3
	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт	4-пн	4-вт	4-ср	4-чт	4-пт
	6	7	8	9	10	11	5	6	7	8	9	10	5	7	9	11
	9	10	11	12	13	14	9	10	11	12	13	14	6	8	10	12

Приложение Б

Расписание

учебных занятий студентов 4-го курса ЭЭФ на 2-й семестр 2005/2006 уч. года

День	Время	Гр. ЭЭ-02-2	Гр. ЭТУС-02
Понедельник	13:20	ПЭС А430 Ст. пр. Утепов Т. Р.
			Н и ПД ЭТ А421 Проф. Сергиенко М. И.
	14:55	Охрана труда А427 Ст. пр. Нахимова Т.С.
	16:30	ЭО А421 Доцент Демиденко Л. И.
Вторник	14:55	Проектирование СЭС А421 Ст. пр. Утепов Т.Р.	ЭО А324 Доцент Базарбаев А.С.

	16:30	Экономика отрасли А423 Проф. Алтай-улы М.Т.

Среда	13:20	Светотехнические устройства А301 Ст. пр. Журавлева О. И.
		ЭО А421 Доцент Демиденко Л. И.	ИТ в Э А336 Ст. пр. Тарасов В. М.
	14:55	ИТ в Э А336 Ст. пр. Тарасов В. М.
			П ЭЛ и ЛУ А421 Проф. Сергиенко М. И.
Четверг	13:20	Иностранный язык А326, Б211, Б213
		Информационные технологии в энергетике А329 Ст. пр. Тарасов В. М
	14:55	П ЭЛ и ЛУ А421 Проф. Сергиенко М. И.	ЭО А421 Доцент Демиденко Л. И.

Пятница	13:20	СГ РЗ и АСЭС А329 Доц. Бурлибаев М. А.	ПЭС ЭТУС А301 Ст. пр. Утепов Т. Р.

	14:55	Перенапряжения в ЭУ Б219 Проф. Дмитриев И.А.
		У и ПД и Эт А421 Проф. Сергиенко М. И.

Начальник УМО ______________

Декан ЭЭФ ______________

Примечание - Парный тег <Pre> позволяет сохранить расположение текста так, как он написан в редакторе текста относительно края страницы: <pre>

Текст, написанный

лесенкой</pre>.

Приложение В

Краткий справочник по тегам

Align=”right” - выравнивание объекта по рамке окна или в параграфе. Варианты: left, center.

Бегущая строка

<Marquee>Бегущий текст</Marquee>

Атрибуты бегущей строки:

- direction=”right” – движение слева направо, вариант Left - движение справа налево;

- scroll - бесконечный цикл повторений;

- behavior=”slide”> - надпись или рисунок остаются на экране в виде слайда;

- bgcolor=”red” - фон текста бегущей строки.

Гиперссылки

<A name=”Prep”> Преподаватели </A> - невидимая закладка для ссылки у слова преподаватели.

<A href="имя файла" #Prep> Преподаватели </A> - в ссылке указано конкретное место файла (закладка), на которое будет переход по гиперссылке.

<A href=“Полное имя файла с рисунком, если файл рисунка не находится в текущей папке”>.

<Img src=“имя_рисунка.gif” ></A>. Если рисунок находится не в текущей папке, то приводится полное имя файла рисунка, но при написании пути наклон слеша должен быть обратным “/”.

<Blockquote>….</Blockquote> - отступ для блока.

<Body >Тело программы с информацией </Body> - тело страницы.

<Body bgcolor=”red-blue” - цвет фона страницы (background) можно задавать английскими словами или с помощью палитры RGB, см. пункт линия.

Background=”имя рисунка” - фон страницы типа обоев (рисунка).

Text=”blue” - цвет текста.

<Br> (Break) – перенос продолжения текста на новую строку.

<Center> Рисунок </Center> - расположение текста «Рисунок» по центру окна.

<Head> - после этого тега пишутся мета определители, которые не влияют на отображение страницы и являются служебной информацией.

<Title> Заголовок окна </Title>- заголовок окна браузера.

</Head> - конец заголовка.

<Hn> Список </Hn> - n меняется от 1 до 6. Стиль и размер заголовка, 1 максимальный размер.

Продолжение приложения В

Линия

<Hr align=”center” width=”80” – расположение линии в окне, длина линии в пикселях (можно указать в процентах, например 70% , от рамки окна программы).

Color=”red-blue” – цвет линии, заданный английскими словами.

Color= “#FF0099” – цвет линии, заданный палитрой RGB. Первые две шестнадцатеричные цифры обозначают интенсивность красного цвета, вторые – зеленого, третьи – голубого.

Текст

Атрибуты задания типа текста: <B> Жирный текст </B>, <I> Курсив </I>, <U> Подчеркнутый текст </U>.

<Font align=”center” color=”red” size=”±5”> - тег шрифта с атрибутами. Атрибут size указывает число пунктов (пункт равен 0,35 мм), на которые изменяется текст от стандартного размера в большую или меньшую сторону.

Списки

OL - нумерованный список (ordered list)

<OL start=”5” type=”1”>. Расшифровка атрибутов: start=”n” - заказ первого номера в списке, type=”1”> - для нумерации в списке выбраны арабские цифры. Если указать “A” или “a”, то нумерация будет латинскими буквами, если “I”, то римскими цифрами. Пример:

<Li> Провода

<Li> Кабель

</OL>

<UL - ненумерованный список (unordered list)

<UL type="circle"> вид маркера ненумерованного списка - окружность. Другие возможные варианты disk, square. Пример:

<Li Провода

<Li> Кабель

</UL>

Параграф

<P> Текст параграфа </P> - внутри параграфа действуют один раз указанные теги, например align=”center”. Выполняется выравнивание рисунков.

<Pre> Текст на нескольких строках с отступами </Pre> -текст, формат которого сохраняется в том виде, как написан в редакторе текста.

Продолжение приложения В

Таблицы

<Table>.. </Table> - теги начала и конца таблицы.

<Tr>..</Tr> - строка таблицы. <Td>..</Td> - столбец таблицы.

Cellspacin - расстояние между ячейками в таблице.

Рисунки

Рисунки вставляются тегом

<Img src=”http://www.belti.ru/Pic/Gruppa.gif”> Вставка рисунка из Интернета. Обратите внимание на наклон слеша!!!

<Img src="Risunki/Boss.gif"> Вставка рисунка из дочерней папки Risunki.

Align=”center” – расположение рисунка в параграфе по центру, варианты: middle, right, left, top, bottom.

Дополнительные атрибуты:

- width=”150”, height=”300” – указание размеров рисунка в пикселях;

- hspace= “20”, vspace=”30” - горизонтальный и вертикальный отступ текста от рисунка;

- border=”6” - размер рамки рисунка в пикселях;

- alt =”Текст, заменяющий рисунок при невозможности его открытия”.

Фреймы (деление экрана на области)

<Frameset cols=”200, *, 2*” > - деление окна браузера по вертикали.

<Frameset rows=”200, *, *” > - деление окна браузера по горизонтали.

Прямоугольная выноска: Заполнение фреймов файлами или рисунками <Frame src=”index.htm”>

<Frame src=”Kat.gif” marginwidth=30 marginheight=20> - этот фрейм заполнен рисунком, указано расстояние рисунка от границ рамки.

Список литературы

1. Велихов А. В., Строчников К.С., Леонтьев Б. Г. Компьютерные сети. – М.: Пресс, 2004. -320 с.

2. Едонский Ю.Е. Техника Web-дизайна. - М.: БХВ, 2005. –386 с.

3. Максимов Н. В., Попов И. И. Компьютерные сети. – М.: Форум, 2005. –336 с.

4. Олифер В. Г., Олифер Н. А. Компьютерные сети. - С-Пб.: Питер, 2001. -670 с.

5. Печников В.Н. Создание Web-сайтов без посторонней помощи.
– М.: Технический бестселлер, 2006. –460 с.

6. Холмогоров В. Основы Web-мастерства: Учебный курс. – М.: Питер, 2001. -350 с.

7. Якушина Е. Изучаем интернет. Создаем страничку. - М.: Питер, 2001. -255 с.

Сводный план 2005 г. поз 117

Виталий Михайлович Тарасов

ИНФОРМАЦИОННЫЕ ТЕХНОЛОГИИ

В ЭНЕРГЕТИКЕ

Программа, методические указания
и контрольные задания
для студентов специальности 210440 – Электроснабжение
заочной формы обучения

Редактор Сыздыкова Ж.М.

Подписано в печать _____________ Формат 60х84 1/16

Тираж 120 экз. Бумага типографская №1

Объем ____ уч. изд. л. Заказ _____ Цена тг.

Копировально-множительное бюро

Алматинского института энергетики и связи

050013, Алматы, Байтурсынова, 126