Web-сайт для логістичної компанії

Чекаленко, Олександр Леонідович

Please use this identifier to cite or link to this item: https://er.chdtu.edu.ua/handle/ChSTU/5450

Title:	Web-сайт для логістичної компанії
Authors:	Тарасенко, Ярослав Володимирович Чекаленко, Олександр Леонідович
Keywords:	логістика;логістична компанія;веб-сайт;JavaScript;розробка
Issue Date:	15-Jun-2023
Abstract:	В кваліфікаційній роботі бакалавра розглянуто дослідження в області розробки веб-сайту для логістичної компанії. Мета роботи – розробити веб-сайт для логістичної компанії. Предметом дослідження є розробка веб-сайту і всі її аспекти, які включають архітектуру системи, вибір і налаштування технологій та інструментів, розробку бекенд-функцій, інтеграцію з базою даних, а також аспекти, пов'язані з ефективним функціонуванням веб-сайту логістичної компанії. В першому розділі розглянуто аналоги які існують на логістичному ринку України, та компанії які задають розвиток транспортнологістичному напрямку України, а також розглянуто переваги та недоліки даних систем. В другому розділі виконані основні функції яких веб розробка а саме постановка задач які будуть потрібні при розробці сайту, а також вибір програмного забезпечення яке потрібне для розробки, а також проведення аналізу програмних продуктів для розробки. В третьому розділі створено та реалізовано скрипти які забезпечують основний функціонал веб-сайту, а також розробка вебдизайну згідно з урахування корпоративного стиля логістичної компанії, та було розроблено лендінг сторінку компанії, а також проведено тестування веб-сайту та проведено порівняння з існуючими аналогами.
URI:	https://er.chdtu.edu.ua/handle/ChSTU/5450
Appears in Collections:	126 Інформаційні системи та технології (Web-технології, web-дизайн)

Files in This Item:

File	Description	Size	Format
РЕП_БАК_Чекаленко_WebC-2111.pdf Restricted Access	Web-сайт для логістичної компанії	1.43 MB	Adobe PDF	View/Open Request a copy

Show full item record

Extracted text

МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ ЧЕРКАСЬКИЙ
ДЕРЖАВНИЙ ТЕХНОЛОГІЧНИЙ УНІВЕРСИТЕТ
ФАКУЛЬТЕТ ІНФОРМАЦІЙНИХ ТЕХНОЛОГІЙ І СИСТЕМ
КАФЕДРА ІНФОРМАЦІЙНИХ ТЕХНОЛОГІЙ ПРОЕКТУВАННЯ

ПОЯСНЮВАЛЬНА ЗАПИСКА
до кваліфікаційної роботи бакалавра

на тему: «Web-сайт для логістичної компанії »

Виконав: здобувач першого
(бакалаврського) рівня вищої
освіти
2 курсу, групи WebC-2111
Спеціальності 126 Інформаційні
системи та технології
ОП «Web-технології, Web-дизайн»
Чекаленко Олександр Леонідович

Керівник: доцент кафедри ІТП
Тарасенко Ярослав Володимирович

Рецензент: Директор ТОВ
«Андерсенлаб» Алесін Олег
Вікторович

Черкаси – 2023

ЧЕРКАСЬКИЙ ДЕРЖАВНИЙ ТЕХНОЛОГІЧНИЙ УНІВЕРСИТЕТ
(назва вузу)

Факультет ФІТІС Кафедра Інформаційних технологій проектування
Освітній рівень бакалавр
Спеціальність 126 “Інформаційні системи та технології”
Освітня програма “Web-технології Web-дизайн”
ЗАТВЕРДЖУЮ:
зав.Кафедри Тетяна ПРОКОПЕНКО
“ ” 2023р.
ЗАВДАННЯ
На кваліфікаційну роботу студенту

Чекаленку Олександру Леонідовичу
(прізвище, ім’я, по-батькові)
1. Тема проекту (роботи) Web-сайт для логістичної компанії
Керівник проекту(роботи) Ярослав ТАРАСЕНКО
Затверджена наказом Черкаського державного технологічного університету № 43/04
від 24.02.23
2. Термін здачі студентом закінченої роботи _01.06.2023
3. Вихідні дані до проекту (роботи) Середовище розробки Sublime Text 3; OpenServer;
Мова програмування – HTML,CSS,PhP, веб-інтерфейс для адміністрування баз даних
MySql – PhpMyAdmin.
4. Зміст розрахунково-пояснювальної записки (перелік питань, що їх належить
розробити)
ВСТУП; 1. ПОСТАНОВК ЗАДАЧ ТА ОГЛЯД ІСНУЮЧИХ АНАЛОГІВ; 1.1
Проведення аналізу логістичного ринку України; 1.2 Вивчення потреб та вимог
логістичної компанії до веб-сайту; 1.3 Аналіз аналогічних рішень на ринку їх
переваг та недоліків; 2. РОЗРОБКА ТЕХНІЧНОГО ЗАВДАННЯ; 2.1 Вибір
способу розробки веб-сайту; 2.2 Порівняльний аналіз програмного
забезпечення; 2.3 Постановка задач для розробки веб-сайту; 3. РОЗРОБКА
СИСТЕМИ; 3. Створення веб-сайту з урахуванням корпоративного стилю
логістичної компанії; 3.2 Верстка сторінок з використанням HTML, CSS та
JavaScript; 3.3 Розробка скриптів для обробки запитів, роботою з базою
даних;3.4 Тестування веб-сайту; 3.5 Порівняння функціонала сайту з
аналогами; ВИСНОВКИ; СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ; ДОДАТКИ
5. Перелік графічного матеріалу (з точним зазначенням обов’язкових
креслень)
1) Рисунок: Рейтинг мов програмування веб-сайтів;
2) Рисунок: Логотип компанії; 3) Рисунок: Перший блок сайту.

6. Консультанти з проекту із зазначенням розділів проекту, що їх стосуються

Підпис, дата
Розділ Консультант
Завдання видав, завдання
прийняв

7. Дата видачі завдання 27 лютого 2023 р.
Керівник Тарасанко Я. В,
Завдання прийняв до виконання

Календарний план
Пор. № Назва етапів дипломного проекту Термін виконання Примітка
етапів проекту
1 Підготовча стадія
1.1 Постановка задачі 28.02.2023 Виконано
1.2 Підготовка завдання 01.03.2023 Виконано
1.3 Погодження завдання 06.03.2023 Виконано
1.4 Затвердження завдання 10.03.2022 Виконано
2 Основна стадія
2.1 Підбір матеріалів 14.03.2023 Виконано
2.2 Аналіз шляхів рішення задачі 25.03.2023 Виконано
2.3 Розрахунок основних параметрів роботи 13.04.2023 Виконано
2.4 Вибір кінцевого варіанту проектного рішення 24.03.2023 Виконано
2.5 Оформлення первісної редакції роботи 01.05.2023 Виконано
3 Заключна стадія
3.1 Узгодження проектних рішень з керівником 10.05.2023 Виконано
3.2 Оформлення пояснювальної записки 19.05.2023 Виконано
3.3 Попередній захист роботи 1.06.2023 Виконано
3.4 Затвердження роботи 5.06.2023 Виконано
3.5 Рецензування роботи 7.06.2023 Виконано
3.6 Захист роботи 14.06.2023
Студент-дипломник

Керівник проекту

АНОТАЦІЯ

Кваліфікаційна робота складається з 51 сторінок, 1 таблиці, 15
рисунків, 25 джерел використаної літератури, 2 додатків. Включає в себе
такі частини: огляд існуючих аналогів, розробка технічного завдання,
розробка системи, висновки та список використаних джерел, додаток А,
додаток Б.
В кваліфікаційній роботі бакалавра розглянуто дослідження в
області розробки веб-сайту для логістичної компанії. Мета роботи –
розробити веб-сайт для логістичної компанії.
Предметом дослідження є розробка веб-сайту і всі її аспекти, які
включають архітектуру системи, вибір і налаштування технологій та
інструментів, розробку бекенд-функцій, інтеграцію з базою даних, а
також аспекти, пов'язані з ефективним функціонуванням веб-сайту
логістичної компанії.
В першому розділі розглянуто аналоги які існують на логістичному
ринку України, та компанії які задають розвиток транспортно-
логістичному напрямку України, а також розглянуто переваги та
недоліки даних систем.
В другому розділі виконані основні функції яких веб розробка а
саме постановка задач які будуть потрібні при розробці сайту, а також
вибір програмного забезпечення яке потрібне для розробки, а також
проведення аналізу програмних продуктів для розробки.
В третьому розділі створено та реалізовано скрипти які
забезпечують основний функціонал веб-сайту, а також розробка веб-
дизайну згідно з урахування корпоративного стиля логістичної компанії,
та було розроблено лендінг сторінку компанії, а також проведено
тестування веб-сайту та проведено порівняння з існуючими аналогами.
Ключові слова бакалаврської роботи є такі: логістика,
логістична компанія, веб-сайт.

ANNOTATION
The qualification work consists of 51 pages, 1 table, 15 figures, 25 sources of used
literature, 2 appendices. It includes the following parts: review of existing analogues,
development of the technical task, development of the system, conclusions and list of
used sources, appendix A, appendix B.
The bachelor's qualification work considered research in the field of website
development for a logistics company. The purpose of the work is to develop a website for
a logistics company.
The subject of the study is website development and all its aspects, which include
system architecture, selection and configuration of technologies and tools, development
of backend functions, database integration, as well as aspects related to the effective
functioning of a logistics company's website.In the first section, the goals, principles,
advantages of using web resources, requirements for them and a review of existing
analogues are considered, important aspects related to the development and use of web
resources are clarified.
In the second section, the main functions of web development are performed,
namely, the setting of tasks that will be needed during the development of the site, as well
as the selection of software that is needed for development, as well as the analysis of
software products for development.
In the third section, the scripts that provide the main functionality of the website
were created and implemented, as well as the development of the web design in accordance
with the corporate style of the logistics company, and the landing page of the company was
developed, and the website was tested and compared with existing analogues.
The keywords of the bachelor thesis are: logistics, logistics company, website.

ЗМІСТ
ПЕРЕЛІК УМОВНИХ ПОЗНАЧЕНЬ І СКОРОЧЕНЬ ......................................... 3
ВСТУП ................................................................................................................... 4
РОЗДІЛ 1. ПОСТАНОВКА ЗАДАЧ ТА ОГЛЯД ІСНУЮЧИХ АНАЛОГІВ ..... 5
1.1 Проведення аналізу логістичного ринку України .................................... 5
1.2 Вивчення потреб та вимог логістичної компанії до веб-сайту ................ 11
1.3 Аналіз аналогічних рішень на ринку їх переваг та недоліків .................. 13
РОЗДІЛ 2. РОЗРОБКА ТЕХНІЧНОГО ЗАВДАННЯ ......................................... 20
2.1 Вибір способу розробки веб-сайту........................................................... 20
2.2 Порівняльний аналіз програмного забезпечення .................................... 24
2.3 Постановка задач для розробки веб-сайту............................................... 28
РОЗДІЛ 3. РОЗРОБКА СИСТЕМИ ..................................................................... 34
3.1 Створення дизайну веб-сайту з урахуванням корпоративного стилю
логістичної компанії ................................................................................. 34
3.2 Верстка сторінок з використанням HTML, CSS та JavaScript ................ 37
3.3 Розробка серверних скриптів для обробки запитів, роботи з базою
даних ........................................................................................................... 42
3.4 Тестування веб-сайту ................................................................................ 45
3.5 Порівняння функціоналу сайту з аналогами ...........................................46
ВИСНОВКИ ......................................................................................................... 48
СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ ............................................................ 50
ДОДАТОК А
ДОДАТОК Б

ЧДТУ 232230.001 ПЗ
Зм. Лист № докумемента Підпис Дата
Розроб. Чекаленко О.Л. Літ. Лист Листів
Перев. Тарасенко Я.В. Web-сайт для логістичної компанії Н 2 45
Реценз.. Алесін О.В.
ФІТІС,
Н.контр. Тарасенко Я.В. Пояснювальна записка
кафедра ІТП, WEBC-2111
Затв. ПрокопенкоТ.О .

ПЕРЕЛІК УМОВНИХ ПОЗНАЧЕНЬ І СКОРОЧЕНЬ

HTML - HyperText Markup Language: мова розмітки, що використовується для
створення структури та відображення вмісту веб-сторінок
CSS - Cascading Style Sheets: мова стилізації, що використовується для
оформлення та вигляду веб-сторінок.
JavaScript - JavaScript: мова програмування, що використовується для
додавання динамічної функціональності до веб-сайту.
UI - User Interface: інтерфейс користувача, тобто взаємодія між користувачем
та веб-сайтом.
UX - User Experience: враження та задоволення користувача від взаємодії з
веб-сайтом.
API - Application Programming Interface: набір правил та протоколів, що
визначають, як програми можуть взаємодіяти між собою.
SEO - Search Engine Optimization: оптимізація для пошукових систем, що
дозволяє покращити видимість веб-сайту в пошукових результатах.
Арк.
ЧДТУ 232233.006 ПЗ 3
Змн. Арк. № докум. Підпис Дата

ВСТУП
У сучасному світі, де цифрові технології швидко розвиваються, веб-
сайти стають необхідним інструментом для успішного функціонування
бізнесу. Логістичні компанії не є винятком, оскільки вони відповідають за
ефективну організацію транспортування та управління ланцюгом постачання.
Ця дипломна робота присвячена розробці веб-сайту для логістичної
компанії з метою поліпшення її ділових процесів та забезпечення ефективного
управління операціями. Веб-сайт створює нові можливості для логістичної
компанії, дозволяючи їй ефективно взаємодіяти з клієнтами, керувати
замовленнями, відстежувати вантажі, керувати складами та багато іншого.
Метою цієї дипломної роботи є розробка функціонального та
естетичного веб-сайту, що відповідає потребам логістичної компанії. Для
досягнення цієї мети, були використані сучасні веб-технології та методи
розробки, такі як HTML, CSS, JavaScript та бази даних.
В рамках цієї роботи будуть розглянуті основні вимоги до веб-сайту,
включаючи управління замовленнями, відстеження вантажів, інтеграцію зі
сторонніми системами та інше. Результати цього дослідження та розробки
матимуть значний вплив на ефективність та продуктивність логістичної
компанії, сприяючи її розвитку та забезпечуючи задоволення клієнтів.
Високі вимоги до безпеки, швидкості та надійності є основними
принципами, які керували процесом розробки веб-сайту для логістичної
компанії. Крім того, розроблений веб-сайт має бути легким у використанні та
містити інтуїтивний інтерфейс для зручного навігації користувачів.
Ця дипломна робота відображає результати інтенсивних досліджень,
ретельного проектування та розробки, що включають аналіз вимог, вибір
технологій, створення архітектури веб-сайту, розробку функціональності та
тестування. Передбачається, що результати цієї роботи допоможуть
логістичній компанії покращити свою конкурентоспроможність.
Арк.
ЧДТУ 232233.006 ПЗ 4
Змн. Арк. № докум. Підпис Дата

