Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Скачиваний:
20
Добавлен:
21.03.2016
Размер:
2.16 Mб
Скачать

Сайт компании

Эта же страница, с точки зрения компоновочных блоков

Типы сайтов

В зависимости от содержания сайты могут быть:

  • Презентационные,

  • корпоративные,

  • информационные,

  • электронные магазины.

После того, как вы определили тип будущего проекта, следует тщательно проанализировать содержание (и объемы содержания) проекта.

Вся информация, которая будет представлена на сайте, обязательно должна быть структурирована до того, как вы нарисуете эскиз первой кнопки. Разделы, подразделы, дополнительные разделы – вы должны сформировать дерево вашей информационной структуры, определить вложенность документов, оценить степень сложности переходов. Карандашом на бумаге или в документе word, где вам будет удобнее - вы должны увидеть эскиз информационной модели вашего проекта.

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

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

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

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

http://www.designchapel.com/

Корпоративный сайт - интернет представительство организации (фирмы, корпорации) в сети, и, следовательно, в таких проектах самые высокие требования к оформлению информации, к балансу графика/текст. Модульная сетка - 2-3-х колоночная. Соответствие фирменному стилю выражено как в структуре информации, так и в цветовой гамме. http://www.intel.com (синий и белый цвета, ясная структура разделов сайта, четкость и лаконичность идеально соответствуют корпоративной идее этой известной организации), http://www.hp.com (меняющаяся цветовая гамма - белый+серый+дополнительный - оранжевый/красный/синий… - но как приятно смотреть и легко разобраться - что и где искать).

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

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

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

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

Типы сайтов

В зависимости от технологии создания можно выделить следующие типы сайтов:

    • статические,

    • динамические,

    • Flash

    • комбинированные сайты

Основные «постулаты» web-дизайна.

Web-сайт подразумевает наличие набора определенных «правил хорошего тона», которых следует придерживаться, чтобы сайт выглядел профессионально:

1. Сайт должен корректно отображаться при различных экранных разрешениях. Графические элементы должны быть в формате .GIF или .PNG и лишь самые необходимые изображения – в формате .JPEG.

2. Web-страница должна идентично отображаться в различных браузерах.

3. Все страницы web-сайта, а также все интегрированные в них графические и интерактивные элементы должны быть минимальными по объему.

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

5. Весь проект должен быть выдержан в одном дизайнерском стиле.

6. На одной web-странице не должно быть более трех различных шрифтов.

7. Необходимо использовать только корректные цветовые схемы и не применяйте при оформлении документов более трех различных цветов.

Исключение здесь можно сделать только для полутонов одного и того же цвета.

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

39