Преподаватель который помогает студентам и школьникам в учёбе.

Разработка сайта издательского дома «LVA Music»

Содержание:

ВВЕДЕНИЕ

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

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

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

Актуальность выбранной темы заключается в том, что современный веб-сервис являются необходимым элементом деятельности современной коммерческой организации, в том числе и для издательского дома

Объект исследования – издательский дом «LVA Music». Предмет исследования –веб-сайт для издательского дома «LVA Music».

Цель выполнения данной курсовой работы – разработка веб-сайта для издательского дома «LVA Music». Для достижения поставленной цели необходимо решить следующие задачи:

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

Практическим результатом данной работы станет сайт издательского дома. Кроме того, навыки, умения и практические наработки, полученные в результате работы над проектом пригодятся в дальнейшей профессиональной деятельности автора работы.

При выполнении работы была использована современная учебная литература, статьи из журналов в области программирования и веб-разработки, а также информационные и аналитические материалы сети Интернет.

1. ТЕОРЕТИЧЕСКАЯ ЧАСТЬ

1.1. Основные понятия и нормативная база

В российском законодательстве отсутствует четкое определение понятия «Web-сайт». В Федеральном Законе «Об информации, информационных технологиях и о защите информации» [1] приведен термин «информационная система» - «совокупность содержащейся в базах данных информации и обеспечивающих ее обработку информационных технологий и технических средств». Под это понятие попадает и веб-сайт.

Web-сайт (от англ. website: web - «паутина, сеть» и site - «место») – это совокупность логически связанных между собой веб-страниц, а также место расположения контента сервера. Сайт в сети Интернет представляет собой некоторую совокупность данных, которая имеет уникальный адрес и воспринимается пользователем как некое целое. Доступ пользователя к веб-сайтам осуществляется по специальному протоколу HTTP [7].

Web-сайт состоит из связанных между собой Web-страниц. Каждая страница Web-сайта также имеет свой Internet адрес, который состоит из адреса сайта и имени файла, соответствующего данной странице.

Веб-система или система управления веб-содержимым (Web Content Management System или WCMS) - это программный комплекс, предоставляющий функции создания, редактирования, контроля и организации веб-страниц.

Web-сервер - компьютерный сервер в сети Интернет, принимающий HTTP-запросы от клиентов, обычно web-браузеров, и выдающий им HTTP-ответы, как правило, вместе с HTML-страницей, изображением, файлом, медиа-потоком или другими данными.

Браузер, или Web-обозреватель (от англ. web browser) - прикладное программное обеспечение для просмотра web-страниц; содержания web-документов, компьютерных файлов и их каталогов; управления web-приложениями; а также для решения других задач.

HTML (от англ. HyperText Markup Language - «язык гипертекстовой разметки») - стандартизированный язык разметки документов во Всемирной паутине. Как правило, web-страницы содержат описание разметки именно на языке HTML (или его более строгим вариантом XHTML). Язык разметки HTML интерпретируется браузерами, а полученное в результате интерпретации содержимое отображается на экране монитора ПК или мобильного устройства.

Веб-сайт может принадлежать частному лицу или организации и быть доступным в компьютерной сети под общим доменным именем и IP-адресом или локально на одном компьютере. Есть мнение [5], что каждый сайт имеет своё название, которое при этом не следует путать с доменным именем. С точки зрения авторского права сайт является составным произведением, т.о. название сайта подлежит охране наряду с названиями всех прочих произведений.

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

Хостинг (англ. hosting) - услуга по предоставлению ресурсов для размещения информации на сервере, постоянно находящемся в сети (обычно Интернет). Обычно хостинг входит в пакет по обслуживанию сайта и подразумевает как минимум услугу размещения файлов сайта на сервере, на котором запущено ПО, необходимое для обработки запросов к этим файлам (веб-сервер).

В Российской Федерации услуга хостинга, с юридической точки зрения [2], не относится к телематическим услугам связи в силу различия определения телематических услуг связи (предоставление доступа пользовательского оборудования к сети связи оператора) и сути хостинга (предоставление ресурсов оборудования подключенного к сети связи для размещения и функционирования веб-сайта клиента).

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

