Разработка web-сайта для ТОО «Кайнар-медиа»
ВВЕДЕНИЕ
Интернет как средство коммуникации, не имеющее территориальных границ, дает возможность обмениваться различного рода информацией. На сегодняшний день Интернет оказал большое влияние на развитие бизнес компаний, изменяя способы представления компании перед потенциальными клиентами, а также обслуживание существующих клиентов. Количество людей, использующих Интернет как средство для получения нужных сведений о предоставляемых услугах, значительно выросло в последнее время. Интернет помогает в росте бизнеса, как маленькому бизнесу, так и крупным компаниям.
На сегодняшний день у Интернет-провайдера «Кайнар-Медиа» отсутствует web-сайт. Компания использует не актуальные методы продвижения услуг, теряет множество клиентов, пользователи интернета отдают предпочтение конкурентам.
Для представления своих услуг в сети Интернет, компании «Кайнар-Медиа» необходимо обзавестись собственным web-сайтом.
ОГЛАВЛЕНИЕ
ВВЕДЕНИЕ 6
1 Обзор современных технологий для создания web-сайта 8
1.1 Обзор и выбор современных методов разработки web-сайтов 8
1.2 Обзор и выбор языков программирования 9
1.3 Обзор и выбор среды разработки 12
1.4 Обзор и выбор графических редакторов 13
1.5 Выводы по первому разделу 19
2 Разработка web-сайта «Кайнар-медиа» 20
2.1 Разработка прототипа web-сайта 20
2.1.1 Обзори выбор структуры web-сайта 20
2.1.2 Обзор и выбор структуры навигации по web-сайту 23
2.1.3 Разработка прототипа web-сайта 25
2.2 Создание дизайна web-сайта 27
2.3 Верстка web-сайта 29
2.4 Выводы по второму разделу 31
3 Практическая реализация программного кода 33
3.1 Тестирование работы адаптивной верстки web-сайта 33
3.2 Тестирование кнопок web-сайта 35
3.4 Тестирование скорости загрузки страниц 36
3.5 Выводы по третьему разделу 38
ЗАКЛЮЧЕНИЕ 39
СПИСОК ИСПОЛЬЗУЕМОЙ ЛИТЕРАТУРЫ 40
ПРИЛОЖЕНИЕ А 42
СПИСОК ИСПОЛЬЗУЕМОЙ ЛИТЕРАТУРЫ
Обзор языка программирования Python: сайт – 2008 – URL: https://www.python.org/about/ (дата обращения 12.05.2022). – Текст: электронный
Обзор языка программирования Ruby: сайт – 2018 – URL: https://www.ruby-lang.org/ru/about/ (дата обращения 12.05.2022). – Текст: электронный
Обзор языка программирования JavaScript: сайт – 2008 – URL: https://www.tutorialspoint.com/javascript/javascript_overview.html (дата обращения 12.05.2022). – Текст: электронный
Обзор библиотеки jQuery: сайт – 2020 – URL: https://jquery.com/ (дата обращения 12.05.2022). – Текст: электронный
Обзор библиотеки React: сайт – 2019 – URL: https://reactjs.org/ (дата обращения 12.05.2022). – Текст: электронный
Обзор библиотеки Vue.js: сайт – 2019 – URL: https://vuejs.org/ (дата обращения 12.05.2022). – Текст: электронный
Обзор среды разработки WebStorm: сайт – 2021 – URL: https://www.jetbrains.com/ru-ru/webstorm/ (дата обращения 12.05.2022). – Текст: электронный
Обзор среды разработки Atom: сайт – 2019 – URL: https://atom.io/ (дата обращения 12.05.2022). – Текст: электронный
Обзор среды разработки Visual Studio Code: сайт – 2022 – URL: https://code.visualstudio.com/learn (дата обращения 12.05.2022). – Текст: электронный
Тег <div>: сайт – 2017 – URL: http://htmlbook.ru/html/div (дата обращения 12.05.2022). – Текст: электронный
Тег <span>: сайт – 2017 – URL: http://htmlbook.ru/html/span (дата обращения 12.05.2022). – Текст: электронный
Обучающие пособия для начинающих Xara: сайт – 2021 – URL: https://www.magix.com/ru/tekhnicheskaja-podderzhka/know-how/obuchajushchie-videoroliki/xara-designer-pro/ (дата обращения 12.05.2022). – Текст: электронный
Гид по Figma: сайт – 2021 – URL: https://tilda.education/articles-figma (дата обращения 12.05.2022). – Текст: электронный
После разработки технического задания вместе с руководителем ТОО «Кайнар-Медиа» были определены основные моменты, которые должны быть отражены на web-сайте. Для интернет-провайдера, web-сайт служит лицом компании. Поэтому в первую очередь сайт должен отображать красивый дизайн, понятный навигационный интерфейс, а также содержать нужную информацию для клиента. В общем сайт будет иметь 10 страниц, к каждой из которых можно перейти через навигационное меню. В шапке каждой странице будет отображен навигационный интерфейс между страницами. Ниже будет расположен рекламный баннер с различными новостями, скидками для привлечения клиентов. Внизу сайта расположатся номера поддержки и ремонтного бюро.
2.1.1 Обзор и выбор структуры web-сайта
После определения как будут оформлены страницы, приступим к созданию прототипа web-сайта. Для начала определим структуру сайта. Это нужно, чтобы изначально понять, каким будет объем сайта, какие функцию будет включать в себя и какие технологии будут использоваться. Существует несколько основных структур:
Линейная структура – выглядит в виде цепочки, хорошо подходит для одностраничных сайтов и визиток. Страницы переходят одна в другую по