Разработка сайта компании ГИК



содержание

ВВЕДЕНИЕ

6

1АНАЛИЗ СУЩЕСТВЮЩИХ ПРОГРАММНЫХ РЕШЕНИЙ

8

  1. Написание собственного ядра сайта

8

  1. Использование готовой системы управления сайтом

12

  1. Система управлением контентом Joomla!

16

  1. Система управлением контентом Drupal

20

  1. Система управлением контентом Typo3

23

  1. Система управлением контентом 1С-Битрикс

25

  1. Система управлением контентом MODx

28

  1. РАЗРАБОТКА АРХИТЕКТУРЫ САЙТА

32

  1. Структура главной станицы

35

  1. Структура страницы «Услуги»

40

  1. Структура страницы «Компания»

42

  1. Структура страницы «Портфолио»

44

  1. Структура страницы «События»

45

  1. Структура страницы «Контакты»

46

  1. Адаптивный веб-дизайн

47

  1. РАЗРАБОТКА СТРУКТУР ДАННЫХ

50

  1. Работа с таблицами в CMS MODx

50

  1. Описание основных таблиц

51

  1. Разработка и реализация программных модулей

53

  1. Экспериментальное тестирование и отладка

56

  1. Руководство администратора

59

  1. Основные элементы CMS MODx

59

  1. Создание раздела

61

  1. Создание подраздела

62

  1. Управление фотогалереей

62

  1. Оценка качества продукта

63

  1. Определение состава работ

63

  1. Определение трудоёмкости разработки

63

  1. Оценка качества проекта

65

ЗАКЛЮЧЕНИЕ

71

СПИСОК ИСПОЛЬЗОВАННОЙ ЛИТЕРАТУРЫ

72

Введение

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

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

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

Разработка сайта – это комплекс работ, состоящий из дизайна, оптимизации, программирования, создания контента, наполнения, тестирования, запуска и продвижения.

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

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

Цель дипломной работы – разработка сайта компании «ГИК».

Достижение поставленной цели осуществляется путем решения следующих задач, определивших структуру и содержание работы:

  1. Проанализировать существующие программные решения;
  2. Разработать архитектуру сайта;
  3. Разработать структуру данных и необходимые программные модули;
  4. Провести экспериментальное тестирование и отладку;
  5. Внедрить административное редактирование сайта;
  6. Дать конечную оценку качества продукта

Объект дипломной работы – сайт.

Предмет курсовой работы –разработка сайта для компании «ГИК».

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

Компания «ГИК» взяла на себя миссию – рассказать людям о современных способах ведения бизнеса и с 2011 года успешно ведет работу по ее выполнению. Тогда она представляла собой небольшую веб-студию, которая занималась разработкой сайтов. Со временем увеличилось число клиентов, и расширился спектр предлагаемых услуг. Штаб сотрудников стал больше, изменилась и рабочая площадь. Сегодня «Гик» – это серьезная компания, одна из лидирующих по Вологодской области, партнер крупных интернет-порталов, предоставляющих услуги комплексного интернет-маркетинга.

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

1 анализ существующих программных решений

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

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

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

- Написание собственного ядра сайта

- Использование готовой системы управления сайтом (CMS)

1.1 Написание собственного ядра сайта

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

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

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

Создание собственного ядра сайта включает в себя несколько важных этапов:

  1. Вёрстка основных страниц сайта.

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

  1. Создание всех таблицы для базы данных.

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

  1. Создание необходимого набора классов, каждый из которых отвечаетза определённую часть.

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

  1. Создание шаблонной страницы сайта.

Следует разбить шаблон на составные логические части – подходящая часть готового шаблона (например, форма авторизации, часть, где выводятся статьи, меню, шапка, подвал и другие) вырезается и из этих частей создаются отдельные блоки или шаблоны с соответствующими вырезанными частями. В результате, появится большое количество отдельных блоков шаблонов, которые могут представлять собой отдельные файлы или же записи в базе данных. В этих блоках-шаблонах помечаются места, в которые следует встроить нужное модули или элементы шаблона. Например, там, где должно быть имя пользователя используется {username}. Там, где должен быть заголовок статьи, используется {article_title}. Аналогичным образом помечаются все нужные элементы в получившихся блоках.

  1. Создание класса шаблонизатора.

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

  1. Вывод html кода получившегося на основе получившихся шаблонов.

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

  1. Финальное оформление сайта – создание уникального дизайна.

Требуется исправить получившиеся модули-шаблоны для соответствия требованиям, добавить CSS-файлы и JavaScript. Функциональность сайта, которая была создана на предыдущих шагах, трогать не требуется [1].

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

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

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

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

1.2 Использование готовой системы управления сайтом

Система управления содержимым (контентом) (англ. Content management system, CMS) – информационная система или компьютерная программа, используемая для обеспечения и организации совместного процесса создания, редактирования и управления контентом (то есть содержимым).

Основные функции CMS:

  1. Предоставление инструментов для создания содержимого, организация совместной работы над содержимым.
  2. Управление содержимым: хранение, контроль версий, соблюдение режима доступа, управление потоком документов и т. п.
  3. Публикация содержимого.
  4. Представление информации в виде, удобном для навигации, поиска.

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

В общем случае системы управления содержимым делятся на:

- Систему управления содержимым масштаба предприятия (англ.Enterprise Content Management System).

- Система управления веб-содержимым (англ.Web Content Management System).

В силу того, чтоECMS имеют глубокую внутреннюю классификацию по предметным областям (HRM, DMS, CRM, ERP и т. д.), термин CMS заместил собой WCMS, превратившись в синоним системы управления сайтами. Подобные CMS позволяют управлять текстовым и графическим наполнением вебсайта, предоставляя пользователю интерфейс для работы с содержимым сайта, удобные инструменты хранения и публикации информации, автоматизируя процессы размещения информации в базах данных и её выдачи в HTML.

Существует множество готовых систем управления содержимым сайта, в том числе и бесплатных. Их можно разделить на три типа по способу работы:

  1. Генерация страниц по запросу.

Системы такого типа работают на основе связки «Модуль редактирования → База данных → Модуль представления». Модуль представления генерирует страницу с содержанием при запросе на него, на основе информации из базы данных. Информация в базе данных изменяется с помощью модуля редактирования. Страницы заново создаются сервером при каждом запросе, что в свою очередь создаёт дополнительную нагрузку на системные ресурсы. Нагрузка может быть многократно снижена при использовании средств кэширования, которые имеются в современных веб-серверах.

  1. Генерация страниц при редактировании.

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

  1. Смешанный тип.

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

Система управления — программа, предоставляющая инструменты для добавления, редактирования, удаления информации на сайте.

Большинство современных CMS имеют модульную архитектуру, что позволяет администратору самому выбирать и настраивать те компоненты, которые ему необходимы. Типичные модули: динамическое меню, блог, новости, опросы, поиск по сайту, статистика посещений, гостевая книга и т. д.

Сайты, организованные посредством системы управления контентом, основаны на следующих технологиях: веб-сервер, хранилище данных (зачастую СУБД, например, такие как MySQL или PostgreSQL, однако существуют и noSQL CMS), веб-приложение для обеспечения работы самой системы, визуальный (WYSIWYG) редактор страниц, файловый менеджер с веб-интерфейсом для управления файлами сайта, система управления правами пользователей и редакторов сайта.

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

Наиболее распространены следующие технологические платформы, используемые в качестве основы веб-приложения, реализующего работу CMS: PHP, Perl, .NET.

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

Большая часть современных систем управления содержимым реализуется в виде визуального (WYSIWYG) редактора — программы, которая создаёт HTML-код из специальной упрощённой разметки, позволяющей пользователю проще форматировать текст [1].

Можно выделить несколько преимуществ готовых систем управления контентом:

- в работе используется наиболее эффективный инструмент для решения конкретной задачи (в зависимости от вида сайта и требований к его функционалу подбирают оптимальную CMS);

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

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

- временные затраты на разработку сайта существенно снижаются, так как разработчику не надо фиксировать своё внимание на чисто технических задачах: «как сделать ленту с новостями» или «как научить CMS искать товары в каталоге», а можно сосредоточиться на информационной и визуальной составляющих будущего сайта;

Можно условно разделить CMS по выполняемому функционалу. Некоторые системы ориентированы только на решение конкретных задач (ведение блогов, интернет магазины, форумы), другие являются универсальными и предоставляют разработчиком удобную среду проектирования и программирования для разработки чего угодно. Часть CMS состоять из множества функциональных блоков и модулей, другие монолитны, неделимы, да ещё и зашифрованы. Одни системы поставляются бесплатно и с возможностью внесения своих доработок, а некоторые предоставляются за деньги и не допускают возможность редактирования ядра движка.

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

Joomla! – яркая, современная, постоянно обновляющаяся, достаточно простая в разработке и использовании, предоставляется совершенно бесплатно;

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

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

1C-Битрикс– очень большая по объёму разработка от компании 1С, в которой можно найти различные редакции от простой, до портальной, при этом стоимость её значительно отличается от версии к версии.

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

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

1.3 Система управлением контентом Joomla!

Joomla! (произносится джумла) – система управления содержимым, написанная на языках PHP и JavaScript, использующая в качестве хранилища базы данных СУБД MySQL или другие индустриально-стандартные реляционные СУБД. Является свободным программным обеспечением, распространяемым под лицензией GNU GPL [2].

CMS Joomla! включает в себя минимальный набор инструментов при начальной установке, который дополняется по мере необходимости. Это снижает загромождение административной панели ненужными элементами, а также снижает нагрузку на сервер и экономит место на хостинге.

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

Основные возможности CMS Joomla!:

  1. Функциональность можно увеличивать с помощью дополнительных расширений (компонентов, модулей и плагинов).
  2. Имеется модуль безопасности для многоуровневой аутентификации пользователей и администраторов (используется собственный алгоритм аутентификации и «ведения» сессий).
  3. Система шаблонов позволяет легко изменять внешний вид сайта: расположение модулей, шрифты и другое. Можно предоставить пользователям выбирать одно из нескольких отображений. В сети существует огромный выбор готовых шаблонов, как платных, так и бесплатных. Также существует программное обеспечение для самостоятельного создания оригинальных шаблонов.
  4. Предусмотрены настраиваемые схемы расположения модулей, включая левый, правый, центральный и любое другое произвольное положения блока. При желании содержимое модуля можно включить в содержимое материала. Например, выражение {loadposition mod_fpslideshow}, введенное (вместе с фигурными скобками) в произвольное место в статье, выведет содержимое модуля, которому задана позиция вывода как «mod_fpslideshow».
  5. К преимуществам системы можно отнести то, что все компоненты, модули, плагины и шаблоны можно написать самому, разместить их в структурированном каталоге расширений или отредактировать существующее расширение по своему усмотрению.
  6. Происходит регулярный выход обновлений. Существует публичный «багтрекер» (система отслеживания ошибок). Существуют также трекеры миграции со старых версий Joomla, трекер пожеланий расширения функционала и так далее, где пользователи Joomla могут оставлять замечания по поводу работы CMS, которые впоследствии изучаются её разработчиками, при необходимости включающими в очередное обновление Joomla исправления, решающие те или иные проблемы.
  7. Многоязычность.

Начиная с версии 2.5 расширена поддержка баз данных. Реализована поддержка Microsoft SQL Server, в версии 3.0 — PostgreSQL. В настоящее время действует версия 3.5.

Joomla! имеет простую для понимания панель администрирования, которая включает следующие возможности:

Структурно система представляет из себя ядро, к которому подсоединяются компоненты. Компоненты могут состоять по функциональному назначению из модуля, плагина и (или) шаблона:

В ядро Joomla! входит:

Создание собственного расширения осуществляется посредством написания модуля на языке PHP с использованием для взаимодействия API Joomla [3].

Можно выделитьсильные стороны CMS Joomla!:

Котрицательной стороне относится:

1.4 Система управлением контентом Drupal

Drupal – система управления содержимым, используемая также как каркас для веб-приложений (CMF), написанная на языке PHP и использующая в качестве хранилища данных реляционную базу данных (поддерживаются MySQL, PostgreSQL и другие). Drupal является свободным программным обеспечением, защищённым лицензией GPL, и развивается усилиями энтузиастов со всего мира [4].

Архитектура Drupal позволяет применять его для построения различных типов сайтов – от блогов и новостных сайтов до информационных архивов или социальных сетей. Имеющуюся по умолчанию функциональность можно увеличивать подключением дополнительных расширений – «модулей» в терминологии Drupal.

Наиболее важныефункции, предоставляемые Drupal из поставки по умолчанию:

  1. Единая категоризация всех видов содержимого (таксономия) – от форумных сообщений до блогов и новостных статей;
  2. Широкий набор свойств при построении рубрикаторов: плоские списки, иерархии, иерархии с общими предками, синонимы, родственные категории;
  3. Вложенность категорий любой глубины;
  4. Поиск по содержимому сайта, в том числе поиск по таксономии и пользователям;
  5. Разграничение доступа пользователей к материалам (ролевая модель);
  6. Динамическое построение меню;

