Чистим фаворитсы. Большинство из замечательного gui.ru, так что речь во всех ссылках более-менее пойдет о юзабилити.
Идея-фикс «content is the king», ставшая возможной с всеобщим распространением RSS, с моей точки зрения, никак не отрицает того факта, что веб-дизайн — штука не нужная. Даже в блогах первое впечатление о сайте — это тот крючок, который «конвертирует» посетителя в читателя. Что уж говорить о том, что комментируем и ищем новое мы все-таки в веб-интерфейсах, а не единой семантической сети без оформления.
Важна не только красота, но и представление элементов сайта в дизайне. Например, простые размышления про стрелки рядом с текстовыми ссылками все возвращают нас к мысли, что применение любого интерфейсного элемента подвержено сильному влиянию контекста.
Но не все так просто. Тут нельзя не вспомнить статью на сайте лучшей студии дизайна иконок в России — про то, что различимость иконки важнее, чем ее «понятность». Тенденция гламурно-градиентных и детальных градиентов зачастую, к сожалению, убивает различимость на корню.
С другой стороны, возвращаясь к контексту — использование «закрывающейся правой елочки» вместо элемента «дальше», тоже один из ужаснейших фактов сегодняшнего Веба. Ведь не стоит забывать, что метафора тоже нужна — ведь это связь между объектом и его идеей (у вас есть еще шанс перевести эту статью, да).
Даже если уходить в сторону от пиктограмм, от которых и так уже голова болит, — скажем, подсказки в формах — как они должны располагаться? Или файловые инпуты, как их кроссплатформенно стилизовать?
Функции элемента должны совпадать с его представлением. Точно так же, как и текст, в котором форма разнится с содержанием, совершенно не воспринимается.
Метафоры все-таки остаются лейтмотивом дизайна, но попробуйте расфокусировать взгляд при просмотре сайта. Или, вообще уберите все элементы оформления, все детали, как это делают на проекте «Веб без слов», который каждую неделю презентует новый популярный сайт в виде блоков верстки. Никакого текста, никаких изображений, только элементы в виде закрашенных блоков, что позволяет отойти от детализации результата в пользу системности прототипа.
![]()
Как всегда, получается, что важную роль играет все — идея, содержание, расположение, подача, форма... Приоритеты можно ставить только рассматривая конкретный проект и конкретный дизайн. Вот так вот все сложно.
И снова чуть-чуть о выключке. Если в книгах выравнивание по ширине позволяет использовать кропотливая работа редакторов, нещадно борющихся с дырами в тексте, то в экранной типографике сложность состоит в том, что никто не будет соответственно подготавливать текст к публикации. Мне возражают, что это можно сделать с помощью плагина расстановки мягких переносов, своего рода «типографа для justify».
Объясню недостатки этого решения:
- При копировании текста тот же Firefox вставляет вместо ­ дефис (попробуйте сами, да) везде. Копирование в плейн-текст оставляет дефисы.
- Загромождает HTML.
- Неправильная расстановка переносов (не полностью по правилам русского языка).
{16 комментариев}
Чтобы многострочный код отображался правильно, естественно, использую <pre><code>. Второй тег говорит нам, что это код, первый же отображает текст, не сжимая последовательности пустых символов и превращая разрывы строк в переводы каретки уже в браузере.
Возможно, из десятка известных мне хайлайтеров выберу один — пока предпочтение идет в сторону js, как более выгодного в свете оптимизации метода. Хотя, конечно, придется выбранный скрипт подсократить и убрать лишние цвета.
Но вот вчера в мессенджер постучался Антон Веринов и указал мне на известную ошибку с pre, который игнорирует ширину родительского блока и вылезает за нее. Ну и плюс силком заставил уменьшить размер шрифта (все равно коду не так требуется читаемость).
Если решать проблему переносов в pre, то мы сталкиваемся с довольно неприятным поведением браузеров, не предоставляющих этого по умолчанию. Краткое решение нашел здесь, а уже потом — у Slaff'а вроде как более полное. Однако, не совсем так.
pre {
<del>white-space: pre; /* CSS2 */</del>
white-space: pre-wrap; /* CSS 2.1 */
<del>white-space: pre-line; /* CSS 2.1/3 */</del>
white-space: -moz-pre-wrap; /* Mozilla */
<del>white-space: -hp-pre-wrap; /* HP printers */</del>
white-space: -o-pre-wrap; /* Opera 7 */
white-space: -pre-wrap; /* Opera 4-6 */
word-wrap: break-word; /* IE 5.5+ */
}
Собственно, первый атрибут удаляем, т.к. он бесполезен. Третий — потому как pre-line — это тот же pre-wrap, но сжимающий последовательности символов пустого пространства (что нам не надо). А пятый — из-за отсутствия смысла. Комментарии (они не «условные») также можно удалить, т.к. они загромождают место.
А если взять за предположение, что пользователи Оперы и Фаерфокса все-таки знают, что такое обновление, достаточно и двух строчек:
white-space: pre-wrap;
word-wrap: break-word;
Соответственно, такое решение позволяет встраивать многострочный код, который, наконец, будет подстраиваться по ширине блока. Без всяких дополнительных тегов, но за счет места в CSS.
{16 комментариев}
Я разучился писать кратко.
{14 комментариев}
Вот знают люди, на каких струнках моей души играть. Любовь к критике (основательной, конструктивной — ну и далее по списку) — это, пожалуй, единственное мое положительное качество, покрывающее даже нудность.
Вот отдали мне на съедение блог Кузьмина Евгения. Это типичный авторский бложек, претендующий на настоящую топовость (а то 180 читателей — это тьфу, просто автор еще не развернулся в полную силу). Содержание и материалы — мэйнстрим, приемы тоже. Но это скорее плюс для блоггера именно как «блоггера».
Зато блог — авторский и часто попадающий в десяточку со своими постами. Впрочем, не нравился бы мне местами контент (<irony>а мне сложно угодить, даааа</irony>), я бы не повелся на предложение. Единственное, насчет самого Евгения у меня не сложилось четкой картинки личности, но виной всему, наверное, моя невнимательность (плюс отсутствие общения с человеком и то, что он подписывается у других как milax), а не недостаток персональности в блоге.
Критика под катом
{18 комментариев}
Хабрачеловек ruskar по собственной воле и в здравом уме усложнил простой алгоритм защиты от автоматического спама, сделав название поля комментария хеш-суммой, изменяющейся через каждые два часа. При этом, естественно, учитывается, что кто-то может отправить коммент на границе «пересаливания».
Таким образом, спамерам не поможет база данных полей. Ведь можно изменить алгоритмы кодирования и уникальный ключ для хеширования.
Окончательное решение спамерского вопроса →
Конечно, от умных парсеров это не спасет, но — готовое решение для встраивания в блоговые движки.
(и не забудьте повысить карму ruskar'у)
{нет комментариев}