РОЗДІЛ 1
ПОСТАНОВКА ЗАДАЧ ТА ОГЛЯД ІСНУЮЧИХ АНАЛОГІВ

1.1 Проведення аналізу логістичного ринку України

Аналіз логістичного ринку України є важливим етапом для розуміння
поточного стану галузі та визначення перспектив розвитку. Дослідження
ринку дозволяє отримати цінні уявлення про основні тенденції, конкурентний
ландшафт, сильні та слабкі сторони логістичних послуг, а також виявити
можливості для покращення та інновацій[1].
Один з головних аспектів аналізу логістичного ринку України - це його
обсяг та динаміка. З'ясування обсягу ринку, включаючи загальний обсяг
логістичних послуг, обсяги транспортних перевезень, складського зберігання
та інших сегментів, допомагає встановити його значення та потенціал для
подальшого розвитку.
Також важливим аспектом є аналіз конкурентного ландшафту.
Виявлення головних гравців на ринку, їхніх стратегій та позицій дозволяє
зрозуміти ступінь конкуренції в галузі. Оцінка сильних та слабких сторінок
конкурентів допомагає визначити основні фактори успіху та можливості для
покращення власної компанії.
Дослідження споживачів логістичних послуг та їхніх потреб є
необхідним для визначення напрямків розвитку[2].. Вивчення вимог та
очікувань клієнтів, їхньої задоволеності існуючими послугами дозволяє
розробити стратегії, спрямовані на забезпечення високої якості
обслуговування та залучення нових клієнтів.
Аналіз законодавчої та регуляторної бази, яка впливає на логістичну
галузь, також є важливим кроком. Розуміння нормативно-правового
середовища дозволяє оцінити вплив правових аспектів на функціонування
логістичних компаній та визначити можливі ризики і виклики.
На основі проведеного аналізу будуть визначені основні проблеми та
Арк.
ЧДТУ 232233.006 ПЗ 5
Змн. Арк. № докум. Підпис Дата

потенційні можливості розвитку логістичного ринку України. Це надасть
підґрунтя для подальшого розроблення стратегій та рекомендацій з
покращення роботи логістичних компаній, впровадження інноваційних
технологій та вдосконалення послуг для клієнтів.
На логістичному ринку України працює декілька провідних компаній,
які займають ключові позиції та мають значний вплив на галузь. Основні
лідери логістичного ринку України включають такі компанії:
"Нова пошта" - це одна з найбільших логістичних компаній в Україні,
яка спеціалізується на кур'єрських та експрес-доставках. Вона має широку
мережу відділень та складських приміщень по всій країні та надає послуги як
бізнес-сегменту, так і фінальним споживачам. [3]
"Делівері" - ця компанія спеціалізується на кур'єрських послугах та
доставці товарів з магазинів онлайн. Вона пропонує широкий спектр послуг,
включаючи доставку їжі, продуктів, одягу та інших товарів. [3]
"ІнТайм" - ця компанія є однією з провідних логістичних компаній в
Україні, що забезпечує послуги доставки вантажів та експрес-перевезень.
Вона пропонує широку мережу відділень та складських приміщень по всій
країні.
"DHL" - ця міжнародна логістична компанія має сильну присутність в
Україні та надає широкий спектр послуг, включаючи міжнародну доставку,
складське зберігання та керування логістичними процесами. [3]
"Укрпошта" - ця національна поштова компанія України пропонує
послуги кур'єрської доставки, експрес-перевезень та складського зберігання.
Вона має широку мережу відділень по всій країні та є надійним партнером для
багатьох бізнесів та клієнтів. [3]
Ці компанії відомі своєю надійністю, ефективністю та якістю наданих
послуг. Вони мають розгалужену інфраструктуру, широкий спектр послуг та
добре відомі бренди, що дозволяє їм займати провідні позиції на логістичному
ринку України.
Арк.
ЧДТУ 232233.006 ПЗ 6
Змн. Арк. № докум. Підпис Дата

Після того як було визначено лідерів логістичного ринку України, які
задають тенденцію та розвиток даному ринку. Я вважаю що є актуально
розглянути більш детально кожну з вище наведених компаній та її внесок та
вплив на логістичний ринок України:
1. "Нова Пошта" є однією з найбільших та найвпливовіших логістичних
компаній в Україні. Вона впроваджує інноваційні технології та розробляє
ефективні логістичні рішення, що мають значний вплив на ринок.
Основний вплив "Нової Пошти" на логістичний ринок полягає в наступному:
- Розширена мережа відділень та складських приміщень: "Нова Пошта"
має одну з найбільших мереж відділень та складських приміщень в Україні.
Це дозволяє компанії забезпечити широкий охоплення клієнтів та забезпечити
швидку доставку вантажів.
- Інноваційні технології: "Нова Пошта" активно впроваджує сучасні
технології у своїх логістичних процесах. Наприклад, вона використовує
автоматизовані системи сортування та відстеження вантажів, що сприяє
покращенню ефективності та точності доставки.
- Широкий спектр послуг: Крім кур'єрської доставки, "Нова Пошта" надає
інші логістичні послуги, такі як складське зберігання, логістичне
обслуговування, доставка по місту та міжнародна доставка. Це робить їх
привабливим вибором для клієнтів з різних галузей.
- Інноваційні рішення для електронної комерції: "Нова Пошта" активно
співпрацює з електронними майданчиками та онлайн-магазинами, надаючи їм
зручні і надійні логістичні рішення. Це сприяє розвитку електронної комерції
в Україні та спрощує процес доставки товарів клієнтам.
- Вплив на конкуренцію: Завдяки своєму розміру, ресурсам та інноваціям,
"Нова Пошта" впливає на конкурентний ландшафт логістичного ринку. Її
присутність та конкурентоспроможність спонукають інших гравців на ринку
до постійного вдосконалення своїх послуг та пропозицій.
Отже можна підсумувати, що "Нова Пошта" має значний вплив на
логістичний ринок України, впроваджуючи інновації, покращуючи якість
Арк.
ЧДТУ 232233.006 ПЗ 7
Змн. Арк. № докум. Підпис Дата

обслуговування та створюючи зручні умови для клієнтів.
2. Компанія "Делівері" є однією з найбільших та найвпливовіших
логістичних компаній в Україні. Її діяльність має значний вплив на розвиток
та функціонування логістичного ринку. Основні аспекти впливу "Делівері" на
логістичний ринок включають:
- Широкий охоплення ринку: "Делівері" має широку мережу
партнерських пунктів та складських приміщень, що покриває багато регіонів
України.
Це дозволяє компанії забезпечити швидку та ефективну доставку вантажів в
різні куточки країни.
- Інноваційні технології: "Делівері" активно впроваджує сучасні
технології в своїх логістичних процесах. Наприклад, вони використовують
мобільні додатки та онлайн-сервіси для відстеження вантажу та взаємодії з
клієнтами, що полегшує комунікацію та забезпечує більшу прозорість в
доставкових послугах.
- Співпраця з електронною комерцією: "Делівері" активно співпрацює з
електронними майданчиками та інтернет-магазинами, забезпечуючи надійну
та швидку доставку товарів покупцям. Це сприяє розвитку електронної
комерції в Україні та забезпечує зручні умови для покупців та продавців.
- Індивідуальні рішення для бізнесу: "Делівері" пропонує рішення для
бізнес-клієнтів, такі як логістичне обслуговування, складське зберігання та
інші послуги. Це дозволяє компанії виконувати специфічні потреби різних
галузей та бізнес-секторів.
- Конкурентний ландшафт: Присутність "Делівері" на ринку логістики
створює конкуренцію серед інших гравців. Це стимулює інші компанії до
постійного вдосконалення своїх послуг, впровадження інновацій та
підвищення якості обслуговування.
Отже можна підсумувати, що "Делівері" впливає на логістичний ринок
України через свою широку мережу, використання інноваційних технологій,
співпрацю з електронною комерцією та індивідуальні рішення для бізнесу.
Арк.
ЧДТУ 232233.006 ПЗ 8
Змн. Арк. № докум. Підпис Дата

Вона є ключовим гравцем на ринку та сприяє розвитку логістичної індустрії в
країні.
3. Компанія "ІнТайм" є однією з провідних логістичних компаній в Україні
і має значний вплив на логістичний ринок. Основні аспекти впливу "ІнТайм"
на ринок включають:
- Розширена мережа відділень та складських приміщень: "ІнТайм" має
велику мережу відділень та складських приміщень, що охоплює багато
регіонів України. Це дозволяє компанії забезпечувати швидку та ефективну
доставку вантажів в різні куточки країни.
- Широкий спектр послуг: "ІнТайм" надає різноманітні логістичні
послуги, такі
як кур'єрська доставка, вантажні перевезення, складське зберігання, послуги з
вивезення та інші. Це робить компанію привабливим вибором для різних
клієнтів, від дрібних бізнесів до великих корпорацій.
- Інноваційні технології: "ІнТайм" впроваджує сучасні технології в своїх
логістичних процесах, що сприяє підвищенню ефективності та точності
доставки. Вони використовують автоматизовані системи відстеження
вантажів, електронні засоби комунікації та інші інноваційні рішення для
поліпшення якості обслуговування.
- Співпраця з електронною комерцією: "ІнТайм" активно співпрацює з
електронними майданчиками та інтернет-магазинами, забезпечуючи надійну
та швидку доставку товарів покупцям. Це сприяє розвитку електронної
комерції в Україні та допомагає компанії зайняти сильну позицію на ринку.
- Вплив на конкуренцію: Завдяки своїй популярності та надійності,
"ІнТайм" створює конкуренцію для інших гравців на ринку логістики. Це
стимулює конкурентів до покращення своїх послуг та інновацій.
Отже можна підсумувати, що "ІнТайм" має значний вплив на
логістичний ринок України завдяки своїй розгалуженій мережі, широкому
спектру послуг, використанню інноваційних технологій та співпраці з
електронною комерцією. Вона є важливим гравцем, який сприяє розвитку та
Арк.
ЧДТУ 232233.006 ПЗ 9
Змн. Арк. № докум. Підпис Дата

покращенню логістичної індустрії в країні.
4. Компанія "Укрпошта" має величезний вплив на логістичний ринок в
Україні. Вона є національним оператором поштового зв'язку та однією з
найбільших логістичних компаній у країні. Основні аспекти впливу
"Укрпошти" на логістичний ринок включають:
- Покриття території: "Укрпошта" має широку мережу поштових
відділень та пунктів обробки по всій країні. Це дає можливість забезпечити
доставку листів, посилок та вантажів до найвіддаленіших регіонів України,
забезпечуючи доступність логістичних послуг для всіх користувачів.
- Різноманітність послуг: Крім звичайної поштової доставки, "Укрпошта"
пропонує різноманітні логістичні послуги, такі як експрес-доставка,
кур'єрська
служба, міжнародна доставка та інші. Це дозволяє задовольняти різні потреби
клієнтів, від приватних осіб до бізнес-сектору.
- Інтеграція з електронною комерцією: "Укрпошта" активно співпрацює з
електронними майданчиками та інтернет-магазинами, забезпечуючи доставку
товарів покупцям. Вона виконує роль поштового партнера для багатьох
електронних магазинів, що сприяє розвитку електронної комерції в Україні.
- Інвестиції в інфраструктуру: "Укрпошта" постійно вдосконалює свою
інфраструктуру та технологічні рішення, щоб покращити якість та
ефективність своїх логістичних послуг. Це включає впровадження сучасних
систем відстеження вантажів, автоматизацію процесів та вдосконалення
системи керування логістикою.
- Конкуренція на ринку: Присутність "Укрпошти" на ринку створює
конкуренцію для інших логістичних компаній. Це стимулює інші компанії до
покращення своїх послуг, розширення мережі та впровадження нових
технологій.
Отже можна підсумувати, що "Укрпошта" має значний вплив на
логістичний ринок України через свою національну мережу, різноманітність
послуг, співпрацю з електронною комерцією та постійні інвестиції в розвиток
Арк.
ЧДТУ 232233.006 ПЗ 10
Змн. Арк. № докум. Підпис Дата

інфраструктури. Вона відіграє важливу роль у забезпеченні логістичних
потреб населення та бізнесу в Україні.
Отже розглянувши дані компанії більш детальніше можна зробити такі
висновки, що за допомогою даних компаній які булі наведені вище
логістичний ринок розвивається дуже швидко та має потенціал в розвитку.
1.2 Вивчення потреб та вимог логістичної компанії до веб-сайту

В процесі вивчення потреб та вимог логістичної компанії до веб-сайту
можна врахувати наступні аспекти:
- Інформаційна структура: Розуміння основних потреб логістичної
компанії у веб-сайті починається з визначення інформаційної структури.
Інформацію потрібно представити на сайті, таку як послуги, ціни, контактні
дані, розклади, новини тощо. Важливо забезпечити логічну та зручну
навігацію для відвідувачів. [4]
- Онлайн-замовлення та відстеження вантажів: Можливість реалізації
онлайн-системи замовлення та відстеження вантажів. Це може включати
функціонал, який дозволяє клієнтам замовляти послуги, вказувати параметри
доставки, відстежувати статус своїх вантажів, отримувати сповіщення про їх
рух тощо.
- Інтеграція з системами керування логістикою: Якщо логістична
компанія використовує певну систему керування логістикою (наприклад,
складське управління, управління перевезеннями), важливо розглянути
можливість інтеграції цих систем.. Це дозволить автоматизувати обмін
даними, спростити процеси та підвищити ефективність роботи компанії. [5]
- Мобільна сумісність: Забезпечте мобільну сумісність веб-сайту, щоб
клієнти могли зручно користуватися ним на різних пристроях, таких як
смартфони та планшети. Мобільна версія сайту або адаптивний дизайн
дозволять забезпечити зручний доступ до інформації навіть в руху.
- Безпека та конфіденційність: Потрібно звернути увагу на заходи безпеки
та конфіденційності. Логістична компанія може мати обмежені доступи до
Арк.
ЧДТУ 232233.006 ПЗ 11
Змн. Арк. № докум. Підпис Дата

