Разработка HTMLшаблона для создания учебных электронных ресурсов


Федеральное государственное бюджетное образовательное учреждение
высшего профессионального образования
«Алтайская государственная академия культуры и искусств»
Факультет информационных ресурсов и дизайна
Кафедра информатики
Разработка HTMLшаблона для создания учебных электронных ресурсов
Курсовая работа
по дисциплине « информационные технологии»
Выполнила:
Пустовалова И.А.,
студентка 2 курса
гр. ПИ-116

Научный руководитель:
Гриневич Л. А.,
к.п.н., ст. преподаватель
Работа защищена
«___» __________ 2013 г.
оценка _______________
г. Барнаул, 2013
СОДЕРЖАНИЕ
TOC \o "1-3" \h \z \u Введение PAGEREF _Toc355802670 \h 3ГЛАВА 1. ТЕОРЕТИЧЕСКИЕ ПРЕДПОСЫЛКИ И МЕТОДИЧЕСКИЕ ОСНОВЫ ЯЗЫКА ГИПЕРТЕКСТОВОЙ РАЗМЕТКИ HTML PAGEREF _Toc355802671 \h 61.1. Понятие, сущность и особенности языка гипертекстовой разметки HTML PAGEREF _Toc355802672 \h 61.2. Обзор основных возможностей языка разметки HTML PAGEREF _Toc355802673 \h 12ГЛАВА 2. РАЗРАБОТКА HTML ШАБЛОНА ДЛЯ СОЗДАНИЯ УЧЕБНЫХ ЭЛЕКТРОННЫХ РЕСУРСОВ PAGEREF _Toc355802674 \h 201.1. Алгоритм подготовки общей структуры комплекта презентационных материалов для создания учебного электронного ресурса PAGEREF _Toc355802675 \h 202.2. Разработка инструкции по сборке учебного электронного ресурса «Комплексная автоматизация библиотек» по готовому HTML шаблону PAGEREF _Toc355802676 \h 25Заключение PAGEREF _Toc355802677 \h 32Список использованной литературы PAGEREF _Toc355802678 \h 35Приложение PAGEREF _Toc355802680 \h 38ВВЕДЕНИЕАктуальность. Стремительное развитие информационного общества, появление и широкое распространение технологий мультимедиа, электронных информационных ресурсов, сетевых технологий позволяют использовать информационные технологии в качестве средства обучения, общения, воспитания, интеграции в мировое пространство.
Появление электронных ресурсов значительно ускорило процесс развития информационного общества. Развитие различных электронных технологий обеспечило миллионам людей возможность быстрого доступа к громадным информационным ресурсам, рассредоточенным по всей планете, обмен информацией, представленной в различных формах (текст, графика, видеоизображение, звук и т.д.) [2].
Основой всей Всемирной паутины является язык разметки гипертекста HTML. HTML – это стандартный язык разметки, который применяется практически для всех документов в сети Интернет. Он служит для логической разметки документа (веб-страницы) [13]. С момента создания и до сегодняшнего дня, HTML не только не потерял своей актуальности – он только расширяется, приобретая новые грани. Практически именно благодаря развитию гипертекста, большинство пользователей получило возможность создавать собственные мультимедийные продукты и распространять их. Такие информационные системы, выполненные в виде набора HTML-страниц, не требует разработки специальных программных средств, так как все необходимые инструменты для работы с данными (веб-браузеры) стали частью стандартного программного обеспечения большинства персональных компьютеров [10].
Таким образом, Создание собственных электронных ресурсов позволяет качественно улучшить информационное обслуживание пользователей. Разработка учебного электронного ресурса «Комплексная автоматизация библиотек» является источником актуальной информации в области библиотечного информирования. Данный ресурс будет представлять интерес как для студентов и преподавателей, так и для информационных и библиотечных работников.
Объект исследования. Язык гипертекстовой разметки HTML.
Предмет исследования. HTML шаблоны веб-страниц.Цель исследования. Создать учебный электронный ресурс «Комплексная автоматизация библиотек» по готовому HTML шаблону.
Задачи исследования:
изучить понятие, сущность и особенности языка гипертекстовой разметки HTML;
рассмотреть основные возможности языка гипертекстовой разметки HTML;
разработать инструкцию по сборке учебного электронного ресурса по готовому HTML шаблону;
создать учебный электронный ресурс «Комплексная автоматизация библиотеки» по готовому HTML шаблону.
Методы исследования. Для решения поставленных задач и обеспечения достоверности исследования применен комплекс общенаучных методов: метод сбора, анализа и обобщения документов, метод описания, операционно-технологический анализ.
Практическая значимость. Результатом курсовой работы является разработка инструкции по сборке учебного электронного ресурса «Комплексная автоматизация библиотеки» по готовому HTML шаблону, который будет использован в качестве учебного материала для студентов
Апробация материла. Основные положения исследования подготовлены в докладе на межвузовской научно-практической студенческой конференции.
Изученность. Разработка и создание собственных электронных ресурсов является особенно актуальным направлением на сегодняшний день. Обширна и литература, освещающая данную проблему, например «Основы Web – технологий», «Создание веб-страниц и веб-сайтов», «Практика разработки Web-сайта». Существенное значение для разработки технологий веб-страниц HTML внесли ученые А. Ю. Гаевский [5], М. В. Кузнецов [16], А. Петюшкин [23]. Также в рассмотрение основ HTML внесли свой вклад ученые В. В. Дунаев [10], Н. П. Кисленко [13], А. В. Матросов [19].
Принципиальное значение для изучения языка разметки HTML были представлены учеными Е. Мальчук [17], А. Пирамидин [24], Е. Л. Полонская [25], Н. В. Комолова [15].
Существенное значение для создания мощных инструментов, с помощью которых разрабатываются современные веб-приложения, представили авторы Р. Чебыкин [29], П. Б. Храмцов [29], Г. А. Брякалов [3].
Структура курсовой работы обусловлена целью и задачами и состоит из введения, двух глав, заключения, списка литературы и приложения.
В первой главе «Теоретические предпосылки и методические основы языка гипертекстовой разметки HTML» раскрываются понятие, сущность и особенности языка гипертекстовой разметки HTML, также произведен обзор основных возможностей языка разметки гипертекста.
Вторая глава «Разработка HTML шаблона для создания учебных электронных ресурсов» посвящена разработке HTML шаблона для учебных электронных ресурсов, построен алгоритм подготовки общей структуры комплекта презентационных материалов для создания учебного электронного ресурса и создана инструкция по сборке учебного электронного ресурса «Комплексная автоматизация библиотек» по готовому шаблону.
В заключение сформулированы основные выводы, характеризующие итоги проделанной работы.
ГЛАВА 1. ТЕОРЕТИЧЕСКИЕ ПРЕДПОСЫЛКИ И МЕТОДИЧЕСКИЕ ОСНОВЫ ЯЗЫКА ГИПЕРТЕКСТОВОЙ РАЗМЕТКИ HTML1.1. Понятие, сущность и особенности языка гипертекстовой разметки htmlHTML – язык гипертекстовой разметки документов (HyperText Markup Language). С помощью HTML создаются Web-страницы, которые находятся в глобальной компьютерной сети Интернет. HTML – это не язык программирования в традиционном смысле, он является языком разметки. С помощью HTML текстовый документ разбивают на блоки смысловой информации (заголовки, параграфы, таблицы, рисунки и т.п.) [14].
Язык гипертекстовой разметки HTML был предложен Тимом Бернерсом-Ли в 1989 году в качестве одного из компонентов технологии разработки распределенной гипертекстовой системы World Wide Web. Среди ключевых технологий, на которых держится современный Интернет, одной из важнейших является язык HTML, предназначенный для разметки и оформления документов World Wide Web [12].
Начало истории HTML следует отнести к далекому 1986 году, когда Международная организация по стандартизации (ISO) приняла стандарт ISO-8879, озаглавленный «Standard Generalized Markup Language (SGML)». Стандарт этот посвящен описанию SGML - обобщенного метаязыка, позволяющего строить системы логической, структурной разметки любых разновидностей текстов. Слово «структурная» означает, что управляющие коды, вносимые в текст, при такой разметке, не несут никакой информации о внешнем виде документа, а лишь указывают границы и соподчинение его составных частей, т.е. задают его логическую структуру.
Создатели SGML стремились максимально абстрагироваться от проблем представления электронного текста в разных программах, на разных компьютерных платформах и устройствах вывода. Так, если с помощью SGML размечается документ, содержащий заголовки, идеология языка запрещает указывать, что такой-то заголовок должен набираться шрифтом Times полужирного начертания кегля 12 пунктов. SGML в таком случае требует ограничиться указанием на уровень заголовка и его место в иерархической структуре документа.
Благодаря таким ограничениям размеченный текст сможет без труда интерпретировать любая программа, работающая с любым мыслимым устройством вывода.
SGML представляет собой не готовую систему разметки текста, а лишь удобный метаязык, позволяющий строить такие системы для конкретных обстоятельств. Стандарт SGML определяет лишь синтаксис записи элементов разметки - тегов, и их атрибутов, а также правила определения новых тегов и указания структурных отношений между ними. Для практической же разметки документов нужно приложение SGML - набор определенных в соответствии со стандартом тегов, представляющий собой, по сути, формальное описание структуры документа.
Создание языка SGML не было вызвано насущной практической необходимостью. Принципы, на которых строится этот язык, значительны и интересны; несомненно, идеология SGML оказала влияние на многие компьютерные разработки. Однако сам по себе SGML не получил заметного распространения, до тех пор, пока в 1991 г. сотрудники Европейского института физики частиц (CERN), занятые созданием системы передачи гипертекстовой информации через Интернет, не выбрали SGML в качестве основы для нового языка разметки гипертекстовых документов. Этот язык - самое известное из приложений SGML - был назван HTML (HyperText Markup Language, «язык разметки гипертекста»).
Изначально HTML, как и положено SGML-приложению, разделял все особенности идеологии SGML. Первым (и долгое время единственным) графическим браузером в те далекие времена была программа Mosaic, разработанная, как и сам WWW, в научном учреждении - Национальном центре суперкомпьютерных приложений США (National Center for Supercomputer Applications - NCSA). HTML развивался, оставаясь в рамках парадигмы структурной разметки, и в апреле 1994 г. началась подготовка спецификации следующей версии языка - HTML 2.0. Этим занимался образованный в том же году Консорциум W3 (W3 Consortium, сокращенно W3C), унаследовавший от CERN верховную власть и авторитет в мире WWW.
В настоящий момент консорциум, имеющий статус «международной некоммерческой организации», объединяет свыше 150 организаций-членов, в том числе фирмы Netscape, Microsoft и множество других. Однако в 1994 - 1995 гг. его членами были почти исключительно университеты и научные учреждения. Столь «академический» состав W3C сказывался как на самих документах, публикуемых консорциумом, так и на процедуре (и особенно на сроках) их принятия. Окончательный вариант HTML 2.0, единственным серьезным усовершенствованием в котором был механизм бланков (форм) для отсылки информации с компьютера пользователя на сервер, был окончательно утвержден лишь в сентябре 1995 г., когда в W3C уже полным ходом шло обсуждение HTML 3.0 («HTML+») [23].
Проект HTML 3.0 – самая яркая и неоднозначная страница в истории языка. Работа над ним началась в марте 1995 г., и первоначальный вариант стандарта включал в себя много интересных нововведений - теги для создания таблиц, разметки математических формул, вставки обтекаемых текстом рисунков, примечаний и др. Самое главное - HTML 3.0 был попыткой разрешить уже достаточно очевидное к тому времени противоречие между идеологией структурной разметки и потребностями пользователей, заинтересованных, в первую очередь, в гибких и богатых возможностях визуального представления. Чтобы разрешить это противоречие авторы версии 3.0 ввели в ней поддержку нового средства - так называемых иерархических стилевых спецификаций (Cascading Style Sheets, CSS) [15].
Система CSS формально независима от HTML, имеет совершенно иной синтаксис, не наследует никаких идеологических ограничений и позволяет, уже в совершенно иных терминах, задавать параметры визуального представления для любого тега HTML. С помощью CSS автор может указать, каким шрифтом, какого кегля набирать заголовки такого-то уровня. Самое важное было достигнуто не введением новых тегов, а разработкой механизма, позволяющего влиять на интерпретацию уже существующих тегов логической разметки, причем с учетом контекста его употребления. Браузеры с текстовым интерфейсом или с синтезатором речи смогут с легкостью проигнорировать эту дополнительную информацию и использовать для оформления свои обычные средства.
Слово «cascading» в названии системы CSS служит напоминанием о том, что в действительности на вывод каждого тега в документе могут оказывать влияние сразу несколько стилевых спецификаций, образующих иерархическую систему: например, поверх спецификаций, относящихся к конкретному документу, может действовать стилевой файл, общий для всех документов на сервере. Кроме того, пользователь браузера, поддерживающего CSS, может указать свои собственные параметры вывода для тех или иных тегов. Конфликты, которые при этом возникают, разрешаются в пользу более частных, узких спецификаций: то, что указано для конкретного документа, берет верх над спецификациями для всего сервера, а параметры вывода тега в данном контексте имеют преимущество перед параметрами для того же тега, без учета контекста. В случае же конфликта спецификаций, заданных пользователем, с установками автора страницы побеждают последние, хотя пользователь может при желании изменить эту ситуацию на обратную [4].
В начале 1994 г. группа разработчиков браузера Mosaic под предводительством Джеймса Кларка, который за несколько лет до того создал компанию Silicon Graphics, основала корпорацию Netscape Communications и вскоре выпустила первую версию коммерческого браузера Netscape (начиная с версии HTML 2.0 - Netscape Navigator). С этого момента начался экспоненциальный рост WWW, продолжающийся до настоящего времени. В конце 1995 г. Netscape объявила, что достигнутые результаты делают ее самой быстрорастущей компанией в мировой истории, чтобы закрепить лидерство и привлечь новых пользователей Netscape вводила в HTML все новые и новые усовершенствования, и эти усовершенствования поддерживались только браузером Netscape.
Практически все новые теги, в изобилии предлагавшиеся Netscape, были направлены на улучшение внешнего вида документа и расширение возможностей его форматирования [1].
В конце 1995 г. ситуация в мире HTML была довольно смутной. Популярность браузера Netscape неуклонно росла; программисты этой фирмы готовили к выпуску версию HTML 2.0, которая должна была утвердить господство Netscape на вечные времена благодаря неслыханному набору новшеств, таких как интерфейс подключаемых модулей, поддержка языка Java, встроенный язык сценариев JavaScript, возможность разбивки окна на кадры (frames) и многое другое. К этому времени W3C окончательно остановился в своем проекте HTML 3.0 , на завершение которого у консорциума не хватало ни сил, ни средств. HTML 3.0 по сравнению с HTML 2.0 был важным шагом вперед, однако он развивался по-прежнему в рамках идеологии структурной разметки, а инструмент, дающий возможность выйти за эти рамки, система CSS - был еще далек от завершения.
В первое время браузер Microsoft Internet Explorer, который тогда существовал в версии 2.0 и не представлял ничего значимого. Тем не менее, выпущенная летом 1996 г. версия Internet Explorer 3.0, которая поддерживала почти все расширения Netscape и обладала оригинальным и привлекательным интерфейсом очень быстро утвердилась в качестве «второго главного браузера». [17].
Проект HTML 3.0 был приостановлен, а вместо него в сжатые сроки создан стандарт HTML 3.2, который всего лишь описывает большинство расширений Netscape (их можно назвать теперь «расширениями Microsoft»). Главный вклад Microsoft в развитие HTML состоит в том, что Microsoft Internet Explorer 3.0 стал наконец-то, первым массовым браузером, поддерживающим стилевые спецификации (CSS) [17].
К выходу версии HTML 4.0 в 1997 году сотрудники W3C избавились от ненужных элементов, которые с появлением CSS стали устаревшими и компрометировали идею отделения разметки структуры от параметризации представления. Основное достижение рекомендаций HTML 4.0 - появление объектной модели страницы (Document Object Model, DOM), элементами которой теперь можно было манипулировать посредствам скриптовых языков программирования, исполняемых браузерами. Самым популярным таким языком программирования является JavaScript.
Объединение HTML, DOM и JavaScript равно Dynamic HTML или просто DHTML, который ознаменовал прорыв в веб-дизайне. Теперь элементы загруженной интернет страницы могли изменять свой внешний вид в ответ на действия пользователя, а также добавлять новые и удалять имеющиеся элементы. В 1999 году выходит последняя редакция версии HTML 4.0 языка разметки гипертекста - HTML 4.01 [19].
Версия HTML5 до сих пор еще не получила статус официальных рекомендаций W3C, авторы HTML продолжают работать в направлении разработки требований к поддержке объектной модели документа и интерпретации JavaScript. Хотя HTML 5.0 и получит ряд новых тегов большая часть рекомендаций все же касается поведения браузера в контексте работы DHTML: появится встроенная поддержка функций перетаскивания элементов (drag-and-drop), возможность рисовать на виртуальном полотне (canvas), управлять просмотром истории, обмениваться сообщениями между страницами, сохранять контекст исполнения и многое другое. Есть надежда, что с выходом новых рекомендаций HTML проблемы отсутствия кроссбраузерности, когда один и тот же JavaScript код исполняется под управлением разных браузеров по-разному, будут постепенно исчезать. Ведь тенденция определять требования к работе с объектной моделью и JavaScript будет сохраняться, а разработчики браузеров будут обязаны следовать этим требованиям.
Выход HTML 5.0 запланирован на 2014 году. Возможно, к тому времени W3C разработает отдельные рекомендации, касающиеся только программирования на JavaScript, а HTML со временем снова станет исключительно языком разметки структуры документа. На данный момент многие новые возможности HTML 5.0 уже сейчас поддерживаются наиболее популярными браузерами. Многое, что приходилось веб-дизайнерам раньше делать самостоятельно, с выходом HTML 5.0 будет поддерживаться на уровне браузера [29].
Таким образом, cтандарт HTML (HyperText Markup Language) был использован и используется в создании большинства сайтов, существующих в сегодняшнем интернет-пространстве. HTML не только не потерял своей актуальности – он только расширяется, приобретая новые грани.
1.2. Обзор основных возможностей языка разметки HTMLБольшинство веб-страниц создаются при помощи языка HTML. Язык HTML интерпретируется браузерами и отображается в виде документа в удобной для человека форме [26].
Разработчики HTML пытались решить две задачи:
▪ дать дизайнерам гипертекстовых баз данных простое средство создания документов;
▪ сделать это средство достаточно мощным, чтобы отразить имевшиеся на тот момент представления об интерфейсе пользователя гипертекстовых баз данных[14].
Базовые элементы языка HTML:
▪ форматирование текста;
▪ создание списков;
▪ связь с другими страницами;
▪ вставка изображений;
▪ форматирование информации в таблицы;
▪ связь с другими услугами Интернета, электронной почтой[1].
HTML-документ – это текст, состоящий из HTML-кодов и основного текста документа.
Особенности HTML-документа:
1. HTML-документ может содержать текст, графику, видео и звук.
2. В общем случае HTML-документ - это один или несколько текстовых файлов, имеющих расширение .htm или .html.
3. Создавать HTML-документ можно как с помощью специальных программ - редакторов HTML (например, FrontPage), так и с помощью любого текстового редактора (например, блокнота Windows).
4. Для просмотра HTML-документов существуют специальные программы-браузеры. Они интерпретируют HTML-документы, т.е. переводят текст документа в веб-страницу, и отображают ее на экране пользователя.
5. При интерпретации HTML-документа браузер не указывает, где расположена ошибка в HTML-документе, т.е. игнорируется и не отображается [9].
Каждый HTML-документ начинает и заканчивается с тега-контейнера <HTML>.