Поддержка XML-форматов:

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

Другая парадигма появилась с созданием в Drupal расширения Content Construction Kit (CCK). CCK позволяет дополнять документы новыми полями различных типов — от полей ввода URL и email, до полей хранения и отображения мультимедийных файлов. Также посредством дополнительных модулей к CCK (например, Node reference) можно организовать связи между документами, не используя механизм таксономии.

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

КдостоинствамDrupal можно отнести следующие пункты:

Кнедостаткам относятся:

1.5 Система управлением контентом Typo3

TYPO3 – система управления сайтами (CMS/CMF) с открытым исходным кодом и свободной лицензией. Написана на PHP, для хранения данных использует любую реляционную базу данных, поддерживаемую TYPO3 DBAL, включая MySQL, Oracle Database, PostgreSQL и другие.

Работает на таких серверах, как Apache или IIS, и на большинстве операционных систем, таких как Linux, Microsoft Windows, FreeBSD, Mac OS X и OS/2.

Распространяется бесплатно под лицензией GNU GPL. TYPO3 – гибкая и расширяемая система, с удобным интерфейсом, большим количеством модулей и функций. Она является прямым конкурентом коммерческих систем [5].

TYPO3 имеет два режима работы: frontend и backend. Frontend – это «лицо» сайта, то, каким он виден посетителям. Backend – это интерфейс для администраторов и редакторов сайта. Кроме того, хуи, поддерживается режим frontend-редактирования, позволяющий редакторам вносить правки непосредственно при просмотре «лица» сайта.

Структура сайта в TYPO3 представлена деревом страниц. На каждой странице могут быть размещены элементы содержимого – небольшие блоки информации: текст, текст + изображение, изображение, таблица, чистый html, плагин и др. TYPO3 основана на шаблонах. Существуют готовые шаблоны для TYPO3, однако в основном шаблоны строятся заново на специальном конфигурационном языке TypoScript. Несмотря на использование script в названии, TypoScript не является процедурным языком. Он используется для конфигурирования и отображения сайта. TypoScript является альтернативой другим конфигурационным языкам, таким как ini или conf-файлы, XML или JSON.

Основные возможности системы:

  1. Редактор текста с форматированием (RTE) и проверка орфографии;
  2. Отмена изменений и история изменений;
  3. Предпросмотр перед публикацией;
  4. Буфер обмена;
  5. Редактирование содержимого из frontend и backend;
  6. Внутренние ссылки (возможны ссылки на уровне элементов содержимого);
  7. Внутренний поисковый механизм;
  8. Одна установка системы для многих сайтов (с единым деревом страниц);
  9. Одна установка системы для многих доменов;
  10. Гибкая система разграничения прав для редакторов сайта;
  11. Динамическое построение меню — текстовых и графических;
  12. Возможность авторизации пользователей через LDAP;
  13. Версионирование;
  14. Рабочие области (workspaces);
  15. Поддержка WML, XML, RSS;
  16. Экспорт в PDF;
  17. Экспорт в статический HTML;
  18. Кэширование страниц

Достоинствасистемы:

Минусы системы:

1.6 Система управлением контентом 1С-Битрикс

CMS 1С-Битрикс – это автоматизированная система управления контентом, разработанная компанией 1С-Битрикс. Продукт предназначен для создания и развития корпоративных проектов предприятий и организаций, информационных, новостных и справочных порталов, социальных сетей, интернет-магазинов и других видов сайтов [6].

Система разработана в 2001 году и в настоящее время доступна в 12 различных редакциях. На сегодняшний день на базе платформы от 1С-Битрикс уверенно работает более 50 тысяч проектов. Партнерская сеть российской компании является крупнейшей в мире и включает в состав более 6 тысяч веб-студий. Продукт регулярно совершенствуется, ежегодно производится около 300 обновлений, которые обеспечивают сайту новые полезные функции.

Преимущества системы 1С-Битрикс

Минусы системы 1С-Битрикс:

Особенности CMS 1С-Битрикс:

  1. Многосайтовость

Разработчики CMS 1С-Битрикс считают, что продукт может эффективно решать задачи 95% проектов. Исключение составляют только те сайты, которые имеют очень индивидуальный характер и созданы на основе специфической логики;

  1. Полноценный визуальный редактор

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

  1. Интеграция с программой 1C: Предприятие

CMS 1С-Битрикс – это система, созданная в результате взаимодействия компаний Битрикс и 1С. Поэтому его пользователю обеспечена уверенная интеграция с продуктом 1C: Предприятие, что весьма удобно, допустим для фирм, которые занимаются реализацией различных товаров и услуг в Интернете;

  1. Инструменты для разработки индивидуальных решений

При условии соответствующих знаний платформа Frame Work позволяет внести значительные изменения в оболочке CMS 1С-Битрикс и в результате создать собственную систему управления веб-проектами.

  1. Магазин MarketPlace

На сайте магазина MarketPlace для пользователей 1С-Битрикс: Управление сайтом партнерами фирмы предлагаются всевозможные бесплатные и платные модули, позволяющие существенно расширить функциональность проекта;

  1. Обратная связь от разработчиков.

На сайте компании 1С-Битрикс действует раздел «Идей», где пользователи могут оставить предложения и пожелания по работе CMS, которые учитываются при разработке последующих обновлений продукта.

В настоящее время CMS «1C-Битрикс занимает ведущую строчку в рейтинге платных тиражных систем управления сайтом в России и четвертую позицию в общем рейтинге CMS, разработанным компанией iTrack.

1.7 Система управлением контентом MODx

При выборе системы управления контентом для сайта компании «ГИК», основными критериями является быстродействие, нетребовательность к ресурсам сервера и простота администрирования. Под эти требования полностью подходит MODx и в дальнейшем эта CMS будет использована для создания сайта.

MODx — система управления содержимым с открытым исходным кодом и открытой лицензией [7]. Написана на языке программирования PHP, использует для хранения данных СУБД MySQL или MS SQL. Интерфейс системыMODx представлен на рисунке 1.1.

Рисунок 1.1 – ИнтерфейсMODx

Возможности MODx:

В настоящее время существует две редакции MODx. MODx Evolution — поддерживается сообществом, а не разработчиком. MODx Revolution — поддерживается и разрабатывается разработчиком. Все новые и основные дополнения разрабатываются и поддерживают в основном только Revolution. Таким образом. актуальной на данный момент является редакция MODx Revolution [8].

