.

Создание активных кнопок

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

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

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

 Добавьте эффект объема. Создайте визуальный эффект рельефности элементов на странице за счет их трехмерного изображения.

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

Используйте подсказки из повседневной жизни

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

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

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



Hosting Ukraine
Hosting Ukraine


Предложить

Дата Окончане проекта

Сумма проекта

×