2.3 Общие требования к созданию сайтов
С течением времени выработались определенные требования к созданию интернет-сайтов, придерживаясь которых, можно создавать наиболее эффективные Интернет-ресурсы. Наиболее важные из них:
навигация является тем инструментом на сайте, с которым по существу и работает посетитель. При проектировании сайта очень важно, исходя из структуры расположения материалов на сайте, разработать максимально удобную для данной структуры навигацию. При этом есть простые базовые принципы, пренебрежение которыми сильно усложняет ориентирование посетителя на сайте: посетитель должен всегда видеть, где он находится (документ и уровень его вложенности), как он сюда попал, и как ему вернуться туда, откуда он пришел. Причём, самой удобной навигацией является та, которая позволяет минимальным числом переходов попасть с одной страницы на другую, при этом, естественно, навигация должна быть легко воспринимаемой и не перегруженной. Последнее достигается расставлением акцентов путем логического форматирования;
соответствие информации, представленной на сайте, целевому назначению сайта. Если сайт посвящен определенной тематике, то информация, не имеющая отношения к содержанию сайта не должна использоваться на нем;
правильное расставление абзацев, оправданное употребление списков, применение правил типографики значительно упрощает восприятие текста;
оперативность обновления информации интернет-сайтов позволяет делать ее востребованной и актуальной, а, следовательно, побуждает пользователя к повторным посещениям ресурса;
использование интерактивных элементов на сайте позволяет разнообразить его информационное содержание, дает возможность организовать механизм обратной связи с посетителями сайта. Необходимо использовать именно всплывающие подсказки - они появляются только тогда, когда это необходимо, то есть когда посетитель хочет как-то использовать определенный элемент сайта;
правильное графическое решение типовой страницы сайта. Разработка дизайна должна соответствовать типу ресурса. Наиболее распространенными являются информационные ресурсы, развлекательные ресурсы, ресурсы, связанные с Интернет-торговлей и т.д.;
корректная работа сайта, выраженная в правильном отображении во всех распространенных типах браузеров (сохранение правильного форматирования сайта, отображение графики), делает возможным использование сайта пользователями с различным программным обеспечением [16].
2.4 Проектирование электронного образовательного ресурса по дисциплине «Современнные интернет-технологии»
Разрабатываемый сайт относится к типу образовательных сайтов и в первую очередь будет необходим для решения образовательных задач как со стороны преподавателей, так и со стороны студентов.
Сайт содержит в себе следующие блоки:
авторизация пользователя – внесение пользователя в базу данных, регистрация на ресурсе;
информационный блок – данный блок содержит в себе структурированный лекционный материал по дисциплине;
блок тестирования – данный блок содержит в себе тесты по дисциплине, разделённые по степени прохождения курса.
2.5 Построение UML-диаграмм
Unified Modeling Language, сокращённо UML, применяется на различных этапах разработки программного обеспечения (ПО). UML переводится как унифицированный язык моделирования.
В UML программы представляются диаграммами. В UML диаграммах представляется общая архитектура программы или её особенности, в UML-диаграммах создаётся только модель будущей программы. Язык UML является довольно высоким уровнем абстракции, поэтому программы, написанные на UML, впоследствии можно реализовать на любом языке, в котором есть достаточно возможностей объектно-ориентированного программирования.
Unified Modeling Language может использоваться на различных этапах разработки ПО: как во время проектирования ПО, так и во время кодирования на конкретном языке. Так как UML представлен диаграммами, то этот язык используется не только программистами, но и, например, менеджерами в компаниях, разрабатывающих ПО.
Необходимо построить следующие диаграммы UML:
диаграмма вариантов использования;
диаграмма компонентов;
диаграмма состояний.
Диаграмма прецедентов или диаграмма вариантов использования — диаграмма, на которой отражены отношения, существующие между актёрами и прецедентами.
Актёр— множество логически связанных ролей в UML, исполняемых при взаимодействии с прецедентами или сущностями (система, подсистема или класс). Актёром может быть человек или другая система, подсистема или класс, которые представляют нечто вне сущности.
Любые (в том числе и программные) системы проектируются с учетом того, что в процессе своей работы они будут использоваться людьми и/или взаимодействовать с другими системами. Сущности, с которыми взаимодействует система в процессе своей работы, называются актёрами, причем каждый актёр ожидает, что система будет вести себя строго определенным, предсказуемым образом.
Прецедент, также: вариант использования, сценарий использования — это спецификация последовательностей действий (варианты последовательностей и ошибочные последовательности) в Унифицированном языке моделирования (UML), которые может осуществлять система, подсистема или класс, взаимодействуя с внешними актёрами.
Основная задача — представлять собой единое средство, дающее возможность заказчику, конечному пользователю и разработчику совместно обсуждать функциональность и поведение системы.
Цели разработки диаграммы прецедентов:
обозначить границы и контекст предметной области;
определить требования к функциям моделируемой системы;
разработать исходную концептуальную модель системы для отображения в виде физических и логических моделей;
подготовить документацию для реализации взаимодействия разработчиков системы с ее заказчиком и конечными пользователями.
Рисунок 2.3 – Диаграмма вариантов использования (прецедентов)
Диаграмма состояний — ориентированный граф для конечного автомата, в котором вершины обозначают состояния, а дуги показывают переходы между двумя состояниями. Понятие автомата в контексте UML обладает довольно специфической семантикой, основанной на теории автоматов. Вершинами этого графа являются состояния и некоторые другие типы элементов автомата (псевдосостояния), которые изображаются соответствующими графическими символами. Дуги графа служат для обозначения переходов из состояния в состояние. Диаграммы состояний могут быть вложены друг в друга, образуя вложенные диаграммы более детального представления отдельных элементов модели.
Главное предназначение этой диаграммы – описать возможные последовательности состояний и переходов, которые в совокупности характеризуют поведение элемента модели в течение его жизненного цикла. Диаграмма состояний представляет динамическое поведение сущностей, на основе спецификации их реакции на восприятие некоторых конкретных событий. Системы, которые реагируют на внешние действия от других систем или от пользователей, иногда называют реактивными. Если такие действия инициируются в произвольные случайные моменты времени, то говорят об асинхронном поведении модели. Хотя диаграммы состояний чаще всего используются для описания поведения отдельных экземпляров классов (объектов), но они также могут быть применены для спецификации функциональности других компонентов моделей, таких как варианты использования, актеры, подсистемы, операции и методы.
Рисунок 2.4 – Диаграмма состояний
На рисунке 2.5 представлен вариант диаграммы состояний для варианта входа администратора на ресурс.
Рисунок 2.5 – Диаграмма состояний для варинта использования администратором ресурса
КОРРЕКТНАЯ РАБОТА САЙТА, ВЫРАЖЕННАЯ В ПРАВИЛЬНОМ ОТОБРАЖЕНИИ ВО ВСЕХ РАСПРОСТРАНЁННЫХ ТИПАХ БРАУЗЕРОВ
ПРАВИЛЬНОЕ ГРАФИЧЕСКОЕ РЕШЕНИЕ ТИПОВОЙ СТРАНИЦЫ САЙТА
ОБЩИЕ ТРЕБОВАНИЯ К СОЗДАНИЮ САЙТОВ
ПРИМЕНЕНИЕ ПРАВИЛ ТИПОГРАФИКИ, ПРАВИЛЬНЕО РАССТАВЛЕНИЕ АБЗАЦЕВ, ОПРАВДАННОЕ УПОТРЕБЛЕНИЕ СПИСКОВ
ОПЕРАТИВНОСТЬ ОБНОВЛЕНИЯ ИНФОРМАЦИИ
Рисунок 2.4 - Общие требования к созданию сайтов
ИСПОЛЬЗОВАНИЕ ИНТЕРАКТИВНЫХ ЭЛЕМЕНТОВ НА САЙТЕ
СООТВЕТСТВИЕ ПРЕДСТАВЛЕННОЙ ИНФОРМАЦИИ ЦЕЛЕВОМУ НАЗНАЧЕНИЮ САЙТА
НАЛИЧИЕ НАВИГАЦИИ НА САЙТЕ
Итоговое тестирование
ИНФОРМАЦИОННЫЙ БЛОК
АВТОРИЗАЦИЯ ПОЛЬЗОВАТЕЛЯ
БЛОК ТЕСТИРОВАНИЯ
Регистрация пользователя, внесение его данных в БД
Тестирование по модулям
Рисунок 2.5 – Структурная схема создаваемого образовательного сайта
Входное тестирование
ОБРАЗОВАТЕЛЬНЫЙ САЙТ
Лекционные блоки