Рис 1 HTML-код
Документ состоит из двух основных блоков - «заголовка» и «тела документа». Заголовок определяется с помощью элемента HEAD, а тело - элементом BODY.
Заголовок содержит «техническую» информацию о документе, хотя чаще всего используется только для обозначения его названия.
Тело документа содержит информацию, которая отображается на странице: текст, картинки, таблицы [6].
HTML-документ состоит из элементов HTML.
Элемент HTML – это два тега (открывающий и закрывающий) и часть документа между ними. Кроме того, существуют элементы HTML, состоящие только из одного тега.
Тег – (в переводе с английского – «ярлык», «этикетка»). Тег определяет тип выводимого элемента HTML (например, заголовок, таблица, рисунок и т.п.). Тег не отображается браузером. Тег представляет собой последовательность элементов:
▪ символ левой угловой скобки (<) - начало тега;
▪ необязательный символ слева (/) - символ используется, чтобы обозначить закрывающий тег;
▪ имя тега;
▪ необязательные атрибуты в открывающем теге;
▪ символ правой угловой скобки (>) [10].
Атрибуты – необязательный набор параметров, определяющих дополнительные свойства элемента HTML (например, цвет или размер). Атрибут включает в себя:
▪ имя атрибута;
▪ знак равенства (=);▪ значение атрибута - строки символов, заключенные в кавычки [26].
Заголовок является необязательной частью структуры HTML-документа и служит для определения служебной информации и названия документа. В случае использования в документе контейнера заголовка <HEAD>...</HEAD> единственным обязательным его элементом является контейнер <TITLE>...</TITLE>, который задает имя документа. Именно это имя пользователь видит в заголовке окна браузера при просмотре веб-страниц в Интернете [25].
Элементы, относящиеся к заголовку документа:
HEAD - определяет начало и конец заголовка документа.
TITLE - определяет имя всего документа, которое отображается в заголовке окна браузера.
BASE - элемент <base> определен внутри контейнера <head> и инструктирует браузер относительно полного базового адреса текущего документа.
STYLE - используется для вставки в документ таблицы стилей CSS.
LINK - описывает взаимосвязь документа с другими объектами.
META - используется для вставки метаданных.
Фреймы (frames) используются для разбивки окна браузера на несколько областей, каждая из которых представляет собой отдельный HTML-документ (фрейм) [17].
Элементы для создания фреймов и работы с ними:
FRAMESET – определяет фреймовую (оконную) структуру документа: размеры и расположение фреймов на странице.
FRAME – определяет фрейм и его свойства внутри FRAMESET-структуры.
NOFRAMES – определяет что показывать, если браузер не поддерживает фреймы.
Скрипт – это программа, которая может сопровождать документ HTML или непосредственно быть внедренной в него. С помощью скриптов можно создавать анимированные кнопки меню, осуществлять автоматическое перенаправление на другие документы и т.д. Большинство скриптов пишется на языке JavaScript.
Элементы для работы со скриптами :SCRIPT – вставляет скрипт в HTML-документ.
NOSCRIPT – определяет текст, который будет отображен, если браузер не поддерживает скрипты [12].
Тело документа – создается с помощью элемента BODY. Указывает начало и конец тела HTML-документа. Между начальным и конечным тегами содержится текст документа, изображения и таблицы. Одним словом, все HTML-элементы, отвечающие за отображение документа, управление им и гипертекстовые ссылки. Элемент BODY должен встречаться в документе не более одного раза.
Текст, блоки текста.
Типичными примерами текстовых блоков являются параграфы, абзацы и главы. Для отделения одной части текста от другой также используются разделительные горизонтальные линии и символы возврата каретки.
H1,H2,...H6 - используются для создания заголовков текста.
P - используется для разметки параграфов.
DIV - отделяет блок HTML-документа от остальной его части.
ADDRESS - оформляет текст как почтовый адрес.
BLOCKQUOTE - оформляет текст как цитату.
BR - осуществляет перевод строки.
HR - вставляет в текст горизонтальную разделительную линию [14].
Форматирование текста - средства его изменения, такие как выбор начертания шрифта и использование эффектов, позволяющих менять вид текста.
Элементы форматирования текста:
BASEFONT - определяет основной шрифт, которым должен отображаться текст документа.
FONT - позволяет изменять цвет, размер и тип шрифта текста.
I - выделяет текст курсивом.
EM - используется для смыслового выделения текста (курсивом).
B - выделяет текст жирным шрифтом.
STRONG - усиленное выделение жирным шрифтом текст.
U - подчеркивает текст.
S, STRIKE - перечеркивает текст.
BIG - отображает текст увеличенным шрифтом.
SMALL - отображает текст уменьшенным шрифтом.
CODE, SAMP - оформляют текст как формулу или программный код.
CITE - оформляет текст как цитату или ссылку на источник[21].
Таблицы – элемент <table> служит контейнером для элементов, определяющих содержимое таблицы. Любая таблица состоит из строк и ячеек, которые задаются с помощью тегов <tr> и <td>.
CAPTION – задает заголовок таблицы. Содержание заголовка должно состоять только из текста. Использование блочных элементов в этом случае недопустимо.
TD и TH – элемент TD создает ячейку с данными в текущей строке. Элемент TH также создает ячейку, но определяет ее как ячейку-заголовок.
TR – создает новый ряд (строку) ячеек таблицы. Ячейки в ряду создаются с помощью элементов TD и TH [25].
Гипертекстовый документ – это документ, содержащий переходы (гиперссылки) на другие документы. При использовании гиперссылки происходит перемещение от одного документа к другому в Интернете. HTML-документ является гипертекстовым документом [20].
Гипертекстовые ссылки – являются ключевым компонентом, делающим веб-страницу интересной для пользователей. Гипертекстовые ссылки делают набор документов связанным и структурированным, что позволяет пользователю получать необходимую ему информацию максимально быстро и удобно.
Важнейшим свойством языка HTML является возможность включения в документ ссылок на другие документы и графические изображения. Ссылки на другие документы в HTML создаются либо с помощью элемента A.
Элемент A применяется, если ссылкой планируется сделать часть текста или целое изображение.
Для обозначения элементов документа (отдельных слов, фраз, изображений), содержащих гипертекстовые ссылки, используют термин «анкер» (anchor). Анкер в документе HTML задает ссылку на некоторый объект, в качестве которого может выступать:
какой-либо другой документ HTML;
любой файл, не являющийся документом HTML (изображение или любой двоичный файл, простой текст и т.д.);
некоторая точка в текущем документе HTML [18].
Списки в HTML бывают двух видов: упорядоченные (пронумерованные) и неупорядоченные (непронумерованные). Отличаются они лишь способом оформления. Перед пунктами неупорядоченных списков обычно ставятся символы-буллеты (bullets), например, точки, ромбики и т.п., в то время как пунктам упорядоченных списков предшествуют их номера.
UL - создает неупорядоченный список.
OL - создает упорядоченный список.
LI - создает пункт меню внутри элементов OL или UL.
MENU, DIR - создает неупорядоченный список, подобный UL.
DL - открывает и закрывает список определений.
DT - создает термин в списке определений внутри элемента DL.
DD - создает определение термина внутри элемента DL.
Формы. С помощью описанных ниже элементов можно создавать заполняемые анкеты, опросники и различные поля для ввода текста пользователем с возможностью последующей отправки заполненной формы на ваш сервер.
Элементы для создания форм
FORM - создает заполняемую форму.
TEXTAREA - создает поле для ввода нескольких строк текста.
SELECT - создает меню в заполняемой форме.
OPTION - создает отдельные пункты в меню.
INPUT - создает поле в форме.
Объекты – это графические и мультимедийные вставки в HTML-документ, такие как картинки, Flash-анимация, Java-апплеты, звуки, музыка, VRML.
IMG - используется для вставки в HTML изображений.
EMBED - используется для вставки в HTML различных объектов.
NOEMBED - используется, если браузер не поддерживает элемент EMBED.
APPLET - используется для вставки в HTML Java-апплетов [8].
HTML – это формат гипертекстовых документов, использующихся в WWW для предоставления информации. Формат этот не описывает то, как документ должен выглядеть, а его структуру и связи. Внешний вид документа на экране пользователя определяется программой просмотра веб-браузером. Если работать за графическим или текстовым терминалом, то в каждом случае документ будет выглядеть по-разному, но структура его останется неизменной, поскольку она задана форматом HTML. Имена файлов в формате HTML обычно имеют расширение htm, html, dhtml, shtml.
Таким образом, язык разметки гипертекста не только не потерял своей актуальности – он расширяется, приобретая новые грани. Стандарт HTML (HyperText Markup Language) был использован и используется в создании большинства сайтов, существующих в сегодняшнем интернет-пространстве. Благодаря разнообразным возможностям HTML: форматирование текстовой части: заголовков, таблиц, списков и других элементов, включение гиперссылок, указывающих на web-страницу, файл или другой объект, добавление изображений и многое другое осуществляется создание электронных ресурсов.

