Анализ основных требований к дизайну web-ресурсов

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

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

Семь правил web-дизайна:

1. Главный критерий – удобство пользователя. Есть негласное правило – сайт должен корректно отображаться при разрешении 800х600 точек с палитрой 256 цветов.

2. Сайт должен идентично отображаться как в IE, так и в NN.

3. Все страницы сайта должны быть минимальны по объему.

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

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

6. Максимальное количество шрифтов на одной странице – три.

7. Максимальное количество цветов на одной странице – три, корректность цветовых схем.

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

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

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

Выбор цветовой палитры является одним из важных аспектов создания интерфейса. При этом должны быть уч­тены эргономические требования: значения цветов должны быть постоянны и соответство­вать устойчивым ассоциациям. Ощущение времени и пространства, чувство наибольшего удаления от предмета и увеличения простран­ства создают цвета сине-голубой части спек­тра, а противоположные им оранжево-желтые тона дают эффект приближения предметов; цвета красно-желтой части спектра вызывают ощущение тепла, а сине-голубой части спектра - ощущение холода, максимум ощу­щения тепла падает на оранжевый цвет. Основное свойство «теплых» цветов - вызывать возбуждение, они стимулируют интерес человека к внешнему миру, общению и деятельности. «Холодные» цвета вызывают торможение. Это успокаивающие и снимающие возбуждение цвета, они вносят в поведение человека рассудочность, рациональность. Наибольшее возбуждающее действие оказывает красный цвет, воспринимающийся также как самый актив­ный. Визуальное равновесие приходится на зеленый цвет, сочетающий в себе легкость и живость желтого со спокойствием и тяжестью синего. При совмещении активных и пассив­ных цветов нужно учитывать, что активные цвета всегда воспринимаются ярче и лучше запоминаются, поэтому для достижения равновесия они должны подаваться в меньших пропорциях. Цвета сине-голубой части спектра считаются наиболее тяжелы­ми для восприятия. Желтый цвет, наоборот, выглядит наиболее легким и воздушным. Очень хорошо гармонируют полярные цвето­вые таблицы, когда они сочетаются на сером фоне или в разных плоскостях. Серый - нейт­ральный цвет. Он не привлекает к себе внима­ния, не вызывает никаких реакций, создает ощущение стабильности. Также к нейтральным относятся цвета: светло-розовый, серо-голубой, желто-зеленый, ко­ричневый.

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

Наиболее хорошо воспринимаемые сочетания цветов шрифта и фона: белый на темно-синем, лимонно-желтый на пурпурном, черный на белом, желтый на синем.

При разработке web-страницы необходимо соблюдать следующие правила:

- избегайте использования текста, графики и фона близких цветов или со сходной насыщенностью цвета или одинаковой яркости;

- поддерживайте высокий контраст;

- избегайте фонов, перегруженных графическими элементами.

При выборе шрифтов следует учитывать следующее:

- Любой шрифт - как и любая форма и цвет - имеет свою тональность, на­строение.

- Прописные буквы воспринимаются тяжелее, чем строчные.

- Лучше воспринимаются цифры, образованные прямыми линиями.

- Если необходимо использовать шрифты нескольких размеров (кеглей), то лучше всего ограничиться одним шрифтом с засечками и одним рубленым, введение тре­тьего шрифта возможно, только если есть очень серьезные причины.

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

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

Ярко выраженная текстура обычно при­меняется лишь к нескольким центральным элементам композиции с целью их акцентирования и должна вызывать увеличение субъективного размера. Любая текстура услож­няет облик предмета, делает его неоднород­ным, что также подталкивает подсознание к увеличению воспринимаемого объекта.

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

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

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

- Любой фоновый рисунок повышает утомляемость глаз обучаемого и сни­жает эффективность восприятия материала.

- Большое влияние на подсознание человека оказывает мультипликация. Ее воздействие гораздо сильнее, чем действие обычного видео. Четкие, яркие, быстро сменяющиеся картинки легко «впечатываются» в подсознание. При­чем, чем короче воздействие, тем оно сильнее. Однако любой нерелевантный движущийся объект понижает восприятие материала, оказывает сильное отвлекающее воздействие, наруша­ет динамику внимания. «Анимационный интерфейс - орудие очень мощное и поэтому требует особой осторожности. Попытки потря­сти мир приводят к быстрой утомляемости пользователя и, как следствие, отторжению системы».

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

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

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

- Украшения строчек акцентируют внимание читателя, невольно притя­гивают взгляд именно к этим строчкам своей яркостью, необычностью;

- Броскость элементов украшений при непродуманном их использовании может не только привлечь внимание, но и дезорганизовать его;

- Вертикаль при отсутствии членений воспринимается как нечто несоиз­меримое, бесконечное, легкое, устремленное ввысь;

- Если вертикаль имеет утолщения в нижней части или стоит на горизон­тальном основании, то она воспринимается как нечто более устойчивое;

- Горизонталь ассоциируется с надежностью, стабильностью;

- Диагональ символизирует динамику, движение, развитие;

- Композиция, построенная на горизонталях и вертикалях, тяго­теет к устойчивости, статичности, торжественности;

- Композиция, базирующаяся на диагоналях, будет обозначать движение, изменчивость, нестабильность;

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

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

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

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

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

Приложение 1

Дата добавления: 2014-10-31