Юзабилити: как сделать сайт удобным

Элементы взаимодействия системы с пользователем

6.2.1. Окно браузера

Все Web-страницы, с которыми работают пользователи, отобража­ются внутри окна браузера. В зависимости от компании-изгото­вителя и версии браузера существуют некоторые различия, однако общий принцип одинаков. Браузер мржет быть однооконным и многооконным. Например, в браузере Internet Explorer на каж­дую открытую страницу по одному окну приложения. В некото­рых браузерах (Netscape Navigator, Opera) новые страницы могут открываться и в нбвом окне, и внутри текущего в окне-вкладке.

С очень небольшими различиями любое окно браузера обладает набором собственных ^элементов (рис, 6.4).

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

• Заголовок

Каждое окно браузера имеет заголовок. Это полоска в самой верхней части окна, в которой отображается информация о стра­нице (если, конечно, разработчик потрудился написать ее в теге <titie>). Заголовок окна виден не только в верхней части окна, но и в панели задач (в MS Windows), по нему пользователи часто смотрят, что за страница у них открыта. Поэтому краткий и чет­кий заголовок — вещь весьма немаловажная.

• Панель инструментов

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

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

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

• Строка состояния

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

• Адресная строка

В адресной строке отображается URL (Universal Resource Locator), иначе говоря, путь к текущей странице. Внешнее представление этого адреса также влияет на работу пользователя с информаци­ей. Например, если в нем есть не только вопросительные знаки, проценты и символы Unicode после основного доменного име­ни, а еще и имена каталогов, то он может подсказать посетите­лю, какова иерархия сайта. Кроме того, аккуратный скромный URL приятен с эстетической точки зрения и улучшает общее впечатление о вашем ресурсе.

• Полоса прокрутки "

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

• Курсор

Его форма влияет на точность попадания в элементы Web-стра­ницы и может бьггь разнообразной. Например, в MS Windows по умолчанию курсор выполнен в виде стрелки. При наведений на любую гиперссылку он изменяет свой вид на «руку».Если глав­ную страницу сайта «особо креативный» дизайнер выполнил в виде изображения, в недрах которого прячется ссылка для вхо­да, то обнаружить ее удается, исследуя местность до тех пор, пока не появится курсор-«рука».

На этом элементы интерфейса браузера заканчиваются. Перехо­дим к элементам самих Web-страниц.

6.2.2. Формы

Под формой понимают и внешнее представление определенной страницы (например, форма регистрации пользователя), и часть внутреннего содержимого страницы (HTML-тег). Формы ис­пользуются для получения информации от пользователя и ее от­правки на сервер (или обработки при помощи JavaScript на кли­ентском рабочем месте). Формой является все, что заключено в специальный HTML-тег <form>. Форма содержит поля ввода (выбор из списка, текстовое поле, чек-боксы и радио-кнопки и Т. Д.). Границы формы, т. е. начало и конец тега <form>, поль­зователь на странице не видит.

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

6.2.3. Апплеты

Апплеты — это внешние программные сущности, встраиваемые в любое место страницы, так же как и флэш-файлы (рис. 6.5). Апплет создается при помощи языка Java и представляет собой программный код, скомпилированный в файл с расширением. class. На HTML-страницу апплет загружается при помощи спе­циального тега <applet>. Для нормальной работы апплета не­обходима поддержка языка Java, что осуществлено практически во всех современных браузерах.

0й£ Язык Java является весьма развитым языком, позволяющим осущест­влять логику взаимодействия системы с пользователем практически любой сложности.

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

ницей с апплетом, необходимость специального программного обеспечения на компьютере пользователя не позволяет широко применять технологию апплетов в Web. Это связано с тем, что не во всех операционных системах и не во всех браузерах существу­ет поддержка Java. Посетителю приходится предлагать то, что для него выглядит как «Скачайте нечто непонятное с сайта ка - кой-то компании Sun Microsystems» (о которой он, возможно, вообще никогда не слышал). К тому же, это «нечто» — файл да­леко не маленького размера.

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

ф 6* ' V* ИФ

к

zi

Рис. 6.5, Апплет для интерактивного построения финансовых и статистических отчетов на сайте РосБизнесКонсалтинга

6.2.4. Диалоговые окна

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

Первым делом пользователь сталкивается с необходимостью на стройки и подключения браузера ко Всемирной паутине. Изме нение определенных требований и настроек нам неподвластнс равно как и управление автоматической подстановкой пароле адреса, вопросами браузера о способе его поведения (в это] смысле наиболее любопытным мне кажется норвежская Opera', Не управляем мы изначально и предупреждениями браузер о том, что он собрался разослать информацию, введенную вами о ужас, в «незашифрованном» виде по всему интернету.

Некоторые диалоги мы в силах предотвратить, лишь измени используемые технологии. Например, на сайтах могут использо ваться Active Х-компоненты (к счастью, не очень часто), о кото рых браузер сразу же предупреждает, т. к. они могут представлят серьезную угрозу безопасности пользЬвательского компьютер* Если разработчику таких сайтов отказаться от йспользовани технологий Active X, по крайней мере в интернете, пользовате лям наверняка станет легче жить.

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

Существуют еще более навязчивые окна, которые даже нельз с чистой совестью назвать диалогами. Это так называемые окн отладки сценариев, т. е., по большому счету, сообщения о ошибках JavaScript. Если ошибок много, работать с содержимы? становится практически невозможно. Когда вы закроете пятна дцатое сообщение о том, что «addMenuItem не является объек том», вы закроете и саму страницу. И правильно сделаете. Поэтом пользователи часто отключают отладку сценариев в настройка браузера. Как славно, что это можно сделать.