Разработка клиентской части интернет-магазина

В приложении Г показывается то, как задается интервал между картинками (строки 24-34), после этого высчитывается ширина картинок для последующей работы слайдера (строки 76-113) Слайдер изображен на рисунке 12.Рисунок 12. Слайдер на сайте2.12 Создание каталога товаровДля создания каталога товаров используются технологии CSS. В CSS использовались такая технология, как grid, а так были использованы анимации псевдоклассы. Каталог товаров изображен на приложении Д (строки 285 – 343). Каталог изображены на рисунках 13Рисунок 13. Каталог товаров с анимациейСоздание баннераДля создания баннера использовалась технология CSS с применением scale, а также filter: brightness для затемнения. Баннер изображен на рисунках 17. Создание баннера продемонстрировано в приложении Д (строки 322 – 335).Рисунок 17 – Баннер Создание новостей сайтаДля создания новостей сайта появляется с картинкой заказа.Так новости изображены на рисунках 19.Рисунок 19 – Новости магазинаПрименение адаптивности к сайтуАдаптивность — одно из ключевых требований, предъявляемых к современным сайтам. Ресурс должен одинаково хорошо демонстрироваться на экране компьютера, планшете, смартфоне. Для этого создается адаптивный дизайн и используется адаптивная верстка. В итоге процесс веб-разработки усложняется, требует дополнительных ресурсов. Но результат стоит вложений: сайт отлично позиционируется на всех основных типах устройств, что гарантирует полноценный охват аудитории. Адаптивность продемонстрировано в приложении Д (строки 450 – 554). Прежде всего в header.php в тег было прописано в коде 5Код 6 – Подключение адаптивностиname = “vieport” width=device-width, initial-scale=1.0 Также в CSS применялись media queries, которые отслеживали ширину экрана, тем самым изменяя отображения и расположения элементов сайта. Адаптивность в сравнении с декстоп версией на примере IpadPro показана на рисунках 20Рисунок 20 – Версия для IpadProТестирование интернет- магазинаТестирование программного обеспечения — процесс исследования, испытания программного продукта, имеющий своей целью проверку соответствия между реальным поведением программы и её ожидаемым поведением на конечном наборе тестов, выбранных определенным образом (ISO/IEC TR 19759:2005).Виды тестирования программного обеспечения, в зависимости от преследуемых целей, можно условно разделить на следующие группы: Функциональные.Нефункциональные.Связанные с изменениями.Далее, мы постараемся более подробно рассказать о каждом отдельном виде тестирования, его назначении и использовании при тестировании программного обеспечения. Функциональные виды тестирования Функциональные тесты базируются на функциях и особенностях, а также взаимодействии с другими системами, и могут быть представлены на всех уровнях тестирования: компонентном или модульном (Component/Unit testing), интеграционном (Integration testing), системном (System testing) и приемочном (Acceptance testing). Функциональные виды тестирования рассматривают внешнее поведение системы. Далее перечислены одни из самых распространенных видов функциональных тестов: Функциональное тестирование (Functional testing).Тестированиебезопасности (Security and Access Control Testing).Тестирование взаимодействия (Interoperability Testing).Нефункциональные виды тестирования. Нефункциональное тестирование описывает тесты, необходимые для определения характеристик программного обеспечения, которые могут быть измерены различными величинами. В целом, это тестирование того, "Как" система работает. На рисунке 13 представлен скриншот тестирования запуска программы на работоспособность.Рисунок 13. Запуск программы .ВалидацияПереходим по адресу: validator.w3.org. Перед нами откроется страница, на которой есть 3 вкладки. На первой вкладке «Validate by URI» вы можете проверить валидность сайта размещенного в интернет, на второй «Validate by File Upload» — загрузить файл с компьютера, и на третьей «Validate by Direct Input» — вставить содержимое файла непосредственно в форму для ввода. Я буду рассказывать о первом варианте, то есть когда сайт размещен в интернет (думаю и с другими способами у вас проблем не возникнет). Поэтому выбираем первую вкладку как на изображении ниже:Далее необходимо выставить сайт на хостинг и выполнить все по порядку для проверки.ВерификацияВерификация - это система ​мер для подтверждения подлинности указанного в процессе регистрации ​электронного адреса вашего сайта. Панель вебмастера - это сервис, предоставляющий информацию о том, как индексируются ваши сайты.Экспертное тестированиеЭкспертное тестирование – это тестирование юзабилити сайта.Что такое юзабилити-тестирование Юзабилити-тест — это комплексная проверка сайта на предмет его удобного визуального восприятия и правильной работы всех технических элементов. За удобство визуального восприятия отвечает UI-дизайн, а для проверки технических элементов используется аудит сайта.Отладка интернет- магазинаОтладка интернет – магазина,проверка на реализацию всех поставленных задач.ЗаключениеВ данной курсовой работе были изучены основные принципы при разработке Веб-сайта. С развитием технологий гипертекстовой разметки в Интернете стало появляться всё больше сайтов, тематика которых совершенно различна - от сайтов крупных компаний, повествующих об успехах компании и её провалах, до сайтов маленьких фирм, предлагающих посетить их офисы в пределах одного города.К технологиям со стороны клиента относятся все технологии создания Web-страниц (HTML, JavaScript, DHTML), а к технологиям со стороны сервера относятся технологии доступа к базам данных в сети Интернет.Каждый ресурс в Web - документ HTML, изображение, видеоклип, программа и т.д. - имеет адрес, который может быть закодирован с помощью универсального идентификатора ресурсов.В данной курсовой работе была разработана главная страница интернет-магазина. Главными достоинствами данной страницы является его адаптивность к различным мобильным устройствамСПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВАлексеев, А.П. Введение в Web-дизайн. / А.П. Алексеев. – М. : СОЛОН-Пресс, 2019. – 184 с.Дакет, Джон Основы веб-программирования с использованием HTML, XHTML и CSS / Джон Дакет. – Москва: Эксмо, 2019. – 768 с.Киселев, С.В. Веб-дизайн / С.В. Киселев. – М.: Академия, 2019. – 285 с.Макфарланд, Д. Новая большая книга CSS. / Д. Макфарланд. – М. : Питер, 2018. – 720 с. .Минник К. / JavaScript для чайников; Минник Крис-М.: Вильямс, 2018.Рассел Д. / Вёрстка веб-страниц; Рассел Джесси- М.: 2018. - 96 c.Ташков П / Веб-мастеринг HTML, CSS, JavaScript, PHP, CMS, AJAX, раскрутка; Ташков Петр . - М.: Книга по Требованию, 2019. - 512 c.Теоретические аспекты создания Web-сайта средствами языка разметки гипертекста HTML и JavaScript [Электронный ресурс]: информационный ресурс СТУДБУКС.НЕТ. - Режим доступа: https://studbooks.net/2272921/informatika/teoreticheskie aspekty sozdaniya sayta sredstvami yazyka razmetki giperteksta html javascri Время обращения 06.12.2021.Web2.0 теоретические аспекты [Электронный ресурс]: информационный ресурс МУЛЬТИУРОК.РУ. – Режим доступа: https/://multiurok.ru/files/web2-0-teoreticheskie-aspekty.html Время обращения 05.12.2021.