Описание платформы для разработки веб-сайта

Для разработки веб-сайта была выбрана такая платформа как WordPress. Он представляет собой систему управления содержимым сайта с открытым исходным кодом, распространяемая под GNU GPL. Написан на PHP, в качестве сервера базы данных использует MySQL.

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

WordPress — идеальная платформа для публикации, ориентированная на красоту, поддержку стандартов и удобство использования. WordPress бесплатен и свободен к распространению.

Установка WordPress на OpenServer

Чтобы запустить наш движок, нужно создать виртуальный хост. Необходимо создать папку домена в каталоге «domains», по адресу «X:\OpenServer\domains\».

Рисунок 3 – Структура каталога WordPress

Далее заходим на разрабатываемый блог через браузер, мы видим ошибку, WordPress не видит файл конфигурации, его необходимо создать.

Чтобы создать базу данных необходимо зайти в PhpMyAdmin. Для этого заходим в трей и нажимаем «Дополнительно» далее «PhpMyAdmin».

Рисунок 4 – Меню WordPress

После у нас открываются браузер, в поле пользователь вводим «root» и заходим в управление PhpMyAdmin.

Рисунок 5 – Форма авторизации PhpMyAdmin

Здесь нам нужно создать нашу базу данных под WordPress.

Рисунок 6 – База данных сайта

Возвращавшемся обратно на создаваемый сайт, и вводим данные созданной базы данных. После заполнения всех форм нажимаем «Отправить». После загрузки следующей страницы нажимаем «Запустить установку». Далее вводим название своего сайта, логин и пароль от панели администратора и E-mail адрес. Нажимаем войти.

Установка шаблона

После запуска Open Server необходимо открыть проект WordPress. Далее откроется консоль, в которой необходимо выбрать Внешний вид – Темы. Здесь можно выбрать же имеющийся шаблон либо добавить новый.

Рисунок 6 - Выбор шаблона

В окне «Внешний вид» можно изменить выбранный шаблон. Это можно сделать, выбрав пункт меню «Настроить».

Рисунок 7 – Изменение шаблона

В окне настроек можно выбрать:

1) название и описание сайта;

2) цвета;

3) изображение заголовка;

4) навигация;

5) виджеты;

6) статическая главная страница.

После выбора шаблона можно приступить к созданию меню сайта.

Меню – это набор кнопок, которые приведут на конкретные объекты, например, список категорий, материал, компонент и т.д. Кроме того, можно создавать неограниченное количество не только пунктов меню, но и сами меню, например, можно организовать горизонтальное и вертикальное меню.

Были созданы следующие пункты меню.

Рисунок 8 – Созданные пункты меню

Вход и регистрация на сайте – этот форма для ввода логина и пароля пользователя при входе в систему. Также он способен запомнить пользователя и оставаться в сети после закрытия сайта.

Форма аутентификации представлена на рисунке №9.

Рисунок 9 – Форма аутентификации

Для создания логотипа веб-сайта использовался Adobe Photoshop CC 2015.

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

Рассмотрим рабочую область Adobe Photoshop CC 2015.

Рисунок 10 – Создание логотипа в Adobe Photoshop

Создание веб-страниц

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

Рисунок 11 – Панель создания рубрик

Например, запись «Об истории рокабилли» будет отображена на странице «Новости».

Рисунок 12 – Результат опубликования новой записи

В конечном итоге были созданы следующие страницы:

1) Главная (на ней отображаются последние опубликованные записи).

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

3) Исполнители (хранит записи о музыкальных исполнителях).

4) Музыка (предоставляется возможность прослушивания музыки).

5) Новости (на страницы отображаются записи о последних новостях в мире музыки рокабилли).

Созданные страницы можно посмотреть на рисунках 13, 14, 15, 16.

Рисунок 13 – Пример записи на странице Видео

Рисунок 14 – Пример записи на странице Исполнители

Рисунок 15 – Пример записи на странице Музыка

Рисунок 16 – Пример записи на странице Новости

Также при создании страниц использовались такие плагины как:

1) HTML5 jQuery Audio Player.

2) Slider.

3) Social.

4) Video Embedder.

Заключение

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

При разработке web-сайта были проанализированы современные web-технологии, позволяющие создавать интерактивные web-страницы. Наиболее подходящими для выполнения поставленной задачи оказались OpenServer и WordPress.

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

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