ГЛАВА 2. РАЗРАБОТКА HTML ШАБЛОНА ДЛЯ СОЗДАНИЯ УЧЕБНЫХ ЭЛЕКТРОННЫХ РЕСУРСОВ2.1. Алгоритм подготовки общей структуры комплекта презентационных материалов для создания учебного электронного ресурсаРазвитие Интернета кардинально меняет коммуникационные возможности людей. Но наиболее существенно воздействие глобальной сети на интеллектуальные сферы человеческой деятельности, на технологии  накопления и распространения знаний, на создание и использование учебных электронных ресурсов.
Учебный электронный ресурс – это совокупность средств, программного, информационного, технического и организационного обеспечения, в которой отражается предметная область, реализуется технология ее изучения для различных видов учебной деятельности [2].
Эффективность использования учебных электронных ресурсов в процессе обучения обеспечивается наличием следующих возможностей: мультимедийность; моделирование; интерактивность.
Мультимедийность – это возможность одновременного воспроизведения на экране компьютера и в звуке некоторой совокупности объектов, представленных различными способами. Степень адекватности представления фрагмента реального мира определяет качество мультимедиа продукта. Высшим выражением является виртуальная реальность, в которой используются мультимедиа компоненты предельного для человеческого восприятия качества: трехмерный визуальный ряд и стереозвук.
Моделирование – имитационное моделирование с аудиовизуальным отражением изменений сущности, вида, качеств объектов и процессов. Учебный электронный ресурс вместо описания в символьных абстракциях сможет дать адекватное представление фрагмента реального или воображаемого мира. С помощью компьютера можно имитировать множество действий, а на дисплее отображать те же результаты действий человека, что и в реальной действительности.
Интерактивность. В интерактивных учебных электронных ресурах содержание предметной области представлено конкретными объектами, которыми можно манипулировать, и процессами, в которые можно вмешиваться (например, лабораторный эксперимент, текущий контроль знаний с оценкой и выводами и др.).Результатом внедрения компьютерных технологий в образовательный процесс является расширение сектора самостоятельной работы студентов. Принципиальным новшеством в данном случае является интерактивность, позволяющая целесообразно использовать время на обучение. Поэтому замена текстового фрагмента с информацией на интерактивный контент способствует повышению качества организации учебного процесса.
Разработка учебных электронных ресурсов является объектом сложного процесса наукоемкого проектирования, успех которого определяется соблюдением основных требований.
Алгоритм подготовки учебного электронного ресурса «Комплексная автоматизация библиотек» является ключевым моментом производственного процесса разработки и создания.
Различия в подготовке учебного электронного ресурса прослеживается в семи технологических процессах:
1. Определение целевого и читательского назначения. Для традиционных учебных ресурсов читательское назначение определяется для конкретной группы читателя, а для электронных учебных ресурсов характерна нацеленность на расширенную читательскую аудиторию.
2. Выявление и отбор документов по необходимой теме. В учебном электронном ресурсе используется актуальная информация по данной теме. При подготовке презентационных материалов, являющихся результатом выполнения проекта, к публикации (размещению на компакт-диске или ином носителе), как правило, возникает проблема сборки этих материалов в единое целое и создания удобной пользовательской интерактивной оболочки.
Проще всего создать такую оболочку с использованием веб-технологии - язык разметки гипертекста HTML. При этом все презентационные материалы (презентации Power Point, графические и любые другие файлы, включая архивы и исполняемые программы) «подключаются» к этой оболочке, играющей роль «содержания», посредством гиперссылок.
Такой комплект из интерактивной пользовательской оболочки и презентационных материалов можно в дальнейшем переделывать и дорабатывать, а также разместить на веб-сайте для онлайн просмотра через сеть Интернет или на сервере учебного учреждения для просмотра материалов по локальной сети; записать на компакт-диск, в качестве раздаточного материала; распространять на любом носителе информации.
При создании подборки презентационных материалов, снабженной интерактивной пользовательской оболочкой, необходимо четкое распределение файлов в структуре папок. Желательно, чтобы собственно презентационные материалы располагались в отдельной папке. Общая папка всего комплекта презентационных материалов и оболочки пользователя нужна при распространении этих материалов на любых носителях, либо при размещении этого комплекта презентационных материалов в сети Интернет или на сервере локальной сети.
3. Подбор вспомогательных материалов, позволяющих оригинально оформить учебный электронный ресурс. В традиционных учебных ресурсах вспомогательные материалы разнообразны, представляются оригинальном виде или «твердых» копиях. Для электронного учебного ресурса обязательно наличие технических и программных средств, позволяющих подготовить ресурс. Вспомогательные материалы представляются в цифровом формате.
4. Выбор формы представления учебного электронного ресурса. В традиционных – статичная форма представления. В электронном учебном ресурсе появляется возможность использования новых компьютерных технологий, поддерживающих различные электронные форматы, в которых возможно использование анимации, звука, видео, гипертекстовых возможностей.
5. Разработка структуры учебного электронного ресурса. В традиционных учебных ресурсах структура и количество документов ограничены пространственными возможностями библиотеки. В электронных ресурсах появляется возможность использования гипертекста, то есть возможен выход на другие источники информации.
6. Оформление ресурса. В оформлении электронного учебного ресурса применяются возможности мультимедиа и гипертекста.
7. Анализ эффективности электронного учебного ресурса. Данный электронный ресурс можно разместить на веб-сайте для онлайн просмотра через сеть Интернет или на сервере учебного учреждения для просмотра материалов по локальной сети.
Проанализированные технологические процессы электронных и традиционных ресурсов, дают возможность выявить специфические различия и особенности их операционного наполнения, которые позволят составить алгоритм подготовки ресурса. Следует отметить, что особенно заметны различия в технологическом процессе оформления ресурса. Если традиционные ресурсы демонстрируют потребителю сами первичные документы, то электронные ресурсы экспонирует преимущественно вторичную информацию в цифровой форме с широкими возможностями оформления и навигации.
На основе вышеизложенного общего операционно-технологического анализа можно составить поэтапный алгоритм подготовки учебного электронного ресурса:
I. Разработка модели учебного электронного ресурса.Выбор темы.
Определение целевого и читательского назначения.
Поиск документов по теме «Комплексная автоматизация библиотек».
Выявление и отбор документов.
Разработка структуры электронного ресурса. Выбор формы представления.
II. Техническая подготовка проекта.
Составление характеристик по автоматизации библиотек.
Сканирование иллюстраций, набор текста, оцифровка других материалов.
III. Создание презентации ЭР в формате PowerPoint.
Размещение текста на слайдах.
Размещение иллюстраций и дополнительных материалов на слайдах.
Предварительный просмотр ресурса.
Исправление недостатков и допущенных ошибок.
IV. Анализ эффективности электронного ресурса.
Основная сложность составления алгоритма подготовки учебного электронного ресурса «Комплексная автоматизация библиотек» заключалась в том, что, в отличие от традиционных ресурсов, виртуальные - не обеспечены конкретным алгоритмом и четкими нормами времени на реализацию процесса. Известны лишь публикации описательного характера или общие рекомендации по созданию мультимедийных презентаций. В связи с этим, алгоритм, требования к учебному электронному ресурсу приходилось рассматривать через призму учебных и методических изданий подготовки электронных ресурсов.
Итак, точная последовательность действий, описывающих порядок выполнения исполнителем операций по подготовке учебного электронного ресурса, является важнейшей частью производственного процесса. Алгоритмизация определяет порядок, методы и средства решения конкретных технологических задач, эффективные способы достижения желаемого результата, которые значительно облегчают процесс создания учебного электронного ресурса.
2.2. Технология создания учебного электронного ресурса «Комплексная автоматизация библиотек» по готовому HTML шаблонуСоздать гипертекстовую интерактивную оболочку необходимо с помощью HTML-кода в текстовом редакторе «Блокнот». При этом можно неоднократно разработать структуру такой оболочки в виде своеобразного шаблона, чтобы далее лишь наполнять ее требуемым содержимым, в частности наращивать список гиперссылок («содержание»), а также изменять по своему желанию заголовок (название) и стартовую картинку – «заставку».
При создании подборки презентационных материалов, снабженной интерактивной пользовательской оболочкой, «хорошим тоном» считается четкое распределение файлов в структуре папок. Желательно, чтобы собственно презентационные материалы располагались в отдельной папке с именем Презентации (либо Проекты или каким-то другим, понятным и отражающим смысл находящихся в ней материалов; допустимо использовать в качестве имени такой папки само название темы проекта). Если презентационные материалы представлены единственным файлом (например, презентацией Power Point), то такие файлы непосредственно помещаются в папку Презентации, если имеются несколько файлов, то необходимо создать отдельную папку. Также в отдельной папке желательно размещать иллюстративные и другие вспомогательные файлы самой пользовательской оболочки [2].
Общая папка всего комплекта презентационных материалов и оболочки пользователя нужна только при распространении этих материалов на флеш-диске или ином подобном носителе, содержащем кроме этих материалов также и другие файлы и папки, либо при размещении этого комплекта презентационных материалов в сети Интернет или на сервере локальной сети (а также собственно в ходе работы над проектом, например его сборки и редактирования). Если же указанные презентационные материалы предполагается распространять на компакт-диске, то все содержимое этой «общей» папки размещается непосредственно в корневом каталоге компакт-диска (т.е. файлы index.htm и автозапуска должны располагаться на диске в корневом его каталоге, а не в какой-то папке), а имя этой «общей» папки записывается в качестве имени самого диска [2]. Далее, разработаем пользовательскую оболочку, которая сочетала бы в себе два на первый взгляд противоречащих друг другу качества:
1) возможность выбора интересующей презентации щелчком мыши на одной из представленных миниатюр (например, уменьшенных копий первого слайда каждой презентации);
2) при просмотре выбранной презентации – максимально возможный размер области просмотра, практически во все окно браузера.
Реализовать элемент управления сайтом, название которого «лента», и который должен работать следующим образом:
1. При просмотре выбранной презентации «лента» скрыта, просматриваемая презентация занимает весь экран. При окончании презентации открывается главная страница (рис. 2).