Веб-дизайнеры разрабатывают макеты шаблонов страниц. Дизайнер определяет, каким образом конечный потребитель будет получать доступ к информации и услугам сайта - то есть, занимается непосредственно разработкой пользовательского интерфейса. Верстальщик получает макеты шаблонов в виде простых изображений (например, в формате JPEG или PNG), либо разбитых по слоям (например, в PSD или AI). К программистам поступают готовые шаблоны страниц и указания дизайнеров по работе и организации элементов сайта. Программист создаёт программную основу сайта, делая её с нуля, используя фреймворк или CMS.

Веб-аналитика – это измерение, сбор, анализ и интерпретация данных с целью лучшего понимания и оптимизации взаимодействия пользователей с веб-сайтами. Веб-аналитика дает возможность оценить эффективность сайта на предмет выполнения поставленных перед ним задач, а также позволяет разработать мероприятия по его улучшению, тем самым увеличив эффективность бизнеса [9, с.46].

Для проведения мероприятий по веб аналитике необходимо в первую очередь собрать данные. Выделяют 2 основных вида инструментов сбора данных:

А) Счетчики (небольшой код на страницах сайта, который загружается браузером). Наиболее популярные решения это OpenStat, GoogleAnalytics, Яндекс.Метрика, LiveInternet и прочие.

Б) Лог-анализаторы (предоставляют возможность собирать статистические данные и составлять свои специальные отчеты путем посредством установки на сервер).

Сбор данных – важнейший этап работы веб-аналитика, поскольку их анализ и является основанием для принятия решений. Необходимо четко определять, какой массив данных подходит в каждом конкретном случае [3] [9, с.47].

1.2. Современные средства разработки

Под веб-сервером понимают как программное обеспечение (ПО), выполняющее функции веб-сервера, так и непосредственно компьютер, на котором это ПО работает. Наиболее популярным веб-сервером на данный момент является Apache.

Apache HTTP-сервер - свободный веб-сервер. Apache является кроссплатформенным ПО, поддерживает операционные системы Linux, BSD, Mac OS, Microsoft Windows, Novell NetWare, BeOS. Основными достоинствами Apache считаются надёжность и гибкость конфигурации. Он позволяет подключать внешние модули для предоставления данных, использовать СУБД для аутентификации пользователей, модифицировать сообщения об ошибках и т. д. Поддерживает IPv6.

MySQL - свободная реляционная система управления базами данных [6, с.16]. Разработку и поддержку MySQL осуществляет корпорация Oracle. Гибкость СУБД MySQL обеспечивается поддержкой большого количества типов таблиц: пользователи могут выбрать как таблицы типа MyISAM, поддерживающие полнотекстовый поиск, так и таблицы InnoDB, поддерживающие транзакции на уровне отдельных записей.

PHP (англ. PHP: Hypertext Preprocessor - «PHP: препроцессор гипертекста»; первоначально Personal Home Page Tools - «Инструменты для создания персональных веб-страниц») - скриптовый язык [18] общего назначения, интенсивно применяемый для разработки веб-приложений. В настоящее время поддерживается подавляющим большинством хостинг-провайдеров и является одним из лидеров среди языков, применяющихся для создания динамических веб-сайтов.

LAMP - акроним, обозначающий набор (комплекс) серверного программного обеспечения, широко используемый в сети Интернет. LAMP назван по первым буквам входящих в его состав компонентов:

Linux - операционная система Linux;
Apache - веб-сервер;
MariaDB / MySQL - СУБД;
PHP - язык программирования, используемый для создания веб-приложений (помимо PHP могут подразумеваться другие языки, такие как Perl и Python).

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

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

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

CSS (англ. Cascading Style Sheets - каскадные таблицы стилей) - формальный язык описания внешнего вида документа, написанного с использованием языка разметки. Преимущественно используется как средство описания, оформления внешнего вида веб-страниц, написанных с помощью языков разметки HTML и XHTML, но может также применяться к любым XML-документам, например, к SVG или XUL.

Основной целью разработки CSS являлось разделение описания логической структуры веб-страницы (которое производится с помощью HTML или других языков разметки) от описания внешнего вида этой веб-страницы (которое теперь производится с помощью формального языка CSS). Такое разделение может увеличить доступность документа, предоставить большую гибкость и возможность управления его представлением, а также уменьшить сложность и повторяемость в структурном содержимом.

