Размещено на http://www.allbest.ru/

Введение

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

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

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

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

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

1. Теоретическая часть

1.1 Постановка задачи

Целью проекта является компьютерная реализация электронного учебно-методического комплекса (УМК) «Объектно-ориентированное программирование» для обучения студентов дисциплине.

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

В связи с поставленной целью необходимо решить следующие задачи:

- определение функционала сайта;

- разработка дизайна;

- организация веб-интерфейса;

- решение вопросов представления в различных браузерах;

- проверка решения задач для самостоятельного выполнения.

1.2 Анализ предметной области

Электронный учебно-методический комплекс будет представлен в виде сайта образовательной направленности по дисциплине «объектно-ориентированное программирование». Данную дисциплину изучают на четвертом курсе специальности «Прикладная информатика». Соответственно данный сайт предназначен для студентов этой специальности.

Сайт - совокупность электронных документов (файлов) частного лица или организации в компьютерной сети, объединённых под одним адресом (доменным именем или IP-адресом).

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

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

HTTP - это методика передачи веб-страниц по сети интернет. Изначально протокол HTTP использовался исключительно для передачи HTML-документов, но в настоящее время посредством HTTP можно передавать любую информацию, в том числе картинки, звук, видео, а также просто абстрактные файлы.

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

- студенты;

- преподаватель.

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

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

Настоятельно рекомендуется использовать стандартный шрифт и размер шрифта. Для русских шрифтов это Arial и Time new Roman и размер от 12 до 14. Использование нестандартных шрифтов и маленьких или больших размеров шрифтов вызывает у пользователя дискомфорт, затрудняет чтение текста и отвлекает от понимания прочитанной информации. С технической точки зрения это тоже плохо - не все браузеры смогут правильно определить кодировку нестандартного шрифта, в результате вместо текста пользователь увидит бессмысленную последовательность непонятных ему символов.

Следует также уделить внимание форматированию текста. Излюбленной ошибкой является использование полужирного шрифта для выделения всего текста. Полужирным шрифтом нужно выделять основные понятия, определения и особо важные фразы. Обычный текст без форматирования должен составлять большую часть наполнения сайта. Большие объемы текстовой информации следует разделять на абзацы и дополнять графическим контекстом: тематическими картинками и фотографиями.

Особое внимание при разработке сайта следует уделить цветовой схеме. Цветовая схема сайта не должна состоять из большого количества цветов. Оптимальным значением является 2-3 цвета. Цвета для сайта следует выбирать, используя специальную таблицу цветов, которая позволяет подобрать оптимальные оттенки для выбранных цветов. Не следует использовать слишком яркие цвета для шрифтов и заднего плана веб-сайта. Если в качестве заднего плана сайта планируется использовать фоновое изображение, нужно убедиться, что оно не будет совпадать (сливаться) с цветом шрифта.

Наполнение электронного учебно-методического комплекса, учитывая намеченную целевую аудиторию и специфику:

- справочная информация - теоретические сведения об объектно-ориентированном программировании;

- уроки с выходом на практику - уроки, которые студенты выполняют на занятии самостоятельно;

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

- тесты - самоконтроль.

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

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

Элементы объектно-ориентированного программирования (ООП) появились в начале 70-х годов в языке моделирования Симула, затем получили свое развитие, и в настоящее время ООП принадлежит к числу ведущих технологий программирования.

Основная цель ООП, как и большинства других подходов к программированию - повышение эффективности разработки программ. Идеи ООП оказались плодотворными, и нашли применение не только в языках программирования, но и в других областях компьютерных наук, например, в области разработки операционных систем.

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

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

Объектно-ориентированный язык программирования должен обладать следующими свойствами:

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

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

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

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

Разработка объектно-ориентированных программ состоит из следующих последовательных работ:

- определение основных объектов, необходимых для решения данной задачи;

- определение закрытых данных (данных состояния) для выбранных объектов;

- определение второстепенных объектов и их закрытых данных;

- определение иерархической системы классов, представляющих выбранные объекты;

- определение ключевых сообщений, которые должны обрабатывать объекты каждого класса;

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

- разработка методов, обрабатывающих каждое сообщение;

- очистка проекта, т.е. устранение всех вспомогательных промежуточных материалов, использовавшихся при проектировании;