Рис. 2. Главная страница электронного ресурса
2. При щелчке мышью на кнопке раскрытия «ленты» она появляется внизу окна браузера (соответственно, размеры области, занятой ранее просматриваемой презентацией, уменьшаются). Кнопка раскрытия «ленты» при этом отображается как «неактивная», а еще одна кнопка, предназначенная для свертывания «ленты», наоборот, становится «активной».3. «Лента» содержит несколько миниатюр, каждая из которых соответствует одной из презентаций, – этих миниатюр столько, сколько умещается по ширине окна браузера. Слева и справа в «ленте» размещаются кнопки «стрелка влево» и «стрелка вправо», щелчки на которых мышью позволяют прокручивать «ленту» в соответствующем направлении для просмотра всех содержащихся в ней миниатюр (рис. 3).

Рис. 3. Лента раскрытия
4. Отыскав в «ленте» требуемую миниатюру, щелчком мыши можно открыть ее на просмотр в расположенной над «лентой» области просмотра. При этом «лента» автоматически скрывается, а выбранная презентация отображается во все окно браузера (рис.4).

Рис. 4. Презентация во все окно браузера
5. Раскрытую «ленту» можно свернуть в любой момент, щелкнув мышью на соответствующей кнопке. На главной странице будет располагаться стартовое изображение (рис.5).

Рис. 5. Главная страница электронного ресурса с миниатюрами
Для того, чтобы достичь результата (рис.5) необходимо выполнить следующие действия:
1. Создайте в папке Итог новую вложенную папку Результат. Создайте в ней вложенную папку Презентации. Создайте в ней вложенные папки с соответствующими именами файлов (не менее 5 папок; желательно - 10-15 штук). В каждой папке разместить необходимую презентацию. Кроме того, поместите в каждую папку миниатюрное изображение первого слайда этой презентации размерами 200х150 пикселей, сохраненное в файле формата JPEG с именем, совпадающим презентации (и с именем соответствующей папки). Для этого можно:
а) открыть первый слайд презентации в программе PowerPoint и сохранить его в файл .jpg, выбрав в меню пункт Файл, Сохранить как, а затем выбрав в окне сохранения файла в списке Тип файла пункт Рисунок в формате JPEG (*.jpg);
б) начав показ презентации, при отображении первого слайда (если на нем использованы анимационные эффекты – при отображении всех его элементов) нажать клавишу PrintScreen и вставить помещенную в буфер копию экрана в любом графическом редакторе, а затем сохранить ее в графическом файле формата JPEG.
Примеры таких миниатюрных изображений:

Рис.6 Миниатюрные изображения в формате .jpg
2. Создайте при помощи текстового редактора «Блокнот» в папке Результат файл index.htm со специальным HTML-листингом (см. Приложение 2).
1080135top
Рис. 7 Файл index.htm со специальным HTML-листингом
3. Необходимо создать в папке Результат файл start.htm. В HTML-код (см. Приложение 3) добавить заголовок с названием презентации.