JavaScript - прототипно-ориентированный сценарный язык программирования. Является реализацией языка ECMAScript (стандарт ECMA-262). JavaScript обычно используется как встраиваемый язык для программного доступа к объектам приложений. Наиболее широкое применение находит в браузерах как язык сценариев для придания интерактивности веб-страницам [12].

jQuery - библиотека JavaScript, фокусирующаяся на взаимодействии JavaScript и HTML. Библиотека jQuery помогает легко получать доступ к любому элементу DOM, обращаться к атрибутам и содержимому элементов DOM, манипулировать ими [4].

1.3. Основные требования к дизайну современных веб-ресурсов

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

В сфере современной медиапрактики наиболее заметным проявлением функционализма стало формирование такой дисциплины, как «юзабилити» – эмпирически сложившейся системы принципов, регламентирующих применение функционального подхода к дизайну электронного издания [15].

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

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

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

Плоский дизайн – минимализм во всем, когда избавляются от объемов, шумов и так далее, оставляя только плоские цвета и понятные визуальные элементы. В основе дизайна таких сайтов лежит минимализм, который позволяет обращать наше внимание на контент сайта, а не на его обложку. Тем не менее, плоский дизайн делает сайт более чистым.

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

HTML5 - язык для структурирования и представления содержимого всемирной паутины. Это пятая версия HTML. В HTML5 реализовано множество новых синтаксических особенностей.

Например, элементы <video>, <audio> и <canvas>, а также возможность использования SVG и математических формул. Эти новшества разработаны для упрощения создания и управления графическими и мультимедийными объектами в сети без необходимости использования сторонних API и плагинов. Другие новые элементы, такие как <section>, <article>, <header> и <nav>, разработаны для того, чтобы обогащать семантическое содержимое документа (страницы). Новые атрибуты были введены с той же целью, хотя ряд элементов и атрибутов был удалён. Некоторые элементы, например <a>, <menu> и <cite>, были изменены, переопределены или стандартизированы [13].

CSS3 (англ. Cascading Style Sheets 3 - каскадные таблицы стилей третьего поколения) - активно разрабатываемая спецификация CSS. Представляет собой формальный язык, реализованный с помощью языка разметки. Главной особенностью CSS3 является возможность создавать анимированные элементы без использования JS, поддержка линейных и радиальных градиентов, теней, сглаживания и многое другое. Преимущественно используется как средство описания и оформления внешнего вида веб-страниц, написанных с помощью языков разметки HTML и XHTML, но может также применяться к любым XML-документам, например, к SVG или XUL [13].

С утверждением стандартов стилевых таблиц CSS3 и языка разметки HTML5 появилось новое направление – адаптивный дизайн. Такой web-дизайн называется еще называется отзывчивым.

Адаптивный веб-дизайн (англ. Responsive web design) – дизайн веб-страниц, обеспечивающий отличное отображение сайта на различных устройствах, подключённых к интернету. Благодаря адаптивной верстке сайт будет качественно и удобно отображаться на разных устройствах, таких как: персональные компьютеры, ноутбуки, планшеты, смартфоны и других.

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

Основные характеристики отзывчивого дизайна:

1. Шаблон трансформируется под разрешение экрана.

2. Текст на мобильных устройствах легко читается без «zoom in».

3. Нет горизонтальной прокрутки.

«Сердцем» адаптивного веб-дизайна является media query. Media Queries – это то, что позволяет вашим веб-сайтам подключать различные стили CSS, опираясь на текущие значения размеров окна просмотра. Таким образом, можно определять различные стили отображения объектов на экранах разной ширины (смартфонах, планшетах, десктопах). Например, можно указать различную ширину блоков, отступы и так далее. На простоте данного механизма базируется ядро адаптивной верстки.

Одним из инструментов для создания адаптивного дизайна является CSS-фреймворк Twitter Bootstrap. Его можно использовать как при создании сайтов и приложений, так и отдельных форм, таких как форма авторизации или форма обратной связи.

Twitter Bootstrap уже имеет готовые списки стилей CSS, встроенную поддержку JQuery, а также располагает несколькими популярными инструментами JavaScript. В ядро фреймворка Bootstrap версии 3.1 интегрирована поддержка мобильных устройств с шириной окна браузера менее 992 пикселей. Это позволяет шаблону сайта адаптироваться под размер экрана разных устройств, в том числе планшетов компьютеров и мобильных телефонов [16, с.11].

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

