Разработка Web-сайта компании по производству обуви Cicross Footwear®

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

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

      Недостатков у HomeSite немного, и все они – оборотные стороны его достоинств. В основном это – перегруженность возможностями. Это резко снижает привлекательность HomeSite в качестве редактора для начинающих Web-программистов.

2. Визуальный редактор Microsoft Front Page

      Это – HTML-редактор, входящий в пакет приложений Microsoft Office. Последняя версия – 2003 года (11-ая). В 2007-ом году на смену программе приходят SharePoint Designer и Microsoft Expression Web. FrontPage считается простейшим визуальным редактором и популярным среди тех, кто отдает предпочтение программным инструментам Microsoft Office.

      FrontPage поддерживает: HTML, JavaScript (скриптовый язык), CSS (каскадные таблицы стилей), DHTML (сочетание HTML, JavaScript, CSS и DOM – объектной модели документа), совместим с технологиями ASP (создание Web-приложений), XML (язык разметки, текстовый формат, применяемый для хранения структурированных данных), VBScript (скриптовый язык программирования), XSL (расширяемый язык таблиц стилей – смена CSS). FrontPage также имеет неплохие возможности по управлению изображениями, flash-роликами, и вообще, по заявлениям его разработчиков, способен создавать сайты с широкими возможностями и предоставляет средства управления ими, а также производить в режиме реального времени автоматическую отправку изменений, внесенных Web-дизайнером в исходные тексты.

      По сути, FrontPage является чуть ли не типичным приложением Microsoft Office, и интеграция редактора с этой серией является его очевидным преимуществом. Любой пользователь, имеющий опыт работы с такими приложениями как Word, Excel, Access, не будет испытывать особых сложностей в работе с редактором FrontPage – знакомые панели инструментов, наборы мастеров и редакторов, шаблонов, автоматических функций и т. д. Другими словами, FrontPage – прекрасное решение для начинающих пользователей и Web-мастеров.

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

      Простота использования – главное качество этого редактора, как, впрочем, и других продуктов серии Microsoft Office. Множество шаблонов и помощников освобождают пользователя от рутинной и сложной работы – допустим, термин «Web-компонент» в FrontPage может подразумевать под собой фотогалерею, которую можно вставить буквально с помощью двух-трех переходов: Insert > Web Component или Insert > Picture > New Photo Gallery. Пользователь может работать с традиционным интерфейсом, представляющим превью-картинки, которые, в свою очередь являются активными ссылками на изображения в их полном качестве и размере. Есть возможность организации монтажа, слайд-шоу, фотогалереи с пояснениями к изображениям и т. д. Впрочем, с Web-компонентами вполне может возникнуть сложность – под ними редактор понимает и динамические эффекты, и содержания, указателя, счетчики посещений и т. д., другими словами – сделать выбор не так-то легко и быстро, как могло бы показаться.

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

      Конечно, у FrontPage есть и недостатки – такие, какие могут быть у редактора для «шаблонных сайтов». Другими словами, именно шаблонность создающихся с его помощью продуктов – и является главной отрицательной стороной этого визуального редактора. К тому же, сам по себе FrontPage зависим от своих же расширений, без установки которых какие-то параметры сайта уже после его запуска могут отображаться некорректно, несмотря на то, что при локальном тестировании все отвечало запросам Web-дизайнера. К тому же, совместимость редактора исключительно с программным обеспечением Microsoft, делает его невозможным для использования пользователями таких операционных систем, как, например, Linux или Mac OS.

3. CMS редактор WordPress

      WordPress – CMS с открытым исходным кодом, распространяемая под GNU GPL лицензию. WordPress написан на языке программирования PHP, в качестве базы данных использует MySQL. Сфера применения – от блогов до достаточно сложных новостных ресурсов и даже интернет-магазинов. Встроенная система «тем» и «плагинов» вместе с удачной архитектурой позволяет конструировать практически любые проекты.

      Скачав и установив движок с официального сайта WordPress, вы получите:

1. Мощную блог-платформу с поддержкой меток, рубрик, комментариев, ЧПУ, RSS и поиска по сайту. С помощью панели управления можно включить поддержку Gravatar и древовидных комментариев, настроить число комментариев, отображаемых на одной странице и многое другое.
2. Возможность создавать статические страницы, например «о сайте», «обратная связь» и так далее.
3. Мощный WYSIWYG текстовый редактор.
4. В последних версиях WordPress появился онлайн-редактор фотографий, поддерживающий функции «обрезать», «отразить», «повернуть» и «масштабировать». Не Photoshop, конечно, но вещь порою очень полезная.
5. В WordPress поддерживается автоматическое обновление, как самого движка, так и установленных плагинов. Один клик мышкой, и движок самостоятельно скачает доступные обновления. Поиск и установка как плагинов, так и шаблонов также производится через панель управления.
6. Также в комплекте с движком идут два стандартных шаблона оформления.

      Также WordPress обладает встроенными плагинам, которые значительно облегчают процесс разработки Web-сайта:

1. CodeColorer – этот плагин добавляет в движок подсветку синтаксиса для всех популярных языков программирования, начиная с Java или Python и заканчивая Haskell.
2. Disqus Comment System – интегрирует ваш блог с популярной системой комментариев Disqus. С ее помощью ваши посетители смогут авторизоваться в блоге с помощью OpenID или учетной записи в Twitter, получать почтовые уведомления о новых сообщениях и многое другое. Кроме того, Disqus имеет собственную защиту от спама, причем весьма неплохую.
3. WP Super Cache – предназначен для кэширования часто посещаемых страниц. За счет кэширования повышается скорость загрузки страниц и снижается нагрузка на сервер.
4. Contact Form 7 – позволяет разместить на сайте весьма гибкую в настройке форму обратной связи.
5. Subscribe To Comments – встроенными средствами WordPress посетители могут следить за обсуждениями только с помощью RSS. Плагин Subscribe To Comments позволяет подписываться на обсуждения с помощью электронной почты. Разумеется, если вы используете Disqus, вам этот плагин не нужен.
6. TDO Mini Forms – довольно мощный плагин, позволяющий разместить на сайте форму для добавления посетителями новых сообщений в блоге. С помощью этого плагина можно построить сайт-сообщество или позволить посетителям присылать новости.
7. WP Polls – с помощью этого плагина можно проводить на сайте опросы. Опрос можно разместить как на конкретных страницах, так и в боковой панели на всех страницах сайта.

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

2. Практическая часть

1. Разработка логической структуры Web-сайта «Cicross»

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

      Web-сайт компании по производству обуви Cicross Footwear^® в городе Шахты, является по большей части информационным сайтом, основные задачи которого:

1. Максимально подробно поведать целевой аудитории о появлении и дальнейшем функционировании нового магазина молодежной обуви «Cicross» в г. Шахты.
2. Обеспечить клиентам компании возможность иметь постоянный доступ к самой свежей информации о новостях и акциях магазина, а также держать в курсе трендов в мире молодежной обуви.
3. Сформировать в глазах целевой аудитории положительное мнение о марке Cicross^™; проинформировать молодых юношей и девушек об идентичности дизайнерских разработок обуви компании Cicross Footwear^® с их стилевыми предпочтениями и вкусами. Сделать это аргументированно, посредством информации о превосходном качестве обуви данной марки и демократичной ценовой категории.

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

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

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

      Сайт компании состоит из 7 основных страниц, связанных между собой, что даёт возможность из каждой страницы легко перейти на главную и любую другую. Данные страницы объединены в одно общее меню, на котором они и располагаются. Меню состоит из следующих разделов: «Главная», «Новости», «Акции», «Статьи», «Контакты», «О». Раздел «О» разветвляется на 2 подраздела «Компании», «Продукции».

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

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

2. Информационное наполнение сайта

      Кроме легкого и функционального юзабилити, а также продуманной системы навигации, превосходный Web-сайт солидной компании должен отличаться грамотным, продуманным и профессионально написанным информационным наполнением сайта (далее – контент). Задачей контента является не только донесение до посетителя нужной информации в удобной форме, не лишенной красоты дизайна, но и попытка заинтересовать его, мотивировать к покупке [3].

      Контент Web-сайта компании Cicross Footwear^® построен таким образом, чтобы сначала заинтересовать потенциального клиента яркими заголовками и оригинальными дизайнерскими решениями, а затем мотивировать на покупку непосредственно рекламным текстом, написанным в лучших традициях профессионального копирайтинга.

      В данном разделе курсовой работы будет подробно рассмотрен контент Web-сайта компании Cicross Footwear^®. Web-сайт компании состоит из 7 основных страниц: «Главная», «Новости», «Акции», «Статьи», «Контакты», «О компании», «О продукции». С целью информативно показать контент Web-сайта были использованы скриншоты.

      Итак, страница «Главная» логически разделена на 3 зоны – это «шапка» страницы, основная часть и «подвал», представленные соответственно на рисунках 5,6,7.

      Скриншот «Шапки» главной страницы Web-сайта показан на рисунке 5, тут последовательно расположены: