Файл: Разработка сайта магазина игрушек ecotoystory.pdf

Предоставить свою продукцию в on-line среде. При этом такое представление не ограничивает, а созданием промо-сайтов и размещением рекламных материалов “банеров”, информационных статей в электронных журналах и на информационных порталах. С развитием интернет среды, развивается и само предложение. Теперь люди могут получать интересующею их информацию, и совершать покупки в онлайн магазинах. При этом с помощью Интернет-магазинов можно приобретать товары совершенно разных категорий, как элементарные потребительские, так и высокотехнологичные.

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

Цель этой работы – спроектировать и реализовать сайт магазина игрушек

«ecotoystory».

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

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

2. Разработка требований к приложению.

3. Проведение анализа исходных данных

4. Описание хода разработки приложения.

ОСНОВНАЯ ЧАСТЬ.

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

Терминология:

Сайт – информационная система, предоставляющая пользователям сети Интернет доступ к своему содержимому и функционалу в виде упорядоченного набора взаимосвязанных HTML-страниц.
WWW – единое информационное пространство на базе сети Internet, состоящее из совокупности сайтов. Приставка “веб“ – может использоваться для обозначения объектов, ориентированных на использование в WWW или использующих типичные для WWW технологии (например, веб – интерфейс – интерфейс на базе веб-страниц).
HTML-теги (теги) – управляющие коды, посредством которых осуществляется форматирование HTML-страницы.
Гиперссылка (ссылка, линк) – активный элемент HTML-страницы, задаваемый специальным тегом. Выделенный фрагмент текста или изображения, позволяющий загрузить другую страницу или выполнить определенное действие.
WWW-браузер (браузер) – клиентская программа, поставляемая третьими сторонами и позволяющая просматривать содержимое HTML-страница.
HTML-форма (форма) – часть HTML –страницы, предназначенная для взаимодействия с посетителем сайта. Представляет собой набор элементов (текстовых полей, селекторов, выпадающих списков), посредством которых пользователь может вывести какую-либо информацию и отправить ее для обработки на сервере.
Дизайн веб-сайта – уникальные для конкретного веб-сайта структура, графическое оформление и способы представления информации.
Веб-интерфейс – совокупность экранов и элементов управления системы, позволяющих пользователю, осуществляющему доступ к системе через веб-браузер, осуществлять поддержку и управление системой.
Простой контентный раздел – раздел с возможностью вставки произвольного текста, графики, ссылок на другие разделы, файлы, графику или внешние сайты. Подобный раздел управляется при помощи системы управления контентом с возможностью использования такого инструмента как «Визуальный редактор».
Простой список (или список) – раздел, содержание которого формируется из однотипных записей с предопределенным набором полей/свойств. При входе в раздел посетитель видит опциональный общий вводный текст и последовательность записей, состоящих из предопределенного набора свойств (в том случае, если оно заполнено). Количество единовременно отображаемых записей на странице раздела ограничено. Если общее количество записей превысит лимит, то отобразится «постраничная навигация», позволяющая просмотреть остальные записи списка. Такой раздел управляется из администраторского модуля, в котором присутствует инструментарий управления каждой по отдельности записью с возможностями редактирования их свойств, скрытия (без удаления) и прочие универсальные действия.

ОБЩИЕ ТРЕБОВАНИЯ К САЙТУ

Web-представительство компании должно обеспечивать реализацию следующих функций:

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

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

Требования к стилистическому оформлению:

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

Шрифты, используемые в графических элементах сайта, могут выбираться произвольно при условии не противоречия корпоративному стилю. Шрифты, используемые в текстовой материал сайта, должны соответствовать стандартным шрифтам браузеров: Helvetica/Arial, Times New Roman, Courier.

Допустимо использование иных распространенных шрифтов (Verdana, Tahoma и др.) в том случае, если их замена на стандартные шрифты не приведет к визуальному искажению текста. Размер (кегль) шрифтов должен обеспечивать удобство восприятия текста при минимально допустимом размере экрана.

Требования к функциональности веб-сервера:

Веб-сервер должен обеспечивать возможности:

управления содержанием и структурой сайта через систему управления контентом;
осуществления обратной связи c пользователями: прием отзывов и запросов пользователей по e-mail через заполнение специальных форм на сайте;
обработки статистики посещений (подключение внешней системы статистики HotLog);
ведения статистики голосований

Требования к браузеру:

Сайт должен обеспечивать корректное отображение данных в следующих браузерах: Internet Explorer 5.0 и выше (Microsoft), Opera 7.0 и выше (Opera Software), Netscape 7.0 и выше (AOL Netscape).

Требования к верстке:

Сайт должен быть оптимизирован для просмотра при разрешении 1024*768, 1280*1024 без горизонтальной полосы прокрутки и без пустых (белых) полей для основных типов разрешения.
Мета-теги и контент сайта на этапе изготовления сайта должны быть настроены с учетом требований поисковых систем, что обеспечить продвижение сайта по ключевым словам в русскоязычных поисковых системах Yandex, Aport!, Rambler, Google.

2.СТРУКТУРА И ОПИСАНИЕ САЙТА

Главная страница (обложка сайта):

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

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

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

Внутренняя навигация раздела «Каталог» отображается в виде списка в левой части экрана под шапкой в виде колонки в текстовом виде для последующей легкой модификации данной области.

Между шапкой и контентной областью предполагается «баннерная крутилка». Атрибуты:

- - Название баннера
  - Картинка
  - Ссылка на ресурс
  - Количество показов
  - Отображать на странице

Контентная область первой страницы делится на разделы:

«Логотип» - отображает название компании и ее девиз.
«Меню» - содержит краткую информацию о разделах сайта, с ссылками, ведущую на указывающие разделы.
«Популярные услуги» - содержит краткую информацию раздела, с ссылкой, ведущую на раздел.
«Прочие услуги» - содержит краткую информацию раздела со ссылкой, ведущую на раздел.
Графическая оболочка внутренних страниц (общая для всех подразделов):

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

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

Между шапкой и контентной областью находится «баннерная крутилка».

Внизу страницы отображается облегченная навигационная панель в текстовом виде, Copyright, контактный e-mail, ссылка на «Основную страницу» сайта.

Описание контента разделов сайта:
1. Основная панель навигации:

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

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

Контакты – текст-ссылка ведущая в соответствующий раздел, содержащий контактную информацию о работе компании, ее адрес, часы и время работы, контактный телефон, общий e-mail, интерактивную карту с расположением компании, а также mail-форма с полями: ФИО, e-mail, телефон, сообщение.

О компании – текст-ссылка ведущая в соответствующий раздел, содержащий контактную информацию о компании, истории ее создания, и mail-формой для отзывов.

1. Карта сайта:

Шапка
О магазине
Каталог товаров
Мягкие игрушки
На солнечной энергии
На элементах питания
На энергии солнечной воды
Контакты
Корзина
Новостное рекламное слайд-шоу
Поиск
Подвал
Связь с нами
Главная (ссылка на верхнюю часть сайта)
1. Подробное описание разделов, подразделов и их функций:
Шапка – отображает логотип и девиз компании, в разделах «Услуги», «Контакты», «О компании» отображают заголовок и название раздела.
Меню – отображать ссылки на разделы сайта.
1. Поиск – строка поиска, выполняет поиск по сайту.
  1. Информационно новостное слайд-шоу – слайд-шоу картинок новой продукции.
2. Каталог товаров – ссылка на список товаров компании.
3. О магазине – ссылка на окно, содержащие подробную информацию

по магазину.

- 1. Контакты – ссылка на страницу содержащие подробную информацию, условий оказания и форму для создания заявки и адрес магазина.
  2. Войти/регистрация – ссылка на страницу для входа или регистрации на сайте.
  3. Звоните – номер для связи с магазином.
  4. Основная страница – отображает основную информацию необходимую пользователю.
1. Подвал – содержит кнопки-ссылки на основные разделы сайта.
2. Главная - кнопки-ссылка на соответствующий раздел сайта.
3. График работы магазина – график работы магазина время.
4. Мини карта – расположение магазина в городе.
5. Обслуживание клиентов/услуга – различные услуги – доставка и возврат.
6. Адрес магазина – подробная информация адреса магазина.

3. АНАЛИЗ ИСХОДНЫХ ДАННЫХ

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

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

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