деяких даних або вимагати захисту персональних даних клієнтів.
Забезпечення безпеки та конфіденційності інформації є важливим аспектом
розробки веб-сайту.
- Зручність використання та дизайн: Веб-сайт, повинен бути зручним у
використанні для відвідувачів. Потрібно звернути увагу на ергономіку,
зручність навігації, читабельність контенту та привабливий дизайн. Сайт
повинен бути зрозумілим та привабливим для відвідувачів.
- Форма зворотного зв'язку: Важливо мати форму зворотного зв'язку на
веб-сайті, де клієнти можуть звертатися зі своїми запитаннями, пропозиціями
або скаргами. Швидка та ефективна відповідь на запити клієнтів допоможе
підтримувати якісну комунікацію.
- Інформація про компанію: Веб-сайт повинен містити детальну
інформацію про саму компанію, таку як історія, місія, цінності та досягнення.
Це допоможе побудувати довіру до бренду і викликати інтерес у потенційних
клієнтів.
- Рецензії та відгуки клієнтів: Розміщення рецензій та відгуків
задоволених клієнтів на веб-сайті може допомогти в підтримці довіри до
компанії та створенні
позитивного враження про неї. [6]
- Інформаційний розділ: Створення блогу або розділу новин, де будуть
публікуватися цікаві матеріали про логістику, тренди у галузі, корисні поради
та інші інформаційні статті. Це може збільшити авторитет компанії та
привернути увагу відвідувачів.
Загалом, вивчення потреб та вимог логістичної компанії до веб-сайту
вимагає глибокого розуміння їх бізнесу, процесів та клієнтських потреб. Це
допоможе забезпечити розробку веб-сайту, який відповідає їх вимогам та
сприяє успішному функціонуванню компанії.
1.3 Аналіз аналогічних рішень на ринку їх переваг та недоліків
В системах управління транспортними процесами (TMS) в логістиці
часто використовуються такі основні функції:
Арк.
ЧДТУ 232233.006 ПЗ 12
Змн. Арк. № докум. Підпис Дата

- Замовлення та вантажні документи: Можливість створення та обробки
замовлень, генерація вантажних документів, таких як накладні, рахунки-
фактури, списки навантажень тощо.
- Маршрутизація та оптимізація маршрутів: Функція, що допомагає
планувати оптимальні маршрути для доставки вантажів, враховуючи вагу,
розмір, тип транспорту, відстань та інші фактори. Це допомагає знизити
витрати на паливо, час доставки та збільшити ефективність.
- Вантажні простори та складські управління: Можливість відстежувати
наявність та використання вантажних просторів, контролювати запаси на
складах, планувати вантажі, контролювати переміщення та зберігання
вантажів.
- Відстеження вантажів та комунікація: Можливість в режимі реального
часу відстежувати рух вантажів, спілкуватися з водіями та іншими учасниками
логістичного процесу, обмінюватися інформацією про статус доставки[7].
- Аналітика та звітність: Функції, що допомагають збирати, аналізувати
та візуалізувати дані про логістичні процеси, такі як витрати на доставку,
ефективність маршрутів, простір на складах, рівень обслуговування тощо. Це
дозволяє компанії зробити обґрунтовані рішення та вдосконалити свою
діяльність.
Дані функції можуть варіюватися залежно від конкретних потреб та
вимог логістичної компанії та її бізнес-процесів. Тому перед тим як визначити
основні функції які будуть розміщені на веб-сайті, потрібно провести більш
детальний огляд даних функцій, та розглянути їхні переваги та недоліки:
1. Маршрутизація та оптимізація маршрутів в логістичних
компаніях мають свої переваги та недоліки. Розглянемо їх детальніше:
Переваги:
- Зниження витрат: Оптимальне планування маршрутів дозволяє
зменшити витрати на паливо, зношування транспортних засобів та інші
операційні витрати. Це призводить до економії коштів для компанії.
Арк.
ЧДТУ 232233.006 ПЗ 13
Змн. Арк. № докум. Підпис Дата

- Збільшення ефективності: Маршрутизація допомагає уникнути зайвих
пробігів та затримок, що покращує загальну ефективність доставки. Водії
можуть обирати оптимальні шляхи та уникати заторів, що забезпечує швидку
та своєчасну доставку.
- Зменшення часу доставки: Маршрутизація дозволяє скоротити час
перевезення шляхом вибору найкоротших та найшвидших маршрутів. Це
особливо важливо для доставки термінових або чутливих до часу вантажів.
- Покращення обслуговування клієнтів: Швидка та точна доставка, яку
забезпечує оптимізований маршрут, сприяє задоволеності клієнтів. Це може
позитивно вплинути на репутацію компанії та забезпечити повторні
замовлення[8].
Недоліки:
- Складність алгоритмів: Оптимізація маршрутів може вимагати складних
алгоритмічних розрахунків та обробки великої кількості даних. Це може
створювати труднощі при реалізації та обслуговуванні системи.
- Обмеження та складність урахування факторів: При оптимізації
маршрутів необхідно враховувати різні фактори, такі як обмеження на
вантажопідйомність, графік руху, дорожні умови тощо. Урахування всіх цих
факторів може бути складним і вимагати додаткових ресурсів.
- Залежність від точності даних: Якщо дані про дорожні умови, трафік або
доступність доріг не є достатньо точними або оновлюються недостатньо
швидко, то оптимізовані маршрути можуть бути не ефективними.
Недостовірна інформація може призвести до затримок або невдалого
планування маршрутів.
- Вартість реалізації та підтримки: Впровадження та підтримка системи
маршрутизації може бути дорогим процесом. Необхідно враховувати витрати
на програмне забезпечення, апаратне забезпечення, навчання персоналу та
забезпечення технічної підтримки.
Як підсумок можна сказати, що маршрутизація та оптимізація
маршрутів мають багато переваг для логістичних компаній, але їх ефективне
Арк.
ЧДТУ 232233.006 ПЗ 14
Змн. Арк. № докум. Підпис Дата

використання вимагає грамотного планування, точних даних та технічного
рішення, що враховує конкретні потреби та особливості компанії[8].
2. Вантажні простори та управління складами є важливою
складовою логістичної діяльності компаній. Розглянемо їх переваги та
недоліки:
Переваги:
- Ефективне використання простору: Оптимальне планування та
управління вантажними просторами дозволяють максимально ефективно
використовувати доступний простір на складі. Це дозволяє збільшити обсяг
зберігання товарів та оптимізувати розміщення вантажів.
- Зменшення затримок та помилок: Добре організоване складське
управління сприяє швидкому знаходженню та видачі товарів при
необхідності. Це допомагає уникнути затримок у постачанні та помилок при
комплектації замовлень.
- Зниження витрат: Ефективне управління складом допомагає
знизити витрати на зберігання товарів, оптимізувати використання робочої
сили та мінімізувати втрати внаслідок пошкоджень або неправильного
зберігання.
- Точність інвентаризації: Чітке відстеження вантажів та належне
обліку запасів на складі дозволяє підтримувати точність інвентаризації. Це
важливо для забезпечення належного управління запасами та запобігання
недостачам або надлишкам товарів[9].
Недоліки:
- Високі витрати на інфраструктуру: Побудова та обслуговування
вантажних просторів та складської інфраструктури можуть вимагати значних
інвестицій. Компанія повинна враховувати витрати на будівництво, оренду
або покупку приміщень, обладнання, технології та безпеку.
- Складність управління: Управління вантажними просторами та
складом вимагає фахових знань та навичок. Організація процесів зберігання,
комплектації замовлень, інвентаризації та вантажу потребує ефективних
Арк.
ЧДТУ 232233.006 ПЗ 15
Змн. Арк. № докум. Підпис Дата

систем та кваліфікованого персоналу.
- Ризики і погрози: Складська діяльність пов'язана з ризиками
втрати, крадіжки, пошкодження товарів або непередбачуваними природними
чи технічними небезпеками, наприклад, пожежами або аваріями. Компанія
повинна приділяти достатню увагу безпеці, страхуванню та заходам захисту.
Як підсумок можна сказати, що вантажні простори та управління
складами мають багато переваг для логістичних компаній, але їх
впровадження і ефективне використання вимагають докладного планування,
фахових знань та уваги до деталей[9].
3. Відстеження вантажів та ефективна комунікація є важливими
функціями в логістиці. Розглянемо їх переваги та недоліки:
Переваги:
- Розширена видимість: Відстеження вантажу дозволяє логістичним
компаніям отримувати розширену видимість над процесами перевезення та
доставки. Це дозволяє підтримувати високий рівень контролю над вантажами,
відслідковувати їх місцезнаходження, виявляти затримки та вживати
необхідні заходи.
- Покращена клієнтська обслуговування: Відстеження вантажів дозволяє
забезпечити точну та своєчасну інформацію клієнтам щодо статусу їх вантажу.
Це сприяє покращенню клієнтського сервісу, довіри та задоволення клієнтів.
- Ефективна реагування на затримки: Відстеження вантажів дозволяє
оперативно реагувати на затримки, проблеми чи невідповідності в процесі
логістики. Це дозволяє приймати вчасні рішення, забезпечувати альтернативні
маршрути та мінімізувати вплив негативних ситуацій на поставки.
- Підвищення ефективності: Ефективна комунікація в межах логістичної
системи допомагає підвищити загальну ефективність процесів. Вона дозволяє
швидко обмінюватися інформацією між різними сторонами, зменшувати
затримки та помилки, покращувати координацію та співпрацю[10].
Недоліки:
- Витрати на технології та інфраструктуру: Впровадження систем
Арк.
ЧДТУ 232233.006 ПЗ 16
Змн. Арк. № докум. Підпис Дата

відстеження вантажів та комунікації вимагає інвестицій у технології,
програмне забезпечення, обладнання та інфраструктуру. Це може бути
додатковим фінансовим навантаженням для логістичних компаній.
- Слабкість інформаційних систем: Недоліками можуть бути недостатня
інтеграція та сумісність інформаційних систем між різними учасниками
логістичного ланцюжка. Це може призводити до проблем зі зв'язком та
неоднаковістю інформації.
- Залежність від технічних засобів: Використання систем відстеження
вантажів та комунікації може стати проблематичним у випадку відмови
апаратного або, програмного забезпечення, технічних несправностей або
відсутності доступу до мережі.
- Конфіденційність даних: Відстеження вантажів та комунікація
вимагають обміну чутливою інформацією. Це може ставити питання щодо
конфіденційності, безпеки та захисту даних.
Отже, відстеження вантажів та ефективна комунікація мають багато
переваг для логістичних компаній, але також можуть мати свої недоліки.
Важливо зробити аналіз і обговорити ці аспекти перед впровадженням
відповідних систем в компанії[10].
4. Аналітика та звітність в логістиці відіграють важливу роль у
вирішенні проблем та удосконаленні логістичних процесів.
Переваги:
- Реально-часовий доступ до даних: Онлайн аналітика дозволяє
отримувати доступ до актуальних даних в реальному часі. Це дозволяє
оперативно відслідковувати та аналізувати ключові метрики логістичних
процесів, такі як обсяги перевезень, терміни доставки, використання ресурсів
тощо.
- Ефективне прийняття рішень: Онлайн аналітика надає компаніям
детальну інформацію та аналіз, що сприяє більш обґрунтованому прийняттю
рішень. Це допомагає вдосконалювати логістичні процеси, виявляти слабкі
місця та робити вдосконалення.
Арк.
ЧДТУ 232233.006 ПЗ 17
Змн. Арк. № докум. Підпис Дата

- Покращена ефективність: Онлайн звітність дозволяє автоматизувати
процес збору та обробки даних, що знижує час та зусилля, необхідні для
вироблення звітів. Це полегшує роботу персоналу та сприяє підвищенню
ефективності управління логістичними процесами.
- Відстеження результативності: Завдяки онлайн аналітиці та звітності,
компанії можуть відстежувати та оцінювати результативність своїх
логістичних операцій. Це дозволяє ідентифікувати позитивні тенденції,
виявляти відхилення та вживати коригувальні заходи[11].
Недоліки:
- Залежність від технологій: Ефективне використання онлайн аналітики
та звітності вимагає наявності відповідних технологій та програмного
забезпечення.
Компанії повинні мати доступ до надійних та сучасних інструментів, а це
може бути додатковим фінансовим навантаженням.
- Захист даних: Онлайн аналітика та звітність вимагають обміну та
зберігання чутливої інформації. Це ставить питання щодо конфіденційності,
безпеки та захисту даних. Компанії повинні приділяти належну увагу захисту
своїх інформаційних ресурсів.
- Складність впровадження: Впровадження систем онлайн аналітики та
звітності може бути складним процесом, особливо для компаній зі складною
існуючою інфраструктурою та системами. Вимагається налагодження
інтеграції з іншими системами та процесами.
- Персонал та навчання: Використання онлайн аналітики та звітності
вимагає належних знань та навичок у персоналу. Компанії повинні
забезпечити достатню підготовку та навчання свого персоналу для
ефективного використання цих інструментів.
Отже, онлайн аналітика та звітність мають багато переваг для
логістичних компаній, проте вони також можуть мати свої недоліки. Важливо
ретельно проаналізувати ці аспекти перед впровадженням відповідних систем
у компанії.
Арк.
ЧДТУ 232233.006 ПЗ 18
Змн. Арк. № докум. Підпис Дата

Отже можна зазначити що кожна функція яка важлива та активно
використовується в сфері логістичних послуг має свої переваги та недоліки,
але дані функції являються популярними та без них дуже важко уявити дану
сферу[11].
Арк.
ЧДТУ 232233.006 ПЗ 19
Змн. Арк. № докум. Підпис Дата

РОЗДІЛ 2.
РОЗРОБКА ТЕХНІЧНОГО ЗАВДАННЯ

2.1 Вибір способу розробки веб-сайту

Всі методи створення сайтів можна умовно розділити на дві основні
групи. Перша група методів створення сайтів - це методи ручного написання
сайтів на одному або декількох мовах веб-програмування. До другої групи
методів створення сайтів входять автоматизовані методи створення сайтів: за
допомогою спеціальних конструкторів сайтів або ж систем управління
контентом (СМS)
Конструктор - програмне рішення (найчастіше онлайн), яке дозволяє
створювати сайт за модульним принципом, коли розробник збирає всю
конструкцію використовуючи готові блоки, які надає конструктор. Такий
підхід дозволяє створити сайт без будь яких знань в області веб розробки та
супутніх навичок. Підходить для тих, хто хоче створити простий сайт про себе
або свою компанію, не роблячи жодних претензій на якість програмного коду
і швидкість роботи сайту. Також, на конструкторах часто роблять простенькі
лендінги для невеликих рекламних кампаній[12].
СMS - це комплекс програмних інструментів, що використовується для
управління веб-контентом. Простими словами - це базова структура і ряд
додаткових інструментів і надбудов, які можна використовувати не тільки для
створення веб-сайту або веб-додатоку, а й для підтримки його роботи,
оновлення контенту і взаємодії з користувачами. Будь-яка СMS може
дозволити створити навіть дуже складні рішення, такі як інтернет-магазини
або великі корпоративні сайти з глибоко вбудованими сторінками, які, однак,
також мають свої особливості.
Створення сайту з виростанням мов програмування це не тільки
найбільш творчий і вільний процес, а й найтрудомісткий процес. Написання
сайту вимагає глибокого розуміння не тільки самих мов програмування, але
також розуміння архітектури, бізнес-процесів клієнта і і багато чому іншого.
Арк.
ЧДТУ 232233.006 ПЗ 20
Змн. Арк. № докум. Підпис Дата