Основные преимущества:

  1. Универсальность

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

  1. Производительность

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

  1. Безопасность

Используется легковесная ORM xPDO, которая реализует очень простой, но эффективный паттерн Active Record, где все манипуляции с данными выполняются с помощью специализированных методов для доступа к данным благодаря чему практически исключаются SQL-инъекции.

  1. SEO ориентированность

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

  1. Гибкость

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

  1. Юзабилити

Использование javascript-фреймворка Ext JS для реализации панели администратора позволяет сделать доступ к любому разделу в два клика, создаёт древовидную структуру документов с неограниченным уровнем вложенности, позволяет работать с документами на сервере – что в итоге позволяет экономить время как во время реализации проекта для разработчика, так и при дальнейшей эксплуатации администратором.

  1. Масштабируемость

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

  1. Доступность

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

  1. Популярность

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

  1. Актуальность

Система написана в духе WEB 2.0 – объектно-ориентированный паттерн программирования, в полной мере используется AJAX.

2 Разработка архитектуры сайта

Разработка архитектуры сайта – важный этап в процессе создания сайта, он продумывается еще на этапе проектирования будущего ресурса.

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

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

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

В процессе разработки архитектуры сайта компании «ГИК» учитывалась следующие моменты:

- контекст сайта

- целевая аудитория

- контент

Контекст сайта определяется направлением деятельности заказчика, его особенностями и какие задачи он собирается решить с помощью разрабатываемого сайта. Компания «ГИК» занимается web-разработками и рассказывает людям о современных способах ведения бизнеса с помощью сайтов и их продвижения. Сайт направлен на привлечение большего числа клиентов и получение дополнительной прибыли.

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

Потенциальные пользователи сайта компании «ГИК» — это бизнесмены, предприниматели, люди, которые хотят развить свой бизнес, привлечь больше клиентов, повысить доходы от своего дела, люди, которые хотят заявить о себе и о своем деле.

Контент на сайте должен быть интересен и полезен его целевой аудитории.

Источник контента должен быть уникальным (тексты, фото, видео и т.д.).

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

Сайт компании «ГИК» состоит из 6 основных страниц [9]:

- главная страница

- услуги

- компания

- портфолио

- события

- контакты

Логическая структура сайта представлена на рисунке 2.1

Рисунок 2.1 – логическая структура сайта

2.1 Структура главной станицы

Главная страница является первой, которую пользователь увидит, заходя на сайт. На ней расположена самая главная и наглядная информация о деятельности компании «ГИК».

  1. Шапка сайта

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

В правом углу находится номер, по которому можно связаться с компанией, и кнопка «Заказать звонок», при нажатии на которую выводится форма обратной связи. Форма обратной связи состоит из полей, необходимых для заполнения: имя, телефон, электронная почта, «Я не робот». Вид шапки сайта представлен на рисунке 2.2.

Рисунок 2.2 – шапка сайта

  1. Главная форма

Ниже расположена главная форма, которая призывает пользователя к действию. Например, кнопка «Подробнее» направляет заинтересовавшегося человека сразу на страницу с услугами, а кнопка «Портфолио» на страницу с последними работами, чтобы пользователь ознакомился, что умеет и предлагает компания. Форма обратной связи предлагает пользователю сразу заполнить необходимые поля (имя, электронная почта, телефон, бюджет) чтобы специалист компании связался с ним и проконсультировал по необходимым вопросам. Вид главной формы представлен на рисунке 2.3.

Рисунок 2.3 – главная форма

  1. Преимущества

Блок преимущества объясняет главные достоинства компании и почему пользователь, который зашел на сайт, должен выбрать именно компанию «ГИК». Блок преимущества представлен на рисунке 2.4.

Рисунок 2.4 – блок преимущества

  1. Последняя работа

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

Рисунок 2.5 – блок с последней работой

  1. Как организована работа

Блок «Как организована работа» показывает в виде схемы все этапы разработки сайта и предлагает сразу заказать работу. Блок представлен на рисунке 2.6.

Рисунок 2.6 – блок «Как организована работа»

  1. Примеры работ

Блок «Примеры работ» показывает последние работы, при нажатии на которые происходит переход на страницу с подробным описанием этих работ. Кнопка «Все работы» осуществляет переход на страницу «Портфолио». Блок «Примеры работ» представлен на рисунке 2.7.

Рисунок 2.7 – блок «Примеры работ»

  1. Внедрение amoCRM

Блок «Внедрение amoCRM» рассказывает о программе, которая ведет учет сделок и работы сотрудников в режиме онлайн. Блок представлен на рисунке 2.8.

Рисунок 2.8 – Блок «Внедрение amoCRM»

  1. Отзывы

Блок «Отзывы» показывает последние комментарии и рекомендации клиентов, которые сотрудничали с компанией «ГИК». Блок представлен на рисунке 2.9.

Рисунок 2.9 – блок с отзывами

  1. Форма обратной связи

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

Рисунок 2.10 – форма обратной связи

  1. Подвал

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

Рисунок 2.11 – подвал сайта

2.2 Структура страницы «Услуги»

Страница «Услуги» состоит из 4 блоков, каждый блок – это название услуги: разработка сайта, поддержка, продвижение сайта и дизайн.

Блоки интерактивные, при наведении на них происходит анимация, и блок меняет вид, картинка становиться меньше, происходит затемнение и появляется кнопка «Подробнее». При нажатии происходит переход на внутреннюю страницу услуги.

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

Рисунок 2.12 – страница «Услуги»

Структура внутренних страниц «Услуги»:

  1. Разработка сайта

- базовые вопросы

- срок разработки

- этапы создания сайта

- форма заказа разработки сайта

- блок другие услуги

  1. Поддержка

- тарифы технической поддержки

- форма заказа технической поддержки

- блок другие услуги

  1. Продвижение сайта

- CEO оптимизация

- способы продвижения сайта

- форма заказа продвижения сайта

- блок другие услуги

  1. Дизайн

- создание дизайна сайта

- фирменный стиль

- современный дизайн сайта – этапы

- форма заказа дизайна сайта

- блок другие услуги

2.3 Структура страницы «Компания»

На странице «Компания» расположена информация о компании «ГИК», чем он занимается, ее история, какие цели она преследует, о команде, которая в ней работает. Так же представлено обращение директора компании к потенциальным клиентам и благодарность партерам.

