Проектная часть разработки web-сайта

Анализ принципов построения Web-сайта

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

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

Разработка интерфейса web-сайта

Дизайн web-сайта

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

Рис.2 главная страница

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

При нажатии на ссылке «Продукция» выводится товары интернет магазина (рисунок 3).

Рис.3 Продукция

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

При вводе административного логина и пароля активируется меню администратора (рисунок 5). Рис.5 Панель администратора

Разработка сайта на основе CMS

Описание установки CMS Joomla

Для доступа к административной панели управления (Backend – бэк-енд, панель управления) Joomla используйте адрес Вашего веб-сайта (или полный путь до папки, в которую установлена Joomla) с добавлением в конце пути " /administrator". Например, если адрес веб-сайта www.myweb.ru, то доступ к панели управления возможен по адресу www.myweb.ru/administrator. После правильного ввода адреса, откроется страница авторизации. Рис.6 страница входа в панель управления joomla Рис.7 главная страница панели управления Joomla

При правильном вводе имени пользователя и пароля откроется главная страница администрирования системой, то есть будет открыта панель управления Joomla (Рисунок 7), которая предоставит управления всеми функциями и возможностями Joomla. Возвратиться на главную страницу панели можно в любое время при нажатии кнопки " Администрация" в левом верхнем углу.

Создание Статей

Рис.8 Доступ на страницу " Менеджер статей"

Будет открыта страница " Менеджер статей".

На странице " Менеджер статей ", используя кнопки на панели инструментов, можно (перечисление справа налево):

Создать новый раздел. Нажмите кнопку " Новый".

Изменить существующий раздел. Нажмите на название раздела или отметьте нужный раздел и нажмите кнопку " Изменить".

Удалить существующий раздел. Отметьте нужный раздел и нажмите кнопку " Удалить".

Копировать существующий раздел. Отметьте нужный раздел и нажмите кнопку " Копия".

Скрыть (сделать неопубликованным) существующий раздел. Отметьте нужный раздел и нажмите кнопку " Скрыть".

Допустить (Опубликовать) существующий раздел. Отметьте нужный раздел и нажмите кнопку " Допустить".

Для создания новой статьи нажмите кнопку " Новый". Будет открыта страница редактирования " Статья руководителя" (Рисунок 9). Рис.9 страница редактирования статьи

На странице редактирования " Статьи" с помощью кнопок на панели инструментов можно (перечисление справа налево):

Помощь – открыть в новом окне страницу описания по данному окну (редактирование " Статьи" ). Нажмите кнопку " Помощь".

Применить (сохранить) изменения, но остаться на странице редактирования " Раздела". Нажмите кнопку " Применить".

Сохранить изменения и закрыть страницу редактирования " Статьи" и вернуться (выйти) на страницу " Управление разделами". Нажмите кнопку " Сохранить".

Загрузить изображение (сохраняется в папку images\stories). Нажмите кнопку " Загрузить".

На странице редактирования " Статьи" нужно:

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

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

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

В поле " Порядок отображения" после применения (сохранения) изменений можно изменить порядок отображения раздела в списке на странице " Управление разделами".

В поле " Уровень доступа" можно выставить права доступа на просмотр данного раздела (содержимого данного раздела):

" Общий" - для всех посетителей вебсайта,

" Участники" - для зарегистрированных пользователей сайта,

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

В поле " Опубликован" - выбрать публиковать сейчас или нет.

В текстовом поле " Описание" можно написать краткое описание (аннотацию) содержимого раздела.

Рис.10 визуальный редактор " TinyMCE"

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

В поле " Описание" используется специальный редактор HTML, то есть не Joomla, а ее расширение - мамбот. Данное расширение, мамбот, называется HTML-редактором Joomla. В системе можно использовать любой из множества различных визуальных HTML-редакторов, но рекомендуется использовать " TinyMCE" (Рисунок 12).

Если HTML-редактор не появился в Вашей системе, то Вы должны установить его и (или) включить редактор. В локализованной сборке Joomla RE редактор " TinyMCE" уже установлен и включен. Внешний вид Вашего визуального редактора может сильно отличаться от того, что использовался для написания этого руководства.

Кнопки на панели инструментов HTML-редактора помогают задавать стиль (формат) вводимого текста.

Когда Вы закончите создавать или редактировать раздел, нажмите кнопку " Сохранить" для сохранения результатов работы и выхода на страницу " Управление разделами". Или можно нажать кнопку " Применить" для сохранения результатов, не закрывая страницы редактирования " Раздела".

Создание Категории

Категория - это второй (после раздела) объект в иерархии структуры содержимого. Создание категории похоже на создание раздела.

Для работы с категориями необходимо перейти на страницу " Управление категориями".

Есть два способа перейти на страницу " Управление категориями".

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

Второй способ: в основном меню выбрать " Содержимое", затем " Содержимое по разделам" и далее нужный вам раздел. И в выпадающем продолжении меню пункт " Добавить/изменить категории в *выбранном вами разделе*". Будет открыта страница " Управление категориями" (Рисунок 11). Рис.11 Страница " Управление категориями"

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

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

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

На странице " Управление категориями", используя кнопки на панели инструментов, можно (перечисление справа налево):

Помощь – открыть в новом окне страницу описания поданному окну (" Управление категориями" ). Нажмите кнопку " Помощь".

Создать новую категорию. Нажмите кнопку " Новый".

Изменить существующую категорию. Нажмите на название категории или отметьте нужную категорию и нажмите кнопку " Изменить".

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

Копировать существующую категорию. Отметьте нужную категорию и нажмите кнопку " Копия".

Перенести – переместить существующую категорию и все ее содержимое в другой раздел. Отметьте нужную категорию и нажмите кнопку" Перенести".

Скрыть (сделать неопубликованной) существующую категорию. Отметьте нужную категорию и нажмите кнопку " Скрыть".

Допустить (Опубликовать) существующую категорию. Отметьте нужную категорию и нажмите кнопку " Допустить".

Для создания новой категории нажмите кнопку " Новый". Будет открыта страница редактирования " Категории".

Страница редактирования " Категории" аналогична странице редактирования " Раздела" (Рисунок 11). Основное отличие страниц редактирования " Категории" и " Раздела" - наличие поля выбора раздела, к которому будет относиться категория. Создание новой категории почти полностью аналогично созданию нового раздела.

⇐ Предыдущая 1 234 5 6 7 Следующая ⇒