Веб-дизайн: запретные приемы. HTML теги

Предисловие

Фреймы

• Поисковые системы регистрируют страницы как есть. Например, у вас есть страница: слева навигация во фрейме, справа текст статьи о кроликах и животноводстве. Предположим, что пользователь поисковой системы ищет именно кроликов и животноводство. Среди найденных ссылок стоит ваша. Куда она ссылается? Да, она ссылается на страницу статьи. Поисковик перекидывает пользователя на страницу со статьей, а фрейм с навигацией не показывает. Ну и куда пойдет ваш посетитель после прочтения статьи? Он не видит навигацию. Вы его потеряли.

   

• Фреймы сбивают с толку. Какой url послать приятелю? Как занести в избранное правой кнопкой мышки? Когда фреймов больше двух даже пользователь не сразу понимает, что произойдет, если кликну тут или тут.

   

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

   

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

  <script language="JavaScript">
  <!--
  if (window == window.top)
  top.location.href = http://my.site.ru/mydocs/index.htm;
  // -->
  </script>
  

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

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

  Где безусловно стоит применять фреймы. В случаях, когда в маленькое пространство необходимо вместить много информации. Например, нужно не тратя место на странице вставить большой текст без оформления (лицензия, соглашение, подсказка). Вот, например, пользовательское соглашение об использовании сервиса mail.ru (iframe).

• Открытие новых окон HTML теги

  Открывать окна нужно и полезно. Только вот 90% новых окон открываются против воли пользователя и без его ведома.

  Начнем с права пользователя на выбор. Мы обязаны сообщать пользователю, куда его отправит ссылка. Даже если это традиция сервера, например, internet.ru практикует открытие всех внешних ссылок в новых окнах, и мы - постоянные читатели уже привыкли, все равно неплохо бы предупреждать. А еще лучше - давать выбор: [ "ссылка" в новом окне ] и [ "ссылка" в этом окне ]. Это должно быть также естественно, как при цитировании говорить "Цитирую", а закончив цитировать - "Конец цитаты".

  Предупреждения можно также давать в "альтах" картинок-ссылок, а для текстов в атрибуте шрифта title (естественно, пользователи старых броузеров это не увидят).

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

  Самая жуткая ошибка это открытие новых окон при дальнейшей полной бесполезности материнского окна. Этим особенно сильно страдают дизайнерские проекты - им простительно, но даже солидные корпоративные сайты иногда построены на таком приёме. Например, http://www.kimmuli.com/ сейчас, правда, они вывесили новую версию. Их побуждения можно понять: окна открывают без статусных строк, без навигации; цель - управление пространством броузера пользователя: либо рабочая область окна становится огромной, либо наоборот - окно открывается маленькое, так как просмотр сайта по мнению разработчиков более удобен в таком формате. Но как же пользователь?

  Для некоторых сайтов есть выход, как это сделал Эрик Джордан (Eric Jordan) на своем легендарном сайте http://gnezdo.webscript.ru/design/article/www.2advanced.com - флеш (технология Macromedia Flash), который обычно пытаются пихнуть в новое окно без навигации и строки состояния, открывается во фреймах (редкий случай - фреймы толково использованы). На мой взгляд идеальное решение, нет ни потерянных окон, ни проблем с разрешением 800 на 600, а в случае с применением растровой графики это очень серьезная проблема - нет возможности ставить флеш по ширине экрана.

  Строка состояния броузера

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

   

• Отвлекает внимание. Этот "изыск" связан с некоторыми специфическими технологиями и работает весьма нестабильно - текст, если это бегущая строка) дергается.

   

• Как правило, ничего умного Вы в статусной строке не прочитаете. Посудите сами, что можно написать туда информативного? Что Вы находитесь на странице Васи Пупкина? Что сейчас 12 часов 59 минут ? Так это и так понятно.

   