- кодирование, отладка, компоновка и тестирование.

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

1.3 Требования к программному продукту

В состав электронного учебно-методического комплекса должны входить:

- учебное пособие по данному курсу с теоретическими и практическими сведениями (курс лекций, упражнения (уроки), практические задания);

- компьютерная тестирующая система;

- перечень базовой и рекомендованной литературы;

- методические рекомендации студентам по самостоятельной работе и изучению дисциплины (раздела, темы);

- методические рекомендации (указания) по выполнению практических заданий, упражнений, занятий;

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

- календарно-тематический план дисциплины объектно-ориентированное программирование;

- рабочая программа дисциплины.

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

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

Упражнение (урок) - занятие, для приобретения или усовершенствования каких-либо навыков. Это элемент пеpеpаботки информации, т.е. различного pода пpеобpазования знаков (или символов) по четко заданным правилам. Упражнение - занятие для усовершенствования каких-либо навыков. Благодаря упражнениям, т.е. постоянным действиям, закрепляется какой-либо навык, вырабатывается привычка делать что-то правильно.

Учебное пособие - учебное издание, дополняющее или частично (полностью) заменяющее учебник, официально утвержденное в качестве данного вида издания.

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

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

Электронный учебно-методический комплекс должен иметь следующие отличительные особенности:

- четкую функциональную направленность каждого компонента УМК на решение определенной педагогической задачи;

- единый методический, информационный и дизайнерский подход, учитывающий возрастные психофизиологические особенности студентов;

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

- использование прогрессивных форм и способов подачи материала, основанных на современных информационных технологиях;

- доступность в использовании;

- интерактивность;

- ориентированность на практическую деятельность учащихся;

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

Цель электронного УМК - обеспечение высокого качества подготовки специалистов.

Задачами электронного УМК, его элементов (или составляющих) являются:

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

- оптимизация подготовки и проведения занятий, интенсификация всего учебно-воспитательного процесса;

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

- обеспечение единства требований к студентам;

- организация и регулирование методической работы преподавателей;

- обеспечение учебно-методическими материалами всех видов занятий и учебной и внеаудиторной деятельности.

Разрабатываемый интерфейс должен отвечать общепринятым нормам и правилам проектирования пользовательских интерфейсов:

- выдержанная в спокойных тонах цветовая гамма;

- простой и очевидный порядок выполняемых действий;

- удобная навигация;

- эргономичное расположение полей ввода и элементов управления.

1.4 Средства реализации

На сегодняшний день все больше и больше рядовых пользователей интернета интересуется программами для создания сайтов.

Так, для создания визуального оформления сайта обязательно нужен графический редактор - хотя бы стандартный Paint от Microsoft. В графическом редакторе создается макет страницы, на котором должным образом представлены все элементы будущей веб-страницы.

Созданный в графическом редакторе дизайн-макет необходимо «превратить» в html-код, который и будет отображаться браузером при загрузке страниц сайта. В качестве программ для «превращения» подойдут либо простые текстовые редакторы, либо же визуальные html-редакторы.

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

1.4.1 WYSIWYG-программы

Пользователям с недостаточным опытом разработки веб-страниц рекомендуется использовать средство разработки, не требующее знания HTML (то есть, позволяющее начать опубликование немедленно). Некоторые средства разработки поддерживают пользовательский интерфейс адекватного отображения (WYSIWYG - what you see is what you get - что вы видите, то и получите), аналогичный используемому в текстовых процессорах, таких как Microsoft Word. Таким образом, для создания веб-страниц достаточно иметь навыки работы с текстовым процессором. Microsoft FrontPage является хорошим примером простого в использовании редактора WYSIWYG, который имеет удобный для пользователя интерфейс, мастера форматирования и различные шаблоны для добавления таблиц и графики на веб-страницы. По мере создания и редактирования веб-страницы в редакторе FrontPage, эта страница отображается так, как она будет выглядеть при открытии в веб-обозревателе. FrontPage имеет специальные программные расширения, которые увеличивают его возможности с помощью веб-сервера.

1.4.2 Преобразование в HTML

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

1.4.3 Текстовый редактор

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

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