Рис. 8 Файл start.htm. со специальным HTML-кодом
4. Поместить в папку Результат\imgs графические файлы с изображением кнопок раскрытия, свертывания и прокрутки «ленты» влево и вправо, «активные» и «неактивные».

Рис. 9 Специальные кнопки
5. Откройте созданный файл index.htm двойным щелчком мыши и оцените достигнутый результат. Проверьте работу всех «механизмов» созданной «ленты»: ее раскрытие и свертывание с помощью соответствующих кнопок; прокрутку миниатюр презентаций влево и вправо (в том числе «до упора», чтобы убедиться, что кнопки прокручивания при этом переходят в «неактивный» режим); выбор и просмотр презентаций.

Рис. 10 Созданный электронный ресурс
Таким образом, благодаря развитию гипертекста, большинство пользователей получило возможность создавать собственные мультимедийные продукты и распространять их. Такие информационные системы, выполненные в виде набора HTML-страниц, не требует разработки специальных программных средств, так как все необходимые инструменты для работы с данными (веб-браузеры) стали частью стандартного программного обеспечения большинства персональных компьютеров.
ЗАКЛЮЧЕНИЕВ работе реализована идея значимости языка разметки гипертекста HTML, с помощью которого можно создавать электронные ресурсы. HTML – это стандартный язык разметки, который применяется практически для всех документов в сети Интернет. Появление электронных ресурсов значительно ускорило процесс развития информационного общества. В отличие, от традиционных ресурсов, электронные ресурсы – это источники информации, которая может быть представлена в различных формах (звук, видео, анимация и т. д.).
В ходе исследования нами установлено, что язык разметки гипертекста не только не потерял своей актуальности – он расширяется, приобретая новые грани. Стандарт HTML (HyperText Markup Language) был использован и используется в создании большинства сайтов, существующих в сегодняшнем интернет-пространстве. Благодаря разнообразным возможностям HTML: форматирование текстовой части: заголовков, таблиц, списков и других элементов, включение гиперссылок, указывающих на web-страницу, файл или другой объект, добавление изображений и многое другое осуществляется создание электронных ресурсов.
Таким образом, благодаря развитию гипертекста, большинство пользователей получило возможность создавать собственные мультимедийные продукты и распространять их. Такие информационные системы, выполненные в виде набора HTML-страниц, не требует разработки специальных программных средств, так как все необходимые инструменты для работы с данными (веб-браузеры) стали частью стандартного программного обеспечения большинства персональных компьютеров.
Традиционное статичное представление ресурса дополняется различными анимационными, графическими, звуковыми эффектами, что является признаком развития электронных ресурсов.
Проанализированные специфические особенности создания электронного ресурса в программе «Microsoft PowerPoint» позволяют продемонстрировать основные достоинства и недостатки создания ресурса в данной программе, так как визуально грамотное оформление является ключевым моментом создания учебного электронного ресурса.
Также, большое значение имеет точная последовательность действий, описывающих порядок выполнения исполнителем операций по подготовке учебного электронного ресурса. Алгоритмизация определяет порядок, методы и средства решения конкретных технологических задач, эффективные способы достижения желаемого результата, которые значительно облегчают процесс создания учебного электронного ресурса.
Таким образом, основными достоинствами учебных электронных ресурсов являются:
количество участников просмотра ресурса не ограничено и имеет широкий географический охват благодаря сети Интернет;
разнообразие оформления электронного ресурса: оригинальные графические изображения, анимация, звуковые эффекты;
учебный электронный ресурс имеет возможность длительного или даже постоянного функционирования.
В созданном ресурсе были использованы язык HTML, веб-сайт, презентационные материалы, графические файлы и информация в области развития библиотек. Используемые программы: Microsoft Internet Explorer, текстовый редактор Блокнот.
При подготовке презентационных материалов, являющихся результатом выполнения проекта, требуется создание пользовательской интерактивной оболочки. Проще всего создать такую оболочку с использованием веб-технологий. При этом все презентационные материалы и любые другие файлы «подключаются» к этой оболочке, играющей роль «содержания», посредством гиперссылок. Такой комплект из интерактивной пользовательской оболочки и презентационных материалов можно в дальнейшем переделывать и дорабатывать, а также разместить на веб-сайте для онлайн просмотра через сеть Интернет или на сервере учебного учреждения для просмотра материалов по локальной сети; записать на компакт-диск, в качестве раздаточного материала; распространять на любом носителе информации.
С учетом рассмотренных особенностей языка разметки гипертекста, была разработана инструкция по сборке учебного электронного ресурса по готовому HTML шаблону, результатом которой явилась разработка электронного ресурса «Комплексная автоматизация библиотек».
Таким образом, можно отметить, что поставленные задачи решены, цель работы достигнута.

