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

Текст из файла (страница 3)

Для описания элементов пользовательского интерфейса и обработки действий пользователя они используют собственные языки ActionScript, XAML и JavaFX Script [25].

Протоколы, на базе которых происходит обмен сообщениями в Web-приложениях

Протокол передачи гипертекста (Hypertext Transfer Protocol, HTTP) является основным протоколом, используемым для передачи сообщений и данных в Web-приложениях. Он предназначен для передачи прежде всего текстовых сообщений между слабо связанными сервером и клиентом. HTTP удобен тем, что большинство сетей заранее настроено на прием сообщений по этому протоколу, поскольку браузеры используются повсеместно; для многих других протоколов нужна специальная настройка, соответствующие порты по умолчанию закрыты во многих сетях. Поэтому использование Web-приложений не требует специальной настройки сетей.

Протоколы взаимодействия Web-служб. Базовым протоколом передачи обращений Web-служб друг к другу является простой протокол доступа к объектам (Simple Object Access Protocol, SOAP). Он работает поверх HTTP (реже используются протоколы удаленных вызовов RPC) и определяет на базе XML формат текстовых сообщений, в которых передается информация

о вызовах операций или их результаты. В дополнение к SOAP разрабатываются многочисленные протоколы с названиями, начинающимися на WS (WS-Security, WS-Addressing, WS-Discovery, WS-Coordination и т.п.), которые предназначены для обеспечения дополнительных характеристик взаимодействия Web-служб – поддержки шифрования, аутентификации участников, интроспекции, транзакций, координации нескольких Web-служб в рамках сценария взаимодействия, т.д.

Основные технологии разработки Web-приложений приведены в таблице 2.1.

Таблица 2.1 – Технологии разработки Web-приложений

	API	Протоколы	Языки	Диалекты, смеси	Технологии
Описание содержимого страниц и их представления		HTTP	XML HTML CSS	XHTML
Описание клиентских сценариев	DOM		ECMAScript	ActionScript JScript JavaScript	Flex Silverlight JavaFX
Серверные сценарии	ISAPI Servlet	CGI	Java C# Perl PHP Ruby Python	JSP JSTL JSF ASP.NET – Web Forms	J2EE .NET

2.3. Технологии продвижения Web-приложений

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

Продвижение web-приложений и контекстная реклама – мощные инструменты для привлечения пользователей на интернет-ресурс.

SEO (продвижение в поисковых системах)

Продвижение интернет ресурсов или как его называют seo продвижение (SEO – Search Engine Optimization, оптимизация под поисковые движки) служит для того, чтобы web-приложение при поисковом запросе в Яндекс или Google занимал строчку как можно выше. Результатом поисковой оптимизации будет Топ-10, Топ-5, а со временем, возможно, и Топ-1.

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

Для увеличения посещаемости сайта необходимо провести ряд мероприятий:

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

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

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

Написание уникального текстового контента позволит гораздо быстрей поднять web-приложение в Топ.

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

Контекстная реклама

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

Контекстная реклама нацелена именно на конкретных пользователей, которые ищут именно по запросам компании «здесь и сейчас». Плюсом такой рекламы является ее стоимость. Компания платит только за клики, за переход пользователя на web-приложение.

Медийная реклама

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

SMM (продвижение в социальных сетях)

SMM (Social media marketing) – увеличение посещаемости web-приложения путем продвижения в социальных сетях. Обычно, благодаря социальным сетям, пользователи сами распространяют контент, без участия организатора. Считается, что сообщения в социальных сетях вызывают больше доверия, ведь их распространяют такие же потребители [32].

2.4. Выбор технологий для реализации проекта

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

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

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

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

Для работы с базами данных использован MySQL. MySQL отличатся хорошей скоростью работы, гибкостью, надежностью [15].

Для более быстрой разработки использован Фреймворк MODX Revolution. Данный фреймворк ускоряет разработку Web-приложений, написан на javaScript, имеет отличную поддержку PHP.