Также существует несколько гибридных инструментов, работающих подобно обычному текстовому редактору. Эти инструменты имеют много полезных возможностей (например, средства WYSIWYG), позволяющие вставлять на страницы предопределенные теги HTML, тем самым уменьшая объем ввода с клавиатуры.

Итак, рассмотрим несколько программ для создания сайтов.

Adobe Dreamweaver - профессиональный пакет для создания сайтов. В Adobe Dreamweaver можно создавать и редактировать html-код с помощью визуального редактора, можно создавать РНР-сценарии, CSS-таблицы, файлы Java, XML и т.д.

Microsoft FrontPage - один из самых популярных программных продуктов для создания сайтов. Поставляется в пакете MS Office. Программа позволяет редактировать html код, как в режиме визуального редактора, так и вручную. С помощью FrontPage можно удобно добавлять в документ изображения, таблицы, в том числе электронные (excel).

GIMP - бесплатный графический редактор, работающий с системами Linux и Windows. Функциональность GIMP практически не уступает известному графическому пакету Adobe Photoshop, при этом GIMP также поддерживает работу с PSD-файлами. Может использоваться для корректировки цифровых изображений в дизайне сайта или для отрисовки нужных изображений с нуля.

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

1.4.4 Программа-модулятор предметной области

Для моделирования процессов взаимодействия пользователей с учебно-методическим комплексом необходима программа для построения функциональных моделей предметной области. В качестве такой программы будет использоваться стандартный редактор, входящий в пакет Microsoft Office, MS Visio 2007.

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

1.5 Сравнительный анализ имеющихся средств

Каждый выбирает свой инструмент для создания Web-страниц. Это может быть Microsoft SharePoint Designer 2007, Adobe Dreamweaver CS3, Microsoft FrontPage и др. А кто-то пользуется простым текстовым редактором, например Блокнотом. Текстовые редакторы, возможно, использовать только для создания небольших страниц, так как у них есть много минусов: не поддерживаются проекты, отсутствует «подсветка» текста, в общем, работать с ними может только профессионал, знающий язык HTML. Рассмотрим возможности визуальных HTML-редакторов. Эти программные продукты рассчитаны на тех, кто плохо, или почти не знает язык HTML, хотя в нем можно создавать сайты, даже не обладая данными знаниями.

В таблице 1 представлена общая информация о WYSIWYG-редакторах, в частности их экономические и аппаратные характеристики

Таблица 1 - Общая информация

	Adobe Dreamwewer CS3	MS FrontPage	Microsoft SharePoint Designer
Стоимость	13134 руб.	4904,68 руб.	бесплатно
Год выпуска	20.04.2007	21.10.2003	04.12.2006
Лицензия	патентованный	патентованный	патентованный
Windows	поддерживает	прекращено (2003)	поддерживает

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

Таблица 2

Функция	Adobe Dreamwewer CS3	MS FrontPage	Microsoft SharePoint Designer
WYSIWYG	да	да	да
Поддержка FTP	да	да	да
Серверные сценарии	да	да	да
Совместные реальном времени редактор	да	да	да
Проверка орфографии	да	да	да
Шаблоны	да	да	да
Обновление шаблонов синхронизации	да	нет	нет
Предварительный просмотр страницы	да	да	да
обработчик формы	да	нет	нет

Веб-технологии - это компоненты web-программрования, которые используются для отображения конкретной информации. Так, например, JavaScript позволяет создавать на страницах тесты и оценивать их. CSS - это стили оформления текста. Таблица 3 показывает какие технологии присутствуют в программах.

Таблица 3 - Поддержка веб-технологии

	Adobe Dreamwewer CS3	MS FrontPage	Microsoft SharePoint Designer
CSS 2	да	частично	да
Фреймы	да	да	да
Java	да	да	да
JavaScript	да	да	да
XForms	да	нет	нет
RSS	да	нет	да

HTML - это стандартный язык разметки документов во всемирной паутине. Практически все веб-страницы создаются при помощи HTML. Это означает, что от версии языка программирования будет зависеть, какими браузерами будет отображаться сайт, а какими нет (таблица 4).

Таблица 4 - HTML / XHTML спецификации поддержки

	Adobe Dreamwewer CS3	MS FrontPage	Microsoft SharePoint Designer