1.4. Этапы проектирования и разработки веб-приложения

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

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

Получив представление о предмете исследований, можно переходить непосредственно к составлению конкретных требований, то есть к работе над техническим заданием. Как правило, этапу составления технического задания предшествует проведение обследования предметной области, которое завершается созданием аналитического отчета. Именно аналитический отчет (или аналитическая записка) ложится в основу документа Техническое задание.

Техническое задание (ТЗ) или Задание на проектирование - это исходный документ на проектирование технического объекта или изделия. Техническое задание устанавливает основное назначение разрабатываемого объекта, его технические характеристики, показатели качества и технико-экономические требования, а также специальные требования.

Осознавая важность роли технического задания в создании программного обеспечения, можно выделить его основные пункты, опираясь на ГОСТ 19.201-78 «Техническое задание. Требования к содержанию и оформлению». Данный стандарт устанавливает порядок построения и оформления технического задания на разработку программы или программного изделия для вычислительных машин, комплексов и систем независимо от их назначения и области применения.

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

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

После формирования технического задания происходит проектирование архитектуры проекта. Подбираются программные средства для разработки, формируется архитектура базы данных и т.п.

Далее можно переходить к созданию прототипов и интерфейсов. UI/UX – разработка системы взаимодействия с пользователем. На данном этапе происходит работа по созданию интерфейса с описанием функций, разработка прототипов веб-приложений. Важной подзадачей на данном этапе является создание карты сайта, отражающей взаимосвязи типовых страниц и их наиболее значимые функциональные возможности.

На следующем этапе, как правило, разрабатывается дизайн веб-сервиса. Данный этап включает в себя 2 параллельных направления деятельности (BackEnd и FrontEnd). Вообще, дизайн проекта разрабатывается дизайнерами и утверждается заказчиком. В дизайн входит создание визуальной составляющей всех элементов проекта.

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

Затем переходят в этапу тестирования. Данный этап является одним из наиболее ответственных, так как проект тестируется на все функции, которые в нем предусмотрены с разными условиями. Тестирование проходит в два этапа: Альфа и Бета. На первом этапе создается список всех необходимых доработок, на втором этапе все еще раз проверяется перед запуском проекта.

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

2. ПРАКТИЧЕСКАЯ ЧАСТЬ

2.1. Постановка задачи

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

Выделим основные цели совершенствования существующего сайта:

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

Основные задачи, которые должен выполнять сайт:

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

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

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

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

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

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

2.2. Разработка макета страниц сайта

Макет дизайна сайта будет состоять из элементов, представленных на рисунке 2.1: шапка сайта, вклчающая логотип и основную информацию, навигационное меню, графический блок (для привлечения внимания), текстовое содержимое, дополнительные блоки, яндекс-карта для поиска организации, а также подвал сайта.

Рис. 2.1 – общая структура макета сайта

Изображение шапки и навигационного меню представлено на рис. 2.2.

Рис. 2.2 – Вид верхней части главной страницы

Изображение карты и подвала представлено на рисунке 2.3.

Рис. 2.3 – Вид нижней части главной страницы

2.3. Описание структуры проекта

Данный сайт будет состоять из основных частей:

Статические html-страницы сайта (располагаются в основной директории сайта);
Файлы стилей (директория css/), в том числе bootstrap-стили;
Файлы скриптов (директория js/);
Файлы изображений (директория images/);
Файлы шрифтов (директория fonts/).

Главная страница расположена по адресу <имя сайта/index.html.

2.4. Анализ соответствия проекта требованиям

Данный проект является полноценным современным веб-сайтом для коммерческой организации.

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

В проекте использованы отдельные маркетинговые инструменты и методы, сделан акцент на продукции организации, а также ее контактной информации.

В дальнейшем можно расширить функционал сайта с помощью серверных языков программирования, которые позволяют создавать динамические страницы на сайте, а также панель управления сайта (для администратора). Для этого можно использовать как php-язык или php-фраймворк, так и готовую CMS (например, Drupal, Joomla, Wordpress).

ЗАКЛЮЧЕНИЕ

