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

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

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

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

Для достижения поставленной цели необходимо выполнить ряд задач:

 выполнить анализ предметной области;

 выбрать средства разработки;

 выполнить проектирование макетов информационного сервиса, разработать дизайн сайта;

 реализовать информационный сервис;

 протестировать сервис на функциональность, корректное отображение контента на различных устройствах.

ВВЕДЕНИЕ..................................................................................................... 3

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

1.1.      Процесс создания сайта....................................................................... 4

1.2.      Типология сайтов................................................................................ 5

2.              Проектирование сайта............................................................................ 7

2.1.      Проектирование структуры сайта...................................................... 7

2.2.      Средства разработки........................................................................... 8

2.3.      Создание базы данных........................................................................ 9

3.              Реализация информационной системы................................................ 11

3.1.      Разработка дизайна сайта................................................................. 11

3.2.      Формы обратной связи..................................................................... 13

3.3.      Информационное наполнение сайта................................................. 17

3.4.      Оконный калькулятор....................................................................... 21

3.5.      Реализация адаптивности.................................................................. 24

4.              Тестирование сайта.............................................................................. 26

4.1.      Функциональное тестирование......................................................... 26

4.2.      Тестирование адаптивности.............................................................. 28

4.3.      Тестирование веб-отображения........................................................ 31

ЗАКЛЮЧЕНИЕ............................................................................................. 32

СПИСОК ЛИТЕРАТУРЫ............................................................................. 37

ПРИЛОЖЕНИЯ..................................................................................................... 39

1. Диков А. В. Клиентские технологии веб-дизайна HTML5 и CSS3 : учебное пособие / А. В. Диков. – Санкт-Петербург : Издательство «Лань», 2019. – 188с. – ISBN 978-5-8114-3822-8.

2. Зенкович Андрей Базовые UI/UX паттерны // Habr.com [сайт]. – URL: https://habr.com/ru/post/476532/ (дата обращения: 16.04.2021).

3. http://webnotbombs.net Адаптивно-отзывчивый: разбираемся в терминологии // Frontender Magazine [сайт]. – URL: https://frontender.info/adaptive-vs-responsive-terminology/ (дата обращения: 17.04.2021).

4. Глазычев В.Л. Дизайн как он есть. : издание / В.Л. Глазычев – М.: Издательство «Европа», 2006. – 320 с. – ISBN 5-9739-0066-5.

5. Типичный программист Как работает CSS Flexbox: наглядное введение в систему компоновки элементов на веб-странице // Tproger [сайт].

– URL: https://tproger.ru/translations/how-css-flexbox-works/ (дата обращения: 22.04.2021).

6. Stas agretsov Вёрстка на Grid в CSS. Полное руководство и справочник     //            Medium     [сайт].     –                        U L: https://medium.com/ stasonmars/вёрстка-на-grid-в-css-полное-руководство-и- справочник-220508316f8b (дата обращения: 22.04.2021).

7. FancyBox - фотогалерея + модальные окна // useller.com [сайт]. – URL: https://ruseller.com/lessons.php?rub=32&id=238 (дата обращения: 23.04.2021).

8. Тег | htmlbook.ru // Htmlbook.ru [сайт]. – URL: http://htmlbook.ru/html/option (дата обращения: 26.04.2021).

9. Contributors to Wikimedia projects элемент графического пользовательского интерфейса программ // Wikipedia.org [сайт]. – URL: https://ru.wikipedia.org/wiki/Флажок_(интерфейс)      (дата         обращения: 26.04.2021).

10.          Contributors to Wikimedia projects иконка, отображающая меню навигации // Wikipedia.org [сайт]. – URL: https://ru.wikipedia.org/wiki/ Гамбургер_(иконка) (дата обращения: 28.04.2021).