При цьому, створюючи сайт з нуля, клієнт отримає унікальний і
персоналізований продукт, який буде вирішувати його завдання і не витрачати
час на зайві процеси.
Самостійна розробка дозволяє створювати проекти будь-якої складності
і з будь-яких побажань клієнта .
Кожна мова має свої особливості, сфери застосування і вирішує свої задачі.
На рисунку 2.1 зображено рейтинг мов написання веб-сайту[13].

Рисунок 2.1– Рейтинг мов програмування веб-сайтів

Для створення зовнішнього вигляду сайту, який буде видно кінцевим
користувачам, на сьогоднішній день існують дві базові мови: HTML і СSS.
HTML – це мова розмітки гіпертексту. Вона дозволяє користувачеві
створювати і структурувати розділи, параграфи, заголовки, посилання і блоки
для веб-сторінок і додатків.
HTML-сторінка – це файл, який містить в собі код, створений з
використанням мови HTML.
HTML надає наступні можливості:
− видавати мережеві документи з заголовками, текстом,
таблицями, списками, фотографіями;
Арк.
ЧДТУ 232233.006 ПЗ 21
Змн. Арк. № докум. Підпис Дата

− отримувати інформацію з мережі через посилання
гіпертексту при натисканні кнопки;
− створювати форми для посилки запитів на віддалені комп'ютери, щоб
проводити пошук інформації, здійснювати бронювання, замовляти товари і
т.п.;
− вставляти електронні таблиці, відео, аудіо та інші програмні додатки
безпосередньо в їх документ. Мова HTML використовується для формування
та оформлення сторінок тексту, які будуть відображатися в Інтернеті за
допомогою спеціальних програм- браузерів[14].
HTML-теги умовно можна розділити на дві категорії:
− теги, які визначають, як тіло документа буде відображатися веб
браузером в цілому;
− теги, що описують загальні властивості документа, такі як заголовок
або автор документа.
СSS – мова каскадних таблиць стилів. Ця мова використовується для
опису зовнішнього вигляду документа, написаного на мові розмітки. СSS
використовується розробниками веб-сторінок для визначення кольорів,
шрифтів, розташування окремих блоків та інших аспектів подання
зовнішнього вигляду цих веб-сторінок. Основна мета розробки СSS полягала
в розділенні опису логічної структури веб-сторінки, тобто виконаної за
допомогою HTML або інших мов розмітки, від опису зовнішнього вигляду цієї
веб-сторінки, який тепер проводиться за допомогою формальної мови СSS.
Такий поділ може поліпшити доступність документа, забезпечити більшу
гнучкість і можливість управління, а також зменшити складність і повторення
структурного змісту.
Це одна з базових технологій в сучасному Інтернеті. Практично жоден
сайт не обходиться без СSS, тому HTML і СSS працюють разом.
РHР отримує вхідний запит від веб-сервера, виконує сценарій і повертає
результат веб-сервера у вигляді готового HTML-коду. Сервер відправляє цей
результат в браузер користувача, який, в свою чергу, відображає його
Арк.
ЧДТУ 232233.006 ПЗ 22
Змн. Арк. № докум. Підпис Дата

користувачеві. РHР дозволяє змінювати веб-сторінку на сервері перед ії
відправкою в браузер. Подивимося, як це працює. РHР може виконувати код,
званий скриптом. Під час виконання РHР може динамічно змінювати або
генерувати HTML-код в результаті виконання сценарію. Потім сервер
відправляє цей код в браузер. Однак браузер не знає, як ця сторінка була
створена: статично організована дизайнером верстки або динамічно створена
за участю РHР. Це не має значення, тому що браузер завжди працює тільки з
тим, що було отримано з сервера. Сценарій - це серверна програма, яка
запускається у відповідь на запит браузера[15].
Оскільки РHР не містить коду, він вказує на конкретний веб-сервер, який
добре працює з такими сучасними серверами як Mісrоsоft ІІS Nеtsсаре
Еntеrрrіsе, Арасhе, Strоnghоld і іншими.
Коли браузер робить запит на сторінку, то він отримує її вихідний
HTML-код в якості відповіді від сервера, і для початку повинен
проаналізувати його. У процесі аналізу і розбору HTML-коду на його основі
браузер створює DОM-дерево.
DОM – це об'єктна модель документа, яку браузер створює в пам'яті
комп'ютера на основі HTML, отриманого з сервера. Простіше кажучи, HTML
– це текст сторінки, а DОM – це серія пов'язаних об'єктів, створених браузером
при аналізі тексту. На рисунку 2.2 зображено схему роботи DОM.

Рисунок 2.2 – Схема роботи DОM

2.2 Порівняльний аналіз програмного забезпечення

Для написання оптимізованого та безпомилкового коду, розробник веб-
Арк.
ЧДТУ 232233.006 ПЗ 23
Змн. Арк. № докум. Підпис Дата

ресурсу повинен обрати відповідне програмне забезпечення.
Текстовий редактор – це комп’ютерна програма, яка використовується
для створення та редагування текстових даних. До популярних текстових
редакторів відносяться: Sublіmе Tехt 3, Vіsuаl Studіо Соdе, Аtоm, Nоtераd++,
TехtMаtе.
При виконанні дипломної роботи для створення веб-сайту краще
використовувати текстовий редактор, так як він працює набагато швидше і має
логічний та простий інтерфейс, а також краще зарекомендував себе при роботі
з невеликими проектами[16].
При виборі текстового редактора слід враховувати наступні основні критерії:
− підсвічування синтаксису (виділення початку та кінця певного
логічного блоку певним кольором допомагає візуальному пошуку та робить
код зручним для читання та корегування);
− мінімальні системні вимоги для комфортної та швидкої роботи;

− автоматичні відступи (перенесення рядка програмою з автоматичним
виставленням рівня вкладеності для покращення орієнтації в структурі коду);
− авто доповнення (аналіз програмою написаного коду та
пропозиція варіантів подальшого продовження);
− розподіл на робочі зони (можливість розділення робочої області
редактора на необхідну кількість секторів);
− персоналізація інтерфейсу (можливість індивідуального
налаштування під користувача);
− інтеграція модулів та додатків (розширення функціональності за
рахунок додавання плагінів);
− гарячі клавіші (наявність комбінацій клавіш для швидкого виконання
певних дій та можливість налаштування під розробника).
Для аналізу та вибору редактору обираємо трійку лідерів із списку:
Vіsuаl Studіо Соdе, Sublіmе Tехt 3 та Аtоm[17].
Арк.
ЧДТУ 232233.006 ПЗ 24
Змн. Арк. № докум. Підпис Дата

Vіsuаl Studіо Соdе – це сервіс, який позиціонує себе як «легкий»
редактор коду для кроссплатформенної розробки веб-і хмарних додатків. VS
Соdе дозволяє розробляти як консольні додатки, так і додатки з графічним
інтерфейсом, включаючи підтримку технології Wіndоws Fоrms, а також веб-
сайти, веб-додатки,
веб-служби як в рідному, так і в керованому кодах для всіх платформ. Редактор
містить вбудований відгадчик і інструменти для роботи з навігації по коду,
авто доповнення типових конструкцій і контекстної підказки.
Продукт підтримує розробку для платформ АSР.NЕT і Nоdе.JS, і
вважається легким рішенням, що не вимагає повністю інтегрованого
середовища розробки. Великою перевагою редактора є підтримка багатьох
мов, таких як С ++, С #, Руthоn, РHР, JаvаSсrірt та інших.
Sublіmе Tехt 3 – це багатофункціональний текстовий редактор
розроблений компанією Sublіmе HQ Рtу Ltd. Програма представляє собою
програмно - орієнтований текстовий редактор, підтримує підсвічування
синтаксису С, С ++, С#, СSS, D, Еrlаng, HTML, Grооvу, Hаskеll, HTML, Jаvа,
JаvаSсrірt, LаTеХ, Lіsр, Luа, Mаrkdоwn, Mаtlаb, ОСаml, Реrl , РHР, Руthоn, R,
Rubу, SQL, TСL, Tехtіlе і ХML. Щоб уникнути плутанини, використовуються
різні колірні шаблони виділення тексту. Щоб мати можливість працювати з
декількома файлами одночасно, в Sublіmе Tехt відображаються кілька
панелей-вікон редагування. Програма має вбудовану підтримку макросів,
з'єднання через WіnSСР[18].
Аtоm – це текстовий редактор з відкритим вихідним кодом розроблений
компанією GіtHub. Він працює на операційних системах Wіndоws, mасОS та
Lіnuх, а отже є кросплатформеним.
Головна особливість Аtоm – це ряд можливостей по налаштуванню.
Редактор можне бути адаптований під ваші потреби. Перш за все, в нього
вбудовані: файловий менеджер, можливості пошуку та заміни, різноманітні
курсори, опції згортання коду і ясний інтерфейс. Десктопна програма Аtоm
має повний доступ до файлової системи, що підходить для операційної
Арк.
ЧДТУ 232233.006 ПЗ 25
Змн. Арк. № докум. Підпис Дата

системи меню та панель команд. У той же час воно ідеально підходить для веб-
програмування: можна додавати власні функції для редагування СSS, HTML і
JаvаSсrірt. Також слід відзначити інтеграцію з Nоdе.JS, включаючи запуск веб-
сервера прямо з редактора. Архітектура програми проста і зрозуміла для всіх:
можна замінити будь-який пакет на свій і завантажити його в центральний
репозиторій для використання всіма бажаючими[19].
Для вирішення задачі вибору текстового редактора порівнюємо три
програми: Vіsuаl Studіо Соdе, Sublіmе Tехt 3 та Аtоm. Результати порівняння
представлені у таблиці 2.1[20].
Таблиця 2.1 – Порівняння текстових редакторів
Параметри Vіsuаl Studіо Соdе Sublіmе Tехt 3 Аtоm
Wіndоws, Lіnuх, Wіndоws, Lіnuх, Wіndоws, Lіnuх,
Кросплатформеніс
ть mасОS mасОS mасОS
Портативна версія - + -
Підсвічування
+ + +
синтаксису
Автоматичні + +- +
відступи
Розділення на
+ + +
робочі
зони
Персоналізація
+ + +
інтерфейсу
Інтеграція + + +
додатків
+ (за допомогою
Відлачик + +
плагіна)
Гарячі клавіші + + +
Пошук та заміна + + +
Сумісна робота + (за допомогою
+ +
над плагіна)
проектом

З проведеного огляду та аналізу виявлено, що всі розглянуті редактори
мають практично однаковий функціонал, за винятком незначних інструментів,
які додатково можна встановити за допомогою плагінів та доповнень. Для
виконання дипломної роботи було обрано текстовий редактор Sublіmе Tехt 3.
Арк.
ЧДТУ 232233.006 ПЗ 26
Змн. Арк. № докум. Підпис Дата

На користь вибору вплинув досвід у роботі з данним редактором. Встановлено
наступний пагін еmmеt, що дозволяє прискорити написання коду вставляючи
фрагменти коду з відповідним синтаксисом.
Шоб опрацювати графічий матеріал та створити дизайнерську
концепцію, розробнику веб-ресурсу слід обрати відповідне програмне
забезпечення, яке може виконувати всі функції.
При виборі графічного редактору слід враховувати наступні основні критерії:
− функціональність інструментів (можливість адаптації інструментів
під різні типи задач);
− підтримка кольорових моделей (наявність всіх популярних моделей);
− швидкість роботи;
− можливість роботи з популярними форматами;
− зручність для користувача інтерфейсу (простота панелі та можливість
настройки);
− налаштування експорту файлів (наявність великої кількості
налаштувань при збереженні);
− можливості роботи з текстом (здатність налаштовувати
параметри текстових даних).
Аналізуючи популярні графічні редактори, обираємо лідерів: Аdоbе
Іllustrаtоr та Аdоbе Рhоtоshор.
Аdоbе Іllustrаtоr – це професійний графічний редактор для створення та
моделювання ілюстративних матеріалів, розроблений компанією Аdоbе.
Інтерфейс програми містить велику кількість інструментів та налаштувань.
Графічний редактор має практичне, інтуїтивно-зрозумілу панель шарів, що
спрощує роботу з фрагментами файлу та сприяє орієнтації по документу
Аdоbе Рhоtоshор – незвичайний редактор, в якому можна не тільки
редагувати і ретушувати зображення, але й перетворювати, зберігати GІF-
анімації, використовувати шари і ефекти. За допомогою цих функцій можно
легко трансформувати, клонувати, покращувати зображення, застосовувати
різні фільтри для створення живописної, продающої картинки.
Арк.
ЧДТУ 232233.006 ПЗ 27
Змн. Арк. № докум. Підпис Дата

2.3 Постановка задач для розробки веб-сайту

При розробці веб-сайту для логістичної компанії, варто враховувати
наступні аспекти:
1. Функціональність сайту:
● Реєстрація та авторизація користувачів
Реєстрація є процесом, за допомогою якого користувачі можуть
створити обліковий запис на веб-сайті логістичної компанії. Цей обліковий
запис дозволяє користувачам отримати доступ до різних функцій і послуг, які
надає компанія.
Основні кроки реєстраційного процесу включають:
1. Введення особистих даних: Користувач повинен ввести своє ім'я,
електронну пошту, контактну інформацію та інші необхідні дані для створення
облікового запису. Ця інформація зазвичай використовується для
ідентифікації
користувача та забезпечення зв'язку.
2. Вибір і перевірка ідентифікаційних даних: Користувач повинен
вибрати унікальне ім'я користувача або ідентифікатор, який буде
використовуватися для входу на сайт. Крім того, користувач повинен ввести
пароль, який буде використовуватися для захисту облікового запису. Зазвичай
також проводиться перевірка пароля для забезпечення безпеки[21].
3. Підтвердження облікового запису: Деякі веб-сайти можуть
вимагати підтвердження облікового запису шляхом надсилання посилання
підтвердження на вказану електронну пошту. Користувач повинен перейти за
посиланням для завершення реєстрації.
4. Збереження даних: Після успішної реєстрації, введені дані
користувача зберігаються в базі даних логістичної компанії для подальшого
використання.
Реєстраційний процес має бути зручним і простим для користувача, з
мінімальною кількістю обов'язкових полів, але достатньою, щоб забезпечити
Арк.
ЧДТУ 232233.006 ПЗ 28
Змн. Арк. № докум. Підпис Дата

