ПЗ (1228299), страница 5

Просмтор этого файла доступен только зарегистрированным пользователям. Но у нас супер быстрая регистрация: достаточно только электронной почты!

Текст из файла (страница 5)

Главная страница – лицо web-портала, то, что видит пользователь. Она должна максимально заинтересовать пользователя и привлечь его внимание. На главной странице web-портала бизнес-инкубатора, помимо шапки и подвала, будет отображаться интерактивный слайдер, мгновенно захватывающий внимание пользователя, контент-зона и колонка с последними новостями бизнес-инкубатора, которая содержит самую актуальную информацию о деятельности организации. Шаблон главной страницы сайта представлен на рисунке 2.4.

Рисунок 2.4 – Главная страница web-портала

Страницы «партнеры» и «проекты» в целом имеют одинаковую структуру. Данные страницы содержат зону автоматически собираемого контента. Это значит, что при добавлении нового проекта или партнера в портфолио бизнес-инкубатора в административной панели WordPress, данный проект или партнер будет автоматически добавлен на соответствующую страницу, что избавляет от необходимости каждый раз вручную редактировать страницу. Содержимое страниц будет выводиться колонками по 3 партнера\проекта. Шаблон данных страниц представлен на рисунке 2.5.

Рисунок 2.5 – Шаблон страниц «партнеры» и

«проекты»

Помимо основных страниц, web-портал будет исполнять роль блога, в котором авторы смогут писать свои статьи по тематике организации. В дальнейшем заказчик планирует создать обширную сеть статей, отсортированных по разным рубрикам и с возможностью комментирования. К функционалу данных статей были добавлены такие виджеты, как «Категории», «Облако тэгов», «Недавние записи», «Недавние комментарии», «Календарь». Данные виджеты будут отображаться в сайдбаре, расположенном справа от зоны контента. Область комментариев будет расположена снизу от информативной зоны. Шаблон страницы записи представлен на рисунке 2.6.

Рисунок 2.6 – Шаблон страницы записи

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

1. Дизайн страниц web-портала

Дизайн, как и контент, играет большую роль в любом web-ресурсе. Хороший дизайн помогает увеличить посещаемость сайта и конверсию. Дизайн должен быть приятен на глаз, вызывать у пользователей желание вернуться на сайт еще раз. Но, тем не менее, он не должен отвлекать от самого главного – содержимого web-портала. Нужно в обязательном порядке соблюсти баланс между запоминающимся, эффектным дизайном и дизайном, который не отвлекает пользователя от взаимодействия с web-порталом.

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

Рисунок 2.7 – Палитра цветов, используемая в web-портале

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

Рисунок 2.8 – Логотип web-портала бизнес-инкубатора

Анимационные эффекты в данном web-портале сведены к минимуму. Анимировано только главное меню сайта (при раскрытии пункта меню «О нас»), а также слайдер на главной странице.

Все важные кнопки выделены синим цветом из палитры, который автоматически привлекает внимание на белом фоне. Текст контента выводится черным шрифтом на белом фоне, что ведет к удобочитаемости текста.

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

Рисунок 2.9 – Главная страница web-портала

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

1. РЕАЛИЗАЦИЯ WEB-ПОРТАЛА БИЗНЕС-ИНКУБАТОРА

В данной главе представлен процесс реализации поставленной задачи, в который входит размещение web-портала в сети Интернет, установка и конфигурация CMS WordPress и, собственно, создание web-портала.

1. Размещение web-портала в сети Интернет

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

В качестве бесплатного начального хостинга был выбран Hostinger, располагающийся по адресу www.hostinger.ru. Данный хостинг обладает всеми нужными характеристиками: бесплатностью, поддержкой CMS WordPress, поддержкой всех необходимых технологий, таких как MySQL, PHP и т.д.