HTML 3.2	да	да	да
HTML 4.0	да	да	да
HTML 4.01	да	да	да
HTML 5	да	нет	нет
XHTML 1.0	да	да	да
XHTML 1.1	да	да	да
Пользователи	да	да	да

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

Таблица 5

	Adobe Dreamwewer CS3	MS FrontPage	Microsoft SharePoint Designer
JPEG	да	да	да
GIF	да	да	да
PNG	да	да	да
SVG	да	нет	нет

1.6 Критерии выбора

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

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

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

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

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

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

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

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

Проблемой, которую трудно решить всем HTML-редакторам, остается непосредственное создание HTML-кода. Большое количество тегов с их атрибутами нормальный человек запомнить не в состоянии. Поэтому каждый редактор решает эту проблему своеобразно. Редакторы попроще вообще не предлагают никакой помощи в создании кода (предполагая, что все должны помнить теги с их атрибутами наизусть).

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

Создатели HTML-редакторов, понимая эту проблему, стараются максимально избавить пользователя от непосредственного написания кода, применяя различных мастеров для вставки на страницу фрагметов кода. Большие программы типа Adobe Dreamweaver имеют много настроек и способны формировать хороший код в визуальном режиме. Пользователю остается лишь скорректировать какие-то детали, редактируя сам код.

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

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

Как правило, хороший комбинированный редактор (который имеет режимы «код» и «дизайн») предпочтительнее хорошего редактора кода, не имеющего визуального режима. Визуальный режим намного удобнее при работе.

В настоящее время не просматривается, что какая-то группа редакторов (редакторы кода, комбинированные или визуальные редактора) начинает преобладать и вытеснять другие. Редакторы всех групп постоянно совершенствуются и находят своих потребителей.

Крайне желательно, чтобы интерфейс программы был на русском языке, как и и справка программы. Все программы, созданные за рубежом (а таких подавляющее большинство) отлично взаимодействуют друг с другом на английском языке. Но с русским языком у многих из них есть проблемы. Некоторые HTML-редакторы вообще не способны печатать русские буквы. Другие имеют русские кодировки, но нужная вам кодировка может быть поставлена в самый конец списка и программа до неё просто не добирается.

Установленные в редакторе кодировки должны позволять общаться с ним на русском языке (если этого нет - пользоваться программой становится затруднительно).

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

В этом случае невольно возникают мысли, что лучше - освоить html и использовать редактор кода? Или не учить html, а использовать сложный визуальный редактор, засев за изучение справки этого редактора? Выбор здесь индивидуальный, но все же есть подозрение, что хотя бы без элементарных знаний html будет трудно работать и в визуальном редакторе.

И последнее (но не маловажное) - программа не должна быть дорогой. А лучше, если программа вообще бесплатная.

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

Основные требования, предъявляемые к таким программам:

- полная поддержка кодировок русского языка;

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

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

Выбор визуальных редакторов HTML-кода очень велик, однако самые распространенные Microsoft Office SharePoint Designer 2007, Adobe Dreamweaver CS3 и Microsoft Office FrontPage 2003.

Программа Microsoft FrontPage просто и логично устроена, и одновременно обладает большими возможностями.

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

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

Из недостатков программы можно отметить то, что программа не быстрая - и открывается долго, и при выполнении некоторых команд есть какая-то заторможенность.

Если при создании текстового материала в визуальном режиме FrontPage обычно выдаст чистый код, то при других операциях может насыпать на страницу много ненужного. Частично эту проблему может решить настраиваемый оптимизатор HTML-кода, имеющийся в редакторе.

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

В итоге можно сказать, что редактор FrontPage имеет некоторые шероховатости, но по многим показателям отвечает требованиям, которые предъявляются к HTML-редакторам. Развитие программы прекращено, ей на смену пришла программа Microsoft Office SharePoint Designer.

Microsoft Office SharePoint Designer 2007 это приложение для создания и публикации сайтов и отдельных веб-страниц. Редактор является одним из компонентов пакета Microsoft Office 2007, однако не включен ни в один из комплектов офиса (устанавливается отдельно). Переход в названии от FrontPage к SharePoint Designer связан с его назначением: созданием и дизайном веб-сайтов Microsoft SharePoint.

Интерфейс программы простой и напоминает интерфейс Microsoft Office Word. Вверху строка меню, ниже располагаются панели инструментов для отдельных видов работ (в программе 11 панелей инструментов, которые можно выставить по отдельности или все сразу).