необхідну інформацію для створення облікового запису. Також важливо
забезпечити захист персональних даних користувачів і дотримуватися
законодавства про конфіденційність[22].
● Відстеження вантажів та інформація про їх стан
Відстеження вантажів та надання інформації про їх стан є важливою
функціональністю для веб-сайту логістичної компанії. Ця функція дозволяє
клієнтам та зацікавленим сторонам отримувати актуальну інформацію про
місцезнаходження та статус вантажу на різних етапах логістичного процесу.
Основні переваги та можливості відстеження вантажів включають:
1. Реальний час і точність: Клієнти можуть отримувати актуальну
інформацію про місцезнаходження свого вантажу у реальному часі. Це
дозволяє відстежувати пересування вантажу і вчасно реагувати на будь-які
затримки або проблеми.
2. Статус та історія: Клієнти мають можливість отримати повний
перелік етапів, через які проходить їхній вантаж. Це дозволяє контролювати
процес доставки,
відслідковувати прогрес та мати повну історію переміщення вантажу[23].
● Генерація звітів, статистичних даних та аналітика
Генерація звітів, статистичних даних та аналітика є важливою
функціональністю для веб-сайту логістичної компанії. Ця функція дозволяє
збирати, обробляти та аналізувати різноманітні дані про логістичні процеси,
що дозволяє компанії отримувати цінні уявлення та зробити обґрунтовані
рішення. Основні переваги та можливості генерації звітів, статистичних даних
та аналітики включають:
1. Звіти та статистика: Система може забезпечити автоматичну
генерацію різних звітів і статистичних даних, таких як звіти про витрати, звіти
про продуктивність, звіти про запаси тощо. Це дозволяє компанії отримувати
чітку картину про різні аспекти її діяльності[24].
2. Аналітика та прогнозування: Веб-сайт може надати аналітичні
інструменти для обробки та аналізу даних, що дозволяє компанії робити
Арк.
ЧДТУ 232233.006 ПЗ 29
Змн. Арк. № докум. Підпис Дата

обґрунтовані прогнози, виявляти тенденції та приймати стратегічні рішення.
2. Дизайн та користувацький інтерфейс:
● Інтуїтивно зрозумілий та зручний інтерфейс для користувачів
Інтуїтивно зрозумілий та зручний інтерфейс є важливою
функціональністю для веб-сайту логістичної компанії. Він забезпечує зручну і
ефективну взаємодію користувачів з сайтом, сприяє їхній задоволеності та
покращує загальний досвід використання. Основні переваги та можливості
інтуїтивно зрозумілого та зручного
інтерфейсу включають:
1. Легкість навігації: Інтерфейс повинен мати логічну структуру та
зручне розташування основних елементів, що дозволяє користувачам швидко
зорієнтуватися та знаходити потрібну інформацію.
2. Чіткість та консистентність: Елементи інтерфейсу повинні бути
чіткими, зрозумілими та однаковими на всіх сторінках сайту. Це сприяє
легкому сприйняттю та запам'ятовуванню функціональності.
3. Мінімальна кількість кроків: Інтерфейс повинен бути
оптимізований для мінімізації кількості кроків та дій, необхідних для
виконання певних завдань. Це забезпечує ефективність та зручність
використання.
4. Інтуїтивність: Елементи інтерфейсу повинні бути простими та
зрозумілими для користувачів без необхідності додаткового навчання чи
інструкцій. Це дозволяє забезпечити швидке освоєння сайту та знижує поріг
входження для нових користувачів[25].
● Приємний та професійний дизайн, враховуючи логотип та брендінг
компанії
Приємний та професійний дизайн є важливою складовою веб-сайту
логістичної компанії. Візуальне оформлення сайту має відповідати бренду та
ідентичності компанії, що допомагає створити позитивне враження на
користувачів та підсилити їх довіру. Основні переваги та можливості
приємного та професійного дизайну включають:
Арк.
ЧДТУ 232233.006 ПЗ 30
Змн. Арк. № докум. Підпис Дата

1. Відповідність бренду: Дизайн сайту повинен відповідати
корпоративному стилю, логотипу та брендінгу компанії. Це допомагає
створити єдиний впізнаваний образ та підкреслити професійний підхід
компанії до своєї діяльності.
2. Візуальна привабливість: Дизайн повинен бути привабливим та
естетичним, з використанням відповідних кольорів, шрифтів та графічних
елементів. Це допомагає створити позитивне перше враження та залучити
увагу користувачів.
3. Легкість сприйняття інформації: Дизайн повинен бути
зорієнтованим на легкість сприйняття інформації. Чіткість, візуальна ієрархія
та адекватне розташування контенту допомагають користувачам швидко
знаходити потрібну інформацію та виконувати необхідні дії.
3. Безпека та захист даних:
● Захист конфіденційної інформації клієнтів та компанії
Захист конфіденційної інформації клієнтів та компанії є надзвичайно
важливим аспектом веб-сайту логістичної компанії. Компанія повинна
приділяти особливу увагу захисту даних, щоб забезпечити конфіденційність,
цілісність та доступність інформації.
Основні переваги та можливості захисту конфіденційної інформації
включають:
1. Шифрування даних: Важлива інформація, така як особисті дані
клієнтів, фінансові дані, контракти тощо, повинна бути шифрована під час
передачі та зберігання. Це допомагає унеможливити несанкціонований доступ
до даних третіми особами.
2. Система аутентифікації та авторизації: Користувачі сайту повинні
проходити процес аутентифікації, щоб підтвердити свою ідентичність перед
отриманням доступу до конфіденційної інформації. Крім того, має бути
належно реалізована система авторизації, щоб керувати рівнями доступу та
обмеженнями.
3. Захист від несанкціонованого доступу: Веб-сайт повинен мати
Арк.
ЧДТУ 232233.006 ПЗ 31
Змн. Арк. № докум. Підпис Дата

механізми захисту, такі як брандмауери, інтранети, системи виявлення
вторгнень тощо, які допомагають запобігти несанкціонованому доступу до
системи та даних.
4. Резервне копіювання даних: Регулярне резервне копіювання
важливих даних є важливим елементом захисту інформації. Воно дозволяє
відновити дані в разі випадкового видалення, системних збоїв або кібератак.
4. Тестування та підтримка:
● Проведення тестування сайту на різних пристроях та браузерах
Проведення тестування сайту на різних пристроях та браузерах є
важливою складовою розробки веб-сайту логістичної компанії. Тестування
допомагає переконатися, що сайт працює належним чином та відображається
коректно на різних пристроях, таких як комп'ютери, планшети та смартфони,
а також у різних популярних браузерах. Основні переваги та можливості
проведення тестування включають:
1. Коректне відображення: Тестування на різних пристроях та
браузерах дозволяє переконатися, що сайт відображається коректно і зберігає
свою функціональність незалежно від використовуваного пристрою та
браузера.
2. Відзивчивий дизайн: Тестування на різних пристроях допомагає
перевірити, чи адаптивний дизайн сайту пристосовується до різних розмірів
екранів і забезпечує зручну навігацію та взаємодію незалежно від пристрою.
3. Кросс-браузерна сумісність: Тестування на різних браузерах
допомагає переконатися, що сайт працює належним чином і має однаковий
вигляд у популярних браузерах, таких як Google Chrome, Mozilla Firefox,
Safari, Microsoft Edge тощо.
4. Виявлення помилок: Тестування допомагає виявити та виправити
будь-які помилки, проблеми зі сумісністю або неочікувану поведінку сайту на
різних пристроях та браузерах. Це забезпечує покращення якості та
стабільності роботи сайту.
● Підтримка та оновлення сайту для забезпечення безперебійної роботи
Арк.
ЧДТУ 232233.006 ПЗ 32
Змн. Арк. № докум. Підпис Дата

Підтримка та оновлення сайту є важливими аспектами забезпечення
безперебійної роботи веб-сайту логістичної компанії. Регулярне технічне
обслуговування та оновлення допомагають забезпечити безперебійну роботу
сайту, запобігти виникненню проблем та забезпечити оптимальну
продуктивність. Основні переваги та можливості підтримки та оновлення
сайту включають:
1. Технічна підтримка: Компанія повинна мати доступну технічну
підтримку, яка готова надавати допомогу у разі виникнення проблем або збоїв.
Це може включати відповіді на запитання, вирішення проблем зі швидкістю
завантаження, відновлення роботи після збоїв тощо.
2. Резервне копіювання та відновлення: Регулярне резервне
копіювання бази даних та файлів сайту допомагає забезпечити безпеку
інформації та можливість відновлення сайту у разі необхідності.
3. Оновлення програмного забезпечення: Регулярні оновлення
програмного забезпечення, такого як система управління контентом (CMS),
плагіни, теми тощо, допомагають забезпечити безпеку, виправити помилки та
покращити функціональність сайту.
4. Моніторинг та аналітика: Важливо використовувати інструменти
моніторингу та аналітики для відстеження продуктивності сайту, виявлення
потенційних проблем та забезпечення швидкого реагування на них[25].
Арк.
ЧДТУ 232233.006 ПЗ 33
Змн. Арк. № докум. Підпис Дата

РОЗДІЛ 3
РОЗРОБКА СИСТЕМИ

3.1 Створення дизайну веб-сайту з урахуванням корпоративного
стилю логістичної компанії
При створенні дизайну веб-сайту з урахуванням корпоративного стилю
логістичної компанії важливо зберігати консистентність, професіоналізм і
впізнаваність бренду. Кожен елемент дизайну повинен підтримувати цілі
компанії і створювати позитивне враження у відвідувачів веб-сайту.
Створення дизайну веб-сайту з урахуванням корпоративного стилю
логістичної компанії є важливим аспектом, який допомагає підкреслити
брендінг компанії та створити єдиний і впізнаваний образ. Основні кроки та
принципи створення дизайну з урахуванням корпоративного стилю
включають в себе такі фактори:
1. Логотип і кольорова палітра: На веб-сайті потрібно використовувати
кольори, які відповідають бренду логістичної компанії. Вони повинні бути
згідні з корпоративними кольорами і відображати ідентичність компанії.
Важливо використовувати ці кольори в дизайні веб-сайту, включаючи фон,
кнопки, текст і графічні елементи.
Згідно пункту номер один було вибрано основний колір який буде
використовуватись як основний на всіх графічних елементах та на усіх блоках
сайту. Даний колір являється гармонічним та не викликає відторгнення в
користувачів даного веб-ресурсу. Кольором який був вибраний, як основний
являється #00CCA6(приклад кольору можна спостерігати на Рисунку 3.1)

Рисунок 3.1 - Основний колір веб-сайту
Арк.
ЧДТУ 232233.006 ПЗ 34
Змн. Арк. № докум. Підпис Дата

Після того як було вибрано основний колір веб-сайту можна
розпочинати розробку логотипу веб-сайту, так як він буде виконаний в
відтінках основного кольору. Результат розробки логотипу компанії ви можете
спостерігати на Рисунку 3.2, даний логотип буде використовуватися на
основній сторінці та на вкладці в браузері.

Рисунок 3.2 - Логотип компанії
2. Логістичні елементи: Графічні елементи, які відображають
специфіку логістичної діяльності компанії. Це можуть бути зображення
вантажних контейнерів, складських приміщень, транспортних засобів або
інших важливих елементів логістики. Дані елементи допоможуть створити
атмосферу, пов'язану з діяльністю компанії.
Користувач веб-сайту повинен розуміти те що він знаходиться на
сторінці компанії, яка спеціалізується на логістичному напрямку тому в
дизайні сторінки були використані елементи графічного дизайну, які роблять
акцент на логістичному напрямку компанії(Рисунок 3.3):

Рисунок 3.3 – Графічні елементи логістичного напрямку
Арк.
ЧДТУ 232233.006 ПЗ 35
Змн. Арк. № докум. Підпис Дата

3. Адаптивний дизайн: Веб-сайт повинен відображатися на різних
пристроях і розмірах екранів. Він повинен бути респонсивним і
пристосовуватися до мобільних пристроїв, планшетів і комп'ютерів. Веб-сайт
повинен мати оптимальний дизайн із зручним відображенням контенту на
будь-якому пристрої.
Дизайн веб сайту був розроблений згідно з нормами та стандартами, за
допомогою яких він автоматично підлаштовується під пристрій на якому
запущений даний веб-сайт. Основна орієнтованість веб-сайту це персональні
комп’ютери, але під автономні пристрої даний веб-сайт також
підлаштовується автоматично( приклад можна побачити на рисунку 3.4):

Рисунок 3.4 – Відображення веб-сайту на мобільному пристрої
4. Ідентифікаційні елементи: Використовуйте корпоративні елементи, такі
як логотип, назва компанії та слоган, на кожній сторінці веб-сайту. Це
допоможе зберегти єдиний образ компанії і підкреслити її бренд.
Для того, щоб користувач мав змогу ідентифікувати компанію, а також
Арк.
ЧДТУ 232233.006 ПЗ 36
Змн. Арк. № докум. Підпис Дата

закарбувати в себе в пам’яті дану компанію логотип компанії був зображений
на основній сторінці та на графічних елементах логістичного напрямку.
Завдяки даному розміщенню логотипу компанії користувач матиме змогу
викарбувати в пам’яті логотип та за допомогою даного «прийому» буде
створена впізнаваність бренду.

3.2 Верстка сторінок з використанням HTML, CSS та JavaScript

Верстка сайту являється основним та головним етапом, яка лежить перед
розробником. Основна сторінка веб сайту буде розроблена як лендінг. Для
початку потрібно зрозуміти що являє собою лендінг.
Лендінг (англ. landing page) - це односторінковий веб-сайт, спеціально
розроблений з метою привернення уваги відвідувачів і перетворення їх на
потенційних клієнтів або виконавців певної дії. Головна мета лендінгу - це
стимулювати відвідувачів виконати конкретну цільову дію, таку як
заповнення форми зворотного зв'язку, покупка товару, підписка на розсилку,
завантаження файлу тощо.
Лендінги зазвичай мають спрощену структуру, що дозволяє
зосередитися на головному повідомленні та викликати бажану реакцію від
відвідувачів. Вони можуть містити такі елементи:
- Заголовок і підзаголовок: Чіткий і переконливий заголовок, що
привертає увагу відвідувачів і викликає цікавість. Підзаголовок може
додатково пояснювати пропозицію або переваги.
Основною метою лендінгу являється привернути увагу користувача з
першого блоку сайту. Так як від даного блоку залежить чи залишиться
користувач на веб-сайті чи залишить даний веб сайт. Тому на першому блоці
було розроблено блок який пояснює користувачеві основні функції які надає
компанія. Готовий приклад який був розроблений ви можете спостерігати на
Рисунку 3.5.
Арк.
ЧДТУ 232233.006 ПЗ 37
Змн. Арк. № докум. Підпис Дата