• Для продвинутых пользователей сообщение, которое появится в строке состояния при наведении на ссылку, например, http://www.***.ru/product.asp?ID=32476?language=english, скажет очень много. Существуют два варианта спама в статусной строке. Первый - бегущий текст. Второй - подсказки вместо url при наведении мыши на ссылку. Первый иначе как спамом не назовешь. Со вторым все просто: если человек наводит мышу на ссылку "о нас", а в строке броузера появляется подсказка "о нас", вам не показалось, что это уж слишком?

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

  Отражение структуры сайта в URL'е

  Сложные URL'ы мешают пользователю перемещаться по сайту не линейно - то есть не так как позволяют ссылки и навигация. Например, существует сайт http://www.ozon.ru/ и есть url http://www.ozon.ru/audio/detail.cfm/ent=1&id=10466 - это адрес какого-то продукта, который продает компания. Признаемся, что только продвинутый пользователь догадается до следующего: если есть такой адрес и он отражает один продукт, значит стерев знаки справа от последнего слеша мы выйдем на более высокий уровень сайта, предположительно - уровень всех товаров. К сожалению многие сайты при таком действии выдадут access denied или что-то в этом роде. Получив отказ пользователь запутается.

  Приведенный случай относится к сайту с базой данных. Но я не раз встречал такие милые недоделки на статических сайтах.

  Содержание страниц желательно отражать в названии html файлов. Например, если речь идет об автомобиле ВАЗ 2109, то URL лучше иметь такой: www.*******.ru/auto/vaz2109.html, а не www.******.ru/mash/bibka/mashinka05.html.

  Вот еще интересный пример. Угадайте, что спрятано под таким адресом http://www.putin2000.ru/06/ ? Нет, это раздел о статусе Президента России. Комментарии полагаю не нужны.

  Таким образом, URL для продвинутого пользователя имеет важность почти как стандартная навигация.

  Технология Macromedia Flash

  Технология Macromedia Flash имеет массу достоинств. Иногда она просто поражает. И люди начинают забывать о недостатках, которые, увы, заставляют задуматься, а стоит ли вообще применять Flash в конкретном случае. Напомню, что основная дискуссия по вопросам юзабилити этой технологии развернулась между Якобом Нильсеном, ведущим специалистом в области юзабилити, и всеми флешерами мира. Господин Нильсен в своей легендарной статье "Flash неприемлем на 99%" [открыть в новом окне] расписал почти все недостатки Flash. Повторю слова господина Нильсена и добавлю пару своих замечаний:

   

• Flash нарушает привычную навигацию в интернете. Навигация это ссылки. Они имеют стандартный вид, при их нажатии происходят стандартные события. Flash все запутывает. Нам нужно нажав простую с виду ссылку "О сайте", например, получить информацию об этом сайте. А "мудрый" флешер (человек работающий с флешем) заставляет нас посмотреть ролик, подождать пока что-то загрузится… А нам-то информация нужна. Не могу отрицать, как средство для создания презентации Flash силен, но для размещения информации... Мягко говоря он ограничен, ограничен, как ни странно, именно огромными визуальными возможностями.

   

• Flash не позволяет работать с кнопками броузера "Вперед" и "Назад". Обычный пользователь не отличит где Flash, а где HTML. Но он знает, что нажатие кнопки "Назад" вернет на его экран ту информацию, которую он только что видел.

   

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

   

• Flash не работает с кнопкой (настройкой) броузера "Увеличить/уменьшить размер шрифта". Как справедливо отметил господин Нильсен, дизайнеры, как правило, обладают хорошим зрением и думают, что если они смогли прочитать, то прочесть смогут и пользователи.

   

• Flash не легко обновлять. И нередко к flash сайту начинают прикреплять заплатки в виде сплэш окон на HTML (новые окна, которые вылетаю при загрузке страницы) с новостями и прочим.

   

• Flash требует плагин. Если нужного плагина нет, появляются проблемы с подкачкой, сертификатами, предупреждениями о безопасности… Не сложно отпугнуть пользователя.

   

• Flash не работает с статусной строкой броузера. Точнее работает, но так редко мы видим сайты, где дизайнер не поленился поставить хоть примитивную подсказку о том, куда ведет ссылка. Это спорный пункт, но для какого-то числа пользователей статусная строка не менее важна, чем реакция курсора на ссылку.

   

• Flash весьма требователен к ресурсам компьютера пользователя, особенно это заметно при слабом процессоре. Один баннер на флеше способ занять 100% мощности 166 Пентиума.

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

  Где Flash более чем приемлем:

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

  Послесловие

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

   

  Благодарности

  Автор выражает особую признательность господам: Павлу Черкашину, Александру Казанцеву, Якобу Нильсену, Вадиму Жартуну, Артемию Лебедеву, Алексею Бородину, КрасноБелому.