Безвкусицаhttp://podhod.ru/shitО том, как делать не нужноСтудия дизайна «Разумный подход»ru-ruРефрижираторhttp://podhod.ru/shit/221http://podhod.ru/shit/2212010-07-08 00:00:00Бесполезная информация<p>Вот три случайных страницы с новостями компаний. Обратите внимание, что перед каждой новостью проставляется год публикации. Поскольку этот раздел обновляется регулярно, то указание года — это бесполезная информация, визуальный мусор, мешающий своим повторяющимся присутствием.</p><p>Кроме этого, каждая из страниц наделена своими бесполезными деталями.</p><img src="http://podhod.ru/images/044-news.png"/>http://podhod.ru/shit/221http://podhod.ru/shit/220http://podhod.ru/shit/2202010-03-25 00:00:00Подготовка текста к публикации<p>На страницах <a href="http://mobile.beeline.ru/samara/3g/voprosy.wbp">справочника</a> Билайна можно встретить комментарии от составителя текста к публикующему текст в интернете сотруднику:</p><img src="http://podhod.ru/images/043-beeline.png"/><p>Стоит отметить, что в подобных текстах «вы» и «ваш» надо писать с маленькой буквы. А в тексте гиперссылки избегать бессмысленного «здесь».</p>http://podhod.ru/shit/220http://podhod.ru/shit/217http://podhod.ru/shit/2172010-03-17 00:00:00Вертикальная линия mail.ru<p>На главной странице сайта <a href="http://mail.ru/">mail.ru</a> средняя колонка не выровнена по вертикалной линии левого края. Это выглядит очень неряшливо.</p><p>Чтобы страница стала аккуратнее достаточно выровнять по левому краю существующие блоки.</p><p>Нажимайте на изображение, чтобы увидеть разницу:</p><p><img src="/images/042-mail1.png" class="toggler" mode="2"/></p>http://podhod.ru/shit/217http://podhod.ru/shit/218http://podhod.ru/shit/2182010-01-31 00:00:00Ползунок громкости в плеере YouTube<p>В новом интерфейсе плеера на <a href="http://www.youtube.com/">Ютюбе</a> появилась возможность выбирать разрешение видеоролика через раскрывающееся меню. Это меню сделали таким, что оно стало мешать изменять уровень громкости.</p><img src="http://podhod.ru/images/042-youtube.png"/><p>Кроме возникшей путаницы с «горячими зонами» есть ешё одна проблема. Очевидно, что изменять уровень громкости приходится значительно чаще чем изменять качество видеоролика, а значит, в соответствии с законом Фитсса, горячая зона для раскрытия ползунка уровня громкости должна быть больше. </p><p>И вообще, не понятно зачем прятать громкость в раскрывающееся меню за маленькой кнопкой — на панели достаточно места чтобы уместить этот ползунок.</p>http://podhod.ru/shit/218http://podhod.ru/shit/206http://podhod.ru/shit/2062009-12-22 00:00:00Логотип Bing<p>Логотип поисковой системы <a href="http://bing.com/">Bing</a> достаточно прост — всего четыре буквы зарифмованные округлостью и шириной штрихов. Столь выраженная геометричность не позволила авторам сделать надпись изящной. При этом, в столь простых конструкциях букв хромает качество контуров.</p><img src="http://podhod.ru/images/041-bing.gif"/>http://podhod.ru/shit/206http://podhod.ru/shit/205http://podhod.ru/shit/2052009-12-10 00:00:00Листалка<img src="http://podhod.ru/images/040-listalka.png"/><p>Один из многочисленных примеров бездумной реализации навигации по страницам.</p>http://podhod.ru/shit/205http://podhod.ru/shit/191http://podhod.ru/shit/1912009-12-02 00:00:00Регистрация на сайте Эпсона<p>При регистрации на сайте компании Epson необходимо сперва выбрать форму обращения, «господин» или «госпожа», а затем указать свой пол «мужской» или «женский».</p><img src="http://podhod.ru/images/039-epson.png"/>http://podhod.ru/shit/191http://podhod.ru/shit/189http://podhod.ru/shit/1892009-11-20 00:00:00Буллеты в меню<img src="http://podhod.ru/images/038-russobit-m.png"/><p>Буллеты, стрелки, кружочки, квадратики и прочие мелкие формы возле каждого пункта меню всегда лишний мусор.</p><p>Исключение: можно рассмотреть вариант поставить какой-либо аккуратный символ в начале списка если названия разделов многословные. Когда названия приходится писать в несколько строк.</p><p>Плашки и рамки в данном случае тоже лишние.</p>http://podhod.ru/shit/189http://podhod.ru/shit/202http://podhod.ru/shit/2022009-11-12 00:00:00Бледное оформление<p>Сайт федеральной службы по труду и занятости <a href="http://www.trudvsem.ru">trudvsem.ru</a> весь голубого цвета. Голубой логотип, голубое меню, голубые заголовки и голубой контент.</p> <img src="http://podhod.ru/images/037-trudvsem.png"/><p>Бледность сайта создает сложности в чтении текста (на сайте много текстовой информации) и мешает различать ссылки (ссылки не подчеркнуты и того же цвета что и текст).</p> http://podhod.ru/shit/202http://podhod.ru/shit/192http://podhod.ru/shit/1922009-04-28 00:00:00Типичные ошибки<p>Чтобы понять, что сайт делали малоопытные разработчики, достаточно обратить внимание на типичные ошибки.</p><p>Вот, например, сайт студии дизайна «<a href="http://artpencil.ru/">ART-СТУДИЯ — все в on-line</a>»:</p><img src="http://podhod.ru/images/036-art-studio.png"/><p>Типичные ошибки:<ol> <li>Логотип на главной ведет на главную;</li> <li>Пустая ссылка;</li> <li>Не прописан белый фон по умолчанию.</li></ol> </p><p>Первый пункт — частный случай проблемы, когда какая-либо ссылка ведет на ту же страницу на которой она расположена. Эта ошибка — первейший индикатор непрофессионализма разработчика. Это сигнал того, что разработчик не понимает что такое удобный интерфейс и что означает термин «гипертекст».</p><p>Вторая проблема возникает когда «дизайн обгоняет контент». Придумали что на этом месте будет ссылка, а куда она ведет не придумали. Такая ошибка возникает когда у разработчика нет цельного представления сайта.</p><p>И третья ошибка-индикатор возникает когда разработчики не отдают должного внимания отображению сайта с учетом пользовательских настроек. Скорее всего не было проведено и должной проверки на работу в различных браузерах, при различных разрешениях экрана и при различных масштабах страницы.</p><p><i>Добавка: ART-СТУДИЯ отреагировала весьма оперативно и поправила ошибки. Тем не менее там остались другие, о которых я не упоминал в этой заметке.</i></p>http://podhod.ru/shit/192http://podhod.ru/shit/190http://podhod.ru/shit/1902009-04-14 00:00:00Автоматическая обработка текста<img src="http://podhod.ru/images/035-civil-code-su.png"/><p>Причина, по которой смайлики не должны заменяться на картинки автоматически.</p>http://podhod.ru/shit/190http://podhod.ru/shit/160http://podhod.ru/shit/1602008-12-29 00:00:00Сбербанк, который хочется облизать<p>Не секрет, что современный Веб-два-ноль-стайл пользовательского интерфейса заложили в компании Apple Inc создав стиль «Aqua». С тех пор утекло много воды, а стиль по прежнему не даёт многим покоя.</p><p>В новый 2009-ый год Сбербанк России входит с <a href="http://www.sbrf.ru/">сайтом-карамелью</a>:</p><img src="http://podhod.ru/images/034-sbrf1.jpg"/><p>Авторы проявили чрезвычайное непонимание изображаемого. Белая палка на зелёной кнопке — это блик. А серый полукруг — это изображение освещения на сгибе:</p><img src="http://podhod.ru/images/034-sbrf2.jpg"/>http://podhod.ru/shit/160http://podhod.ru/shit/147http://podhod.ru/shit/1472008-12-11 00:00:00Простой способ оценить качество сайта<p>Карта сайта многое говорит о качестве самого сайта. Эта страница лучше других демонстрирует понимание задачи разработчиком — буквально это и есть краткое содержание технического задания.</p><img src="http://podhod.ru/images/033-sitemap.png"/><p><a href="http://www.anchar.ru/sitemap.phtml">Например</a>, если карта сайта всего лишь дублирует главное меню, то смысла существования такой страницы нет. Разработчик не думал. Сразу возникает вопрос, есть ли необходимость в существовании других разделов.</p>http://podhod.ru/shit/147