Рисунок 3.5 - Перший блок сайту
Даний блок сайту має такий код:
<div class="row-3f4fmU row" data-id="169:28">
<div class="main-content-P3WY5d main-content" data-id="169:29">
<h1 class="h1-headline7-ooDTSn h1" data-id="169:30">Цифрова
платформа <br>для вантажоперевезення</h1>
<h4 class="h4-ooDTSn h4" data-id="169:31">Екосистема сервісів
для транспортної логістики&nbsp;&nbsp;<br>Транспортні тендери |
Спотовий аукціони | TMS | Трекінг вантажів</h4>
<div class="cta-ooDTSn" data-id="169:32">
<div class="buttonbtnprimary-colorbtn-round-EAfli" data-
id="169:33">
<div class="btn-text btn-text" data-id="169:34">
<a class="buttonbtnprimary-colorbtn-round-EAfli1"
href="register.html">Приєднатися</a></div>
</div>
</div>
</div>
</div>
Арк.
ЧДТУ 232233.006 ПЗ 38
Змн. Арк. № докум. Підпис Дата

- Вигода та переваги: Переконливо викладіть основні переваги вашої
пропозиції. Поясніть, які проблеми вона вирішує та які вигоди отримає
відвідувач.
Згідно даного пункту користувач повинен розуміти які послуги надає
даний веб-сайт. Дана інформація розміщена на сайті, а також під кожним
таким блоком повинен бути заклик до дії, завдяки якому клієнт матиме змогу
зареєструватись на даному ресурсі. Приклади даних закликів та блоків
інформації ви можете спостерігати на Рисунку 3.6-3.9.

Рисунок 3.6 - Інформаційний блок №1

Рисунок 3.7 - Інформаційний блок №2
Арк.
ЧДТУ 232233.006 ПЗ 39
Змн. Арк. № докум. Підпис Дата

Рисунок 3.8 - Інформаційний блок №3

Рисунок 3.9 - Інформаційний блок №4
Дані блоки мають такий програмний код(більш детальніший код ви
можете спостерігати в Додатку А):
<div class="view-FOIx87" data-id="169:807"><img class="frame-GLVacZ frame"
data-id="169:808"
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAA
ALAAAAAABAAEAAAICRAEAOw==" anima-
src="https://cdn.animaapp.com/projects/6469fb52d706284cf60442e5/releases/646
9fbb4754105b20c4cfd35/img/frame-1.svg" alt="Frame">
<div class="text_label-GLVacZ text_label montserrat-bold-fuscous-gray-
31px" data-id="169:853"> Трекінг вантажів</div>
Арк.
ЧДТУ 232233.006 ПЗ 40
Змн. Арк. № докум. Підпис Дата

<p class="erp-GLVacZ montserrat-medium-fuscous-gray-24px" data-
id="169:995">Інтеграція з ERP-системою клієнтів

<br>Автоматизація розподілу замовлень
<br>Відстеження зміни статусів
<br>Можливість гнучкого налаштування
<br>Аудит логістичних процесів</p>
<div class="buttonbtnprimary-color-GLVacZ buttonbtnprimary-color" data-
id="169:996">
<div class="btn-text -" data-id="169:997">Попробовать</div>
</div>
</div>
- Форма зворотного зв'язку: Форма, за допомогою якої відвідувачі можуть
надіслати вам свої контактні дані або зв'язатися з вами безпосередньо.
Зазвичай це поля для введення ім'я, електронної пошти та повідомлення.
Дана форма являється основною формою зворотнього зв’язку з клієнтом
за допомогою якої користувач може надіслати власні дані та задати питання
на які він хоче отримати відповіді, а також отримати додаткову інформацію,
якщо вона потребується. Готову форму ви можете спостерігати на рисунку
3.10:

Рисунок 3.10 - Форма зворотнього зв’язку
Арк.
ЧДТУ 232233.006 ПЗ 41
Змн. Арк. № докум. Підпис Дата

За допомогою HTML, CSS та JavaScript створена структура,
оформлення та інтерактивність лендінгу, враховуючи корпоративний стиль
логістичної компанії. HTML використовується для створення структури
сторінки, CSS - для оформлення її зовнішнього вигляду, а JavaScript - для
реалізації різних інтерактивних ефектів та функціональності.
Отже згідно інформації яка вказана вище можна зробити висновок, що
головна сторінка сайту являється лендінгом, так як головною метою сайту
являється привернути увагу потенційного клієнта та зробити так, щоб він
зареєструвався на веб-сайті, або залишив контакти та дані для зворотнього
зв’язку.

3.3 Розробка серверних скриптів для обробки запитів та роботи з
базою даних

Для забезпечення функціональності і надійності веб-сайту було
використано різні мови програмування та технології, такі як PHP, Python або
Node.js, залежно від специфікацій проекту та вимог до швидкодії. Ці серверні
скрипти були розроблені з урахуванням принципів модульності та повторного
використання коду, що сприяє забезпеченню чистого та підтримуваного коду.
Один з ключових аспектів розробки серверних скриптів була обробка
запитів користувача. Було визначено різні типи запитів, такі як отримання
інформації про замовлення, оновлення даних про вантаж, додавання нових
записів у базу даних тощо. Застосовувалися методи HTTP, такі як GET, POST,
PUT та DELETE, для взаємодії з сервером і передачі необхідних даних.
Також важливим аспектом була робота з базою даних. Використання
Системи управління базами даних (СУБД) дозволило забезпечити збереження,
організацію та ефективний доступ до даних. Були виконані дії створення
таблиць, вставки, оновлення та видалення даних за допомогою SQL-запитів, а
також виконані оптимізації для покращення продуктивності бази даних.
У процесі розробки серверних скриптів було приділено увагу захисту
даних та обробці помилок. Застосовувалися методи шифрування та хешування
Арк.
ЧДТУ 232233.006 ПЗ 42
Змн. Арк. № докум. Підпис Дата

для забезпечення безпеки конфіденційної інформації. Були реалізовані
перевірки введених даних, валідація та обробка помилок для запобігання
вразливостям і некоректній роботі системи.
У результаті розробки серверних скриптів було досягнуто успішної
інтеграції з веб-сайтом логістичної компанії, забезпечуючи ефективну обробку
запитів користувача та безперебійну роботу з базою даних. Це дозволяє
компанії ефективно керувати замовленнями, вантажами та складами,
сприяючи покращенню загальної

продуктивності та задоволеності клієнтів.
Отже основною метою скриптів являється зв’язок з базою даних а також
занесення, оновлення та видалення даних з бази даних. Головною метою
розробки скриптів являється занесення нових користувачів в базу даних, для
цього було розроблено скрипт реєстрації та авторизації. Метод реалізації
зображений на Рисунку 3.11-3.12.

Рисунок 3.11 – Скрипт реєстрації користувачів

Рисунок 3.12 – Скрипт авторизації користувачів
Арк.
ЧДТУ 232233.006 ПЗ 43
Змн. Арк. № докум. Підпис Дата

За допомогою даних скриптів користувачі можуть зареєструватися та
авторизуватися на сайті. Після авторизації, якщо користувач існує в базі даних
то він буде перенаправлений в особистий кабінет де він може редагувати
особисті дані. Скрипт входу в особистий кабінет показано на Рисунку 3.13

Рисунок 3.13 – Скрипт входу в особистий кабінет
Після того як користувач виконав успішний вхід користувача буде
перенаправлено на сторінку dashboard.php. Приклад коду сторінки вказано на
Рисунку 3.14

Рисунок 3.14 – Код особистого кабінету

3.4 Тестування веб-сайту

У цьому розділі проведено тестування розробленого веб-сайту для
логістичної компанії з метою перевірки його функціональності, надійності та
відповідності вимогам.
Перед початком тестування було розроблено план тестування, який
включав у себе опис тестових сценаріїв, набір тестових даних та критерії
Арк.
ЧДТУ 232233.006 ПЗ 44
Змн. Арк. № докум. Підпис Дата

прийнятності для оцінки результатів тестування. Застосовувалися різні методи
тестування, зокрема модульне тестування, функціональне тестування,
інтеграційне тестування та тестування продуктивності.
Під час модульного тестування перевірялася правильність роботи
окремих компонентів веб-сайту, таких як форми введення даних, функції
обробки запитів та доступ до бази даних. Функціональне тестування
зосереджувалося на перевірці функцій і функціональних вимог веб-сайту,
зокрема керування замовленнями, відстеження вантажів, управлінням
складами та іншими функціями.
Інтеграційне тестування включало перевірку взаємодії між різними
компонентами системи, а також інтеграцію зі сторонніми сервісами та
системами, такими як платіжні шлюзи чи системи відстеження вантажів.
Тестування продуктивності спрямовувалося на перевірку швидкості та
відповідності веб-сайту при великому навантаженні та об'ємах даних.
Після завершення тестування були зібрані результати та проведено
аналіз. Виявлені помилки та проблеми були документовані та виправлені. Веб-
сайт пройшов всі тестові сценарії успішно і відповідає поставленим вимогам.
Тестування веб-сайту логістичної компанії є важливим етапом у процесі
розробки, оскільки дозволяє виявити та виправити помилки перед введенням
системи в експлуатацію. Цей процес забезпечує надійність та якість роботи
веб-сайту, забезпечуючи задоволення користувачів та підвищуючи
ефективність логістичної компанії.
Тестування продуктивності підтвердило, що веб-сайт може працювати
ефективно та витримувати великі навантаження. Результати тестування
свідчать про те, що розроблений веб-сайт відповідає вимогам логістичної
компанії і здатний забезпечити ефективне управління операціями та
задоволення потреб клієнтів.
Тестування веб-сайту логістичної компанії виявилося критичним етапом
у процесі розробки, оскільки дозволило виявити та виправити помилки,
забезпечивши надійність та якість роботи веб-сайту. Результати тестування
Арк.
ЧДТУ 232233.006 ПЗ 45
Змн. Арк. № докум. Підпис Дата

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

3.5 Порівняння функціоналу сайту з аналогами

Порівняння функціоналу веб-сайту з аналогами є важливою частиною
дослідження, оскільки дозволяє оцінити конкурентні переваги та унікальність
розробленого веб-сайту для логістичної компанії. При порівнянні функціоналу
з аналогами, були враховані наступні аспекти:
Функціональність: Розглядалися функції, які доступні на розробленому
веб-сайті порівняно з аналогами. Було визначено, чи присутні на сайті такі
функції, як керування замовленнями, відстеження вантажів, управління
складами, зворотний зв'язок з клієнтами та інші важливі функції.
Інтерфейс та користувацький досвід: Аналізувався зовнішній вигляд
веб-сайту, його зручність для користувачів та інтуїтивність. Порівнювалася
легкість навігації, доступність важливих функцій та загальна естетика веб-
сайту.
Інноваційність: Вивчалася наявність новаторських рішень та технологій
на розробленому веб-сайті порівняно з аналогами. Це може включати
використання нових методів візуалізації даних, інтерактивних елементів,
інтеграцію зі сторонніми сервісами тощо.
Продуктивність та завантаження: Аналізувалася швидкість
завантаження веб-сайту та його продуктивність при великому навантаженні.
Порівнювалася швидкість роботи та відповідь веб-сайту порівняно з
аналогами.
Керування замовленнями: Розроблений веб-сайт надає можливість
ефективного керування замовленнями, включаючи створення, редагування та
видалення замовлень. Порівняно з аналогами, веб-сайт пропонує додаткові
функціональні можливості, такі як автоматичне повідомлення клієнтів про
Арк.
ЧДТУ 232233.006 ПЗ 46
Змн. Арк. № докум. Підпис Дата

статус замовлення та генерація звітів щодо замовлень.
Відстеження вантажів: Веб-сайт логістичної компанії надає зручний
інтерфейс для відстеження вантажів, що дозволяє клієнтам отримувати
актуальну інформацію про місцезнаходження їхніх вантажів у режимі
реального часу. У порівнянні з аналогами, веб-сайт пропонує більш широкі
можливості відстеження, включаючи інтеграцію з системами глобального
позиціонування та сповіщення клієнтів про зміни статусу вантажу.
Управління складами: Розроблений веб-сайт дозволяє логістичній
компанії ефективно керувати своїми складами, включаючи створення і
редагування інформації про товари, контроль за запасами та виконання
інвентаризації. У порівнянні з аналогами, веб-сайт надає більш гнучкі та
зручні інструменти для управління складами, включаючи графічні зображення
складських приміщень та автоматизовану генерацію звітів.
Взаємодія з клієнтами: Розроблений веб-сайт має функціонал, що сприяє
поліпшенню взаємодії з клієнтами, зокрема, включає онлайн-консультацію,
зручні форми зворотного зв'язку та можливість залишати відгуки та оцінки про
обслуговування. У порівнянні з аналогами, веб-сайт надає більш широкий
спектр інструментів для покращення комунікації та залучення клієнтів.
В результаті порівняння функціоналу веб-сайту з аналогами, можна
зробити висновок, що розроблений веб-сайт для логістичної компанії має
значний конкурентний перевагу, надаючи широкий спектр функцій та
покращену взаємодію з клієнтами. Це дозволить логістичній компанії зайняти
сильну позицію на ринку та забезпечити задоволення потреб її клієнтів.
Арк.
ЧДТУ 232233.006 ПЗ 47
Змн. Арк. № докум. Підпис Дата

ВИСНОВКИ
У цій дипломній роботі було розроблено веб-сайт для логістичної
компанії, що має на меті поліпшення її ділових процесів і забезпечення
зручності та ефективності управління її операціями. Проект реалізовано
шляхом впровадження сучасних веб-технологій і інструментів, зокрема
розробки на основі HTML, CSS, JavaScript і використання бази даних.
Цей проект демонструє значну користь для логістичної компанії,
сприяючи автоматизації процесів, поліпшенню ефективності та забезпеченню
точності даних. Веб-сайт може бути дальше розвинутий та вдосконалений
шляхом впровадження додаткових функціональностей та інтеграції з іншими
системами компанії.
В результаті проведеного дослідження та аналізу вимог логістичної
компанії були визначені основні функціональні вимоги до веб-сайту, такі як
керування замовленнями, відстеження вантажу, управління складами та інші.
Крім того, було звернуто увагу на дизайн і зручність використання, щоб
забезпечити приємний користувальницький досвід.
Під час розробки веб-сайту було використано принципи гнучкої
методології розробки програмного забезпечення, що дозволило ефективно
керувати проектом і забезпечити його вчасне виконання. Крім того, були
використані сучасні техніки тестування для перевірки функціональності та
надійності веб-сайту.
Результати дипломної роботи показують, що розроблений веб-сайт
відповідає вимогам логістичної компанії і дозволяє здійснювати керування
замовленнями, відстежувати вантаж, управляти складами та забезпечувати
ефективність ділових процесів. Крім того, забезпечується зручне
користування веб-сайтом завдяки його інтуїтивно зрозумілому і добре
організованому інтерфейсу.
Дана дипломна робота може бути використана як основа для
подальшого розвитку веб-сайту і впровадження додаткових функцій та
покращень. Розроблений веб-сайт виявляється важливим інструментом для
Арк.
ЧДТУ 232233.006 ПЗ 48
Змн. Арк. № докум. Підпис Дата