СПИСОК ИСПОЛЬЗОВАННОЙ ЛИТЕРАТУРЫ1. Алексеев, Е. Г. Информатика [Электронный ресурс] : мультимедийный электрон. учебник / Е. Г. Алексеев, С. Д. Богатырев. – Саранск : Морд. гос. ун-т, 2009. – Режим доступа. : URL : http://inf.e-alekseev.ru/2. Блюмин, А. М. Мировые информационные ресурсы [Текст] / А. М. Блюмин, Н. А. Феоктистов. – М.: Дашков и Ко, 2010. – 150 с.
3. Богомолова, О. Б. Искусство презентации [Текст] / О. Б. Богомолова, Д. Ю. Усенков. – М. : БИНОМ. Лаборатория знаний, 2010. – 446 с.4. Брякалов, Г. А. Основы современных компьютерных технологий [Текст] : учеб. пособие / Г. А. Брякалов, А. Д. Хомоненко. – СПб. : КОРОНА, 2005.
5. Власов, В. К. Элементы информатики [Текст] / В. К. Власов, Л. Н. Королев. – М. : Наука, 2008. – 320 с.
6. Гаевский, А.Ю. Создание веб-страниц и веб-сайтов [Текст] / А. Ю. Гаевский, В. А. Романовский. – М. : Триумф, 2008. – 464 с.
7. Гончаров, А. HTML в примерах [Текст] / А. Гончаров. – СПб. : Питер, 2003.
8. Гуда, А.Н. Информатика и программирование : компьютерный практикум [Текст] : учеб. пособие / А. Н. Гуда, М. А. Бутакова, Н. М. Нечитайло [и др.] ; под общ. ред. В. И. Колесникова. – М. : Дашков и К, 2010. – 237 с.
9. Гусева, Е. Н. Информатика [Текст]: учеб. пособие / Е. Н. Гусева, И. Ю. Ефимова, Р. И. Коробков, [и др.]. – 3-е изд., стереотип. – М. : ФЛИНТА, 2011. – 260 с.
10. Дригалкин, В. В. HTML в примерах. Как создать свой Web-сайт: Самоучитель [Текст] / В. В. Дригалкин. – М. : Изд-во «Вильямс», 2003. – 192 с.
11. Дунаев, В. В. HTML, скрипты и стили [Текст] / В. В. Дунаев. – СПб: БХВ, 2006. – 832 с.
12. Избачков, Ю. С. Информационные системы [Текст] : учебник для вузов / Ю. С. Избачков, В. Н. Петров, А. А. Васильев, И. С. Телина. – СПб. : Питер, 2011. – 544 с.
13. Каймин, В. А. Информатика [Текст] : учеб. пособие / В. А. Каймин. – 2-е изд. – М. : РИОР, 2007. – 124 с.
14. Кисленко, Н. П. HTML. Самое необходимое [Текст] / Н. П. Кисленко. – СПб : БХВ-Петербург, 2008. – 352 с.
15. Козырев, А.А. Информатика [Текст] / А. А. Козырев. – СПб. : Изд-во Михайлова В.А., 2002. – 510с.
16. Комолова, Н. В. HTML. Самоучитель [Текст] / Н. В. Комолова. – 1-е изд. - СПб. : Питер, 2009. – 272 с.
17. Кузнецов, М.В. Практика разработки Web-сайта [Текст] / М.В. Кузнецов, И.В. Симдянов, С.В. Голышев. – СПб. : БХВ-Петербург, 2005. – 960 с.
18. Мальчук, Е. HTML и CSS. Самоучитель [Текст] / Мальчук Е. – Вильямс, 2007. – 408 с.
19. Макарова, Н. В. Информатика [Текст] : учебник для вузов / Н. В. Макарова, В. Б. Волков. – СПб. : Питер, 2011. – 576 с.
20. Матросов, А. В. HTML 4.0 [Текст] / А. В. Матросов, А. О. Сергеев, Н. П. Чаунин. – СПб: БХВ, 2005. – 672 с.
21. Могилев, А. В. Информатика [Текст] / А.В.Могилев, Н.И.Пак, Е.К.Хеннер. – М. : Изд. центр «Академия», 2008. – 816 с.
22. Острейковкий, В. А. Информатика. Теория и практика [Текст] : учеб. пособие / В. А. Острейковский, И. В. Полякова. – М. : Издательство Оникс, 2008. – 608 с.
23. Острейковский, В. А. Информатика [Текст] / В. А. Острейковский. – М. : Высш. шк., 2001. – 511 с.
24. Петюшкин, А. HTML в Web-дизайне [Текст] / А. Петюшкин. – СПб. : БХВ-Петербург, 2004 г.– 400 с.
25. Полонская, Е. Л. Язык HTML. Самоучитель [Текст] / Е. Л. Полонская. – М. : Диалектика, 2005. – 320 с.
26. Симонович, С. В. Информатика. Базовый курс [Текст] / С. В. Симонович. – СПб. : Питер, 2002. – 640 с.
27. Степанов, А.Н. Информатика [Текст] / А. Н. Степанов. – 3- е изд. – СПб. : Питер, 2002. – 608 с.
28. Храмцов, П. Б. Основы Web – технологий [Текст] : учеб. пособие / П. Б. Храмцов. – М. : Изд-во Интуит, 2003. – 512 с.
29. Чебыкин, Р. Самоучитель HTML и CSS. Современные технологии [Текст] / Р. Чебыкин. – СПб. : БХВ-Петербург, 2008. – 624 с.
30. Чиртик, А. А. HTML: Популярный самоучитель [Текст] / А. А. Чиртик. – 1-е изд. – СПб. : Питер, 2008. – 256 с.

