«Ад — это другие веб-программисты.» — Жан-Поль Сартр (Jean-Paul Sartre), дополненная цитата.
Знайте, Вы в Преисподней дизайна, если видите...
мигающий текст
Из-за мигающего текста практически невозможно обращать внимание на что-либо ещё кроме него. Он приводит 87% пользователей в беспомощное состояние ступора, сильно похожее на то, как кролик цепенеет в свете надвигающихся фар. Это плохо. Если вы неправильно пользуетесь тэгом blink, вас следует застрелить. Подсказка: если вы используете тэг blink, вы неправильно пользуетесь им (на User Friendly есть подходящий комментарий на эту тему).
неоправданная анимация
Анимация нанесёт вам все те же чудные увечья, что и тэг blink, и в довесок оскорбит временем загрузки графики. Тем, кто злоупотребляет графикой, надо бы запихивать книги в каждое отверстие тела до тех пор, пока они не поймут, что двух-, трех-кадровая анимация ещё менее приятна, чем их состояние.
бегущая строка
Может быть, вы думаете, что тэг blink и паршивая анимация — это самые худшие пытки, которым сумеречные гении веб-программирования могут подвергнуть ваши глаза? Нееееет. На случай, когда этого недостаточно, Великий Сатана из Редмонда преподнёс нам тэг , который позволяет создавать анимированные бегущие строки одним броском угловой скобки. Этот ублюдочный брат тэга blink может вызывать головокружение и припадки у восприимчивых людей, делая их похожими на жертв лоботомии, истекающих слюнями, — какими, собственно, и нужно быть для покупки продуктов Microsoft. Совпадение? Мы так не считаем.
пёстрый фон
Как только мы снова натыкаемся на страницу, автор которой считает, что круто использовать в качестве фона языки пламени, муаровый узор или ярко-розовые завитушки, мы клянемся, что сейчас прямо через экран дотянемся до этого прыщавого негодяя и вырвем ему глотку. Если и существует такой источник мигреней и боли в глазах, который будет похуже тэга blink, то это именно пёстрый фон.
нечитаемые комбинации текст-фон
Этот мир полон клоунов, которые считают, что их текстовые странички смотрятся лучше с клоунским макияжем из режущих глаз сочетаний цветов (типичный идиот-любитель пёстрого фона к тому же тащит целую кучу всего этого). Этим неудачникам нужно выучить два волшебных слова: «световой контраст». Пускай ваше чувство цвета остаётся между вами и Богом Дурного Вкуса, но если вы терпеть не можете светлого текста на тёмном фоне или наоборот, вы отвадите посетителей, любящих читать, не испытывая страданий от рези в глазах.
рукописные заголовки
Рукописные заголовки — это грубо. Если только вы не думаете, что каждый пользователь, попавший на вашу страницу, действительно молит о возможности повисеть на ней достаточно долго, наблюдая за ростом ногтей, пока грузится изображение, просто отображающее заголовок, который вы могли бы набрать милым, приятным и, главное, «быстрым» шрифтом.
«Лучше всего смотрится в...»
О, да, «лучше всего смотрится в...» — верный признак некомпетентности дизайнера (если это не одна из пародийных кнопок кампании "Viewable with Any Browser" — «Можно смотреть в любом браузере»). Эта форма ущербности — не просто дурной вкус, она делает сайт практически непригодным для огромного количества посетителей, которым довелось пользоваться чем-нибудь другим, а не любимым браузером дизайнера. К несчастью, те люди, которые указывают «Лучше всего смотрится в...», бывают еще и слишком глупы, чтобы понять, о чём речь, когда вы пытаетесь объяснить им, что HTML предполагается быть платформо-независимым. Так что стоит высечь их и объяснить, что слепые люди тоже пользуются интернетом. Если это не сработает, забейте их до смерти ножкой стула, или еще чем попало. Ни один суд не признает вас виновным.
«измените размер окна вашего браузера на...»
Верно. Как будто мы хотели, чтобы наши браузеры занимали так много места на экране. Но по-настоящему бесит то, что эти субъекты неизменно делают всё неправильно. Например, их браузер имеет отступ в 8 пикселей, наш съедает 20, и они забыли предусмотреть полосы прокрутки, так что в любом случае они ошиблись как минимум на 30 пикселей, и отображаемая графика — настоящие помои.
огромные таблицы фиксированного размера
С ними мы часто сталкиваемся благодаря всё тем же идиотам, которые любят инструкции «измените размер окна браузера на...». Эй? Есть кто? Есть ли тут кто-нибудь, кто объяснит мне, почему до них не доходит, что мир населяет множество людей с разными мониторами, и что плавающие таблицы не зря придуманы? Ох…
излишние интервалы между границами
Это особенно дебильная разновидность больших фиксированных таблиц: дизайнер помещает всю страницу в таблицу и дополняет края пустыми столбцами фиксированной ширины. Нда. Верный признак, что он или она — один из тех жалких знатоков настольных издательских систем, что думают, будто HTML — это язык описания страниц. Виселица для них слишком хороша.
Бесцельное использование <small> и <font size=>
Если бы нам был нужен нечитаемо-мелкий текст, мы бы так и сказали нашему браузеру. Эти тэги особенно сильно обворовывают пользователей с 20- и 21-дюймовыми мониторами: так как большинство шрифтов рассчитано на 72dpi, то при 100dpi они и так уже на 30% меньше, чем должны бы быть. Каждый, кто использует эти тэги в тексте, сам должен быть сжат на 30%, медленно и, желательно, в машине с огромными ужасными шипами.
мастурбация с Javascript
С Javascript связан широкий набор неприятностей, производимых людьми, чья способность копировать и вставлять превышает их пренебрежительно малое чувство вкуса. Одно из самых распространённых неудобств — скрипт, который прокручивает текст в строке статуса Netscape. Ко всем недостаткам он добавляет ещё и то, что вы больше не видите, куда ведут ссылки. Ещё лучше, когда страницы с 25 килобайтами Javascript содержат менее 5 килобайт контента; эти страницы, разумеется, неизменно размещены на медленных серверах, чтобы вы могли испытать наслаждение от ожидания загрузки Javascript, потому что только так вы можете увидеть оригинально анимированное меню или что-то настолько же бесполезное. В общем, каждая страница, которая содержит больше Javascript, чем содержимого, должна быть отправлена в мусорное ведро.
злоупотребление Java
Существует кое-что похуже, чем заурядный идиот веб-дизайнер, и это наполовину умный идиот, который любит внедрять все новейшие технологии подряд, не задумываясь об их побочных эффектах. Один известный веб-сайт из списка «Fortune 100», определив, что вы пользуетесь Netscape, полагает, что ваш браузер должен поддерживать модный поисковый Java-апплет. И если вы отключили Java по соображениям безопасности, вы не можете искать по сайту, потому что вполне адекватный CGI-поиск, которым вы могли бы воспользоваться в Lynx, был отключён. Мораль: Не усложняй, тупица! (KISS принцип прим. пер.)
всплывающие окна
Некоторые особенно невыносимые дизайнеры открыли магическую формулу, которая вынуждает ваш браузер открывать новое окно, когда вы нажимаете на ссылку — или даже хуже, приводит к появлению всплывающих окон, когда вы просто пытаетесь сбежать из их жалкой обители грязи и насилия настолько быстро, как только сможете найти кнопку «Назад». Оставайтесь в своем собственном окне, черт побери! Интернет не должен выходить из под контроля пользователя; дизайнеры, упорствующие в грубом захвате кусочков пользовательского экрана без разрешения, заслуживают хорошей порки кнутом.
меню, целиком построенные с помощью image map
Подсказка: многие пользуются текстовыми браузерами (например, Lynx), потому что им так хочется (ради скорости загрузки), либо потому что вынуждены (расстройство зрения или отсутствие графического дисплея). И поэтому целая страница, отображенная в виде «[ISMAP]-[IMAGE]», бесполезна. Дизайнеры, которые не побеспокоились хотя бы добавить ссылку на альтернативное текстовое меню, по меньшей мере, ленивы и неосмотрительны. Огромные image map'ы плохи даже для графических браузеров; они долго загружаются и понапрасну расстраивают пользователей. А недовольный пользователь — потерянный пользователь.
запуск видео и аудио без подтверждения
Как насчёт видео-роликов, которые неожиданно начинают проигрываться по умолчанию, не поинтересовавшись, хотите ли вы их включить? Нет, не хотим. Если на вашем сайте есть баннеры — отлично, но если мои колонки неожиданно начнут орать о том, как я могу выиграть ПОДАРОЧНУЮ КАРТУ НА ТЫСЯЧУ ДОЛЛАРОВ, если я ПРОЙДУ ЭТОТ ОПРОС СЕЙЧАС, то я вам гарантирую, что скорее буду облизывать язвы в лепрозории, чем проходить ваш опрос или когда-либо иметь с вами дело. И ещё совет для всех, кто делает порносайты: большинство людей, смотрящих порно, не желает, чтобы звуки занимающихся сексом были слышны всем находящимся в радиусе 30 футов.
стили (CSS), которые устанавливают фиксированный размер шрифта в пикселях
Это излюбленный способ идиотов веб-дизайнеров сделать сайт нечитаемым на мониторах с более мелким шагом точек, чем используемые ими. Угадайте, что произойдёт, если установить 10- или 11-пиксельный шрифт на 72dpi-мониторе, и затем посмотреть его на 120dpi-мониторе? Всё верно, моментальное перенапряжение глаз, и ещё один пользователь проклинает ваше имя. Эта проблема со временем будет ещё хуже, так как мониторы становятся всё более крупными и мелкозернистыми.
CSS, изменяющий цвета хотлинков
Разве это не забавно, когда вы разглядываете страницу, и ваши глаза останавливаются, пытаясь разглядеть, которая часть текста является хотлинками? Подчёркнутый синий и фиолетовый — ценные навигационные подсказки в джунглях Web. Если страница содержит разноцветные ссылки или ссылки, которые сложно различить, то это ещё один случай, когда отмена настроек браузера должна караться близким знакомством с разделочным ножом.
Изменение цветов текста или фона по отдельности, а не вместе
Допустим, мне нравится, когда браузер отображает страницы с зелёным текстом на чёрном фоне по умолчанию. (Да, я на самом деле получил письмо от читателя, который так делает!) Если вы делаете цвет текста чёрным, но не меняете цвет фона, сайт становится нечитаемым в моём браузере. А если вы сделаете цвет фона белым (или, ещё хуже, оранжевым — такое тоже бывало!), но не измените цвет текста, то у меня разовьётся переутомление глаз, и я буду желать вам нашествия ползучих ужасов. Не слишком умно предполагать, что пользователь не игрался с настройками своего браузера; устанавливайте либо оба цвета сразу, либо ни одного.
MIDI, Flash, Shockwave, и другие мерзости в фоне
Фоновая музыка грузится целую вечность, и она не переносима. Flash и Shockwave загружаются бесконечно долго, не переносимы, а из-за проприетарности их форматов вы попадаете в зависимость от единственного поставщика софта. Когда вы смешиваете ваших посетителей с подобным дерьмом, не стоит ожидать, что они к вам ещё вернутся.
Знайте, Вы в Преисподней контента, если видите...
счётчики посещений
«Вы — 2317-й посетитель этой страницы.» Ага, будто это нас волнует. На Yahoo или Alta Vista можно без усилий найти и посмотреть каждую страницу на земле, где упоминаются, допустим, тумбочки или грязь между пальцами. В этом дивном новом мире счётчики посещений являются ничем иным, как особо дебильной формой членомерки, которая производит впечатление только на хомячков. Счётчики могут рассказать вам, сколько людей попалось и посетило эту яркую сверкающую страницу, но они не способны даже намекнуть, сколькие из них проворчали «отстой!» и смылись отсюда быстрее, чем вы сможете произнести «клик мышью». Дополнительный ущерб от счётчиков ссылок в том, что они ломают кэширование страниц, увеличивая нагрузку на линии Internet.
гостевые книги
Если нам найдётся что сказать вам, мы пришлём письмо. Заводить гостевую книгу — глупость, это лишь демонстрирует, что дизайнер не задумывается, что бывает, когда вы подначиваете людей написать что-то, ну хоть что-нибудь. Разумеется, не менее 95% содержимого такой гостевой книги окажется бессмысленным бредом.
устаревшие ссылки
Устаревшие ссылки — это отстой. Те, у кого полно устаревших ссылок, — ламеры. Ладно, каждому время от времени указывают на них, — но вы не замечали, что устаревшие ссылки, как правило, появляются на странице массово, как тараканы? Дело в том, что владельцы хороших веб-сайтов следят за своими страницами, досконально разбираются в них и быстро исправляют битые ссылки; так что вряд ли у них найдётся много устаревших ссылок сразу. Страница с кучей устаревших ссылок кричит: «Мой автор — ленивый и отсталый неудачник с позой хозяина клоповника, владеющего тараканьим дворцом».
страницы, навечно «в разработке»
Пользователи сети быстро понимают, что из 10 вывесок «в разработке» от силы только две успеют снять до второго пришествия Христа. Это глупо. HTML — это не ракетостроение, и сделать макет страницы — не так уж долго. Каждый, кто не может найти время, чтобы убрать вывеску «в разработке» со своих страниц, должен засунуть эти страницы подальше и найти занятие, более подходящее к его способностям: например, пускать слюни или пялиться в стену.
Знайте, Вы в Преисподней стиля, если видите...
бессмысленные тщеславные страницы
Если бы нам давали по 5 копеек за каждую увиденную домашнюю страницу с тоскливыми вариациями на тему «Привет, это я, и вот клёвые фоточки моих собаки/кошки/друга/подруги», то мы могли бы уже завтра отправиться на Мальдивы в компании супер-моделей. Совет: если вам нечего сказать, заткнитесь. И избавьте от этого Web — жизнь слишком коротка для скуки.
тоска и претенциозность
Изначально мы собирались выразить своё раздражение насчёт чёрного фона страниц, но обнаружили, что чёрный фон не является проблемой. Существуют три пересекающиеся группы неудачников, которые делают 99% чёрного фона в Web — вот в чём проблема. Это: [a] потребители понтов («круче-чем-ты»-искусство), [b] предающиеся тоске подростки, и [c] следящие за трендами пустозвоны, которые действительно верят, что подписка на журнал Wired сделает их модными. Совет: тоска и претенциозность наводят скуку. Те, кто отрыгивает хреновыми стишками, и/или имеет фетиш писать только строчными буквами, и/или торгует мутными картинками посредственного авангардного искусства, должны перерезать себе вены, или уйти в коммуну, или сделать что-то ещё, что защитит Web от их самолюбивого дерьма.
корпоративный словесный понос
Мы все их видели — эти корпоративные страницы, которые прежде всего грузят какой-то чудовищный графический логотип из преисподней. И после того, как вы выждали миллион лет или три года, пока это закончится, вся остальная часть страницы изобильно растекается о том, насколько чудесна эта компания; возможно, там есть немного корявой завлекухи, просто чтобы заполучить ваш адрес в их список рассылки, и — вообще никакого контента. Совет маркетологам: это неэффективно, если только вы не ставите своей целью, чтобы компания выглядела одним из слабоумных подражателей, которые думают, что наличие Web-адреса придаёт им вид обладателей ключей к успеху. Это не так!
адская реклама
Разве вы не любите рекламу из шапки страницы, которая сменяется каждый раз при очередном посещении? Если вы переходите назад и вперед между заглавной страницей и подкатегориями, вы каждый раз получаете сомнительное удовольствие от ожидания, когда наконец загрузится очередная графическая реклама.
отсутствие электронного адреса для обратной связи
Эти парни хотят, чтобы вы смотрели и слушали их, но не желают ничего слышать от вас. Разве не любопытно, что половина веб-страниц из списка компаний «Fortune 500», такие громкие имена, как McDonald's, не желают сообщать вам свой e-mail? Демонстрируя вам, насколько удивительно слабо на самом деле ценят своих клиентов. Ещё совет маркетоидам: подобные вещи выставляют вашу компанию точно такой же высокомерной, глупой и безразличной к своим клиентам, какова она и есть на самом деле. Рассматривайте e-mail для обратной связи как часть необходимой маскировки.
cookie-штурм
Множеству веб-пользователей не хочется, чтобы посторонние помаленьку гадили на их жёстких дисках, благодаря чему пользователи могут быть отслежены, просканированы, проанализированы и проданы. Поэтому многие пользователи настроили свои браузеры, чтобы те делали запрос, прежде чем установить cookie. Теперь многие пользователи чрезвычайно сердятся на страницы, захлёстывающие их потоками запросов на установку cookie. Подсказка: если пользователь отклоняет первую cookie, ему не нужна ни вторая, ни сорок девятая — перенесите это с достоинством. Каждый веб-дизайнер, который создаёт страницы, производящие cookie-штурм, должен быть выпотрошен тупым садовым ножом, «pour encourager les autres» (фр. «чтобы придать храбрость другим»)
Знайте, Вы в Преисподней расширений, если видите...
некорректный HTML
Огромное количество некорректного HTML было подарено миру, поскольку он иногда проходит незамеченным через дефективный 'парсер' всенародно любимого громоздкого веб-браузера. Дизайнер заслуживает приз за извращённость, если он может спровоцировать радикально иное поведение в других браузерах или версиях браузера.
'умные кавычки' от Microsoft
Ещё один признак дефективности Microsoft — вопросительные знаки, указывающие, где должны находиться кавычки. «Here?s an example, doesn?t it look illiterate?» — вот пример, разве он не выглядит неграмотно? Совет: выруби так называемую функцию «умные кавычки» в твоём Microsoft Word, тупица. Она генерирует специфичные для Microsoft символы, которых нет в кодировке Latin-1; многие браузеры (справедливо) поднимают руки от страха перед ними. Это лечится.
нестабильные расширения
Мы просто обожаем, когда наш браузер замирает при загрузке страницы, висит какое-то время, а потом позорно падает. Когда это происходит, вы можете поспорить на деньги, что эта страница использует раздувшееся расширение, которое никто даже не потрудился отладить (и таких почти бесконечное количество). Несомненно, худшая обида…
фреймы
Мы привыкли говорить «фреймы для идиотов» в те времена, когда они крушили большинство браузеров. Фреймы с рамками до сих пор таковы; они пожирают ценное пространство экрана своими халтурными обрамляющими штуковинами. Приходится признать, что у фреймов без рамок есть применение — но если вы их используете, делайте это правильно. Фреймы, которые нельзя добавить в закладки, по-прежнему сосут, а ссылки, которые не заменяют страницу целиком, когда вы выполняете переход, сосут ещё больше. Используйте фреймы крайне осмотрительно.
Улучшение вашей страницы
Слышу, как вы говорите, — «Ладно, вы дали мне хороший урок насчёт того, как не перегнуть. Может, есть что-то более позитивное? Например, что стоит сделать и как я могу улучшить свою страницу?» Для вас, мой друг, у меня есть три слова. Содержимое, содержимое и ещё раз содержимое. Дайте посетителям причину заинтересоваться. Слишком много страниц похоже на сказки, рассказанные идиотами, — полные пафоса, но не значащие ничего. Хотите, чтобы было интересно? Тогда забудьте о графике и блеске. В первую очередь, вы должны иметь, что сказать.
Предложения?
Есть жалобы на плохой HTML дизайн? Пишите нам! <esr@thyrsus.com>
Пожалуйста, не просите меня оценить или подправить вашу страницу. Мне и так достаточно сложно найти время на поддержку своих собственных страниц. Вы можете изменить мое мнение только кучей денег, выплаченых авансом.
Благодарность
… Питу Гласкоку (Pete Glasscock), вдохновившему на создание этой страницы, несмотря на то, что он пропал впоследствии из Сети.… Патрику Кэмпбел-Престону (Patrick Campbell-Preston) <patrick@chaos.org.uk> за большую часть «Ада расширений».… Робу Новаку (Rob Novak) <rnovak@ibm.net> за «адскую рекламу». Остальные, кто участвовал в создании этой страницы, попросили их не указывать.
Еще хороший совет
Есть милая проповедь на тему веб-дизайна от C. J. Silverio. Ужасные примеры плохой техники собраны на Web Pages That Suck. Колонка Якоба Нильсена (Jakob Nielsen) «10 грубейших ошибок веб-дизайна» также хороша. The Yale Style Guide заслуживает прочтения.
Перевод: © Vadim, ckald, onb, Vladimir_M, Bubik.
translated.by переведено толпой