Итак, Web - это совокупность логически связанных между собой веб-страниц, а также место расположения контента сервера. Сайт в сети Интернет представляет собой некоторую совокупность данных, которая имеет уникальный адрес и воспринимается пользователем как некое целое. Доступ пользователя к веб-сайтам осуществляется по специальному протоколу HTTP.

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

В данной работе мною был использован язык гипертекстовой разметки Web-страниц HTML, каскадные таблицы стилей CSS, Javascript.

Проект вклчает html-страницы, файлы каскадных таблиц стилей, js-скрипты и базовые библиотеки bootstrap. Страницы сайта наполнены осмысленной информацией. Эти условия удовлетворяют требованиям к данной курсовой работе.

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

СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ

1. Федеральный закон от 27.07.2006 N 149-ФЗ (ред. от 19.12.2016) «Об информации, информационных технологиях и о защите информации» (с изм. и доп., вступ. в силу с 01.01.2017) // СПС «Консультант Плюс». Режим доступа: http://www.consultant.ru/document/cons_doc_LAW_61798/

2. Постановление Правительства РФ от 18 февраля 2005 г. № 87 «Об утверждении перечня наименований услуг связи, вносимых в лицензии, и перечней лицензионных условий» а также Руководящий документ отрасли «Телематические службы»

3. Авинаш Кошик Веб-аналитика 2.0 на практике. Тонкости и лучшие методики = Web Analytics 2.0: The Art of Online Accountability and Science of Customer Centricity. - М, 2011. - С. 528

4. Адам Фримен. jQuery для профессионалов = Pro jQuery. - М.: «Вильямс», 2012. - 960 с.

5. Бобкова О., Давыдов С. К вопросу о соотношении понятий «доменное имя» и «название сайта» // Хозяйство и право. - М., 2014, № 6. - С. 102—106.

6. Васвани. MySQL: использование и администрирование = MySQL Database Usage & Administration. - М.: «Питер», 2011. - 368 с.

7. Воройский Ф.C. Информатика. Энциклопедический систематизированный словарь-справочник. - М.: Физматлит, 2006. - С. 432. - 945с.

8. М.А. Курилов, С.В. Терещенко. Классификация систем управления содержимым web-ресурсов и их использование для разработки сайта дистанционного обучения // «Искусственный интеллект» 3’2010.

9. Олевинский Матвей Александрович. Веб-аналитика. Сравнение систем веб-аналитики // Научное периодическое издание «IN SITU, 2015, №4.

10. Чувиков Д.А. Самостоятельная разработка персонального сайта учителем // European student scientific journal. – 2014. – № 1. – С. 16-21.

11. Чувиков Д.А. Разработка персонального сайта учителем школы // Современные наукоемкие технологии. – 2014. – № 5 (1). – С. 222.

12. Флэнаган Д. JavaScript. Карманный справочник. Сделайте веб-страницы интерактивными! / Перевод А.Г. Сысонюк. - Москва.: Издательский дом «Вильямс», 2015. - С. 320.

13. Эд Титтел, Джефф Ноубл. HTML, XHTML и CSS для чайников, 7-е издание = HTML, XHTML & CSS For Dummies, 7th Edition. - М.: «Диалектика», 2011. - 400 с.

14. Экспертные системы : учебное пособие / сост. А. Н. Никулин. – Ульяновск : УлГТУ, 2015. – 78 с.

15. Якунин А.В. Веб-дизайн и оформление электронных СМИ. СПб., 2015. 94 с.

16. Peter Shaw. Twitter Bootstrap 3 Succinctly. - Syncfusion, Inc, 2014. - 110 с.

17. Веб-сайт [Электронный ресурс] // Wikipedia . Режим доступа: https://ru.wikipedia.org/wiki/Сайт (дата обращения 15.04.2018).

18. Preface // PHP.NET [Электронный ресурс]. Режим доступа: http://php.net/manual/en/preface.php

ПРИЛОЖЕНИЯ

Приложение А. Код главной страницы

<!DOCTYPE html>

<head>

</head>

<body>

</div>

<div class="col-lg-3" style="height: 100%; text-align: center; font-style: italic;">Издаем только<br>качественную музыку

</div>

8-800-000-00-00<br>8-800-000-00-01

