Разработка содержания, структуры и дизайна сайта

Практическая работа № 1

РАЗРАБОТКА ПРОЕКТА САЙТА

Цель работы:изучение и освоение принципов разработки сайта.

Задачи практической работы

1. Изучить общие принципы разработки сайта.

2. Определить основную тему разрабатываемого сайта.

3. Разработать структуру и содержание сайта.

4. Написать сценарий сайта.

5. Разработать макет сайта.

6. Собрать и подготовить информацию и материалы для сайта.

7. Определить аппаратно-программные потребности сайта.

Перечень обеспечивающих средств для выполнения практической работы:

- индивидуальное задание на выполнение работы (тема задания совпадает с темой курсового проекта по дисциплине «Конструирование программного обеспечения»;

- персональный компьютер;

- программное обеспечение (ПО) Microsoft Office Word;

Задание

Для выполнения практической работы № 1 необходимо изучить общие принципы разработки сайта. Для определения основной темы разрабатываемого сайта необходимо сформулировать, что должно присутствовать на сайте, представляющем компанию (или проект). Разработать структуру, содержание, дизайн, макет сайта. Написать техническое задание, собрать, подготовить информацию и материалы для разрабатываемого сайта. Определить аппаратно-программные требования сайта.

Порядок выполнения практической работы

1. Определение основной темы разрабатываемого сайта

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

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

- целей сайта;

- информационных потребностей посетителей сайта;

- материалов сайта;

- бюджетных ограничений.

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

Разработка содержания, структуры и дизайна сайта

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

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

Структурность - многоплановое понятие, которое применяется как к информации, так и к визуальным элементам.

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

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

1 Index (Главная страница - это страница, которая загружается при наборе доменного имени сайта в строке браузера. В подавляющем большинстве сайтов, главная страница содержит колонку News);

2 About (О нас, О компании, и т.д.);

3 News (Новости - периодически и регулярно дополняемая информация);

4 Products (Наши услуги, Наши продукты, Наши туры);

5 Price (Цены, прайс-лист);

6 Support (Техническая и/или сервисная поддержка, горячая линия и/или e-mail связь);

7 Search (Поиск - модуль поиска по введенному слову или словосочетанию).

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

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

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

1. текст - основное содержание страницы, т.н. контент;

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

3. фон - цвет страницы или ячейки таблицы;

4. ссылки - ссылки гипертекста;

5. картинки - фотографии и графика контента, графические элементы оформления сайта.

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

8. Визуальное оформление.

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

9. Эксклюзивность и оригинальность сайта.

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

10. Соответствие сайта техническим требованиям.

Страницы сайта должны быть привлекательными (даже без рисунков), быстро загружаться и быть совместимыми с наиболее популярными браузерами (Internet Explorer, Opera, Mozilla Firefox, Google Chrome). Разработав дизайн, необходимо подготовить техническое задание (сценарий) для создания сайта. В нем указываются примеры удачных сайтов и указания по стилю и цветовому оформлению. В результате изготавливается макет, который можно будет корректировать по ходу выполнения проекта.

11. Не забывайте: Ваш сайт - лицо Вашей компании!

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

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

12. Подготовка технического задания (сценария) для создания сайта

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

Рекоментованные ссылки:

1. http://mixsystems.com.ua/Content/For-clients/tz_examples/