Разработка web-приложения на примере компьютерного теста по информатике

Разработка web-приложения на примере компьютерного теста по информатике

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

Введение…………………………………………………………………………...3
Глава 1. Теоретическая часть…………………………………………………….6
1.1 PHP как средство разработки сайта………………………………………….6
Глава 2. Обзор существующих сайтов для компьютерного тестирования…..13
2.1 Информационно-образовательный портал для учителя информатики и ИКТ http://www.klyaksa.net...................................................................................13
2.2 Официальный информационный портал единого государственного экзамена http://www.ege.edu.ru/............................................................................15
2.3 Единый портал Интернет-тестирования в сфере образования www.i exam.ru……………………………………………………………………………17
Глава 3. Технические требования к web приложению ………………………..20
3.1 Типы сайтов……………………………………………………………….20
3.2 Структура сайта…………………………………………………………...22
3.3 Требования к дизайну сайта……………………………………………...23
3.4 Требования к функциональности………………………………………...24
3.5 Средства разработки……………………………………………………...25
Глава 4. Практическая реализация web-приложения на примере компьютерного теста по информатике................................................................26
4.1 Руководство администратора…………………………………………….....26
4.2 Описание программы………………………………………………………..47
Заключение……………………………………………………………………….60
Литература ……………………………………………………………………….63

Разработка web-приложения на примере компьютерного теста по информатике

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