Вверху страницы расположен заголовок страницы и «хлебные крошки», так называемые ссылки на предыдущие страницы на которых был пользователь до посещения этой страницы для быстрого перехода. Так же рядом с заголовком расположены ссылки на внутренние страницы: о компании, вакансии, партнеры и отзывы. Страница «Компания» изображена на рисунке 2.13.

Рисунок 2.13 – страница «Компания»

Структура внутренних страниц «Компания»:

  1. О компании

- Информация о компании

- Наша команда

- Обращение директора

  1. Вакансии

- Менеджер по продажам

- Web-дизайнер

- Web-программист

- SEO-специалист

  1. Партнеры

- Список партнеров и ссылки на них.

  1. Отзывы

- Отзывы клиентов компании «ГИК» и их рекомендации.

2.4 Структура страницы «Портфолио»

Страница «Портфолио» содержит в себе список всех работ, которые сделала компания «ГИК». Работы представлены в виде блоков с картинкой при наведении, на которые видно краткое описание, а при нажатии осуществляется переход на внутреннюю страницу с работой.

Вверху страницы расположен заголовок страницы и «хлебные крошки», так называемые ссылки на предыдущие страницы на которых был пользователь до посещения этой страницы для быстрого перехода. Так же рядом с заголовком расположены ссылки на внутренние страницы: сайт компании, интернет каталог, лендинг, сложные проекты, мобильные (адаптивные) сайты и лого. Страница «Портфолио» изображена на рисунке 2.14.

Рисунок 2.14 – страница «Портфолио»

Структура внутренних страниц «Портфолио»:

  1. Сайт компании

Большие и объемные сайты для компаний.

  1. Интернет каталог

Сайты, содержащие продукцию, позволяющие просматривать товар и заказывать его.

  1. Лендинг

Одностраничные сайты, промо-сайты, которые настраивают посетителя на совершение определенного действия.

  1. Сложные проекты

Сложные сервисы, направленные на достижение и облегчение разных сторон бизнеса.

  1. Мобильные (адаптивные) сайты

Сайты, разработанные не только под компьютер, но и под мобильные устройства (Iphone, Android и т.д.).

  1. Лого

Логотипы и фирменный стиль проектов.

2.5 Структура страницы «События»

Страница «События» содержит информацию о последних акциях, новостях, затрагивающих web-разработку и бизнес.

Вверху страницы расположен заголовок страницы и «хлебные крошки», так называемые ссылки на предыдущие страницы на которых был пользователь до посещения этой страницы для быстрого перехода. Так же рядом с заголовком расположены ссылки на внутренние страницы: все, акции, новости и блог. Страница «События» изображена на рисунке 2.15.

Рисунок 2.15 – страница «События»

Структура внутренних страниц «События»:

  1. Все

Все новости и акции.

  1. Акции

Скидки, специальные предложения.

  1. Новости

Новости, связанные с web-приложениями, разработкой и IT-сферой.

  1. Блог

Публикации компании «ГИК», советы и ответы на вопросы.

2.6 Структура страницы «Контакты»

Страница «Контакты» содержит контактные данные компании «ГИК»: телефоны, электронную почту, режим работы и местоположение офиса.

Контактные данные представлены для двух городов: Вологды и Череповца.

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

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

Рисунок 2.16 – страница «Контакты»

2.7 Адаптивный веб-дизайн

Адаптивный веб-дизайн — дизайн веб-страниц, обеспечивающий корректное отображение сайта на различных устройствах, подключённых к интернету и динамически подстраивающийся под заданные размеры окна браузера.

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

В оформлении сайта компании «ГИК» используется фреймворк Twitter Bootstrap. Twitter Bootstrap — свободный набор инструментов для создания сайтов и веб-приложений. Включает в себя HTML и CSS шаблоны оформления для типографики, вебформ, кнопок, меток, блоков навигации и прочих компонентов веб-интерфейсов, включая JavaScript расширения. Bootstrap использует самые современные наработки в области CSS и HTML.

Основные преимущества Twitter Bootstrap:

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

- высокая скорость — динамичные макеты Bootstrap масштабируются на разные устройства и разрешения экрана без каких-либо изменений в разметке;

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

- простота в использовании — платформа проста в использовании, пользователь с базовыми знаниями HTML и CSS может начать разработку с Twitter Bootstrap;

- совместимость с браузерами — Twitter Bootstrap совместим с Mozilla Firefox, Google Chrome, Safari, Internet Explorer и Opera;

- открытое программное обеспечение — особенность Twitter Bootstrap, которая предполагает удобство использования, посредством открытости исходных кодов и бесплатной загрузки [10].

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

Вид сайта на экране монитора изображен на рисунке 2.17.

Рисунок 2.17 – вид сайта на экране монитора

Вид сайта на мобильном устройстве изображен на рисунке 2.18.

Рисунок 2.18 – вид сайта на мобильном устройстве

3 Разработка структур данных

Так как сайт создан при помощи системы управления контентом MODx, база данных которой представлена в виде MySQL, база данных сайта будет поддерживать ту же структуру, внося в неё свои изменения.

MODx без установленных дополнительных модулей содержит 63 таблицы. Многие из таблиц содержат вспомогательную информацию и нет смысла описывать каждую из них.

3.1 Работа с таблицами в CMS MODx

Работа с базой данных в MODx построена поверх библиотеки xPDO.

xPDO (open eXtensions to PDO) – это легковесная ORB (object-relational bridge, объектно-реляционный мост) библиотека, работающая на PHP 5, которая помогает пользоваться преимуществами последних стандартов работы с базами данных в PHP, расширением PDO (PHP Data Objects). xPDO реализует очень простой, но эффективный паттерн для доступа к данным Active Record, а также гибкую модель предметной области, позволяющую отделить логику области от логики, специфичной для той или иной базы данных.

Но xPDO — это немного больше, чем простая реализация паттерна. Это еще и способ абстрагирования бизнес-логики приложения от фактически используемых для доступа к данным в БД SQL-запросов и связанных переменных (prepared statements), а также легко описать и обеспечить реализации объектной модели для нескольких целевых платформ баз данных.

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

3.2 Описание основных таблиц

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

Основные таблицы CMS MODx:

- site_htmlsnippets — содержит информацию о чанках пользователя;

- site_snippets — содержит информацию о снипетах пользователя;

- site_content — содержит информацию о ресурсах, добавленную пользователем;

- users — список пользователей;

- user_attributes — профили пользователей.

Таблица описывает представление чанка в базе данных. Чанки содержат в себе статический HTML код.

Таблица 1 – структура таблицы site_htmlsnippets