В редакторе два режима - Код и Конструктор (визуальный редактор), имеется возможность разделить окно программы на код и дизайн. При этом редактирование страницы возможно как на половине кода, так и на половине дизайна. Однако визуальный режим является основным, а режим кода играет подсобную роль и многие функции по оформлению страницы в нем недоступны.

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

Редактор не является совершенством, имеет некоторые недочеты, к примеру:

- при копировании и вставке на страницу текстового материала в визуальном режиме редактор вставит излишний код, т.к. попытается скопировать оформление оригинала;

- иногда затруднительно выполнить такие простые операции, как скопировать-вставить;

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

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

Общее впечатление от SharePoint Designer 2007: несмотря на некоторые недостатки, в целом редактор удовлетворяет тем требованиям, которые предъявляются к HTML - редакторам.

Adobe Dreamweaver - программа большая и сложная. Чтобы прочитать справку, потребуется неделя. Тем не менее создатели программы сумели не загромоздить интерфейс и все необходимое для создания HTML-страниц находится под рукой.

Большинство прочих надстроек спрятаны в так называемый «док панелей», откуда и извлекаются по мере необходимости.

Считая, что всего этого еще недостаточно, создатели программы в помощь Adobe Dreamweaver привлекли ряд расширений - Adobe Bringe, Adobe Fireworks, Adobe Flash и др. Всем этим руководит специальное приложение - Extension Manager. Extension Manager предоставляет простой и удобный способ установки и удаления расширений в приложениях Adobe, а также поиск информации об установленных расширениях.

Редактор Adobe Dreamweaver тесно интегрирован с программой Adobe Bringe, котрая обеспечивает просмотр, поиск, сортировку, фильтрацию, обработку и управление изображениями, макетами страниц, документами Adobe PDF и динамическими файлами мультимедиа.

Рабочее простанство (Интерфейс) настраиваемое. В программе есть три режима: код (непосредственное создание кода страницы), дизайн (визуальное создание страницы) и просмотр. Окно программы можно разделить на код и дизайн.

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

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

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

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

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

Редактор хорош, но не идеален. Встречаются мелкие погрешности в работе, иногда неприятные. К примеру, в режиме визуального создания страницы ее вид может быть искажен, т.е. в Интернете страница будет выглядеть по-другому.

Несмотря на то, что создателям программы удалось компактно разместить все имеющееся в программе, Adobe Dreamweaver все же является довольно громоздким агрегатом, на котором трудно работать.

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

1.7 Выбор инструментальных средств

В ходе теоретического анализа было установлено, что более удобным для создания сайта является html-редактором Adobe Dreamweaver CS3, так как он имеет следующие возможности:

- не обладая знаниями HTML, легко создать современный сайт;

- удобный, интуитивный интерфейс;

- поддержка больших проектов;

- генерирует очень чистый HTML-код;

- обладает встроенными HTML, CSS, JavaScript, PHP, «визуальным» редакторами кода (просмотр кода и инспектор кода);

- вставка и обработка различных объектов;

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

Dreamwewer на несколько шагов опережает другие редакторы, использующие технологию WYSIWYG, в первую очередь тем, что генерирует очень чистый HTML-код. Dreamwewer позволяет избавиться от однотипной работы при создании страниц (например, верстка текста) при помощи использования опции «запись последовательности команд» можно записывать последовательность производимых вами команд, потом нажимаете, например, CTRL+P, и Dreamwewer воспроизводит всё в той же последовательности.

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

Dreamweaver автоматически найдет код в ведущих браузерах и подскажет причину и решение потенциальной проблемы. Также, редактор дает возможность получить решение наших CSS-проблем при помощи нового ресурса Adobe - CSS Advisor: сообщества разработчиков и дизайнеров. Данный редактор кода проверяет код по XHTML- и CSS-стандартам. Dreamweaver - это первый инструмент, позволяющий автоматизировать нахождение и решение множества наиболее популярных CSS-ошибок, что позволяет вести браузерную разработку.

