Курсовая работа: Проектирование web-сайта "Бойцовые собаки – кто они?"

Технические требования: использование HTML,CSS.

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

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

3.2 Создание рабочего наброска сайта

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

Основные мысли:

1)  История бойцовых (происхождение породы).

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

3)  Статьи с отрицательным характером (статьи 1, 2).

4)  Познавательные статьи (легенда, статья 3).

5)  Контактная информация.

Данные мысли я планирую вынести в заголовки (черновые названия):

1)  История.

2)  Опасные породы.

·  американский стаффордширский терьер;

·  бультерьер;

·  бульмастиф;

·  кавказская овчарка;

·  доберман пинчер.

(К каждой породе будут прилагаться фото и краткая характеристика).

3)  .Мнения.

·  хроника убийств;

·  законопроекты;

·  интервью;

·  заслуживают ли бойцовые собак ненависти людей;

·  бойцовые породы – крик души.

4)  Это интересно:

·  легенда;

·  шарпеи – тоже бойцовые;

·  анализ поведения собак;

·  собачий юмор.

5)  Контактная информация

Рисунок 12 - блок схема сайта

4. Разработка набора макетов страниц

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

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

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

4.1 Определение функциональных зон страниц сайта

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

Правильное использование гиперссылок является важнейшим фактором повышения юзабилити сайта. Известный специалист по юзабилити Якоб Нильсен (www.useit.com) утверждает, что навигация сайта должна в любой момент предоставлять посетителю ответы на три вопроса:

1)  Где я нахожусь?

2)  Где я уже был?

3)  Куда я могу пойти?

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

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

·  логотип компании, который является ссылкой на стартовую страницу, а также краткое описание сферы деятельности;

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

·  поле поиска по сайту.

Классификация элементов навигации

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

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

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

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

Текстовая ссылка как элемент навигации

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

Рисунок 13- Главная страница моего сайта

Рисунок 14- Второстепенная страница моего сайта

4.2 Нахождение идеи пластического решения, определение колорита страниц

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

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

Правила сочетания цветов

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

Не существует правильного сочетания цветов, существует только удачное сочетание цветов.

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

Первый тип – однотонный:

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

Страницы: 1, 2, 3, 4, 5, 6, 7, 8