В качестве технологии для продвижения Web-приложения использована контекстная реклама, а также SMM (маркетинговая реклама в социальных сетях). Для данного web-приложения SMM является дополнительным источником трафика. Контекстная реклама является основным источником трафика. Это быстрый и очень эффективный способ продвижения, так как такая реклама показывается пользователям, которые искали данный товар или услугу. Так как основными поисковыми площадками были выбраны Яндекс и Google, то данный вид продвижения является самым оптимальным для привлечения новых клиентов и покупателей.

Таким образом, для разработки Web-приложения электронной коммерции для студии косметологии «AxyBeauty» использованы технологии – Adobe Photoshop CC2015, CorelDRAW X7, HTML5, CSS3, JavaScript, PHP, AJAX MySQL, MODX Revolution.

3 Проектирование web-приложения

3.1. Разработка Дизайна Web-приложения

Дизайн Web-приложения делится на две части: информационная часть и часть интернет-магазина. Весь дизайн выполнен в фирменной цветовой гамме предприятия (рисунок 1.2). В качестве фона Web-приложения выбран белый цвет, на котором размещен паттерн в виде нежных штрихов чёрно-белым карандашом. Сверху и снизу в качестве декоративного обрамления используется черная штриховая линия. Графика на сайте подбиралась с учётом пожеланий компании: все графические элементы должны символизировать легкость и воздушность, а также не должны содержать в себе острых, грубых, жирных элементов. Так как графические элементы содержат в себе белый либо прозрачный фон, то для выделения их на странице ресурса использованы нарисованные от руки рамки, имеющие акцентный цвет. При наведении на графические элементы и кнопки, поверх них появляется штриховой фон, который оповещает пользователя о том, что он навел курсор на определенное изображение. Отображение графических элементов на главной странице представлено на рисунке 3.1.

Рисунок 3.1 – Графические элементы на главной странице

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

Для меню в информационной части Web-приложения выбран шрифт бледно-серого цвета размером 30px. При наведении цвет текста в меню меняется на черный. Подменю стилизованно под общую концепцию web-приложения, имеет белый фон, рисованную от руки рамку, размер шрифта 26px. Меню информационной части представлено на рисунке 3.2.

Рисунок 3.2 – Меню информационной части Web-приложения

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

Макет главной страницы Web-приложения представлен на рисунке 3.3.

Рисунок 3.3 – Макет главной страницы

Все остальные разделы информационной части имеют общую концепцию построения, за исключением некоторых особенностей: раздел «О Нас» имеет на всю ширину, по центру, изображение, которое символизирует миссию и ценности компании, ниже, по правой стороне расположена цитата, шрифт Ariston, размер шрифта 45px, еще ниже расположен контент, шрифт Century Gothic, размер шрифта 20px. Макет раздела «О Нас» представлен на рисунке 3.4.

Рисунок 3.4 – Макет главной страницы

Раздел «Контакты» имеет на всю ширину экрана интерактивную карту проезда, также номер телефона, почту, и полный адрес. Ниже представлена контактная форма, отображение стандартных элементов которой изменены в соответствии с дизайном. Макет раздела «Контакты» представлен на рисунке 3.5.

Раздел «Новости» представляет собой блог, содержит в себе обзор новостей и событий, которые модерируются менеджером компании.

Рисунок 3.5 – Макет главной страницы

Разделы «Красота», «Здоровье», «Стройность» содержат в себе большое описание информации, для ее структурирования используются вложенные друг в друга выпадающие панели. Раздел «Подарки для любимых» содержит в себе информацию о сертификатах, реализуемых компанией в своей профессиональной деятельности. Раздел «Акции и скидки» информирует пользователей об интересных акциях и скидках проходящих в компании.

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

3.2. Разработка клиентской части Web-приложения

Для разработки клиентской части Web-приложения использован Фреймворк MODX REVOLUTION, а также технологии HTML5, CSS3, JavaScript. При разработке структуры страниц были использованы все теги HTML5. Часть HTML кода Web-приложения представлена в листинге 3.1. Структура всех интерфейсов Web-приложения представлена на рисунке 3.6.

Рисунок 3.6 – Структура интерфейсов Web-приложения

Листинг 3.1 – HTML код Web-приложения

<!doctype html>

<>

Характеристики

Список файлов ВКР