Одно из преимуществ - интеграция с Adobe Photoshop. Дизайнеры достаточно часто обрабатывают необходимые файлы в Photoshop. Используя Dreamweaver и Photoshop можно непосредственно копировать и вставлять изображения в Dreamweaver. Просто надо выбрать тип компрессии и файл, а также место вставки в документ. Dreamweaver запомнит источник файла, поэтому при необходимости с легкостью сможем отредактировать необходимый файл. Помимо копирования и вставки, мы можем импортировать в Dreamweaver непосредственно Photoshop-документ, да Dreamweaver теперь понимает PSD-файлы преимущества использования CSS все очевидней, а потому многим необходим пример использования. Данный редактор предлагает на выбор воспользоваться шаблонами одно-, двух- или трехколоночными шаблонами, которые могут быть как фиксированной, так и «эластичной» ширины. У визуального редактора Dreamweaver помимо вышеперечисленных достоинств, есть одно общее - это удобство, наглядность и простота в освоении.

Минусы: Dreamweaver занимает довольно много ресурсов на компьютере.

2. Практическая часть

2.1 Моделирование процесса использования электронного ресурса «Объектно-ориентированное программирование»

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

Исследуемая предметная область - электронный учебно-методический комплекс по дисциплине «Объектно-ориентированное программирование». Студенты изучают теорию при помощи электронного пособия, выполняют уроки с выходом на практику, которые проверяет и засчитывает преподаватель. Все практические занятия и уроки выполняются в программе Delphi 7, которая установлена на For_all. Обучающиеся проверяют свои навыки при помощи Практических занятий под наблюдением преподавателя. Данные работы проверяет и оценивает преподаватель. При окончании обучения студент получает оценку при наличии всех выполненных уроков и практических занятий. Итоговая оценка выводится по общим оценкам за проведенные практические занятия.

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

В обучающей системе должны быть предусмотрены следующие типы модулей учебного материала:

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

- статические иллюстрации в различных графических форматах;

- ссылки на готовые программные продукты.

Конструирование процесса взаимодействия пользователей с электронным учебно-методическим комплексом выполняется с использованием каскадной модели жизненного цикла программного обеспечения.

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

Этапы проекта в соответствии с каскадной моделью:

- формирование требований;

- проектирование;

- реализация;

- тестирование;

- внедрение;

- эксплуатация и сопровождение.

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

Контекстная диаграмма IDEF 0 (Приложение А) представляет в общем виде организацию изучения дисциплины «Объектно-ориентированное программирование» через сайт с точки зрения преподавателя.

Входными данными в работе выступят:

- описания занятий;

- методические указания.

Управляющими элементами являются:

- теория на сайте;

- план обучения;

- количество отведенных часов;

- практические работы;

- требования к знаниям

- тесты;

- контрольные работы.

Механизмы:

- программа Delphi 7;

- персональные компьютеры;

- сайт ООП;

- преподаватель.

В конце работы в качестве выходных данных будут:

- отчеты о выполнении заданий;

- результат;

- оценка.

На декомпозированной диаграмме IDEF 1.x. (Приложение Б) представлена развернутая схема организации изучения дисциплины.

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

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

Теперь необходимо выполнить следующие этапы:

- изучить теорию;

- применить на практике;

- проверить знания.

Управляющие элементы влияют на работу всех трех этапов равнозначно, тогда как входные данные, механизмы и выходные данные распределяются по этапам.

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

Второй этап заключается в применении знаний на практике, механизмами являются практические работы на сайте и программа Delphi 7. На выходе формируются практические навыки работы в среде объектно-ориентированного программирования, поступающие на вход для третьего этапа.

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

2.2 Технология создания программного продукта

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

Основные идеи сайта:

- определение информационной части сайта (статическая составляющая) и активной части, которая требует от пользователя выполнения действий, например, заполнения форм, просмотр ресурсов и т.п.;

- группировка идеи по содержанию;

- группировка идеи по возможностям;

- определение приоритета каждой из идей.

Из созданной структуры сайта создадим карту сайта (Приложение В). Карта сайта - это своеобразная диаграмма, позволяющая визуально представить веб-страницы еще до их построения.

Для удобного доступа к информации сайт нужно разумно организовать. Все предполагаемое содержание нужно разбить на основные темы (разделы сайта), содержащие одну или несколько HTML-страниц. Каждый раздел при большом количестве информации удобно разделить на несколько подразделов.

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

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

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

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

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

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

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

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