Поле

Тип

Комментарий

Id

int(10)

Первичный ключ

source

int(10)

Источник

property_preprocess

tinyint(1)

Обработка свойств

name

varchar(50)

Название чанка

description

varchar(255)

Описание чанка

editor_type

int(11)

Внутренний текстовый редактор

category

int(11)

Категория

cache_type

tinyint(1)

Вид кэширования

snippet

mediumtext

Содержание

locked

tinyint(1)

Блокировка

properties

text

Свойства

static

tinyint(1)

Является ли статичным файлом

static_file

varchar(255)

Путь к статичному файлу

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

Таблица 2 – структура таблицы users

Поле

Тип

Комментарий

id

int(10)

Первичный ключ

username

varchar(100)

Имя пользователя

password

varchar(100)

Хэш пароля

cachepwd

varchar(100)

Кэшированный пароль

class_key

varchar(100)

Тип пользователя

active

tinyint(1)

Активен ли пользователь

remote_key

varchar(255)

Внешний ключ

remote_data

text

Внешние данные

hash_class

varchar(100)

Тип хэширования пароля

salt

varchar(100)

Символы, добавляемые к паролю

primary_group

int(10)

Главная группа

session_stale

text

Статус сесии

sudo

tinyint(1)

Является ли суперпользователем

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

Таблица user_attributes содержит такую информацию как полное имя пользователя, email, телефон и служебную информацию такую как время последнего входа, общее число входов, страну. В общей сложности таблица содержит 26 полей.

В таблице site_content содержится информация о всех ресурсах сайта, а также служебная информация с этим связанная. Данная таблица в общей сложности содержит 43 поля.

4 Разработка и реализация программных модулей

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

Быструю загрузку страниц обеспечивает технологияAJAX.

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

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

При использовании AJAX:

  1. Пользователь заходит на веб-страницу и нажимает на какой-нибудь её элемент;
  2. Скрипт определяет, какая информация необходима для обновления страницы;
  3. Браузер отправляет соответствующий запрос на сервер;
  4. Сервер возвращает только ту часть документа, на которую пришёл запрос;
  5. Скрипт вносит изменения с учётом полученной информации (без полной перезагрузки страницы).

Преимущества AJAX:

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

При правильной реализации AJAX позволяет снизить нагрузку на сервер в несколько раз.

В частности, все страницы сайта чаще всего генерируются по одному шаблону, включая неизменные элементы («шапка», «навигационная панель», «подвал» и т.д.), для генерации которых требуются обращения к разным файлам, время на обработку скриптов (а иногда и запросы к БД) — всё это можно опустить, если заменить полную загрузку страницы генерацией и передачей лишь содержательной части. Дизайн страницы также обычно содержит множество файлов, связанных с оформлением (картинки, стили), на повторную обработку которых не надо тратить время, используя AJAX (экономия на количестве HTTP-соединений значительно выгоднее, чем на сокращении трафика каждого из них).

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

Например, при вводе поискового запроса в Google выводится подсказка с возможными вариантами запроса. На многих сайтах при регистрации пользователь вводит имя, и сразу же видит, доступно это имя или нет. AJAX удобен для программирования чатов, административных панелей и других инструментов, которые выводят меняющиеся со временем данные [11].

Все сайты находятся в одном месте, в определенной категории.

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

Имеется шаблон, в нем запускаетсяsnippet, в который передается список сайтов, относящихся к данной категории с параметрами вывода сайтов в категории. Пример сайта в портфолио представлен на рисунке 4.1.

Рисунок 4.1 – сайт в портфолио:

1 – название сайта; 2 – ссылка на сайт; 3 – изображение сайта; 4 – категории сайта

Для вывода всех категорий сайта, к которым данный сайт в портфолио относиться, используется ApiModex. Вначале определяется пятьTV-параметров, каждый из которых соответствует категории в портфолио. Далее мы получаем списокid-ресурсов каждой категории портфолио (массив).Id-страницы ищутся в каждом из пяти массивов и если в каком-то из массивов этотid находиться, выводится ссылка на портфолио, которая соответствует этому массиву.

Переход между проектами осуществляется при создании переменной, которая заполняетsnippet, который генерируетid-ресурсы. Беретсяid текущего ресурса, на котором мы находимся и поэтомуid находиться индекс этого элемента в массиве со всеми сайтами. Дальше берется следующий индекс массива и предыдущий. У этих индексов берется значение, которое соответсвуетid-ресурсам. СредствамиModex изid-ресурса генерируется ссылка на следующий и предыдущий ресурс.

5 Экспериментальное тестирование и отладка

В ходе тестирования был использован очень полезный инструмент для разработчиков сайтов на MODX -DebugParser от Василия Наумкина. Он сильно выручает на стадии окончания разработки сайта и может пригодится не только начинающим, но и уже вполне состоявшимся разработчикам. DebugParser позволяет найти и оптимизировать узкие места сайта. Включается он добавлением к адресной строке параметра debug=1.

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

Теперь вы можете точно определить и оптимизировать медленные вызовы на каждой странице. Пример использованияDebugParser изображен на рисунке 5.1.

Рисунок 5.1 – использование DebugParser

В таблице показывается вызов тега MODX, количество запросов в БД при его работе, время запросов и общее время, затраченное на обработку.

Если на странице какой-то тег вызывается несколько раз, то эти вызовы суммируются.

Внизу таблицы вы видите сумму по статистике и общие данные: версия PHP, БД и т.д.

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

Все параметры он принимает через $_GET.

Для вывода работы тегов шаблонизатора Fenom вам нужно использовать:

Примеры:

  1. Обычный вывод

http://mystite.com/?debug=1

Таблица с отчетом заменит содержимое страницы, так что вы увидите только таблицу.

  1. Вывод с использованием кэша

http://mystite.com/?debug=1&cache=1

Если страница загружается из кэша, будут обработаны и показаны только некэшируемые теги.

  1. Вывод первых 10 самых медленных тегов

http://mystite.com/?debug=1&cache=1&top=10

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

  1. Вывод с присоединением таблицы к содержимому страницы

http://mystite.com/?debug=1&cache=1&top=10&add=1

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

6 Руководство администратора

6.1 Основные элементы CMS MODx

Ресурс — в понятии MODx ресурс представляет собой страницу сайта. Кроме того, существуют другие типы ресурсов, такие как, ссылки, сами файлы, и т.д. По умолчанию тип нового ресурса — документ, точнее представление одной страницы сайта.

Существует 4 вида ресурсов:

