веб сайт интернет программный
Создание сайта организации - это ответственная и непростая задача. Потому необходимо подойти к ее решению серьезно и качественно. Перед выполнением задания нужно изучить сферу деятельности и специфику клиента, подобрать наиболее удачное сочетание цветов и элементов, оговорить архитектуру сайта. Лучше выполнить дизайн с использованием корпоративной символики, что еще больше подчеркнет статус компании.
Разрабатываемый веб-сайт для детского морского центра Меридиан позволит родителям и ученикам получить всю требуемую информацию, в любое время, не выходя из дома. Обширное множество полезных сведений о данном учреждении смогут найти родители, желающие, чтобы их дети смогли стать воспитанниками детского центра, что в значительной степени упрощает работу сотрудников. Кроме всего прочего, данная тема актуальна в связи с выходом Федерального закона "Об образовании в Российской Федерации" от 29.12.2012 N 273-ФЗ, который предписывает всем образовательным учреждениям иметь свой собственный сайт [1].
Целью данной выпускной квалификационной работы является изучение проектирования веб-сайтов при помощи CMS «Joomla», а также модернизация веб-сайта для МОУ ДОД ДМЦ Меридиан г. Вологды [2].
Задание на ВКР предписывает:
- выполнить общий анализ проектирования и создания веб-сайтов;
- создать техническое задание на разработку веб-сайта;
- определить структурную модель веб-сайта;
- разработать сайт на основе CMS «Joomla»;
- наполнить сайт контентом;
- разместить сайт на хостинге.
1. АНАЛИТИЧЕСКИЙ ОБЗОР
1.1 Веб-сайт, общие понятия
Веб-сайт (англ. Website, от web - паутина и site - место) - это совокупность документов, объединенная под одним адресом, доменным именем или IP-адресом, которая принадлежит частному лицу либо организации. Обычно предполагается, что сайт размещается в сети интернет. В целом все веб-сайты интернета представляют всемирную паутину. Для осуществления прямого доступа клиентов к веб-сайтам на серверах был изобретен протокол HTTP. Веб-сайты также именуют интернет представительством человека или организации. Фраза: «своя страничка в интернет» может подразумевать как целый веб-сайт, так и личную страницу в составе чужого сайта. Кроме веб-сайтов, в интернет так же доступны WAP-сайты, которые предназначены для мобильных телефонов.
Первоначально веб-сайты состояли только из объединения статических документов. Сейчас же для подавляющего количества из них характерна интерактивность и динамичность. В этом случае используется термин веб-приложение - готовый программный комплекс для решения задач веб-сайта. Веб-приложение является частью состава веб-сайта и без данных является сайтом только технически.
Веб-серверами называют аппаратные сервера для хранения веб-сайтов, а услугу хранения называют веб-хостингом. Изначально каждый сайт хранился на своем личном сервере, но с развитием интернета и технологическим прогрессом серверов стало возможным размещение множества сайтов на одном компьютере, что получило название «виртуальный хостинг». Сервера для хранения только одного сайта называют выделенными (англ. dedicated) [3].
1.2 Разновидности Веб - сайтов
Коммерческие сайты - к данной разновидности необходимо отнести те сайты, которые главным образом связаны с ведением бизнеса. Это самый распространенный вид интернет-ресурсов, ориентированный на привлечение потенциальных клиентов, партнеров и информирование их о товарах и услугах компании. Среди их многообразия можно выделить: подталкивающие к продажам в оффлайн-бизнесе (то есть в бизнесе, который существует вне зависимости от существования интернета), а так же направленные на онлайн-коммерцию (то есть виды бизнеса, которые без интернета невыполнимы, примером такого может быть интернет-магазин). Реальные и возможные клиенты приходятся главными посетителями коммерческого сайта. По своему объему и типу коммерческий сайт может относиться к следующим типам.
Сайт-визитка - небольшой сайт, состоящий, как правило, из одной или нескольких страниц. В общем случае содержит основную информацию о владельце сайта, такую как деятельность, реквизиты, перечень товаров и услуг, контактные сведения. Это своего рода виртуальная расширенная визитная карточка предпринимателя или организации. Главная цель такого сайта - первичное знакомство потенциальных клиентов с компанией.
Сайт-каталог - ресурс, на котором имеется подробный каталог продаваемой продукции какой-либо компании. Это есть основное отличие от сайта-визитки. Как правило, на таком сайте отсутствует возможность сделать заказ в режиме онлайн, пользователь может лишь только ознакомится с товаром.
Интернет-магазин - сайт, позволяющий пользователям сформировать онлайн заказ на покупку при просмотре каталога продукции, выбрать способ оплаты и доставки заказа, а так же оплатить заказ. На сайте присутствует функция «корзина», с помощью которой можно за один прием заказать несколько понравившихся товаров [4].
Промо-сайт - создается для продвижения какого-либо определенного товара или торговой марки, подталкивающей покупателя к выбору данной фирмы, что является частью маркетинговой программы по его продвижению. Чаще всего создается на время проведения компании и содержит в себе все необходимые сведения об акции: условия, сроки, место проведения и другую информацию.
Бизнес интернет-портал - сложный и многофункциональный ресурс, который предназначен для большого количества пользователей. В основном принадлежат крупным компаниям с обширным диапазоном видов деятельности. Состоит из большого числа страниц, которые охватывают различные темы. Отличительной чертой является предоставление пользователю широкого спектра многообразных сервисов: почта, форум, чат и т. п.
Некоммерческие сайты - в основном создаются, чтобы заявить о себе. Перед ними не ставится задачи по увеличению прибыли компании или организации. Чаще всего, такие веб-проекты предоставляют различную информацию пользователям (информационные сайты) или оказывают какие-либо онлайн услуги (веб-сервисы).
Личные страницы - имеют так же название homepages (домашняя страница). На них люди обычно предоставляют данные о себе, фотографии и еще какие-либо сведения по своему желанию. На сегодняшний день такого рода страницы практически полностью вытеснены социальными сетями и блогами.
Тематические информационные сайты - это веб-ресурс посвященный какой-либо определенной теме. Примерами таких веб-сайтов могут быть различные сайты фанатов музыкальных групп, фильмов, поэтов и другие.
Поисковые системы - это специальные веб-узлы, которые предоставляют ссылки на страницы сайтов, которые отвечают заданному поисковому запросу пользователя. На сегодняшний день значительная часть поисковых систем переросла в полновесные интернет-порталы. Например, Яндекс, Google, Рамблер. Как бы то ни было, примером «чистой» поисковой системы можно назвать Nigma.ru.
Почтовые сервисы - все крупные почтовые сервисы либо стали крупными Интернет - порталами (например, Mail.ru), либо являются частью других порталов (например, Gmail.com как сервис, входящий в Google, или Яндекс.Почта как часть Яндекса).
Почтовые сервисы. В настоящее время, практически все крупные почтовые сервисы либо переросли в большие интернет-порталы (mail.ru), либо приходятся компонентами других порталов. Примерами последнего может быть сервис gmail.com, входит в Google, а Яндекс.Почта является частью Яндекса.
Социальные сети - в настоящее время завоевали невероятную популярность. Такие сайты могут быть как конкретной направленности так, так и без нее. Собственно их функции заключаются дать возможность зарегистрированным пользователям найти в данной сети нужного человека и поддерживать с ним связь, создавать либо вступать в сообщества по интересам, публиковать собственный контент. Основная задача социальных сетей - это помочь пользователю поделиться с друзьями тем, что он опубликовал. На сегодняшний день крупнейшими в мире социальными сетями являются Facebook и Twitter, а в России «ВКонтакте» и «Одноклассники».
Блоговые сервисы - сервис в интернете, который предоставляет любому желающему площадку для ведения собственного блога, но также и позволяет нескольким пользователям вести совместные блоги (сообщества), а также устраивать удобное взаимное чтение. Слово «блог» (blog) является сокращением от web log - интернет-журнал событий, интернет-дневник, онлайн-дневник. Это разновидности ресурсов в интернете, для которых характерны записи личного характера, без использования формальных стилей и официальности. На сегодняшний день блоги имеют достаточно широкий диапазон использования: от простых записей для нескольких друзей до масштабной аудитории в тысячи человек.
Сервисы для хранения фотографий - эти сервисы дают людям как бесплатный, так и платный хостинг для фотографий и изображений, а также есть возможность для их структурирования и классификации. Наиболее популярными фотохостингами являются flickr.com, photobucket.com.
Сервисы для хранения и воспроизведения видео - на такие сайты пользователи загружают свои видеозаписи, которые может просматривать любой желающий. Кроме того, такие сервисы дают право размещать данное видео на любом другом сайте. Крупнейшим видеохостингом является YouTube.com, в России наибольшую признательность получил RuTube.ru.
Доски объявлений - практически аналогичны стандартным доскам объявлений или рекламным газетам. Любой желающий может разместить своё предложение, а все посетители сайта - просмотреть его. Доски объявлений, чаще всего, имеют несколько тематических разделов.
Каталоги сайтов - содержат упорядоченные списки гиперссылок на веб-сайты с небольшим описанием. Масштаб различных каталогов может сильно отличаться: от нескольких сотен ссылок до глобальных всемирных каталогов. В качестве примера можно привести DMOZ и Yahoo!. Русскоязычные варианты - Яндекс.Каталог, каталог mail.ru.
Тематические информационные Интернет - порталы представляют собой развернутую версию тематических сайтов с огромным количеством различных новостей, статей и других материалов. Чаще всего имеют более широкую тематику, чем обычные тематические сайты, и дают посетителям пользоваться различными сервисами и другими возможностями. Примером такого информационного портала может быть sports.ru.
Онлайн энциклопедии - в общем случае базируется на вики-принципе, который основывается на том, что каждый пользователь может самостоятельно создавать новые статьи и вносить правки в уже существующие. Самой известной вики-энциклопедией является Wikipedia [3].
Очевидно, что подавляющая часть вышеперечисленных разновидностей сайтов так или иначе занимаются зарабатыванием денег, используя способы размещения рекламы, или различными дополнительными платными услугами для пользователя. Тем не менее, эти сайты в первую очередь преследуют цель не для получения прибыли, а для удовлетворения потребности пользователя, поэтому подобное разграничение весьма призрачно, следовательно, большинство из них можно также назвать условно некоммерческими.
1.3 Роль сайта в работе образовательного учреждения
Создание веб-сайта - действие, способствующее улучшению имиджа образовательного учреждения. Качественный сайт, сохраняя в себе полезную и актуальную информацию, представляет лучшую визитную карточку, как для коммерческой фирмы, так и для образовательного учреждения, работая на них в любое время суток. Очевидно, это современно и престижно. Это возможность показать всем свои достижения, опубликовать своевременную информацию для заинтересованных лиц как для педагогов, учеников и родителей, так и для коллег из других учебных заведений. Также это отличный способ рассказать о своих успехах и поблагодарить спонсоров [4].
На сайте можно публиковать различные статьи, отчеты о проведенных мероприятиях, не только в форме документа, но и в виде фото или видео, кроме того приглашать к участию в предстоящих событиях новых лиц. Вся информация будет доступна любому посетителю ресурса, если конечно администратор не установит ограничения на просмотр каких-либо материалов только для зарегистрированных пользователей. Систематически проводимые социологические исследования показывают, что первоначальный образ об учебном заведении молодое поколение извлекает с помощью интернет-сайта. На ярмарке, в процессе профориентационной работы, абитуриент составляет общее представление об учебном заведении, а все интересующие его второстепенные сведения смотрит на сайте, так как считает, что именно там находится наиболее полная информация, и также существует возможность задать свои вопросы сотрудникам. Ко всему вышесказанному, сайт образовательного заведения выполняет весомую миссию в организации учебной деятельности, снабжении информационной поддержки учеников и родителей, обмене опытом и построении дружественных связей с учебными заведениями других городов, также методической помощи коллегам родственных учебных заведений.
Для учеников и их родителей интернет-сайт - это, прежде всего информационный ресурс. Просматривая сайты всевозможных образовательных учреждений, у абитуриентов и других заинтересованных лиц есть возможность сравнить организации между собой и сделать выбор в пользу лучшей. К основным характеристикам образовательных сайтов относятся:
·содержание образовательного интернет-сайта - единство всех основных элементов (текстовых и графических) образовательной информации, существующей и выраженной в виде веб-сайтов, а также единство связей этих основных элементов;
·дизайн образовательного интернет-сайта - процесс выбора и организации графических компонентов с целью достижения определенной цели, которая может быть либо эстетической, либо иметь функциональную подоплеку, а зачастую преследовать обе эти цели;
·техническая реализация образовательного интернет-сайта - выбор компонентов, интегрирование технологий, программных продуктов и технических средств, для донесения образовательной информации до пользователя.
1.4 Общие требования к публикуемому веб-сайту в сети Интернет
Деятельность по созданию и применению веб-сайтов дала возможность определить следующую совокупность общих требований:
·простота навигации;
·глубина содержания;
·устойчивость информационных ресурсов;
·оперативность в обновлении данных;
·простота для пользователей;
·однообразие дизайна всех разделов.
Простота навигации зависит от логично построенной схемы веб-сайта, которая чаще всего имеет иерархическую структуру. Необходимо предоставить возможность посетителям без затруднений передвигаться от раздела к разделу, так же легко возвращаться назад или получить справку при необходимости. Большое значение при этом стоит уделить разработке титульной страницы, так как она содержит общий список разделов сервера, так называемый своеобразный «основной ряд» [5].
Глубину содержания можно определить количеством размещенной информации, степенью ее детализации и ценностью. Безусловно, все эти показатели должны стремиться к максимуму. Информативности веб-сайта можно достичь путем публикации материалов, доставляющих набольший интерес для виртуального посетителя, которым, в принципе, может стать любой пользователь интернета.
Устойчивость информационного наполнения определяется в первую очередь постоянством представленных данных. У пользователя должна быть уверенность в том, что он найдет интересующую его информацию, даже если на сайте будет проведена техническая или структурная реорганизация. Например, потерявшие достаточную актуальность материалы, такие, как доклад позапрошлогодней конференции либо материалы после завершившейся выставки, не следует удалять, а лучше переносить в архивную часть сайта.
Оперативность обновления данных подразумевает непрерывное поддержание сайта в актуальном состоянии. Систематическое обновление и дополнение различной информации на веб-сайт хорошо сказывается на сохранении интереса у его постоянных посетителей. Однако необходимо помнить, что устаревшее наполнение сайта может произвести худшее впечатление на посетителя, чем полное отсутствие контента.
Простота для пользователей, или, как ее еще называют, доступность формируется из ряда факторов, доминирующим из которых приходится техническая «устойчивость» веб-сайта, что является заботой штата системных администраторов. Не стоит забывать, что на доступность информации также может повлиять и внешнее оформление страниц. Чрезмерное употребление иллюстративных материалов, аудио- и видеофрагментов, которые занимают достаточно большой объем памяти по сравнению с обычным текстом, может заметно снизить скорость передачи данных, тем самым, в значительной степени затруднит или сделает практически невозможным их использование. Это необходимо помнить, и стоит употреблять графику, а тем более аудио и видео, в разумной мере.
Внешнее оформление веб-страниц не играет решающего значения, естественно, что смотреть на изящный фон и со вкусом сделанную анимацию приятнее, чем на тоскливо серые страницы. Безусловным требованием ко всему веб-сайту является единообразный стиль оформления. При выборе цветовой схемы не стоит рваться за излишней оригинальностью дизайнерского решения, цветовое оформление, в первую очередь, должно быть удобно для восприятия человеком. Также следует постоянно помнить, изысканный внешний вид сайта - не самоцель, и прекрасен только тот дизайн, который работает на содержание. Не стоит забывать, что при создании или обновлении страниц, а так же перед их загрузкой на веб-сайт необходимо выполнить полную проверку текста на наличие орфографических ошибок.
1.5 Методы разработки Интернет - сайтов
По методу разработки сайты можно разделить на «статические» и «динамические».
«Статические» сайты состоят из набора неизменяемых html-страниц, которые размещены на интернет-сервере и внутри себя не содержат исполняемых на стороне сервера программ.
«Динамические» сайты, так же как и статические состоят из совокупности текста и графики, языка разметки. Главное отличие от статических сайтов состоит в том, что они используют различные технологии, исполняемые на стороне интернет-сервера, которые позволяют формировать веб-страницы «на лету».
Статические интернет-сайты представляют собой совокупность размещённых на интернет-сервере файлов (таких, как - «index.html», «robot.txt», «style.css» и тому подобное), не содержащих на стороне сервера исполняемых программ.
Динамические интернет-сайты, в отличие от «статических» сайтов, помимо либо вместо набора размещённых на интернет-сервере файлов (таких, как - «index.html», «robot.txt», «style.css» и тому подобное), не содержащих исполняемых на стороне сервера программ, содержат в себе исполняемые на сервере программы, формирующие в ответ на запрос клиентского браузера страницы сайта, демонстрируемые пользователю [4].
Возникает вопрос: какой метод выбрать лучше?. Обычные сайты на HTML-страницах - сложны в поддержке, архаичны и не подходят для представления сложных структур информационных данных. Динамические сайты выдвигают новые требования к их созданию и сопровождению, они и значительно дороже в разработке, а так же требуется содержание новой штатной единицы - программиста. И вот тут было найдено решение в виде создания качественных сайтов на CMS.
Аббревиатура CMS расшифровывается как Content Management Software (Программное обеспечение для управления содержимым, Программный комплекс управления сайтом). В нашей стране принято последнюю букву «S» расшифровывать как System, по-русски это звучит как Система управления контентом. Иногда употребляется жаргонное выражение - движок сайта.
.5.1 Подробнее о CMS
Система управления сайтом (или как её еще называют движок для сайта) представляет собой специальный веб-интерфейс, с помощью которого можно управлять структурой сайта и его содержимым: добавлять новости, новые страницы, редактировать текущие материалы, добавлять товары в каталог и много другое. Движок для сайта так же важен, как и двигатель для автомобиля.
Системы управления сайтом, впрочем, как и многие программные продукты, могут быть как бесплатные, так и коммерческие. Среди наиболее популярных систем администрирования сайта, бесплатные версии которых распространяются в открытом доступе: Wordpress, Joomla, Drupal.
Wordpress считается типично блоговой системой управления сайтом (CMS), функционал сайта легко расширяется установкой дополнительных модулей в разделе «Плагины». Wordpress в комплекте с плагинами обеспечивает неплохую функциональность ресурса, однако подходит в основном для маленьких и простых сайтов. Создать свой первый сайт с помощью данной CMS несложно, если вы умеете пользоваться сайтами различных почтовых сервисов типа Майл.ру, Яндекс или ВКонтакте.
Еще одна популярная система управления контентом сайта, бесплатно тиражируемая в сети Интернет - Joomla. Удобный, функциональный и, что важно, бесплатный движок для сайта Joomla позволяет создавать практически любые ресурсы, от сайта-визитки до интернет-магазина. В отличие от многих других систем управления Joomla не требовательна к ресурсам сервера - для нее подойдет практически любой хостинг с поддержкой php и mysql. Управлять сайтом на Joomla легко без специальных знаний программирования и html-верстки, присутствует визуальный редактор WYSIWYG.
Среди популярных CMS Drupal больше всего подходит для использования профессионалами. Простым пользователям достаточно сложно сориентироваться в управлении этим движком. Поэтому, несмотря на мощность и гибкость Drupal, эта CMS, бесплатно предоставляемая разработчиками для создания сайта на PHP, рекомендуется лишь для профессионального использования.
Коммерческие CMS стоят от нескольких десятков долларов до десятков тысяч. Многие системы, например, Netcat, UMI и Bitrix существуют в нескольких редакциях, отличающихся по возможностям и стоимости, либо позволяют индивидуально комплектовать систему различными модулями. Среди коммерческих CMS особенно часто рекомендуют на просторах интернет Bitrix. CMS Bitrix позволяет создавать технически совершенные, мощные и безопасные ресурсы, поэтому, по мнению некоторых специалистов именно Bitrix - лучшая система управления сайтом. Среди «молодых» коммерческих CMS UMI отличается большим количеством дополнительных модулей, а NetCat - простым и интуитивно понятным интерфейсом [4].
Joomla - система управления содержимым, которая была создана при помощи языков PHP и JavaScript. Данная CMS представляет собой свободное программное обеспечение.
Структуру Joomla можно назвать простой, изящной, эффективной.
Одним из возможных вариантов ее использования может быть - создание статьи пользователем, которая обычно состоит из заголовка, текста и параметров публикации [6].
.6.1 Статьи
На странице, которая выводится Joomla, может быть как одна статья, так и несколько представленных в виде перечня.
Для статьи предусмотрены различные форматы по ее выводу. Например, если статья слишком длинная, то можно обойтись выводом анонса и ссылки для перехода к полной версии. В этом случае, нажав на ссылку «Подробнее», пользователь окажется на странице с одной единственной статьей.
Пользователи с соответствующими полномочиями могут задать необходимый формат отображения в административном разделе.
Статьи, хранящиеся в базе данных, могут быть доступны или недоступны посетителям, другими словами опубликованы или сняты с публикации, это так же настраивается в административном разделе с помощью соответствующих кнопок «Опубликовать» и «Снять с публикации». Статьи можно размещать на главной странице либо оправлять в архив, по желанию можно удалять и восстанавливать, а также копировать и перемещать [6].
.6.2 Категории
С целью более логичного отображения статей создаются категории, к которым «привязываются» статьи, это своего рода «папки» для группировки «файлов». Одна статья может быть привязана только к одной категории. Ограничений по глубине вложенности категорий нет.
К тому или иному пункту меню могут относиться статьи из одной или нескольких категорий, а так же выводиться в формате, который был выбран администратором. Нажав на ссылку, пользователь получит доступ ко всем статьям, принадлежавшим к выбранному пункту меню при этом относящимся к разным категориям. Такой подход к выводу материалов применяется, например, онлайн-газетами. Пользователь переходит в раздел «Спорт» и там статьи по выбранной теме. Если статей довольно много, то их можно раздробить на подкатегории [6].
.6.3 Пользователи
Для того, чтобы создавать контент, нужны пользователи. На сайте под управлением Joomla есть как минимум один пользователь, который был создан в процессе установки системы. Данный пользователь наделен правами главного администратора, то есть он может вносить правки в конфигурацию системы. Другие же пользователи в соответствии с наделенными правами могут создавать материалы либо на стороне посетителя, либо в административном разделе при помощи положенного интерфейса. Для того, чтобы создать учетную запись пользователя, необходимо придумать логин и пароль, а также указать адрес электронной почты. Каждый пользователь относится к той или иной группе, соответственно имеет тот или иной уровень полномочий, который дает ему возможность ограничивать доступ к публикуемым им материалам по критерию принадлежности к пользовательской группе [6].
.6.4 Навигация
Для перемещения по просторам сайта необходима система навигации, которая представляет собой набор ссылок, ведущих на публикуемые страницы. В Joomla данную функцию выполняют «меню», при этом нет ограничения на их число. Так же можно создать неограниченное количество их сочетаний. На стороне посетителя выбранное меню можно разместить в той или иной части страницы, определяемой шаблоном, с помощью, так называемого модуля [6].
.6.5 Модули
Модуль - это небольшой компонент, который выводится на странице в виде маленького информационного блока сайта, но не контент. Примером модулей является интерфейс входа в систему, регистрация, навигационное меню, календарь, список популярных статей и прочее. Администратор сайта может создавать столько модулей с различными замечательными функциями, сколько ему нужно, а также размещать их в разных областях страницы, определяемых применяемым шаблоном [6].
.6.6 Шаблоны
Шаблон - это фундамент, на котором основывается дальнейший дизайн веб-сайта. Формирование дизайна выполняется главным образом за счет HTML и CSS. Joomla поставляется с несколькими предварительно установленными шаблонами. Любой шаблон можно попытаться настроить под свой сайт, например, изменить логотип или цвет фона. На макете большинства шаблонов имеются так называемые посадочные места для модулей. Модули можно сгруппировать вокруг одной или нескольких статей [6].
.6.7 Плагины
Плагины выполняют практические функции, но обычно не видны посетителям. Они ориентированы на выполнение определенной функции при возникновении в системе определенного события. Визуальный редактор WYSIWYG - это плагин, срабатывающий в системе после наступления события вызова редактора. Плагины - это расширения, которые можно устанавливать неограниченное число раз. В исходную комплектацию Joomla входит множество полезных плагинов [6].
.6.8 Компоненты
Компонент - это одно из основных средств расширения функциональности Joomla, представляющий собой набор скриптов, которые обеспечивают определенный функционал и обладают интерактивным интерфейсом пользователя. Примерами компонентов в Joomla являются форма обратной связи, галерея, системы сбора статистики и так далее. На данный момент существует огромное количество компонентов, которые могут расширить функционал сайта до неузнаваемости [6].
.6.9 Настройки
Кнопки с этой подписью в административном разделе вызывают интерфейсы настройки, которые позволяют изменить параметры системы и ее отдельных элементов, таких как, учетные записи, категории, модули, компоненты [6].
.6.10 Прочие структуры
Кроме этого существует множество других структур, специализированных для интерфейсов пользователя, шаблонов, обеспечивающих техническое взаимодействие [6].
1.7 Архитектура «Joomla»
В общем случае, архитектуру «Joomla» можно сравнить с деревом, где стволом дерева будет служить ядро «Joomla» (фреймворк). Ветками являются API (программный интерфейс). На API размещаются всевозможные компоненты «Joomla», это листья. Все компоненты управляют содержимым сайта, но минимально контактируют друг с другом. Фреймворк CMS «Joomla» [5]. Каркас или фреймворк CMS «Joomla» состоит из трех частей (уровней). Схематичное изображение уровней показано на рисунке 1.1.
<https://joomla-abc.ru/images/Raznoe/CMS-Joomla-framework1.jpg>
Рисунок 1.1 - Архитектура CMS «Joomla»
Базовый каркас, который обеспечивает основную функциональность «Joomla» при помощи фреймворка (ядра), библиотек и плагинов.
Уровень приложения это набор приложений, расширяющие абстрактный класс «JApplication».
Уровень расширений это набор из расширений «Joomla».Перечислим пять основных типов расширений: компоненты, модули, плагины, пакеты языковых локализаций, шаблоны.
Кроме этого, необходимо отметить, что CMS «Joomla» делит сайт на доступную часть для посетителей Frontend (фронтенд) и часть сайта для администрирования Backend (бэкенд). Поэтому войти в сайт «Joomla» можно из двух точек: «домен/index.php» для посетителей (вход в фронтенд) и «домен/administrator/index.php» для входа в административную часть (бэкенд). Практически все компоненты «Joomla» тоже делятся на фронтенд и бэкенд части. Хранятся обе части компонентов в разных папках каталога сайта [5].
В ходе аналитического обзора исследована общая понятийная база и технологии создания веб-сайтов, рассмотрены основные разновидности сайтов, их отличительные черты.
Анализ показывает, как важно иметь сайт для образовательной организации. Во-первых, это повышает имидж образовательного учреждения. Во-вторых, это прекрасная возможность продемонстрировать всем свои достижения, размещая актуальную информацию для заинтересованных лиц. В-третьих, полная информация на сайте может помочь родителям и будущим ученикам определиться с выбором в пользу данного учреждения и активно участвовать в образовательном процессе.
Кроме этого, выявлены общие требования к публикуемому веб-сайту в сети Интернет, такие как, глубина содержания, простота навигации, оперативность обновления информации и некоторые другие.
Рассмотрены методы разработки сайтов, проведён анализ по бесплатным и коммерческим системам управления сайтом. Наиболее подходящей системой для решения задач дипломного проекта является «Joomla», исследованная наиболее подробно. Выбор этой среды разработки и поддержки обусловлен требованиями технологичности и невысокой стоимости сопровождения сайта заказчика.
2. ТЕХНИЧЕСКОЕ ПРЕДЛОЖЕНИЕ
2.1 Состояние сайта МОУ ДОД «ДМЦ Меридиан» на сегодня
Проанализировав существующий сайт МОУ ДОД «ДМЦ Меридиан», я выявила следующие проблемы, которые планируется исправить в ходе выполнения дипломного проекта. Пример главной страницы сайта на момент разработки приведен в приложении 1 [2].
- На сайте содержится неактуальная на сегодняшний день информация.
- Сайт не соответствует приказу Рособрнадзора, где перечислены требования к структуре официального сайта образовательного учреждения.
- Необходимо сделать группировку разделов меню сайта более логичной.
- Загрузка страниц при переходе по страницам сайта происходит очень медленно.
Для решения первых трех из вышеперечисленных задач был проведен анализ на основе приказа Рособрнадзора с требованиями к структуре официального сайта образовательной организации в информационно-телекоммуникационной сети «интернет», который будет рассмотрен ниже.
2.2 Особенности представления информации об образовательной организации
Для сайтов образовательных учреждений существует ряд обязательных требований к структуре сайта, а именно перечень необходимой информации, которую нужно указать на страницах. Эти требования подробно расписаны в приказе Рособрнадзора от 29.05.2014 N 785 (ред. от 02.02.2016) "Об утверждении требований к структуре официального сайта образовательной организации в информационно-телекоммуникационной сети "Интернет" и формату представления на нем информации". Проанализируем данный документ и составим небольшое резюме с перечнем страниц, которые в будущем необходимо включить в наш сайт.
. Согласно приказу на сайте должен быть создан специальный раздел "Сведения об образовательной организации". Информация в специальном разделе должна быть представлена в виде набора страниц и (или) иерархического списка и (или) ссылок на другие разделы сайта.
. Доступ к специальному разделу должен осуществляться с главной (основной) страницы сайта, а также из основного навигационного меню сайта.
. Специальный раздел должен содержать следующие подразделы:
.1. Подраздел "Основные сведения".
.2. Подраздел "Структура и органы управления образовательной организацией".
.3. Подраздел "Документы".
.4. Подраздел "Образование".
.5. Подраздел "Образовательные стандарты".
.6. Подраздел "Руководство. Педагогический (научно-педагогический) состав".
.7. Подраздел "Материально-техническое обеспечение и оснащенность образовательного процесса".
.8. Подраздел "Стипендии и иные виды материальной поддержки".
.9. Подраздел "Платные образовательные услуги".
.10. Подраздел "Финансово-хозяйственная деятельность".
.11. Подраздел "Вакантные места для приема (перевода)"[1].
2.3 Выбор системы управления контентом
В аналитическом обзоре были рассмотрены различные системы управления контентом, такие как Wordpress, Joomla, Drupal, Netcat, UMI и Bitrix. Большая часть отзывов различных разработчиков веб-сайтов сводится к тому, что при реализации проектов малой и средней сложности следует обратить внимание на CMS «Joomla». Применяя CMS «Joomla», можно создать как сайт-визитку, так и отраслевой портал либо интернет-магазин.
На сегодняшний день для «Joomla» разработано большое количество многообразных модулей, компонентов и плагинов, что позволяет назвать данную систему одной из самых функциональных CMS [7].
Рассмотрим преимущества CMS «Joomla», как инструмента для создания и раскрутки Web-сайтов. CMS «Joomla» это не только инструмент для создания проекта, но также ее можно использовать для раскрутки веб-сайта. Обозначим основные преимущества:
) при создании веб-сайтов посредством «Joomla» заказчик не привязывается к определенной студии дизайна. Это значит, что в любой момент он может выбрать для сопровождения проекта другого исполнителя. Кроме этого, обширное распространение «Joomla» хорошо влияет на число опытных специалистов, которые в совершенстве владеют различными секретами данной системы;
) общераспространенность «Joomla» подтолкнула большинство хостинг-провайдеров дать возможность использовать данную систему по умолчанию. Теперь заказчику нет потребности в поиске подходящего релиза CMS «Joomla» и самостоятельной установке на свой сайт, потому что для этого достаточно во время заключения договора о предоставлении хостинг-услуг отметить соответствующий пункт меню;
) «Joomla» имеет достаточно простой и понятный интерфейс, поэтому задачу по наполнению и сопровождению веб-сайта можно поручить далекому от программирования специалисту, к примеру, типичному менеджеру или секретарю;
) также абсолютно бесплатно можно получить различные дополнительные модули;
) раскрутка сайта, разработанного с помощью системы управления контентом «Joomla», не представляет трудности даже новичку, так как данная CMS имеет встроенный функционал, который направлен на быстрое продвижение веб-сайтов. Подключение дополнительных специализированных модулей позволяет за считанные минуты оптимизировать веб-сайт и отслеживать позиции в поисковых системах.
Таким образом, использование CMS «Joomla» более удобно. У этой CMS много плюсов, и не составит большого труда выполнить проект, то есть веб-сайт для Детского морского центра Меридиан.
Для того, чтобы работать над созданием веб-сайта в CMS «Joomla» на своем компьютере, необходима программная оболочка Denwer.
·Инсталлятор (поддерживается также инсталляция на flash-накопитель).
·Apache, SSL, SSI, mod_rewrite, mod_php.
·PHP5 с поддержкой GD, MySQL, sqLite.
·MySQL5 с поддержкой транзакций.
Система управления виртуальными хостами, основанная на шаблонах. Чтобы создать новый хост, вам нужно лишь добавить директорию в каталог /home, править конфигурационные файлы не требуется. По умолчанию уже поддерживаются схемы именования директорий многих популярных хостеров; новые можно без труда добавить [7].
3. РАЗРАБОТКА САЙТА
3.1 Описание установки CMS «Joomla» и программной оболочки Denwer
Первым шагом необходимо установить Denwer. Во время установки программной оболочки, по умолчанию, создается локальный диск Z, но при желании можно выбрать любую другую свободную букву.
Вторым шагом создадим базу данных. Во время запущенного Denwerа необходимо открыть браузер и перейти по адресу «localhost», после чего нажать на ссылку phpMyAdmin - администрирование СУБД MySQL, либо указать путь «localhost/Tools/phpmyadmin/». На открывшейся странице щелкнуть по вкладке «Базы данных». Далее вводим имя базы в поле «Создать базу данных» и нажимаем «Создать». Моя БД будет называться «JDB».
Теперь необходимо скачать «Joomla» с официального сайта и распаковать архив в папку нашего будущего сайта. Устанавливать «Joomla» будем через веб-интерфейс, для этого необходимо в адресной строке браузера указать адрес сайта, после чего откроется мастер установки. Следуя подсказкам мастера, установка не представит особой сложности. На последнем шаге установки необходимо удалить папку «installation» и поменять расширение у файла «htaccess.txt» в «.htaccess».
Перед началом работы с веб-сайтом необходимо запустить Denwer, после чего открыть браузер. В качестве доступа к административной панели управления сайтом «Joomla» применяется адрес, сформированный из адреса веб-сайта, либо полный путь до папки, где установлена «Joomla», с добавлением в конце пути «/administrator». При правильном вводе адреса, пользователь перейдет к странице авторизации, как показано на рисунке 3.1.
Рисунок 3.1 - Страница входа в административную панель
После ввода корректной пары имя пользователя и пароль будет открыта главная страница по администрированию системы, другими словами, будет открыта панель управления (Рисунок 3.2), через которую предоставляется управление всеми возможностями и функциями системы «Joomla» [7].
Рисунок 3.2 - Административная панель «Joomla»
3.2 Разработка структуры базы данных
Как было сказано выше, создание базы данных происходит в процессе установки «Joomla» на Denwer, все дальнейшее добавление необходимых для реализации веб-сайта таблиц делается автоматически. По адресу «localhost/Tools/phpmyadmin/» можно посмотреть все данные по базе данных.
Структура базы данных представлена в приложении 2 [7].
3.3 Разработка структуры сайта
.3.1 Основные пользователи сайта и их интересы
Рассмотрим основных пользователей и их интересы при работе с сайтом. Всю аудиторию посещающих сайт можно условно разделить на: желающие записаться в ДОД, курсанты центра, их родители, выпускники, проверяющие, случайные гости.
Для желающих записаться в детское образовательное учреждение будет интересно посетить страницы, содержащие основную информацию о центре, посмотреть информацию о плавательной практике: условия для зачисления, сроки, а так же фотографии в галерее. Будет полезно почитать отзывы или задать вопрос в разделе «Гостевая книга».
Для курсантов центра наиболее интересны разделы: «Галерея», где для некоторых альбомов будет доступ добавлять фотографии зарегистрированным пользователям, «Куда пойти учиться» и «Интересная информация», «Плавпрактика» помогут сохранить и усилить желание заниматься в центре.
Родителям будет интересно узнать как можно больше сведений по учреждению, в котором занимается их ребенок, поэтому они чаще всего будут посещать разделы «Новости» и «Галерея», чтобы быть в курсе жизни центра. Перед началом летней практики, особенно, если их ребенок занимается первый год, родители смогут найти много полезной информации в разделе «Плавпрактика» и задать все важные вопросы в пункте меню «Гостевая книга».
Выпускники и случайные гости, скорее всего, будут смотреть разделы «Галерея», «Новости», «Гостевая книга».
Для проверяющих создан специальных раздел «Сведения об образовательной организации», здесь содержатся все необходимые для проверки документы согласно приказу с необходимыми требованиями к сайту.
Исходя из вышеперечисленных интересов посетителей сайта, было найдено компромиссное решение: доступ ко всем разделам сделать с главной страницы, но разбить на два меню «Основное» и «Дополнительное». Так как планируется, что основной аудиторией сайта будут желающие записаться в центр, курсанты и их родители, то в «Основное» меню добавим разделы интересные для перечисленных категорий пользователей. Все остальное будет также доступно с главной страницы, но находиться в «Дополнительном» вертикальном меню.
.3.2 Разработка структуры
Структурная схема сайта представлена на рисунке 3.3.
Рисунок 3.3 - Структурная схема сайта
На главной странице сайта отображается опрос для пользователей: «К какой категории посетителей вы относитесь?» и форма авторизации, также создан поиск по сайту. Созданы меню «Основное меню» и «Дополнительное меню».
Основное меню содержит следующие вкладки:
- Главная;
- О центре;
- Плавпрактика;
- Галерея;
- Гостевая книга;
Пункт «Главная» содержит название учреждения, контактную информацию, режим работы центра.
Пункт «О центре» содержит информацию об истории учреждения, традициях, а также гиперссылки на страницы «Наш коллектив», «Успехи и достижения».
Пункт «Плавпрактика» несет информацию о ежегодной практике курсантов, также содержит гиперссылки «Распорядок дня», «Список вещей», «Памятка для родителей».
Пункт «Галерея» содержит фотогалерею, которая дает визуальное представление о детском центре.
Пункт «Гостевая книга» служит для осуществления обратной связи между администратором сайта и другими пользователями.
Внешний вид приведен на рисунке 3.4.
Рисунок 3.4 - Основное горизонтальное меню
Дополнительное меню содержит следующие вкладки:
Новости;
Сведения об образовательной организации
Интересная информация
Пункт «Новости» служит для публикации событий в жизни центра, таких, как участие в соревнованиях, встречи с известными людьми и другие.
Пункт «Сведения об образовательной организации» нужен для заинтересованных в структуре и направлении деятельности организации и для проверяющих. В его подразделах можно найти основные сведения, лицензии, рабочие программы и многое другое.
Пункт «Интересная информация» содержит ссылки на другие сайты по морской тематике.
Внешний вид приведен на рисунке 3.5.
Рисунок 3.5 -Дополнительное вертикальное меню
.4 Разработка дизайна веб-сайта
.4.1 Определение дизайна
При разработке мало создать сайт, важно также обдумать его дизайн. Оформление должно быть максимально привлекательным и функциональным, в противном случае у сайта будет небольшая посещаемость.
Для большего удобства при работе с сайтом необходимо решить, где будут находиться главное меню, пункты и другие материалы, расположенные на сайте.
Рационально расположить главное меню в верхней части сайта, это значительно облегчит поиск и навигацию посетителей по веб-сайту. Пункты главного меню будут находиться в горизонтальном положении для того, чтобы нужная информация о сайте была на виду у пользователей. Так же после перечня пунктов меню располагается поисковая строка по сайту.
В данной дипломной работе будем использовать компоновку блоков на экране, которая представлена на рисунке 3.6
Рисунок 3.6 - Пример компоновки блоков на экране
.4.2 Разработка дизайна
При установке «Joomla» в комплект входит три стандартных шаблона, но так же не представляет трудности разработчику найти в сети интернет среди множества шаблонов подходящий для него вариант [8].
В шаблон входят:
·файл «index.php», который определяет базовую структуру страницы сайта;
·файл CSS-стилей, позволяющий регулировать оформление блоков страницы, таких как цвет, размер шрифта и тому подобное;
·XML-файл, используется для установки шаблона через администра-тивную панель;
·графический файл, применяемый для предпросмотра шаблона.
После того как подходящий шаблон найден, его следует установить. Информация по установке расширений, таких как шаблон, компонент, модуль, плагин, языковые пакеты будет изложена в следующем пункте.
3.5 Установка расширений
В «Joomla 2.5» установка различных компонентов, модулей, плагинов, шаблонов, языковых пакетов происходит при помощи менеджера расширений.
Рисунок 3.7 - Переход к установке расширений
Во время установки доступно 3 способа:
1.Обычная установка происходит через форму с компьютера
2.Установка из директории /tmp
.Установка со стороннего сайта
Обычная установка применяется для установки локально с компьютера. Действия будут следующими: скачать расширение и загрузить его в форму, затем нужно нажать «загрузить и установить». Запустится установка, после чего выведется оповещение о завершении процесса. Такой способ применяется наиболее часто.
Для использования данного метода необходимо в папку «корень_сайта/tmp» скопировать архив с требуемым расширением и прописать путь до него. Другими словами, требуется дописать название архива к выделенному пути до папки «/tmp», который извлекается из файла «configuration.php».
При установке со стороннего сайта или «Установить из URL», загрузка расширения происходит непосредственно с сайта, где располагается необходимое расширение, при условии того, что имеется прямая ссылка на архив расширения.
Если есть необходимость в удалении какого-либо расширения, то нужно перейти к вкладке «Управление», где имеется весь список расширений. Для простоты поиска требуемого расширения имеются фильтры, позволяющие найти «кандидата на удаление». После чего рядом с расширением отмечаем «checkbox» и нажимаем кнопку «Деинсталировать». Таким образом будут удалены все файлы расширения.
Теперь немного подробнее об установке каждого расширения.
Плагины после установки находятся в выключенном состоянии. Для этого их необходимо включить, а также, если нужно, то активировать из предложенных требуемые настройки. Все установленные плагины можно найти, перейдя по вкладкам «Расширения -> Менеджер плагинов».
После установки модули располагаются по адресу «Расширения -> Менеджер модулей». Как и плагины, модуль следует включить и настроить. Следует помнить что, если в менеджере модулей модуль не отобразился, то необходимо создать самостоятельно новый модуль, выбрав его в списке типа модулей. Должен появиться пункт выбора для данного типа модуля.
Чаще всего, компоненты идут комплектом к плагину или модулю. Плагины и модули компонента обычно устанавливаются отдельно, но также встречаются ситуации, когда они уже встроены в компонент и ставятся автоматически. По завершению компонента, мы сразу его может найти в выпадающем списке меню «Компоненты». Важно, не забыть включить модули и плагины, если они были установлены автоматически из комплекта компонента.
Языковые пакеты после установки можно найти, перейдя по вкладкам «Расширения->Менеджер языков».
После установки шаблона, его необходимо применить ко всем страницам, для этого нужно выбрать установить «по умолчанию». Так же возможен вариант привязки шаблона к конкретным страницам. Затем, необходимо посмотреть, каким образом новый шаблон установился на сайт, для этого открываем сайт и обновляем страницу.
Если есть необходимость в проверке позиций в том или ином шаблоне, то нужно набрать в адресной строке браузера «#"justify">3.6 Создание материала
Менеджер материалов дает возможность управлять материалами сайта. Для того, чтобы перейти к данному разделу, необходимо в административном меню в пункте «Материалы» выбрать подпункт «Менеджер материалов». Откроется таблица, где представлены материалы, имеющиеся на сайте, которые можно отсортировать по различным полям, например, по категории, автору, дате и прочие.
Для создания новой стати необходимо нажать кнопку «Создать». Во время создания или редактирования статьи следует заполнить основные поля, такие, как заголовок, алиас, категория, доступ, состояние, избранные. Категорию, к которой будет принадлежать материал, определяем с помощью соответствующего поля. Это важно, чтобы информация на сайте была структурирована. Если же нет необходимости явно классифицировать статью, то указываем в поле «Без категории». Поле «Избранные» отвечает за то, нужно ли отображать материал на главной странице или нет [8].
3.7 Создание меню
Теперь, когда категория или материал созданы, нужно вывести их на сайт, поэтому необходимо создать для них пункт меню. Для этого в меню административного раздела выбираем пункт «Меню» -> подпункт «Главное меню». Далее нажимаем кнопку «Создать». Теперь следует определиться, какую информацию мы будем выводить, например, только избранные материалы, материал или весь список. Для этого в поле «Тип пункта» нажимаем кнопку «Выбрать».
Перечислим наиболее часто используемые типы пунктов меню.
Материал. При использовании этого типа на сайте по щелчку на данный пункт меню будет выведен только один выбранный материал.
Блог категории. В этом случае выводится список материалов выбранной категории в виде блога. В формате «Заголовок + текст».
Список материалов категории. Данный тип, выведет в виде таблицы только заголовки материалов по выбранной категории.
Избранные материалы. На страницу будут выведены только те материалы, которые были отмечены как «Главная страница - Да».
Создать материал. Использование такого пункта будет открывать форму создания новой статьи. Это довольно интересный пункт, так как появляется возможность редактирования контента из пользовательской части.
Контакт. Выведет на страницу один назначенный контакт.
Phoca Gallery - Список категорий. Будут выведены категории фотогалереи в виде папок.
Рисунок 3.8 - Создание меню
Теперь, когда определились с выбором пункта, в нашем случае это «Блог категории», перейдем к последующим полям:
Заголовок меню - Здесь указываем имя пункта меню.
Алиас - псевдоним, это название будет отображено в строке браузера.
Состояние - Выбираем, будет ли отображаться данный пункт меню на сайте.
Доступ - Отмечаем, кто сможет увидеть данный пункт меню.
Меню - Выбираем, к какому меню будет относиться редактируемый пункт, так как на сайте их может быть несколько.
Родительский элемент. Если нужно сделать редактируемый пункт меню вложенным, то назначаем ему «родителя» среди существующих пунктов.
Выбор категории - Здесь указываем, какой категории должны быть выведены материалы. Если был выбран тип пункта меню «Материал», то в параметре необходимо будет указать конкретный материал из списка имеющихся.
После того, как все настройки будут сделаны, необходимо сохранить изменения [6].
3.8 Добавление галереи
Загрузим компонент Phoca Gallery на сайт. Для этого необходимо зайти на панель администратора, нажать на вкладку «Расширения», после чего выбрать пункт «Установка и удаление». Устанавливать будем через форму с компьютера, поэтому в окне «Обзор» нужно выбрать компонент, который мы предварительно загрузили. По завершении успешной установки сможем увидеть сообщение: «Компонент установлен удачно», а также большую панель с логотипом и двумя большими кнопками. На данном экране необходимо нажать кнопку «Install», и спустя какое-то время сможем увидеть новое сообщение «Phoca gallery success fully installed».
Так как публиковать галерею мы хотим в отдельном пункте меню, то при создании нового пункта, укажем в поле тип меню «PhocaGallery».
Перед тем, как загрузить фотографии на сайт, требуется создать категорию. При этом в настройках категории необходимо добавить права для доступа, загрузки и удаления элементов. После того, как категория с нужными настройками создана, можно перейти к загрузке фотографий. PhocaGallery предусматривает функцию как одиночной загрузки, так и добавление нескольких фотографий одновременно. Кроме этого, у любой фотографии можно задать флаг публикации.
3.9 Создание гостевой книги
Для создания гостевой книги «Joomla» существует множество различных дополнений, но в данной работе гостевую книгу создадим, используя компонент «PhocaGuestbook».
Одним из плюсов компонента «PhocaGuestbook» является наличие возможности сортировки сообщений по различным категориям, что позволяет создать несколько гостевых книг на сайте.
Установка компонента происходит так же, как и любого другого расширения, через административную панель. В завершении установки появляется форма, позволяющая настроить гостевую книгу.
Рисунок 3.9 - Настройка гостевой книги
Для продолжения создания гостевой книги с помощью компонента «PhocaGuestbook» создадим гостевую книгу. Для этого перейдем к пункту «Гостевые книги», затем на открывшейся странице нажмем на кнопку «Создать». В результате, увидим окно настроек гостевой книги. На данной форме достаточно ввести название гостевой книги в поле «Заголовок» и выбрать положение «Да» в пункте «Опубликовано», после чего нажать на кнопку «Сохранить». Теперь, когда гостевая книга создана, ее также необходимо вывести на сайт. Выводить книгу будем также в отдельном пункте меню. Для этого переходим по пунктам «Меню» -> «Главное меню», на открывшейся странице нажимаем кнопку «Создать». Затем среди предложенного списка типов выбираем необходимый нам пункт «PhocaGuestbook». Далее появиться панель с настройками пункта меню, где необходимо указать имя пункта меню в поле «Заголовок» и указать ранее созданную книгу в поле «Параметры» -> «Основное» -> «Выбрать гостевую книгу».
.10 Добавление ссылки на группу «ВКонтакте»
Для добавления ссылки на группу «ВКонтакте» был установлен модуль - JL VK Group. После установки модуля необходимо его настроить. Для этого надо указать Заголовок, позицию и ID группы. Получили результат, который приведен на рисунке 3.10.
Рисунок 3.10 - Модуль группа Вконтакте - JL VK Group
3.11 Добавление опроса
Разного рода опросы и голосования являются неотъемлемым атрибутом современных сайтов. Опросы помогают сделать сайт более наполненным и интересным.
Для движка «Joomla» существует большой ряд различных расширений, позволяющих реализовать на сайте опросы и голосования.
После установки расширения на сайт, чтобы попасть в его настройки, нужно в навигации административной панели кликнуть на пункт «Компоненты» и выбрать из списка «Sexy Polling».
Для того, чтобы создать опрос, необходимо выполнить следующий порядок действий:
Создаём категорию. Так как в настройках опроса есть пункт назначения категории, то логичнее начинать с создания категорий. Заходим в «Категории» и нажимаем кнопку «Создать». Вводим название для категории, выбираем состояние «Опубликовано» и сохраняем.
Создать опрос. После того, как категория создана, переходим в пункт «Опросы». Здесь необходимо задать вопрос для опроса.
Создать варианты ответов. Здесь необходимо создать варианты ответов, которые будут составлять опрос.
Разместить опрос на сайте.
Для этого необходимо зайти в «Менеджер модулей» и создать новый модуль. Среди списка типов модулей выбрать «Sexy Polling». Настройки для модуля минимальны. Если требуется, скрываем заголовок модуля, выбираем позицию для отображения и проверяем, чтобы состояние было «Опубликовано», после чего сохраняем.
Полученный результат представлен на рисунке 3.11.
Рисунок 3.11 - Модуль с опросом
Необходимо отметить, что к опросу так же добавлен плагин, который переименовывает название компонента из «Sexy Polling» на «Fancy Polling». Это полезно для учебных заведений и людей, которым не подходит в названии слово Sexy. Если вас не смущает слово Sexy, плагин можно не устанавливать.
4. ЗАЩИТА САЙТА
Владельцу любого ценного ресурса рано или поздно приходится сталкиваться с задачей по обеспечению безопасности и защите сайта. Этот вопрос лучше решить на этапе разработки сайта, но можно и вернуться к нему в случае возникших проблем на этапе функционирования.
Под разработкой защиты сайта подразумевается разработка такого ресурса, который будет удовлетворять всем необходимым требованиям безопасности, устранению потенциально опасных уязвимостей, а так же гарантирует отсутствие их в перспективе. Под безопасностью сайта подразумевается не только безопасность кода и используемого ПО, но и безопасность его администрирования, сохранность паролей, защита от перегрузок, а также решение ряда организационных и технических вопросов с провайдером.
Основными угрозами для сайта, не содержащего конфиденциальной информации, являются вирусные и хакерские атаки с целью сделать сайт недоступным, разрушить или исказить его содержание.
Главная цель хакеров - получить доступ к конфиденциальной информации. Разрабатываемый сайт не подразумевает запрос и хранение этих сведений, поэтому, нам нужно обеспечить целостность и доступность всех других данных сайта. Произвести защиту от взлома административной панели, для того чтобы злоумышленник не смог произвести замену или удаление данных, разместить вирусы или различные скрипты. Также провести ряд мер по защите от вирусов и блокировки сайта.
На форумах в интернете можно найти много полезных советов по защите сайта, написанного с использованием CMS «Joomla». Попробуем перечислить и обобщить основные способы.
Первый шаг мы выполняем неосознанно во время установки системы управления. Данный совет звучит так: «После установки «Joomla» необходимо сразу удалить каталог «Installation». Это требование предъявляет к пользователю сама программа.
Вторым шагом будет замена префикса таблиц у базы данных. Префикс «jos_» является стандартным для таблиц БД в «Joomla». Поэтому большая часть попыток автоматического взлома безопасности основана на том, что таблицы называются «jos_*****». Следовательно, используя свой собственный префикс, можно свести на нет очень большое количество попыток взломов.
В дополнение к защите базы данных советуют не использовать стандартного пользователя «root» в MySQL. Для каждого сайта свой отдельный пользователь.
Следующим шагом рекомендуют довольно очевидное правило безопасности. Это создание сложной пары логина и пароля для суперадминистратора. Для этого рекомендуют использовать нестандартное мышление, либо воспользоваться услугами различных онлайн-сервисов для генерации случайных паролей. Регулярная смена пароля, также способствует защите от несанкционированного входа.
Кроме этого, рекомендуют постоянно обновлять версии ПО «Joomla», а также сканировать сайт на вирусы. В интернете достаточно онлайн-сервисов, которые могут это сделать. Лучше использовать не один, а несколько сервисов для проверок, так как каждый сервис использует свою базу.
Отключение, а лучше сразу удаление неиспользуемых расширений. Для этого следует перейти в «Расширения -> Менеджер расширений», а затем выбрать соответствующий раздел «Удаление» либо «Управление» и выполнить все необходимые действия.
Ко всему выше сказанному, рекомендуется установить плагин «JSecure». Так как обычно, чтобы перейти ко входу в административную панель сайта, необходимо дописать после домена сайта слово «administrator». Зная это, злоумышленник может подобрать пару логин/пароль и войти в панель управления сайтом. Пример ссылки: «#"justify">Поэтому, одним из способов защиты от взлома административной панели будет установка данного полезного плагина.
«JSecure» - устанавливается на сайт точно так же, как любой плагин или шаблон, очень прост в установке и применении.
После установки в админ панель необходимо перейти к разделу «Расширения» и затем выбрать пункт «Плагины». Здесь мы сможем увидеть только что установленный плагин «System - jSecure Authentication», следует выполнить вход в него.
Подробности:
- Название - можно менять для личного удобства.
Включен - включение/отключение плагина защиты.
Файл плагина - по умолчанию "jsecure.php" основной файл выполнения плагина.
Уровень доступа - кто может использовать плагин.
Порядок - расположение в общей таблице плагинов.
Настройки:
- Key - секретное слово для доступа в админ панель сайта, ввести слово и записать его куда-нибудь, чтоб не забыть.
- Redirect Options - Redirect to index page - если кто попытается получить доступ к административной части, то его перенаправит на главную страницу сайта.
Custom Path - перенаправление на страницу с ошибкой 404
Custom Path - путь к станице ошибки, относительно корня сайта по умолчанию это plugins/system/404.html.
После выполнения необходимых настроек проверим работоспособность плагина. Допишем к домену «/administrator» - выходит ошибка. Теперь попробуем дописать к адресу такую надпись «/administrator/Key», где Key - это секретное слово, которое было указано в поле "Key" в настройках плагина защиты сайты от взлома "JSecure", видим что сайт плагин работает корректно.
Таким образом, мы выполнили ряд мер по защите своего сайт от взлома.
5. ТЕСТИРОВАНИЕ
Тестирование в какой-то степени можно назвать завершающим этапом разработки веб-сайта. Однако он также играет важную роль в процессе создания программного продукта. Ведь только после его успешного выполнения можно смело показать готовый проект заказчику, который будет содержать минимальное число некритичных ошибок.
В соответствии с IEEE Std 829-1983 тестирование - это процесс анализа программного обеспечения, направленный на выявление отличий между его реально существующими и требуемыми свойствами (дефект) и на оценку свойств ПО.
Другими словами, тестирование - это процесс поиска ошибок (багов).
По ГОСТ Р ИСО МЭК 12207-2010 в жизненном цикле ПО определены среди других процессы верификации, валидации, квалифицированного тестирования и аудита [9].
Процесс верификации является процессом оценки системы или её компонентов с целью определения удовлетворяют ли результаты текущего этапа разработки условиям, сформированным в начале этого этапа.
Процесс валидация в контексте жизненного цикла представляет собой совокупность действий, гарантирующих и обеспечивающих уверенность в том, что система способна реализовать свое предназначение, текущие и перспективные цели [9].
Процесс квалификационного тестирования, проводится разработчиком и санкционировано приобретающей стороной (при необходимости) с целью демонстрации того, что программный продукт удовлетворяет спецификациям и готов для применения в заданном окружении или интеграции с системой, для которой он предназначен [9].
Процесс аудита является процессом определения соответствия требованиям, планам и условиям договора. В сумме эти процессы и составляют то, что обычно называют тестированием.
При тестировании веб-сайта необходимо выполнить такие шаги, которые смогут показать пользователю, насколько удобен и логичен проект, насколько легко найти интересующую информацию. Необходимо проверить корректность работы всего функционала. Подтвердить, что сайт легко воспринимается для человеческого глаза.
Существует множество различных способов и стратегий, с помощью которых можно провести проверку. При тестировании сайтов применяют следующие виды: функциональное, верстки (интерфейса), юзабилити (удобства использования), нагрузочное (производительность) и безопасности.
Рассмотрим, как проводилось тестирование по каждому виду.
Наиболее продолжительным этапом проверки сайта является функциональное тестирование, суть которого состоит проверить работу всего функционала. Необходимо удостовериться, что работают: все обязательные функции, пользовательские формы (регистрация, добавление комментария), поиск. На сайте нет нерабочих ссылок. Информация на странице находится на нужных страницах.
Приведем несколько тестов, выполненных в процессе функционального тестирования.
Рисунок 5.1 - Авторизация незарегистрированным пользователем
Тест 1. Попробуем авторизоваться на сайте не зарегистрированным пользователем. Введем некорректную пару логин/пароль. В результате получим сообщение об ошибке.
Тест 2. Проверим, как изменится блок «Вход/Регистрация» после аутентификации зарегистрированным пользователем. После успешного входа на сайт отображается картинка и кнопка выпадающего меню. Результаты приведены на рисунке
Рисунок 5.2 - Меню до аутентификации
Рисунок 5.3 - Меню после аутентификации
Рисунок 5.4 - проверка отправки комментария
Тест 3. Попробуем добавить пустой комментарий в разделе гостевая книга. При попытке отправить форму с незаполненными полями появляется уведомление с просьбой заполнить первое по порядку ошибочное поле, так продолжается пока не будут заполнены все обязательные поля.
Тест 4. Отправка комментария с некорректно заполненным кодом подтверждения. В случае ошибочно введенного кода с картинки, выходит соответствующее уведомление, текст комментария не отправляется.
Тест 5. Проверим как работает поиск по сайту. В поле поиска введем фразу: «Список вещей» и нажмем кнопку «Поиск». На странице вывелись результаты соответствующие данному запросу.
Рисунок 5.5 - поиск по сайту
При тестировании была проверена работоспособность всех ссылок, расположенных на страницах сайта. Битых ссылок обнаружено не было.
Следующим этапом проверки сайта будет тестирование верстки. Здесь необходимо проверить, что графические элементы находятся на своих местах, и выполнено все в едином стиле. Необходимо посмотреть, как будет выглядеть проект при различных разрешениях экрана. Кроме того, необходимо проверить кроссбраузерность, то есть совместимость с многообразными интернет браузерами [10].
Так как шаблон адаптивный, то проблем во время изменения разрешения экрана выявлено не было. Так же сайт был проверен на отображение в браузерах Chrome, Mozilla FireFox, Internet Explorer.
Тестирование удобства пользования проводится для оценки удобства и практичности в использовании. Позволяет выяснить, понятен ли сайт посетителю, насколько удобная навигация, а также выяснить что может быть лишним на ресурсе [10].
Сайт имеет довольно простой интерфейс, который не перегружен излишней информацией и изображениями.
Нагрузочное тестирование чаще всего проводится для того, чтобы оценить поведение сайта с определенным количеством одновременно работающих пользователей. Такой вид тестирования можно провести, только после того как проект будет размещен на хостинге.
Тестирование безопасности, включает в себя проверку отсутствия доступа к служебным страницам сайта обычных пользователей. Так же на данном этапе проверяется защита раздела администрирования от стороннего воздействия.
При тестировании системы сбоев и критических ошибок не обнаружено.
По результатам тестирования проект готов к размещению на хостинге и полноценной работе, выполняя все функции.
6. ВНЕДРЕНИЕ САЙТА
Разработанный демонстрационный вариант сайта был представлен заказчику.
Характеристики программно-аппаратной платформы, на которой развёрнут сайт:
Конфигурация персонального компьютера:
Имя ОСМайкрософт Windows 8
Версия 6.2.9200 Сборка 9200
Изготовитель ОСMicrosoft Corporation
Имя системыPK
ИзготовительHewlett-Packard
МодельHP Pavilion g6 Notebook PC
Типx64-based PC
ПроцессорAMD A10-4600M APU with Radeon(tm) HD Graphics, 2300 МГц, ядер: 4, логических процессоров: 4
Версия BIOSInsyde F.26, 21.02.2013
Версия SMBIOS2.7
Версия встроенного контроллера57.53
Режим BIOSUEFI
Изготовитель основной платыHewlett-Packard
Язык системыРоссия
Установленная оперативная память (RAM)8,00 ГБ
Полный объем физической памяти7,47 ГБ
Размер файла подкачки1,81 ГБ
phpMyAdmin версии 3.5.1
Сервер баз данных
Сервер: 127.0.0.1 via TCP/IP
Программа: MySQL
Версия программы: 5.5.25 - MySQL Community Server (GPL)
Версия протокола: 10
Кодировка сервера: UTF-8 Unicode (utf8)
Веб-сервер/2.2.22 (Win32)_ssl/2.2.22/1.0.1c
PHP/5.3.13
На ПК установлены интернет-браузеры:
Google Chrome 58.0.3029.110 (64-bit)Firefox 53.0.3 (32-бит)
Internet Explorer 10.0.9200.16384
Заказчик претензий сайту не имеет. Внедрение новой версии запланировано на четвертый квартал 2017 года. Представлена справка от директора МУ ДО ДМЦ «Меридиан».
ЗАКЛЮЧЕНИЕ
В результате выполнения выпускной квалификационной работы была разработана новая версия веб-сайта для МОУ ДОД «ДМЦ Меридиан» г. Вологды. Данный ресурс позволяет посетителям получить всю требуемую информацию о данном учреждении, также сайт служит визитной карточкой детского центра, привлекая дополнительное внимание целевой аудитории. При разработке руководствовалась приказом Рособрнадзора от 29.05.2014 N 785 (ред. от 02.02.2016) "Об утверждении требований к структуре официального сайта образовательной организации в информационно-телекоммуникационной сети "Интернет" и формату представления на нем информации". Новая версия сайта соответствует всем требованиям приказа.
Кроме того, в ходе проделанной работы были изучены общие понятия и разновидности веб-сайтов. Обозначены роль сайта в работе образовательного учреждения и общие требования к публикуемому интернет-ресурсу. Познакомилась с основными системами управления сайта. Проектирование сайта производилось при помощи CMS «Joomla». Была разработана система навигации и дизайн, после анализа интересов предполагаемых посетителей. Для расширения функционала, возможности создать резервную копию, а ткже усиления защиты административного раздела были установлены соответствующие компоненты. Обозначен и проведен ряд мер по защите сайта от злоумышленника. Проведено тестирование веб-сайта. По завершению тестирования, критичных ошибок не обнаружено.
Сайт был представлен заказчику и получил одобрение на размещение на хостинге взамен старой версии сайта. Внедрение сайта запланировано на 4 квартал 2017 года.
В будущем для развития сайта так же возможна его доработка в соответствии с новыми требованиями заказчика и пожеланиями посетителей.
СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ
1.Об утверждении требований к структуре официального сайта образовательной организации в информационно-телекоммуникационной сети "Интернет" и формату представления на нем информации [Электронный ресурс]: приказ Рособрнадзора от 29.05.2014 N 785 // КонсультантПлюс: справ.-правовая система / Компания «КонсультантПлюс»
.МОУ ДОД «ДМЦ Меридиан», 2010-2016 [Электронный ресурс]: офиц. сайт. - Режим доступа: http://d10326.edu35.ru/
3.Русская сеть. Информационный портал о программировании [Электронный ресурс] - Режим доступа: http://www.ruweb.ru/toclients/functions.shtml.
.Интернет-клиент. [Электронный ресурс] - Режим доступа:
http://internet-client.ru
.CMS Joomla! Изучение и Практика. [Электронный ресурс] - Режим доступа: https://joomla-abc.ru/
6.Крамер, Дж. Joomla!-Как спланировать, создать и поддерживать ваш веб-сайт.-Москва: Рид Групп, 2011.-400с.
7.Joomla, 2006-2017 [Электронный ресурс]: офиц. сайт. - Режим доступа: http://joomla.ru/
.Граф, Х. 10 легких шагов к освоению joomla. (перевод Баскинов, А.), - Электронная версия, 2012. - 111с. Режим доступа:
https://cocoate.com/sites/cocoate.com/files/private/j3ru.pdf
.ГОСТ Р ИСО/МЭК 12207-2010 Информационная технология (ИТ). Системная и программная инженерия. Процессы жизненного цикла программных средств [Электронный ресурс]. - Введ. 01.01.2013 - Режим доступа: http://docs.cntd.ru/document/1200082859
10.Орлов, С. А. Технологии разработки программного обеспечения: учебник / С.А. Орлов, - Санкт-Петербург: Питер, 2003. - 464с.