Для бизнес-инкубатора «Современные технологии проектирования» был выбран бесплатный домен второго уровня esy.es. Сам web-портал был запущен по адресу dvgups.esy.es. Следует отметить, что данный хостинг – лишь временное пристанище данного web-портала, так как в дальнейшем сайт будет запущен официально на хостинге Дальневосточного Государственного Университета Путей Сообщения. Также в рамках хостинга была создана база данных будущего web-портала. Информация по доступу к базе данных показана на рисунке 3.1.

Рисунок 3.1 – База данных web-портала

Далее, используя FTP-клиент FileZilla, или же пользуясь FTP-клиентом хостинга, необходимо установить CMS WordPress на сервер. Установленная CMS WordPress представлена на рисунке 3.2.

Рисунок 3.2 – Корневой каталог web-портала с установленным WordPress

В результате всех вышеперечисленных действий, на сервера хостинга появляется пустой сайт, управляемый CMS WordPress и имеющий адрес www.dvgups.esy.es.

В процессе разработки web-портала был подписан акт о внедрении web-портала в сети ДВГУПС и развертывание сайта на домене dvgups.ru. В настоящее время web-портал запущен и доступен по адресу http://biz.dvgups.ru.

1. Плагины для создания web-портала с помощью CMS WordPress

Для WordPress написано огромное количество разных плагинов, которые распространяются на бесплатной основе. Данные плагины призваны упростить работу над проектами и\или расширить функционал web-портала. При создании web-портала бизнес-инкубатора «Малое инновационное предприятие» были установлены и использованы следующие плагины:

• Contact Form 7 (для создания формы обратной связи);

• Simple Local Avatars (расширение функционала редактирования профиля участника);

• WP DS Blog Map (создание карты сайта).

Установка всех плагинов производится непосредственно через панель администратора WordPress. Необходимо лишь выбрать нужный плагин, установить и активировать (рисунок 3.3).

Рисунок 3.3 – Установка дополнительных плагинов

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

1. Настройка и особенности работы в CMS WordPress

Как и при работе в любой CMS, создание web-портала в WordPress происходит через административную панель (рисунок 3.4). На данной панели есть все необходимые инструменты для работы.

Рисунок 3.4 – Панель администратора WordPress

WordPress позволяет настраивать систему под определенный проект. Так, можно менять язык сайта, формат отображения даты\времени, формат записей и т.д.

Сайт создается из отдельных страниц. Список созданных страниц представлен на рисунке 3.5.

Рисунок 3.5 – Список страниц web-портала

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

Как писалось в главе 2, в web-портале должно быть реализовано общее портфолио, в котором могут находиться как проекты бизнес-инкубатора, так и партнеры. Выводится, тем не менее, они будут на разных страницах. Для разделения партнеров и клиентов были введены категории – метки, которые относят запись в портфолио к одной из представленных групп. При добавлении в портфолио новой записи, следует выбрать в свойствах нужную категорию – партнеры или клиенты соответственно. Пример добавления записи представлен на рисунке 3.6.

Рисунок 3.6 – Добавление новой записи в портфолио

Но для того, чтобы страница «Проекты» выводила только записи из категории проектов, а «Партнеры» – из категории партнеров, нужно в свойствах данных страниц добавить произвольное поле category-include со значением projects и partners соответственно. Добавление данного произвольного поля представлено на рисунке 3.7.

Рисунок 3.7 – Добавление произвольного поля

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

1. Программная реализация

При реализации данного web-портала по большей части использовано четыре языка программирования: HTML 5, CSS3 и PHP.

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

CSS3 – каскадные таблицы стилей третьего поколения. Формальный язык реализованный с помощью языка разметки. Основное преимущество перед старыми версиями состоит в том, что позволяет создавать некоторую анимацию без использования JavaScript. В данном проекте именно CSS-код отвечает за дизайн сайта. CSS-код вынесен в файл style.css, он представлен в приложении А. HTML и CSS связаны с помощью классов и идентификаторов. В HTML-коде элементы принадлежат определенным классам и идентификаторам, а в СSS-коде задается стиль для данных классов.

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

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

Ниже представлен код шаблона footer.php.

<footer id="footer">

Характеристики

Список файлов ВКР