- Документ — самый распространённый ресурс, по сути веб-страница сайта. В основной массе состоит из заголовка, аннотации, подробного текста, различных дат, мета-тегов и дополнительных полей (TV-параметров).

- Web-ссылка — ссылка на внешний ресурс или веб-страницу.

- Символическая ссылка — внутренняя ссылка на другой ресурс.

- Статический ресурс — файл.

Каждый ресурс также имеет уникальный идентификатор, или «Resource Identifier». Если требуется связать два ресурса, то для этого следует использовать ID. Таким образом, MODx сгенерирует ссылку, и не придется беспокоиться об изменении адреса страницы или типы адресации.

Так же каждому ресурсу можно назначить шаблон, шаблон может определять дополнительные поля этого ресурса.

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

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

Параметры — используются для вывода значений полей ресурса.  Вызов осуществляется так: [[*field]].

TV параметры — это дополнительное поле или переменная шаблона (TV):

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

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

TV-тег заменяется соответствующим значением заполненным пользователем при обработке ресурса. Так же каждый такой параметр привязан к какому-либо шаблону и может использоваться лишь в совокупности с ним. Вызов осуществляется так: [[*TV]].

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

Чанк не может содержать какой-либо исполняемый код, но в нём можно вызывать сниппеты для вывода динамического контента. Вызов чанка осуществляется так: [[$chunk]].

Сниппет — PHP код который исполняется во время обработки шаблона MODx. Результат работы его может быть расположен либо на месте его вывода, либо в плейсхолдерах, специальных тегах определяющими куда поместить те или иные результаты. Вызов сниппета осуществляется так: [[snippet]].

6.2 Создание раздела

Раздел – это главный объект в основе иерархии структуры содержимого. Все доступные разделы сайта отображаются в главном верхнем меню.

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

Для добавления раздела на сайт необходимо создать ресурс в корне иерархии сайта (WEB). Для этого следует выделить корень иерархии — WEB и нажать правую клавишу мыши. В появившемся меню выбрать пункт «Создать → Дочерний документ». В поле заголовок ввести название нового раздела, а в поле содержимое ресурса информацию, которую необходимо отразить на главной странице нового раздела.

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

Рисунок 6.1 – создание нового раздела

6.3 Создание подраздела

Под подразделом, в понятии сайта, понимается следующим за разделом в иерархии сайта ресурс. Каждый раздел сайта имеет некоторое число подразделов.

Для создания подраздела необходимо правой кнопкой мыши нажать на ресурсе раздела, после появления меню выбрать «Создать → Дочерний документ» и аналогично созданию раздела заполнить необходимые поля — заголовок и содержимое.

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

6.4 Управление фотогалереей

Управление фотогалереей происходит из панели управления сайтом. Для доступа к галерее в панели управления следует перейти на страницу «Компоненты → Gallery». На странице управления галерей доступны такие действия как создание альбома, удаление альбома, редактирование альбома.

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

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

7 Оценка качества продукта

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

7.1 Определение состава работ

Работы по разработке программного обеспечения можно разбить на следующие этапы:

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

7.2 Определение трудоёмкости разработки

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

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

На решение поставленной задачи заданы ограничения следующие ограничения:

Время выполнение поставленной задачи – 4 месяца.

Расчёт трудоёмкости разработки производится по формуле (1).

                                              (1)

где ti – трудоемкость работ по стадиям проектирования, n – количество стадий проектирования.

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

                                                             (2)

Затраты времени на каждую стадию разработки проекта представлены в таблице 3.

Таблица 3 — Затраты времени по стадиям разработки проекта

Стадия разработки

tmin,

чел. дни

tmax,

чел. дни

Ожидаемые затраты времени, чел. дни

Подготовительный этап

5

7

6

Проектирование

10

30

20

Программирование

30

55

40

Этап отладки и тестирования

25

30

27

Заполнение информацией

30

40

35

Составление документации

7

12

9

Итого:

107

174

137

Работы по выполнению поставленной задачи распределим между руководителем (проектирование, общего руководство и работа с заказчиками) и программистом (техническая разработка и составление документации). Распределение объёмов работы между исполнителями приведено в таблице 4.

Этапы разработки

Трудоёмкость чел-дн.

Исполнители

Доля участия,%

Фонд времени, дн.

Подготовительный этап

6

Руководитель

50

3

Программист

50

3

Проектирование

20

Руководитель

30

6

Программист

70

14

Программирование

40

Программист

100

40

Отладка и тестирование

27

Руководитель

40

11

Программист

60

16

Заполнение информацией

30

Руководитель

40

12

Программист

60

18

Составление документации

9

Руководитель

25

2

Программист

75

7

Итого

132

Таблица 4 — Распределение объёмов работы

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

7.3 Оценка качества проекта

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

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

В качестве метода оценки будем применять метод начисления баллов по каждой характеристике, после чего по среднему баллу можно будет судить о качестве разрабатываемого программного продукта. Для определения уровня ранжирования воспользуемся 10-балльной системой. Всё это определяет ГОСТ РИСО/МЭК 9126-93 "Информационная технология. Оценка программного продукта. Характеристики качества и руководство по их применению".

Программное обеспечение может быть оценено следующими характеристиками:

  1. Функциональные возможности

Для оценки функциональных возможностей применяются следующие параметры:

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

— Правильность – атрибут программного обеспечения, показывающий обеспечение правильности соответствия результатов или эффектов. Правильность – 10 баллов.

— Согласованность – атрибут программного обеспечения, который заставляет программу придерживаться соответствующих стандартов или соглашений, положений, законов или подобных рекомендаций. Общий вид, интерфейс соответствуют принятым стандартам для интернет-приложений (Консорциум Всемирной паутины (World Wide Web Consortium, W3C)). Согласованность – 10 баллов.

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

— Способность к взаимодействию – атрибут ПО, относящийся к способности его взаимодействовать с конкретными системами. Система взаимодействует с необходимыми для ее работы системами через соответствующий клиент (браузер). Способность к взаимодействию – 10 баллов.

  1. Надёжность

Оценим надёжность программы с помощью следующих критериев.

— Стабильность – атрибут программного обеспечения, относящийся к частоте отказов при ошибках в программном обеспечении. За время тестирования программы были обнаружены некоторые отказы и ошибки, вызванные ошибками при разработке системы. Обнаруженные ошибки были исправлены. Стабильность программы можно оценить в 8 баллов.

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

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

  1. Практичность

Оценим практичность программы с помощью следующих критериев.