ПРИЛОЖЕНИЕПриложение 1
Алгоритм построения учебного электронного ресурса
Конец
18. Анализ эффективности ресурса
17. Информирование учащихся и преподавателей
16. Запись на CD-диск
15. Исправление недостатков
14. Предварительный просмотр ресурса
13Б. Создание навигации
12А. Вставка иллюстраций и иных материалов
13А. Создание гипертекстовых ссылок
12Б. Создание анимации
11А. Задание стиля текста
10А. Ввод необходимых тегов, определяющих структуру HTML-документа, создание фреймов
9А. Создание учебного электронного ресурса в HTML
11Б. Размещение иллюстраций и иных материалов на слайдах
10Б. Размещение текста на слайдах
9Б. Создание презентации ЭР в формате PowerPoint
6. Составление характеристик по автоматизации библиотек
8. Выбор формата ЭР
7. Сканирование иллюстраций, набор текста, оцифровка других материалов
4. Выявление и отбор документов
5. Разработка структуры электронного ресурса. Выбор формы представления
Начало
1. Выбор темы
3. Поиск документов по теме «Комплексная автоматизация библиотек»
2. Определение целевого и читательского назначения

Приложение 2
HTML-код для файла index.htm
<html>
<head>
<meta http-equiv="content-type" content="text/html" charset="windows-1251">
<title>Комплексная автоматизация библиотек</title>
<script language="JavaScript">
<!--
// при открытии страницы - открыть ее во весь экран
self.moveTo(0,0)
self.resizeTo(screen.availWidth,screen.availHeight)
var h; // исходная высота окна с презентацией
var dh; // изменение высоты окна с презентацией
var ribbon_mini_h; // высота ленты в свернутом состоянии
var ribbon_maxi_h; // высота ленты в раскрытом состоянии
var lft; // номер крайней миниатюры слева
function inils() { // начальные присваивания
ribbon_mini_h=40; // высота свернутой ленты
ribbon_maxi_h=200; // высота свернутой ленты
// исходная высота окна браузера
h=document.body.clientHeight;
// высота окна с презентацией при свернутой ленте (10 пикселей - запас)
hslide_maxi=h-(ribbon_mini_h+10);
// высота окна с презентацией при раскрытой ленте (10 пикселей - запас)
hslide_mini=h-(ribbon_maxi_h+10);
// массив имен миниатюр
inames=new Array("Введение", "Доконтрольная информационная зона", "Автоматизированные системы библиотеки", "Сетевая информационная инфраструктура", "Пользовательские устройства", "Производственный участок библиотеки", "Оборудования управления", "Зона отдыха читателей", "Система управления библиотекой");
inom=inames.length; // кол-во миниатюр
// массив имен презентаций
irefs=new Array("Введение.pps", "Доконтрольная информационная зона.pps", "Автоматизированные системы библиотеки.pps", "Сетевая информационная инфраструктура.pps", "Пользовательские устройства.pps", "Производственный участок библиотеки.pps", "Оборудования управления.pps", "Зона отдыха читателей.pps", "Система управления библиотекой.pps");
lft=0; // номер крайней миниатюры слева
// (элементы массива нумеруются с нуля)
ribbonGo(); // обновить содержимое ленты
// сначала лента спрятана
document.getElementById('main').height=hslide_maxi;
document.all.ribbon.style.display="none";
}
function ribbonUp() { // раскрыть ленту
document.getElementById('main').height=hslide_mini;
document.all.ribbon.style.display="";
document.butdn.src="_imgs/button_dn.gif";
document.butup.src="_imgs/button_up_no.gif";
}
function ribbonDn() { // спрятать ленту
document.getElementById('main').height=hslide_maxi;
document.all.ribbon.style.display="none";
document.butdn.src="_imgs/button_dn_no.gif";
document.butup.src="_imgs/button_up.gif";
}
function ribbonRt() { // прокрутить ленту вправо
if (lft > 0) { lft=lft-1 }
ribbonGo(); // обновить содержимое ленты
}
function ribbonLt() { // прокрутить ленту влево
if (lft < inom-4) { lft=lft+1 }
ribbonGo(); // обновить содержимое ленты
}
function ribbonGo() { // вывести ленту
document.pic1.src="Презентации/"+inames[lft]+"/"+inames[lft]+".jpg";
document.pic2.src="Презентации/"+inames[lft+1]+"/"+inames[lft+1]+".jpg";
document.pic3.src="Презентации/"+inames[lft+2]+"/"+inames[lft+2]+".jpg";
document.pic4.src="Презентации/"+inames[lft+3]+"/"+inames[lft+3]+".jpg";
if (lft > 0) {
document.butrt.src="_imgs/button_rt.gif"
}
else {
document.butrt.src="_imgs/button_rt_no.gif"
}
if (lft < inom-4) {
document.butlt.src="_imgs/button_lt.gif"
}
else {
document.butlt.src="_imgs/button_lt_no.gif"
}
}
function ribbonClick(i) { // щелчок по миниатюре
document.getElementById('main').src="Презентации/"+inames[lft+i]+"/"+irefs[lft+i];
ribbonDn(); // скрыть ленту
}
//-->
</script>
</head>
<body onLoad="inils();" bgcolor=#F5F5DC link=blue vlink=#000080 topmargin=0>
<iframe src="start.htm" width="100%" height="550" align="center" id="main" frameborder=0 scrolling=no></iframe>
<center>
<table width=100% border=0> <!-- bgcolor=#f8f8b9 -->
<tr>
<td align=center><i>Презентации <b>"Комплексная автоматизация библиотек"</b></i></td>
<td align=right width=50><img name="butdn" src="_imgs/button_dn_no.gif" border=0 alt="Свернуть ленту" onClick="ribbonDn();">&nbsp;&nbsp;&nbsp;<img name="butup" src="_imgs/button_up.gif" border=0 alt="Развернуть ленту" onClick="ribbonUp();"><td>
</tr>
</table>
<table width=100% border=0 id="ribbon">
<tr>
<td width=50 align=left><img name="butlt" src="_imgs/button_lt.gif" border=0 alt="Прокрутить ленту влево" onClick="ribbonLt();"></td>
<td width=50 align=center>
<img name="pic1" border=1 width=200 height=150 alt="Посмотреть презентацию" onClick="ribbonClick(0);">
</td>
<td width=50 align=center>
<img name="pic2" border=1 width=200 height=150 alt="Посмотреть презентацию" onClick="ribbonClick(1);">
</td>
<td width=50 align=center>
<img name="pic3" border=1 width=200 height=150 alt="Посмотреть презентацию" onClick="ribbonClick(2);">
</td>
<td width=50 align=center>
<img name="pic4" border=1 width=200 height=150 alt="Посмотреть презентацию" onClick="ribbonClick(3);">
</td>
<td width=50 align=right><img name="butrt" src="_imgs/button_rt.gif" border=0 alt="Прокрутить ленту вправо" onClick="ribbonRt();"></td>
</tr>
</table>
</center>
</html>
Приложение 3
HTML-код для файла start.htm
<html>
<head>
<meta http-equiv="Content-Type" content="text/html"; charset="windows-1251">
<title> Комплексная автоматизация библиотек </title>
</head>
<body bgcolor=#F5F5DC text=green link=blue vlink=#000080 >
<h1 align=center> Комплексная автоматизация библиотек </h1>
<body bgcolor=#F5F5DC>
<center>
<img src="_imgs\t11.jpg">
</center>
</body>
</html>

Приложенные файлы