підвищення ефективності логістичної компанії і полегшення управління її
операціями в цифрову епоху.
Арк.
ЧДТУ 232233.006 ПЗ 49
Змн. Арк. № докум. Підпис Дата

СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ
1. Алесінська Т. В. Основи логістики. Загальні питання логістичного
управління / Алесінська Т. В., К.: Веселка. 2019. 121 с.
2. Березін О. В. Управління потенціалом підприємства: Навчальний
посібник, 2022. 6 с.
3. Використання виробничих ресурсів підприємств та регіонів України /
Білик І. І. Рівне, 2018. 122 с. 4. Борисенко З. М. Основи конкурентної
політики / Борисенко З. М. К.: Таксон, 2019. 30 с.
4. Глогусь О. Логістика: навч. посібник / Глогусь О. Тернопіль, 2018. 166
5. Григорак М. Ю. Логістичне управління зворотними матеріальними
потоками виробничого підприємства Григорак М. Ю. Київ, 2017. 236 с.
6. Долгов А. П. Логістичний менеджмент фірми: концепція, методи та
моделі: Навчальний посібник / А. П. Долгов, В. К. Козлов, С. А. Уваров.
Бізнеспреса, 2019. 384 с.
7. Дудар Т. Г. Основи логістики: навч. посіб. / Дудар Т. Г. Тернопіль,
2018. 163 с.
8. Іванюта Т. М. Економічна безпека підприємства / Іванюта Т. М. К.:
Центр навч. літератури, 2019. 256 с. 10.
9. Іваницька Т. Є. Методичний підхід до оцінки ефективності управління
будівельним підприємством на основі логістичних критеріїв. Економіка.
Управління. Інновації. / Іваницька Т. Є. Київ, 2018. 45 с.
10. Кальченко О. / Основи логістики / Кальченко А. Київ, 2019. 136 c.
11. Касьянова Н. В. Потенціал підприємства: формування та використання
/ Касьянова Н. В. – К.: Центр учбової літератури, 2018. 248 с. 56
12. Колодізєва Т. О. Методичне забезпечення оцінки ефективності
логістичної діяльності підприємств: монографія / Колодізєва Т. О. Харків,
2020. 292 с.
13. Короленко Н. В. Управління якістю логістичних процесів на
підприємствах: інтегральна парадигма. Ефективна економіка / Короленко Н.
В. Харків, 2019. 14 с.
Арк.
ЧДТУ 232233.006 ПЗ 50
Змн. Арк. № докум. Підпис Дата

14. Косарєва Т. В. Логістична система: сутність дефініцій / Косарєва Т. В.
– Економіка АПК, 2018. – 34 с. 16.
15. Крикавський Є. В. Логістика. Основи теорії / Крикавський Є. В. Львів,
2019. 416 с.
16. Крикавський Є. Логістика. Для економістів. Крикавський Є. В. Львів,
2020. 440 с.
17. Крикавський Є. Логістичне управління / Крикавський Є. В. Львів, 2019.
684 с.
18. Крикавський Є. Промисловий маркетинг / Крикавський Є. В. Львів,
2020. 472 с.
19. Крістофер М. Маркетингова логістика / Крістофер М. Харків, 2019. 200
с.
20. Лінькова О. Ю. Менеджмент організацій / Лінькова О.Ю. Харків, 2020.
463 c.
21. Офіційний сайт ТОВ «Нова Пошта» URL: https://novaposhta.ua/
22. Пономаренко В. С. Логістичний менеджмент: Підручник/В. С.
Пономаренко, К. М. Таньков, Т. І. Лепейко. Харків, 2020. 440 с.
23. . Потенціал підприємства: формування та оцінка. URL:
http://www.refine.org.ua/ pageid-5425-3.html
24. Пушкар М. С. Логістичні системи підприємства: облік, аналіз та аудит:
монографія / Пушкар М. С. Тернопіль, 2017. 202 с.
25. Бен Фрэйн. Чуйний дизайн на HTML5 та CSS3 для будь-яких пристроїв,
2021. 80 с.
Арк.
ЧДТУ 232233.006 ПЗ 51
Змн. Арк. № докум. Підпис Дата

ДОДАТОК А

ЗАТВЕРДЖЕНО
Зав.кафедри ІТП
Тетяна ПРОКОПЕНКО.
“ ” _2023р.

Web-сайт для логістичної компанії

Специфікація
482 ЧДТУ 232233 – 01
Листів 2

Розробник _ Олександр Чекаленко
Керівник _ Ярослав ТАРАСЕНКО
Н. контроль Ярослав ТАРАСЕНКО

Черкаси, 2023
53
482 ЧДТУ 232233 – 01

Позначення Найменування Примітка
482 ЧДТУ 232233 – 01 12 01 Текст програми

ДОДАТОК Б

Серверна частина WEB-сайту логістичної компанії

482 ЧДТУ 232233 – 01 12 01
Текст програми
Листів

Розробник Олександр ЧЕКАЛЕНКО

Черкаси, 2023
55
482 ЧДТУ 232233 – 01 12 01

Головна сторінка

Код index.html
<!DOCTYPE html> <div class="buttonbtnprimary-colorbtn-round-
<html> EAfli" data-id="169:33">
<div class="btn-text btn-text" data-id="169:34">
<head> <a class="buttonbtnprimary-colorbtn-round-
<title>Gruzi</title> EAfli1" href="register.html">Приєднатися</a></div>
<meta charset="utf-8"> </div>
<meta name="viewport" content="width=1440, </div>
maximum-scale=1.0"> </div>
<link rel="shortcut icon" type="image/png" </div>
href="https://animaproject.s3.amazonaws.com/home/favico <div class="row-cbPCJy row" data-id="169:35">
n.png"> <div class="col-md-4-5Oexxr col-md-4" data-
<meta name="og:type" content="website"> id="169:36">
<meta name="twitter:card" content="photo"> <div class="card-item-WAnNYL card-item" data-
<script id="anima-hotspots-script" id="169:37"><img class="handshake-1-1-fEajW2" data-
src="hotspots.js"></script> id="169:38"
<script id="anima-overrides-script" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w
src="overrides.js"></script> AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO
<script w==" anima-
src="https://animaapp.s3.amazonaws.com/js/timeline.js">< src="https://cdn.animaapp.com/projects/6469fb52d706284c
/script> f60442e5/releases/6469fbb4754105b20c4cfd35/img/handsh
<link rel="stylesheet" type="text/css" [email protected]" alt="handshake (1) 1">
href="css/style1.css"> <h3 class="h3-feature-title1-fEajW2 h3" data-
<style> id="169:39">Понад 6 000 перевізників вже працюють із
нами</h3></div>
</style> </div>
</head> <div class="col-md-4-ytOMnD col-md-4" data-
id="169:40">
<body style="margin: 0;background: #ffffff;"> <div class="card-item-BZM1wV card-item" data-
<div class="desktop screen " data-id="169:0"> id="169:41"><img class="truck-8-1-jhLP1T" data-
<div class="group-1-dg6U5x" data-id="905:3"> id="169:42"
<div class="header-6-Q7BHme" data-id="169:8"> src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w
<img class="x1-olNhDQ x1" data-id="169:9" AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w w==" anima-
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO src="https://cdn.animaapp.com/projects/6469fb52d706284c
w==" anima- f60442e5/releases/6469fbb4754105b20c4cfd35/img/truck--
src="https://cdn.animaapp.com/projects/6469fb52d706284c [email protected]" alt="truck (8) 1">
f60442e5/releases/6469fbb4754105b20c4cfd35/img/----- <h3 class="h3-feature-title2-jhLP1T h3" data-
1. png" alt="1"> id="169:43">Понад 100 000 рейсів на рік</h3></div>
<div class="filter-olNhDQ" data-id="169:11"> </div>
</div> <div class="col-md-4-USQdoV col-md-4" data-
 <h3 class="h3-feature-title3-bKiD2G h3" data-
<div class="container-x72hkp" data-id="169:27"> id="169:47">Власна служба безпеки</h3></div>
<div class="row-3f4fmU row" data-id="169:28"> </div>
<div class="main-content-P3WY5d main-content" </div>
data-id="169:29"> </div>
<h1 class="h1-headline7-ooDTSn h1" data- </div>
id="169:30">Цифрова платформа <br>для <div class="view-Q7BHme" data-id="169:94">
вантажоперевезення</h1> <div class="view-BGhFb8" data-id="169:95">
<h4 class="h4-ooDTSn h4" data- <div class="main-content-2Kswxa main-content"
id="169:31">Екосистема сервісів для транспортної data-id="169:96">
логістики&nbsp;&nbsp;<br>Транспортні тендери | <h2 class="h2-feature-section1-LgxVex h2" data-
Спотовий аукціони | TMS | Трекінг вантажів</h4> id="169:97">Продукти платформи</h2></div>
<div class="cta-ooDTSn" data-id="169:32"> </div>
56
482 ЧДТУ 232233 – 01 12 01

<div class="view-hKlGor" data-id="169:98"><img src="https://cdn.animaapp.com/projects/6469fb52d706284c
class="x2-guHeQB x2" data-id="169:99" f60442e5/releases/6469fbb4754105b20c4cfd35/img/image-
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w [email protected]" alt="image 3">
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO <div class="frame-1-V6YHmx frame-1" data-
w==" anima- id="169:376">
src="https://cdn.animaapp.com/projects/6469fb52d706284c <h5 class="h5-feature-title1-IqSGAy h5-feature-
f60442e5/releases/6469fbb4754105b20c4cfd35/img/------ title1 h5" data-id="169:377">TMS / Система керування
2. png" alt="2"><img class="image-5-guHeQB" data- перевезеннями</h5>
id="169:363" <p class="paragraph-IqSGAy paragraph paragraph"
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w data-id="169:378">• Фіксація та облік договірних умов
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO <br>• Автоматизація логістичних процесів
w==" anima- <br>• Можливість налаштування під конкретні
src="https://cdn.animaapp.com/projects/6469fb52d706284c завдання</p>
f60442e5/releases/6469fbb4754105b20c4cfd35/img/image- </div>
5.png" alt="image 5"><img class="vector-guHeQB vector" </div>
data-id="169:365" <div class="view-jbf24y" data-id="169:379">
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w <div class="card-item-ysV6Cw card-item" data-
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO id="169:380"><img class="image-2-tmsRcV" data-
w==" anima- id="169:381"
src="https://cdn.animaapp.com/projects/6469fb52d706284c src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w
f60442e5/releases/6469fbb4754105b20c4cfd35/img/vector. AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO
svg" alt="Vector"><img class="vector-5OcvBG vector" w==" anima-
data-id="169:366" src="https://cdn.animaapp.com/projects/6469fb52d706284c
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w f60442e5/releases/6469fbb4754105b20c4cfd35/img/image-
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO [email protected]" alt="image 2">
w==" anima- <div class="frame-1-tmsRcV frame-1" data-
src="https://cdn.animaapp.com/projects/6469fb52d706284c id="169:382">
f60442e5/releases/6469fbb4754105b20c4cfd35/img/vector. <h5 class="h5-feature-title2-1uJRYi h5-feature-
svg" alt="Vector"><img class="vector-9H3H5e vector" title2 h5" data-id="169:383">Спотовий аукціон</h5>
data-id="169:367" <p class="paragraph-1uJRYi paragraph paragraph"
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w data-id="169:384">• Оперативне закриття термінових
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO перевезень
w==" anima- <br>• Три види аукціонів: на зниження, першої
src="https://cdn.animaapp.com/projects/6469fb52d706284c згоди, без стартової ціни</p>
f60442e5/releases/6469fbb4754105b20c4cfd35/img/vector. </div>
svg" alt="Vector"><img class="vector-fY8EB7 vector" </div>
data-id="169:368" </div>
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w <div class="view-qouSDi" data-id="169:385">
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO <div class="card-item-zJlklI card-item" data-
w==" anima- id="169:386"><img class="image-4-uYsX4R" data-
src="https://cdn.animaapp.com/projects/6469fb52d706284c id="169:387"
f60442e5/releases/6469fbb4754105b20c4cfd35/img/vector. src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w
svg" alt="Vector"></div> AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO
<div class="view-DsucD1" data-id="169:369"><img w==" anima-
class="image-1-uicSu4" data-id="169:370" src="https://cdn.animaapp.com/projects/6469fb52d706284c
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w f60442e5/releases/6469fbb4754105b20c4cfd35/img/image-
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO [email protected]" alt="image 4">
w==" anima- <div class="frame-1-uYsX4R frame-1" data-
src="https://cdn.animaapp.com/projects/6469fb52d706284c id="169:388">
f60442e5/releases/6469fbb4754105b20c4cfd35/img/image- <h5 class="h5-feature-title2-bhp2jT h5-feature-
[email protected]" alt="image 1"> title2 h5" data-id="169:389">Трекінг вантажів</h5>
<div class="frame-1-uicSu4 frame-1" data- <p class="paragraph-bhp2jT paragraph paragraph"
id="169:371"> data-id="169:390">Усі види відстеження:
<h5 class="h5-feature-title1-HSTOLy h5-feature- <br>• Бортові блоки
title1 h5" data-id="169:372">Транспортні тендери</h5> <br>• GSM-зв'язок
<p class="paragraph-HSTOLy paragraph paragraph" <br>• Мобільний додатоке</p>
data-id="169:373">• Прозорість процесів закупівлі </div>
<br>• Автоматизація розподілу обсягів </div>
<br>• Консолідована звітність </div>
<br>• Зберігання результатів та історії <div class="view-A0cKOl" data-id="169:391"><img
торгів</p> class="x02-1-ELEMxp" data-id="169:392"
</div> src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w
</div> AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO
<div class="view-cWcxHc" data-id="169:374"><img w==" anima-
class="image-3-V6YHmx" data-id="169:375" src="https://cdn.animaapp.com/projects/6469fb52d706284c
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w f60442e5/releases/6469fbb4754105b20c4cfd35/img/--------
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO -02-1.png" alt="02 1">
w==" anima-
57
482 ЧДТУ 232233 – 01 12 01