— Понятность – атрибут программного обеспечения, относящийся к усилиям пользователя по пониманию общей логической концепции и ее применяемости. Оценка понятности – 10 баллов.

— Обучаемость – атрибут программного обеспечения, относящийся к усилиям пользователя по обучению его применению. Система рассчитана на пользователей, имеющих опыт работы в интернете. Обучаемость – 10 баллов.

— Простота в использовании – атрибут программного обеспечения, относящийся к усилиям пользователя по эксплуатации и оперативному управлению. Оценка простоты в использовании – 10 баллов.

  1. Эффективность

Для оценки эффективности применяются следующие параметры:

— Характер изменения во времени – атрибут программного обеспечения, относящийся к временам отклика и к скоростям выполнения его функций. Время подготовки, вывода информации, а также время обработки вводимых данных зависит от вычислительной мощности компьютера, вычислительной мощности сервера и скорости интернета пользователя. Оценка – 9 баллов.

— Характер изменения ресурсов – атрибут программного обеспечения, относящийся к объёму используемых ресурсов и продолжительности такого использования при выполнении функций. Оценка характера изменения ресурсов – 10 баллов.

  1. Сопровождаемость

Оценим сопровождаемость программы с помощью следующих критериев.

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

— Устойчивость – атрибут программного обеспечения, относящийся к риску от непредвиденных эффектов модификации. Оценка устойчивости – 7 баллов.

— Анализируемость – атрибут ПО, относящийся к усилиям необходимым для диагностики недостатков или случаев отказов, или определения составных частей для модернизации. Анализируемость – 10 баллов.

— Тестируемость – атрибут ПО, относящийся к усилиям, необходимым для проверки модифицированного ПО. Тестируемость – 10 баллов

  1. Мобильность

Оценку мобильности проведём по следующим показателям.

— Адаптируемость – атрибут программного обеспечения, относящийся к удобству его адаптации к различным конкретным условиям эксплуатации, без применения других действий или способов, кроме тех, что предназначены для этого в рассматриваемом программном обеспечении. Оценка адаптируемости – 9.

— Простота внедрения – атрибут программного обеспечения, относящийся к усилиям, необходимым для внедрения программного обеспечения в конкретное окружение. Для использования системы требуется минимальные настройки администраторов. Оценка простоты внедрения – 10 баллов.

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

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

Результаты экспертной оценки занесены в таблицу 5.

Таблица 5 – Оценка качества программного обеспечения

Атрибут

Балл

1

2

Пригодность

10

Правильность

10

Согласованность

10

Защищенность

9

Способность к взаимодействию

10

Стабильность

8

Продолжение таблицы 5

1

2

Устойчивость к ошибке

8

Восстанавливаемость

9

Понятность

10

Обучаемость

10

Простота в использовании

10

Характер изменения во времени

9

Характер изменения ресурсов

10

Изменяемость

9

Устойчивость

7

Анализируемость

10

Тестируемость

10

Адаптируемость

9

Простота внедрения

10

Взаимозаменяемость

10

Соответствие

10

Средний балл

9,43

В результате проделанной работы сайт компании «ГИК» позволяет эффективно добавлять новые разделы, публиковать новости и акции, добавлять новые работы в портфолио, отправлять информацию или запрос пользователей администратору сайта (форма обратной связи) и размещать отзывы заказчиков.

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

По экспертной оценке, сайт компании «ГИК» получил средний бал 9,4, что говорит о его функциональности, удобности в использовании и соответствует всем современным стандартам.

Заключение

Таким образом поставленные нами задачи были выполнены, а именно:

  1. Проанализированы существующие программные решения
    • Разработка собственного ядра сайта;
    • Использование готовой системы управления сайтом;
      1. Разработана архитектура сайта

Сайт компании «ГИК» состоит из 6 основных страниц:

В ходе дипломного проекта был спроектирован и введён, в эксплуатацию сайт компании «ГИК». На начальном этапе был проведён анализ доступных способов решения проблемы создания сайта и выбран оптимальный.

При разработке проекта особое внимание уделялось актуальности используемых WEB-технологий, привлекательности интерфейсов, надёжности, понятности и поддержке на разных видах устройств.

Разработанный программный продукт соответствует требуемым стандартам.

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

Список использованной литературы

  1. Как создать движок для сайта [Электронный ресурс] MyRusakov.ru [Офиц. сайт]URL: https://myrusakov.ru/php-create-engine.html (дата обращения 11.06.2016)
  2. Joomla! [Офиц. сайт] URL:https://www.joomla.org/ (дата обращения 11.06.2016)
  3. Joomla.ru [Офиц. сайт] URL:http://joomla.ru/ (дата обращения 11.06.2016)
  4. Drupal [Офиц. сайт] URL:https://www.drupal.org/ (дата обращения 12.06.2016)
  5. TYPO3 [Офиц. сайт] URL:https://typo3.org/ (дата обращения 13.06.2016)
  6. 1С-Битрикс [Офиц. сайт] URL:http://www.1c-bitrix.ru/ (дата обращения 13.06.2016)
  7. MODX [Офиц. сайт] URL:http://modx.com/ (дата обращения 14.06.2016)
  8. MODX [Электронный ресурс] Википедия — свободная энциклопедия [Офиц. сайт] URL: https://ru.wikipedia.org/wiki/MODX (дата обращения 14.06.2016)
  9. ГИК [Офиц. сайт] URL: https://gik35.ru/ (дата обращения 14.06.2016)
  10. Bootstrap [Офиц. сайт] URL:http://getbootstrap.com/ (дата обращения 14.06.2016)
  11. Ingate [Офиц. сайт] URL: http://promo.ingate.ru/ (дата обращения 14.06.2016)




Похожие работы, которые могут быть Вам интерестны.

1. Разработка сайта для строительной компании «Технология»

2. Разработка и создание web-сайта компании «МаксАвто»

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

4. Процесс создания web-сайта строительной компании ООО «СКИТ»

5. РАЗРАБОТКА САЙТА ДЛЯ ОБУЧЕНИЯ АНГЛИЙСКОМУ ЯЗЫКУ

6. Разработка сайта с интегрированной базой данных

7. Разработка и внедрение веб–сайта под названием Удачная постройка

8. РАЗРАБОТКА WEB-САЙТА ПРЕДПРИЯТИЯ И ЕГО ПРОДВИЖЕНИЕ В ПОИСКОВЫХ СИСТЕМАХ

9. Разработка веб-сайта МБОУ Модутская средняя общеобразовательная школа

10. Проектирование и разработка модулей системы управления контентом для сайта