ВКР (Информационное веб-приложение для ООО Двадцать семь), страница 3

$password= $_POST['pass'];

в соответствии с этими переменными составляется SQL-запрос к базе данных, выбирающий запись, соответствующую введенным логину и паролю:

$lo = "SELECT * FROM b180798_ob.Admin WHERE Login='$login' and password='$password'";

Запрос выполняется следующей функцией:

$sqlquery=mysqli_query($msql, $lo);

Если соответствующая строка находится, то возвращаемое число рядов будет больше нуля. В таком случае переменной сессии, отвечающей за авторизацию пользователя $_SESSION["avtorizovan"], присваивается значение «true» и выполняется переход на одну из страниц администратора:

if (mysqli_affected_rows($msql) > 0) {

$_SESSION["avtorizovan"] = true;

header("Location: http://obstrok.ru/Admin-1.php");

exit;}

Если же соответствующей записи не находится, то переменной $_SESSION["avtorizovan"] присваивается значение «false» и сессия закрывается, предварительно удалив все свои переменные:

else {$_SESSION["avtorizovan"] = false;

$_SESSION = array();

session_destroy();}

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

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

if((!iset($_SESSION["avtorizovan"]))|($_SESSION["avtorizovan"] = false))

{$_SESSION = array();

session_destroy();

header("Location: http://obsrok/Admin.php");

exit;}

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

if(isset($_POST['exit']))

{$_SESSION = array();

session_destroy();}

Кроме того, если пользователь уже авторизован и снова заходит на страницу авторизации – происходит перенаправление на одну из страниц закрытого раздела администратора:

if(isset($_SESSION["avtorizovan"]))

{header("Location: http://obsrok/Admin-1.php");}

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

Кроме серверного языка веб-программирования, так же важную роль играет использование клиентского языка JavaScript.

JavaScript – это язык программирования, позволяющий сделать веб-страницу интерактивной, то есть реагирующей на действия пользователя [2].

В данной работе JavaScript используется для проверки выполнения ограничения по формату загружаемого файла, а также для обработки доступности кнопки подачи объявления или банера в зависимости от согласия пользователя с условиями размещения. Часто JavaScript используется в совокупности с библиотекой JQuery.

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

на основе которой написан код обработки кнопок выбора раздела для просмотра объявлений. Также JavaScript вместе с JQuery задействованы для вывода модального окна, в котором отображаются условия размещения пользователем объявлений и банерной рекламы.

Кроме основных технологий по созданию веб-приложений всё чаще используются фреймворки и различные библиотеки. Фреймворк (Framework) - это программный каркас из набора программных шаблонов, позволяющей на своей основе создать сайт под любые задачи. Фреймворк не является CMS системой и включает только библиотеки и инструменты для разработки проектов под конкретную архитектуру. Создание сайта на фреймворке, в отличие от разработки на готовых платформах, позволяет писать код под конкретный функционал, что исключает вероятность нагромождения лишнего функционала как в теле страницы, так и в административной панели [7].

Одним из наиболее известных фреймворков HTML, CSS, и JavaScript является Bootstrap.

Он содержит большое количество часто встречающихся компонентов: меню, навигация, элементы форм, заголовки и др. Еще одним важным аспектом является многоколоночная вёрстка. Bootstrap не просто вставляет элементы на страницу, он сразу же устанавливает их оформление и взаимодействие с пользователем через JavaScript. Исходные коды библиотеки открыты и их можно изменять и расширять в процессе разработки под свои нужды [8].

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

2 Дизайн веб-приложения

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

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

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

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

2.1 Уровни разработки

В зависимости от спроектированного дизайна, при работе пользователя с интерфейсом приложения складывается опыт взаимодействия, на основе которого пользователь определяет, насколько удобно ему было работать с данным приложением и возникнет ли у него желание работать с ним снова или нет [17].

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

2.1.1 Уровень стратегии

Данный уровень определяет цели приложения и потребности пользователей.

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

Чем точнее будут сформулированы цели и потребности, тем качественнее будет сформирована стратегия.

Стратегией приложения целиком определяется набор возможностей [12].

2.1.2 Уровень набора возможностей

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

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

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

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

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

Говоря о контенте, мы чаще всего имеем ввиду текст. Однако нельзя забывать, что изображения, звуки видео тоже являются контентом. Эти разные виды контента могут комбинироваться, чтобы удовлетворить какому-то одному требованию [12].

2.1.3 Уровень структуры

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

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

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

В сфере создания контента структурирование опыта взаимодействия – это вопрос информационной архитектуры.

Как информационная архитектура, так и проектирование взаимодействия влияют на определение паттернов взаимодействия с пользователем и их последовательность. Проектирование взаимодействия имеет отношение к реализации возможностей, позволяющих пользователю решать задачи, а информационная архитектура – к реализации возможностей, связанных с предоставлением пользователю информации [12].

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

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

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

Первая и самая лучшая защита от ошибок – это разработка такой системы, в которой ошибки пользователей просто невозможны.

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

Информативные сообщения об ошибках и хорошо продуманные интерфейсы во многих случаях помогут пользователям обнаружить совершенные ошибки. Однако, некоторые действия пользователя могут вначале казаться корректными, а потом будет слишком поздно, чтобы система могла их обработать. В таких случаях система должна предоставить пользователю способ восстановления после ошибки. Самым известным примером такой функции является «отмена действия», однако восстановление после ошибки может принимать разные формы. Если восстановление невозможно, то единственным доступным способом удержать пользователя от ошибки является большое количество предупреждений. Однако слишком большое количество предупреждений может также вызвать негативное восприятие пользователем [12].

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