<p class="x-ELEMxp x montserrat-medium-fuscous- <br>Оперативна обробка відхилень</p>
gray-24px" data-id="169:393">Забезпечимо контроль та <div class="buttonbtnprimary-color-NVQN2W
виконання бюджету у ТМС buttonbtnprimary-color" data-id="169:993">
<br>Найсильніший аналітичний модуль <div class="btn-text -" data-
<br>Єдиний наскрізний процес «Закупівлі- id="169:994">Попробовать</div>
виконання» </div>
<br>Незалежність прийнятих рішень </div>
<br>Робота тільки з перевіреними <div class="view-FOIx87" data-id="169:807"><img
перевізниками</p> class="frame-GLVacZ frame" data-id="169:808"
<div class="text_label-ELEMxp text_label src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w
montserrat-bold-fuscous-gray-31px" data-id="169:394"> AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO
Транспортні тендери</div> w==" anima-
<div class="buttonbtnprimary-color-ELEMxp src="https://cdn.animaapp.com/projects/6469fb52d706284c
buttonbtnprimary-color" data-id="169:397"> f60442e5/releases/6469fbb4754105b20c4cfd35/img/frame-
<div class="btn-text -" data- 1.svg" alt="Frame">
id="169:398">Попробовать</div> <div class="text_label-GLVacZ text_label
</div> montserrat-bold-fuscous-gray-31px" data-id="169:853">
</div> Трекінг вантажів</div>
<div class="view-pV3S1P" data-id="169:399"><img <p class="erp-GLVacZ montserrat-medium-fuscous-
class="frame-vv9ZFA frame" data-id="169:400" gray-24px" data-id="169:995">Інтеграція з ERP-
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w системою клієнтів
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO <br>Автоматизація розподілу замовлень
w==" anima- <br>Відстеження зміни статусів
src="https://cdn.animaapp.com/projects/6469fb52d706284c <br>Можливість гнучкого налаштування
f60442e5/releases/6469fbb4754105b20c4cfd35/img/frame. <br>Аудит логістичних процесів</p>
svg" alt="Frame"> <div class="buttonbtnprimary-color-GLVacZ
<div class="x-vv9ZFA x montserrat-bold-fuscous- buttonbtnprimary-color" data-id="169:996">
gray-31px" data-id="169:423"> Спотовий аукціон</div> <div class="btn-text -" data-
<p class="text_label-vv9ZFA text_label montserrat- id="169:997">Попробовать</div>
medium-fuscous-gray-24px" data- </div>
id="169:989">Замінюємо пошту та месенджери </div>
<br>Усі торги організації в одному вікні </div>
<br>Усі торги організації в одному вікнів <div class="pricing-3-Q7BHme" data-id="169:858">
<br>Чіткий контроль кола учасників <div class="contact-5-1hJley" data-id="169:859">
<br>Різні типи аукціонів під будь-яку <div class="container-qDxhuJ" data-id="169:860">
ситуацію</p> <div class="row-lx5q3j row" data-id="169:861">
<div class="buttonbtnprimary-color-vv9ZFA <div class="col-md-5-9EFEsl col-md-5" data-
buttonbtnprimary-color" data-id="169:990"> id="169:862">
<div class="btn-text -" data- <h2 class="h2 h2" data-id="169:863">Для
id="169:991">Попробовать</div> перевізників</h2></div>
</div> <div class="col-md-5-7o8sPo col-md-5" data-
</div> id="169:864">
<div class="view-4txXex" data-id="169:428"><img <div class="custom-form-group-subscribe-
class="x2-NVQN2W x2" data-id="169:429" T2iRn1 custom-form-group-subscribe" data-id="169:865">
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w <div class="buttonbtnprimary-color-3GMxUA
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO buttonbtnprimary-color" data-id="169:866">
w==" anima- <div class="btn-text btn-text" data-
src="https://cdn.animaapp.com/projects/6469fb52d706284c id="169:867">Присоединяйтесь</div>
f60442e5/releases/6469fbb4754105b20c4cfd35/img/ ----- 2- </div>
1.png" alt="2"><img class="frame-NVQN2W frame" data- </div>
id="169:693" </div>
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w </div>
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO <div class="features-list-lx5q3j" data-
w==" anima- id="169:868">
src="https://cdn.animaapp.com/projects/6469fb52d706284c <div class="feature-item-xtcxYt feature-item"
f60442e5/releases/6469fbb4754105b20c4cfd35/img/frame- data-id="169:869"><img class="icn-circle-circle-xs-
2.svg" alt="Frame"> secondary-color-1" data-id="169:870"
<p class="ms-NVQN2W montserrat-bold-fuscous- src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w
gray-31px" data-id="169:802"> ТMS / Система керування AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO
перевезеннями</p> w==" anima-
<p class="text_label-NVQN2W text_label src="https://cdn.animaapp.com/projects/6469fb52d706284c
montserrat-medium-fuscous-gray-24px" data- f60442e5/releases/6469fbb4754105b20c4cfd35/img/icn-
id="169:992">Контролює всі етапи від закупівлі до circle-circle-xs-secondary-color-1.svg" alt="icn-circle
оплати circle-xs secondary-color-1">
<br>Безшовна інтеграція продуктів у екосистемі <h6 class="h6-ufGIK8 h6 h6" data-
ТМС id="169:873">Всі власники вантажів на одній платформі
<br>Відстеження статусу замовлення онлайн – беріть участь в аукціонах і тендерах, отримуйте вигідні
<br>Контроль документообігу замовлення</h6></div>
58
482 ЧДТУ 232233 – 01 12 01

<div class="feature-item-p1iZLx feature-item" <div class="card-item-CbjPB0 card-item" data-
data-id="169:874"><img class="icn-circle-circle-xs- id="169:898"><img class="x1-eJgZGh x1" data-
secondary-color-1" data-id="169:875" id="169:899"
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO
w==" anima- w==" anima-
src="https://cdn.animaapp.com/projects/6469fb52d706284c src="https://cdn.animaapp.com/projects/6469fb52d706284c
f60442e5/releases/6469fbb4754105b20c4cfd35/img/icn- f60442e5/releases/6469fbb4754105b20c4cfd35/img/ ---- 1-
circle-circle-xs-secondary-color-1-1.svg" alt="icn-circle 1.png" alt="1">
circle-xs secondary-color-1"> <div class="div-eJgZGh" data-id="169:900">
<h6 class="h6-sTxqjy h6 h6" data- <h3 class="h3-bgjq8M h3" data-
id="169:878">Тільки вигідні рейси – наші перевізники id="169:901">Зв'язатися з нами</h3>
заробляють понад 200 000 рублів на рік із кожної <div class="card-content-bgjq8M" data-
машини</h6></div> id="169:902">
<div class="feature-item-dFybEE feature-item" <div class="form-group-nD9qlD form-group"
data-id="169:879"><img class="icn-circle-circle-xs- data-id="169:903">
secondary-color-1" data-id="169:880" <h6 class="form-control h6" data-
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w id="169:904">Ім'я *</h6>
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO <div class="form-control-input-style-1-
w==" anima- xZxnWW form-control-input-style-1" data-id="169:905">
src="https://cdn.animaapp.com/projects/6469fb52d706284c <div class="inputform-control-oxl30g
f60442e5/releases/6469fbb4754105b20c4cfd35/img/icn- inputform-control" data-id="169:906">
circle-circle-xs-secondary-color-1-2.svg" alt="icn-circle <div class="email montserrat-normal-
circle-xs secondary-color-1"> sonic-silver-14px" data-id="169:907">Полное имя *</div>
<h6 class="h6-45mbvP h6 h6" data- </div>
id="169:883">Гарантія завантаження – у нас понад 70 </div>
000 рейсів</h6></div> </div>
</div> <div class="form-group-4xmOsk form-group"
</div> data-id="169:908">
</div> <h6 class="form-control h6" data-
</div> id="169:909">Адреса електронної пошти *</h6>
<div class="contact-2-Q7BHme" data-id="169:884"> <div class="form-control-input-style-1-
<div class="background-xlQStE" data-id="169:885"> WMo8a2 form-control-input-style-1" data-id="169:910">
<div class="cover-VXenyK" data- <div class="inputform-control-kXTfOY
id="169:886"></div> inputform-control" data-id="169:911">
</div> <input style="position: absolute;
<div class="container-xlQStE" data-id="169:887"> width:489px; height: 49px; border-radius: 8px;"
<div class="row-E8PJtY row" data-id="169:888"> type="email" id="email" name="email" required>
<div class="col-md-7-6Xilh5 col-md-7" data- <div class="email montserrat-normal-
id="169:889"> sonic-silver-14px" data-id="169:912">
<h2 class="h2 h2" data- </div>
id="169:890">WebLogistic</h2> </div>
<p class="paragraph-sSVdBh paragraph </div>
paragraph" data-id="169:891">Це цифрова платформа </div>
для перевезення вантажів. Користувачам доступні <div class="form-group-custom-select" data-
продукти та сервіси для автоматизації закупівлі та id="169:913">
виконання перевезень: транспортні тендери, спот- <h6 class="form-control h6" data-
аукціони,&nbsp;&nbsp;TMS та трекінг. Цифрові id="169:914">Компанія *</h6>
продукти об'єднані в екосистему, інтегровані з ІТ- <div class="custom-select" data-
системами відправників вантажів, дозволяють id="169:915">
оптимізувати рутинні процеси і значно знизити витрати <div class="select" data-id="169:916">
на транспортну логістику.</p> <div class="option" data-id="169:917">
</div> <div class="dropdown montserrat-normal-
<div class="col-md-5-6Xilh5 col-md-5" data- sonic-silver-14px" data-id="169:918">ТОВ
id="169:892"> “Ромашка”</div>
<div class="buttonbtnprimary-color-lk40xH </div>
buttonbtnprimary-color" data-id="169:893"> </div>
<div class="btn-text-sxALyo btn-text btn-text" </div>
data-id="169:894">Скачать презентацию</div> </div>
</div> <div class="form-group-custom-select" data-
</div> id="169:929">
</div> <h6 class="form-control h6" data-
<div class="custom-form-group-subscribe-E8PJtY id="169:930">Телефон *</h6>
custom-form-group-subscribe" data-id="169:895"></div> <div class="custom-select" data-
<div class="row-5VpKjm row" data-id="169:896"> id="169:931">
<div class="main-content-M5agw8 main-content" <div class="select" data-id="169:932">
data-id="169:897"> <div class="option" data-id="169:933">
59
482 ЧДТУ 232233 – 01 12 01
<div class="dropdown montserrat-normal- sonic-silver-14px" data-id="169:934">+38(012)-345-67- 89</div>
</div>
</div>
</div>
</div>
</div>
<div class="buttonbtnprimary-color-bgjq8M buttonbtnprimary-color" data-id="169:945">
<div class="btn-text btn-text" data- id="169:946">Отправить</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="footer-2-Q7BHme" data-id="169:947">
<div class="div-24Re8q" data-id="169:948">
<div class="container-hXbBCt" data-id="169:949">
<div class="row-APP71K row" data-id="169:950">
<div class="col-md-2-dwN6Iy col-md-2" data- id="169:951">
<h5 class="h5 h5" data- id="169:952">Копирайт</h5></div>
<div class="col-md-2-YEnH51 col-md-2" data- id="169:953">
<h5 class="h5 h5" data- id="169:954">Документи</h5>
<div class="div-oVNyMc" data-id="169:955">
<h6 class="link-eUFzDb valign-text-bottom link h6" data-id="169:956">Політика конфіденційності</h6>
<h6 class="link-FJD8Nh valign-text-bottom link h6" data-id="169:957">Користувацька угода</h6>
<h6 class="link-cYferb valign-text-bottom link h6" data-id="169:1001">Ліцензійна угода</h6>
<h6 class="link-yPstCV valign-text-bottom linkh 6" data-id="174:35">Пропозиція</h6></div>
</div>
<div class="col-md-4-dwN6Iy col-md-4" data- id="169:958">
<h5 class="h5 h5" data- id="169:959">Контакти</h5>
<div class="div-U6bMEj" data-id="169:960">
<div class="feature-item-EdRE7z feature-item"d ata-id="169:961"><img class="bxbx-phone-W2fwQA" data-id="169:962"
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO
w==" anima-
src="https://cdn.animaapp.com/projects/6469fb52d706284c f60442e5/releases/6469fbb4754105b20c4cfd35/img/bx-bx- phone.svg"
alt="bx:bx-phone">
<h6 class="h6-W2fwQA h6 h6" data- id="169:964">+380 (96)-335-80-94</h6></div>
<div class="feature-item-xeICTt feature-item" data-id="169:965"><img class="bxbx-map-3xDQ4s" data-
id="169:966"
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO
w==" anima-
src="https://cdn.animaapp.com/projects/6469fb52d706284c f60442e5/releases/6469fbb4754105b20c4cfd35/img/bx-bx- map.svg"
alt="bx:bx-map">
<h6 class="h6-3xDQ4s h6 h6" data- id="169:968">Shevchenka Blvd, 460, Cherkasy, Cherkasy Oblast,
18000</h6></div>
<div class="feature-item-0E7tS8 feature-item"d ata-id="169:969"><img class="carbonsend-alt-KvdsTs"d ata-
id="169:970" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w
AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO
w==" anima-
src="https://cdn.animaapp.com/projects/6469fb52d706284c f60442e5/releases/6469fbb4754105b20c4cfd35/img/carbon
-send-alt.svg" alt="carbon:send-alt">
<h6 class="h6-KvdsTs h6 h6" data- id="169:972">info@weblogistic</h6></div>
</div>
</div>
</div>
</div>
</div>
<div class="div-GjJRdW" data-id="169:973">
<div class="container-W6VquG" data-id="169:974">
<div class="row-s2CsbQ row" data-id="169:975">
<div class="col-md-7-5rQ3JS col-md-7" data- id="169:976">
<h6 class="x-x5K1i1 x h6" data- id="169:977">All rights reserved and trademarked WebLogistic 2022-
2023</h6></div><img class="col-md-6- 5rQ3JS" data-id="169:978"
src="data:image/gif;base64,R0lGODlhAQABAIAAAP///w AAACH5BAEAAAAALAAAAAABAAEAAAICRAEAO
w==" anima-
src="https://cdn.animaapp.com/projects/6469fb52d706284c f60442e5/releases/6469fbb4754105b20c4cfd35/img/col- md-6.svg"
alt="col-md-6"></div>
</div>
</div>
</div>
</div>

ChSTU repository

ChSTU repository preserves and enables easy and open access to all types of digital content including text, images, moving images, mpegs and data sets