</div>

</div>

<li class="nav-item"><a href="product.html">Продукция</a></li>

<li class="nav-item"><a href="autors.html">Авторы</a></li>

<li class="nav-item"><a href="partners.html">Партнеры</a></li>

<li class="nav-item"><a href="#yamap">Контакты</a></li>

</ul>

</div>

</nav>

</div>

</header>

</div>

<ul>

<li>

<h2>«LVA Music»</h2>

<p style="text-align: center;">один из крупнейших музыкальных издательских домов в России, брэнд международного уровня.</p>

</div>

</li>

</ul>

</div>

</section>

<ul>

<div class="place">Аудиокнига</div>

</li>

<div class="place">Музыкальный альбом</div>

</li>

<div class="place">Видеоклип</div>

</li>

</ul>

</div>

</section>

<div class="place">Продвижение</div>

<div class="price">Бесценно</div>

</li></ul>

</div>

</section>

</section>

</div>

</div>

</div>

</div>

</section>

</div>

<h2>Полезная информация</h2>

<ul>

<li>Издательский дом</li>

<li>Коммерческое предложение</li>

<li>Словарь терминов</li>

</ul>

</div>

<h2>О компании</h2>

<ul>

<li>Контактная информация</li>

<li>Наши достижения</li>

<li>Новости</li>

<li>Вакансии</li>

</ul>

</div>

<h2>Наши суперзвезды</h2>

<ul>

<li>Рэпэр "Миронофф"</li>

<li>Певица "Няшка"</li>

<li>Группа "Фрукты-Овощи"</li>

<li>Место свободно :)</li>

</ul>

</div>

if (window.ifpluso==undefined) { window.ifpluso = 1; var d = document, s = d.createElement('script'), g = 'getElementsByTagName'; s.type = 'text/javascript'; s.charset='UTF-8'; s.async = true; s.src = ('https:' == window.location.protocol ? 'https' : 'http') + '://share.pluso.ru/pluso-like.js'; var h=d[g]('body')[0]; h.appendChild(s); }})();</script><div class="pluso" data-background="transparent" data-options="medium,square,line,horizontal,nocounter,theme=06" data-services="vkontakte,odnoklassniki,facebook,twitter,google" data-user="599511796"></div>

</div>

</footer>

</body>

</html>

Приложение Б. Содержимое файла стилей

Файл header/css

header.navbar {

width: 100%;

border-radius: 0px;

border: 0px solid transparent;

border-bottom: 0px solid #fff!important;

/* background-color: #F2F2F2; */

background-color:transparent;

margin-bottom: 0px!important;

}

header .header{

height: 50px;

margin: 5px 0px;

}

header .mainmenu .navbar{

background-color: #000;

min-height: 50px;

color: #fff;

border-radius: 0px;

margin-bottom: 0px!important;

border: 0px solid transparent;

}

header .mainmenu .navbar .navbar-nav{

padding: 0px;

}

header .mainmenu .navbar li{

list-style-type: none;

font-family: Helvetica Neue,Helvetica,Arial,sans-serif;

}

header .mainmenu .navbar li a{

display: block;

color: #fff;

font-size: 18px;

height: 50px;

line-height: 50px;

padding: 0px 20px;

text-transform: uppercase;

font-weight: 100;

}

header .mainmenu .navbar li a:hover{

background-color: #f70000;

color: #fff;

transition: 0.1s;

}

Файл footer.css

footer{

min-height: 300px;

background: #3d4047;

color: #fff;

}

footer h2{

font-size: 17px;

color: rgb(255, 255, 255);

text-transform: uppercase;

}

Файл plitka.css

.plitka li{

position: relative;

}

.plitka li img{

width: 100%;

height: auto;

-moz-transition: all 0.5s ease-out;

-o-transition: all 0.5s ease-out;

-webkit-transition: all 1s ease-out;

}

.plitka li img:hover{

-webkit-transform: scale(1.1);

-moz-transform: scale(1.1);

-o-transform: scale(1.1);

}

.plitka li .place{

position: absolute;

color: #fff;

top: 15px;

left: 30px;

font-size: 25px;

}

.plitka li .price{

position: absolute;

color: #fff;

bottom: 15px;

right: 30px;

font-size: 28px;

}