При этом требующаяся информация, содержащаяся в базе данных, вставляется в заранее разработанный шаблон страницы. В итоге появляется полноценная веб-страница.Распространенная разновидность динамических веб-страниц - веб-страницы результатов поиска по базе данных. Динамические веб-страницы создаются (генерируются) тогда, когда их запрашивает пользователь.Отображение динамически создаваемой вебстраницы может изменяться от настроек пользователя, браузера и других технических параметров.С точки зрения гибкости и возможности настроек, динамические страницы имеют целый ряд преимуществ перед статическими страницами.Структура сайтаСтруктура сайта — основа для формы отображения имеющихся данных на сайте. При правильной структуре сайта пользователям максимально удобно переходить от одной страничкик другой и изучать необходимые для них сведения. Первый вид структуры сайта является линейный. Он называется так потому, что в нем вся информация представлена в линейном виде. Это как будто цепочка, где все элементы послушно следуют друг за другом. Здесь не может быть разделов, и пользователь не может перескакивать с одной страницы на другую в любой последовательности, он получает возможность лишь плавно переходить по заданной траектории, так, как будто он читает книгу. Данный вид структуры сайта подходит для создания презентаций либо онлайн-книг, его очень просто реализовать. Навигация здесь необходима минимальная, на каждой странице нужно обозначить лишь три основные ссылки: на главную страницу, на предшествующую и последующую.В качестве расширенной формы этого вида структуры сайта представлен линейный с ответвлениями. Он содержит несколько веток и на главной странице посетитель может выбрать, по какой из них идти дальше, и в зависимости от выбора ему будет представлена та или иная цепочка сведений.Но самым многофункциональным и развитым можно назвать древовидный вид структуры сайта. Это форма представления данных, выраженная в форме многоуровневой иерархии. То есть, вся структура может содержать большое количество разделов и подразделов, внутренних страниц любой вложенности и в произвольной последовательности. В таком формате можно выполнить совершенно любой веб-ресурс, причем вне зависимости от того, посвящен он одной тематике или сразу нескольким различным областям. Однако здесь следует быть осторожным, ведь вы можете запутать своих посетителей в лабиринте составных частей проекта. Чтобы этого не случилось, при выборе подобного вида структуры сайта следует хорошо позаботиться о подробной и удобной навигации, понятном интерфейсе.Существует еще один вид структуры сайта – решетчатый. Он выполняется практически по тем же стандартам, что и древовидный, но в его составе есть особая функция, которая помогает в один клик переместиться с одной части веб-проекта в совершенно противоположную. В большинстве случаев такой ход лишь усложняет разработку сайта, так что данный вид структуры сайта применяется лишь в среде разработчиков каталогов.Требования к дизайну сайтаИз-за специфики работы с информацией, представление которой осуществляется при помощи современных информационных технологий, особое значение приобретает графический дизайн. Можно выделить наиболее общие требования к графическому интерфейсу:Привлекательность дизайн-решения для основной группы пользователей;Уникальность и запоминаемость;Гибкость дизайн-решения.Привлекательность дизайн-решения наряду с информационной ценностью зависит пользователя задержаться на портале и внимательнее отнестись к увиденному. Правильно спроектированный дизайн облегчает восприятие информационного материала. Привлекательность определяется соответствием решения основным понятием и принципам веб-дизайна для всех элементов портала.Уникальность и запоминаемость графического интерфейса пользователя оставляет образный отпечаток в подсознании, позволяет идентифицировать ресурс как знакомый и формирует к нему доверительное отношение. Кроме того, интерфейс должен удовлетворять определенным эргономическим требованиям, то есть обеспечить комфортность действий и ускорить адаптацию пользователей к информационной среде. Информационный материал должен быть подан таким образом, чтобы он достаточно удобен для восприятия. Образовательная специфика портала и ее особенности должны быть раскрыты в дизайне интерфейса портала на стадии его разработки.Под гибкостью дизайн-решения портала понимается обеспечение быстрой и качественной адаптации к возможным изменениям на уровне выполняемых функций и платформы. Разработка дизайна интернет-приложения должна происходить с учетом дальнейшего масштабируемости приложения. Расширение его свойств и возможностей не должно приводить к постоянной переработки графического дизайна интерфейса[4].Требования к функциональностиЛегкость использования (простота работы с прикладными программами и максимально удобный интерфейс); производительность и быстродействие; достоверность данных; защита от искажения и уничтожения информации; гарантированный доступ к информации исключительно привилегированным пользователям; работа по сети (использование технологии клиент-сервер); невысокие требования к компьютерному оборудованию.Средства разработкиДля разработки web-приложения были выбраны следующие программные продукты и технологии: реляционная база данных MS SQL; HTML Hypertext Markup Language) - язык разметки гипертекстовых страниц; PHP (Hypertext Preprocessor)— скриптовый язык программирования общего назначения, интенсивно применяемый для разработки веб-приложений. В настоящее время поддерживается подавляющим большинством хостинг-провайдеров и является одним из лидеров среди языков программирования, применяющихся для создания динамических веб-сайтов;JavaScript — прототипно-ориентированный сценарный язык программирования. Является диалектом языка ECMAScript;CSS (Cascading Style Sheets) — формальный язык описания внешнего вида документа, написанного с использованием языка разметки. Преимущественно используется как средство описания, оформления внешнего вида веб-страниц, написанных с помощью языков разметки HTML и XHTML.Глава 4. Практическая реализация web-приложения на примере компьютерного теста по информатике4.1 Руководство администратораТребования к ПОНачиная с версии 3.2PHP версии 5.2.4 или выше;MySQL версии 5.0 или выше;(Необязательно (требуется для режима Multisite)) Модуль Apache mod_rewrite (для красивых адресов, называемых постоянными ссылками), в нашем случае заменен плагином rus-to-lat.До версии 3.2PHP версии 4.3 или выше;MySQL версии 4.1.2 или выше.Необходимое абонентское обслуживание для хостинга:- Обслуживание от 10 компьютеров - Обслуживание windows server - Обслуживание специализированного компьютера, терминала - Обслуживание сервера на базе ОС Linux Монтажные работы- Прокладка ВОЛС (Волоконно оптическая линия связи)- Прокладка слаботочных сетей- Настройка сетевого оборудования- Установка видеонаблюдения, СКУД (Система контроля учета доступа)- Умный дом- Сеть без WI-FI и проводовДля оператора системы – встроенные функции мониторинга и управления контентом, НСИ и учетными записями, сводящие к минимуму ошибки и человеческий фактор, автоматизированная поддержка бизнес-процессов регистрации, обработки запросов и обращений пользователей, внутренний контроль и протоколирование действий обслуживающего персонала.Приведем краткое техническое описание используемых технологий, чтобы вы имели более полное представление о применяемых инструментах в нашей работе.Касательно используемых технологий стоит отметить, что в выбранной нами системе управления контентом (cms) имеются следующие технические особенности:- основной язык программирования - PHP;- классовая структура кода;- дополнительные языки программирования для реализации визуальных функций JavaScript;- база данных MySQL;- модульная структура CMS.Для администрирования ресурса необходимо обратиться к ключевому файлу библиотеке администрирования. Как правило, этот файл не выводят виде ссылок на страницы ресурса, в целях безопасности. (А если и выводят, то только ссылку на страницу авторизации пользователей)Вход в административный интерфейсАдминистративный интерфейс представляет собой особый раздел сайта, также называемый «back-end», «панель управления» или «админпанель». Вам необходимо Войти, используя присланные доступы, для того что бы попасть на страницу, где вводиться пароль и доступ, для этого необходимо перейти по ссылке http://адрес сайта/wp-admin/. Переходу в административный раздел предшествует аутентификация (форма входа), где по желанию можно выбрать язык интерфейса (рис. 12).Рисунок 12 - Страница авторизации пользователя в Wordpress версии 3.9Главное окно интерфейсаИнтерфейс платформы WordPress интуитивно понятен и прост в использовании. Первым элементом меню системы управления является Консоль (Dashboard). Консоль оперативно сообщает сжатую информацию о том, что происходит с веб-сайтом. На ней отображается такая информация, как количество комментариев, которые ждут модерации, наличие обновлений плагинов и самой cms, а также новости, связанные с WordPress.Ниже располагается блок содержимого, который содержит основные инструменты управления сайтом.Кнопка Записи (Posts). Раздел Записи позволяет создавать, редактировать и удалять записи сайта.Кнопка Медиафайлы (Media). Данная кнопка открывает раздел управления медиа, файлами.Кнопка Ссылки (Links). Вызывает список ссылок на сторонние веб-ресурсы, которые можно использовать внутри блог-ролла.Кнопка Страницы (Pages). Данная кнопка аналогична кнопке Записи, но вызывает раздел управления страницами веб-сайта.Кнопка Комментарии (Comments). Кнопка, вызывающая раздел управления комментариями.Кнопка Внешний вид (Appearance). Вызывает раздел управления внешним видом сайта, который включает в себя: раздел управления темами веб-сайта, раздел управления виджетами, редактор и раздел управления некоторыми другими настройками дизайна.Кнопка Плагины (Plugins). Данная кнопка вызывает раздел управления плагинами.Кнопка Пользователи (Users). Вызывает раздел управления пользователями веб-сайта.Кнопка Инструменты (Tools). Вспомогательные инструменты управления сайтом.Кнопка Параметры (Settings). Главный раздел управления настройками веб-сайта.Перед Вами откроется Консоль WordPress – основное меню администрирования блога. Для администратора меню выглядит следующим образом (рис. 13):Рисунок 13 - Главная страница администратораУправление правами группМногие пользователи являются единственными авторами в своем блоге или сайте и им не требуется добавлять дополнительных пользователей сms. Однако, в случаях, когда требуется обеспечить большее количество пользователей, например, при видении нескольких блогов используется возможность WordPress по добавлению пользователей в систему управления контентом.В платформе WordPress существует пять уровней или ролей пользователей, начиная с Администратора и заканчивая Подписчиком (рис. 14).Рисунок 14 – Список ролек WordPressАдминистратор (Administrator). У данного типа пользователя есть доступ ко всем функциям блога. Это учетная запись с наивысшими возможностями контроля.Редактор (Editor). Редактор имеет доступ ко всему, что имеет отношение к содержимому блога, кроме настроек. Редактор может читать, публиковать, удалять записи, страницы, ссылки, рубрики и метки. Важно то, что если необходимо работать с контентом, то пользователь с таким типом привилегий может этим заниматься. Многие эксперты по безопасности рекомендуют владельца блогов и сайтов на базе WordPress создавать для себя дублирующую учетную запись типа редактор и пользоваться ею для ежедневной работы. Если данная учетная запись будет скомпрометирована, сам блог не пострадает, если же будет скомпрометирована учетная запись администратора, последствия будут тяжелее.Автор (Author). Авторы могут создавать и публиковать свои материалы, однако, они не могут редактировать материалы других пользователей, или добавлять новые рубрики и ссылки.Участник (Contributor). Помощники могут создавать собственные записи, однако, они не имеют права публиковать в блоге или на сайте.Подписчик (Subscriber). Подписчики могут только читать записи блога и оставлять комментарии. Эта роль может быть полезна при применении плагина почтовой рассылки.На нашем сайте пользователи не могут регистрироваться, администратор в ручную добавляет пользователей. Здесь мы опишем, как зарегистрировать нового пользователя. Для начала, зайдите в консоль, после чего нажав Пользователи - Жмем на «Добавить нового». В новом окне, заполняем все поля, и выбираем какими правами будет обладать пользователь: администратор, редактор, автор, подписчик. После того как пользователь new_user зарегистрирован, администратор увидит его учетную запись в разделе Пользователи: Права пользователя определяет администратор в разделах Параметры и Пользователи. Например, администратор может наделить выбранного пользователя правами, предложенными в выпадающем списке Изменить роль на. Вы также можете установить роль по умолчанию – тогда вновь зарегистрированный пользователь будет обладать именно этой ролью и соответствующими правами. Сделать это можно в Параметрах - Общие - Роль нового пользователя. По умолчанию пользователю также доступен личный профиль, в котором он может разместить информацию о себе и редактировать личные настройки. Основное менюВ информатике слово меню означает элемент интерфейса пользователя, позволяющий выбрать один из нескольких перечисленных вариантов [7].  Веб-страницы связаны между собой с помощью ссылок. Обычно эти ссылки называют навигационными, так как они обеспечивают передвижение по страницам сайта, а когда ссылки, ведущие на страницы сайта оформляют единым блоком, то получается навигационное меню.Для работы с меню сайта, Вам требуется перейти в вкладку (Внешний вид - Меню). Рисунок 15 – Меню cms WordpressС помощью данного функционала редактируется или создается горизонтальное меню, которое отображается на сайте. Для того чтобы создать меню, Вам требуется: 1. Ввести название меню 2. Выбрать из списка страницы или записи. 3. Путем манипулирования с помощью мышки, Вы можете поместить меню в нужном для Вас месте, тем самым сделать организовать в меню, подменю. Нажать кнопку (Сохранить). 4. Выберите родительское меню для сайта. Как правило данное меню находиться в верхней части сайта. Чтобы настроить вертикальное меню, вам требуется: 1. Ввести название меню 2. Выбрать из списка страницы или записи. 3. Путем манипулирования с помощью мышки, Вы можете поместить меню в нужном для Вас месте, тем самым сделать организовать в меню, подменю. Нажать кнопку (Сохранить). 4. Перейдите в (Внешний Вид - Виджеты) после чего требуется выбрать виджет (Vertical Menu), путем манипуляций мыши, перетянуть в правую область экрана и разместит в нужной позиции. 5. Выбрать (Custom Menu) и совершить выбор ранее сознанного меню. 6. Нажать кнопку (Сохранить меню). После проделанный манипуляций произойдут выбранные вами изменения.Создание контентаОбратите внимание на удобное выпадающее меню справа, которое предлагает быстро перейти к той или иной возможности. На каждой странице меню содержит разные наборы возможностей, например, на странице Записи, о которой речь пойдет далее, меню выглядит так:Рисунок 16 – Пункты быстрого создания элемента «Добавить»Здесь же правее находятся еще две опции - настройка экрана (позволяет настроить структуру страницы администрирования, количество объектов, колонок, записей на ней и проч.) и помощь (краткая справка, в случае, если ее не хватает, вы всегда можете перейти по ссылке на документацию). Перед созданием страниц на сайте, Вам нужно определиться, в каком формате она должна быть. Записи – годиться для ведения новостей и прочего информативного контента, который располагается в специальных категориях. К записям возможно привязывать превью изображение. Может включать в себя время публикации, автора статьи, комментарии и прочее. Страницы – предназначены для организации основных страниц сайта. Рассмотрим подробнее Для того чтобы добавить страницу, требуется в консоли подвести курсор к ссылке (Страницы) и нажать (добавить новую). Рисунок 17 – Добавление новой страницыПеред Вами откроется специальный интуитивно понятный редактор. Редактирование страниц доступно в двух вариантах: HTML и Визуальный. В окне редактора добавляется, редактируется контент. Добавляются медиа файлы и прочее. Так же в правой области сайта, Вы можете выбрать корневую страницу или оставить опцию не стронутой «Нет родительской». Запланировать публикацию, сохранить запись как Черновик или Опубликовать страницу.Рисунок 18 – Окно параметров новой страницыВыбор корневой страницы позволяет организовать выпадающее меню, если таковое предусмотрено на Вашем сайте. Если необходимые страницы не отображаются на сайте, Вам требуется добавить их в нужное меню и убедиться в работоспособности меню. Настройку меню сайта, мы рассмотрим позже. Создание записей Данный раздел позволяет вам создавать новые Записи (Меню → Добавить новую):Рисунок 19 – Окно добавления новой записи После создания записи вы можете сохранить, запланировать публикацию или опубликовать. Так же к записи предусмотрена привязка превью изображений, выбор специальной рубрики или рубрик, метки – с помощью которых можно привязывать ключевые слова данной статьи и возможный дополнительный функционал. Для редактирования записи или страницы достаточно перейти в (меню - страницы) или (меню - записи) и открыть нужный для Вам контент. Вы имеете возможность: Изменить, Просмотреть, Удалить запись или страницу. WordPress позволяет применять групповые изменения сразу к нескольким выбранным записям: вы можете самостоятельно выбрать из списка нужные записи, выбрать все записи, а также отфильтровать по дате и/или рубрике – эти возможности доступны в верхней части страницы раздела Редактирование записей. Метки записи – раздел для управления метками – добавления, удаления, редактирования. Рубрики – раздел управления рубрикамиС помощью CMS можно создавать и редактировать.Разделы статей, предназначенный для объединения статей в группы.Статьи - информационные страницы сайта.Параграфы - составляющие элементы статьи.Структура и элементы статьиЕсли попытаться разбить информационное наполнение страниц на логические элементы, то каждая страница может содержать:Заголовки.Абзацы (блоки текста).Изображения.Ссылки.Таблицы.В терминологии CMS все эти элементы называются параграфами, так как каждый из них представляет собой отдельный блок страницы. Список типов параграфов далеко не полон. Развивая CMS, можно добавлять новые типы параграфов, выделяя их из структуры страниц по каким то критериям.Параграф - это структурные элементы статей. Они не обладают оформлением и дизайном. Оформление присваивается параграфам в виде стилей. Каждый параграф в зависимости от его типа может иметь несколько стилей, один из которых должен быть установлен ему в системе администрирования.Например, «Заголовок» может иметь стили:Название страницы.Обычный заголовок.Важный блок страницы.Заголовок примечания.Абзацу могут быть присвоены следующие стили:Обычный текст.Текст с отступом.Подпись к картинке.Примечание.Стили содержат не только оформление, но и логику поведения элементов, например, у элемента «Ссылка» могут быть стили:Открыть ссылку в новом окне.Открыть ссылку в текущем окне.Открыть ссылку во всплывающем окне.Последний стиль в основном используется, если ссылка указывает на отдельное изображение.Набор стилей для каждого элемента можно дополнять, развивая функциональность CMS.Добавление на сайт медиафайлов WordPress позволяет добавлять на Ваш сайт, файлы различных типов: изображения, аудио и видео файлы. Вы можете добавлять медиа файлы как в записи, так и на страницы вашего сайта. В разделе Медиафайлы вы можете добавить новый медиафайл в Библиотеку файлов. Обратите внимание на то, что для возможности загружать файлы на сайт, пользователь должен обладать соответствующими правами, которыми наделяет его администратор.