Хабр Курсы для всех
РЕКЛАМА
Практикум, Хекслет, SkyPro, авторские курсы — собрали всех и попросили скидки. Осталось выбрать!
Хабр доступен 24/7 благодаря поддержке друзей
Комментарии 103
Думаю sidebar с рекламной не получится убрать на мобильных девайсах. Все хотят кушать, не так ли?
И я так думаю, предлагаю автору немного изменить дизайн для мобильных устройств: блоки ( они не только с рекламой ) можно равномерно расположить между статьями (в списке).
Рекламный сайдбар вселенское зло. Лучше уж баннеры.
Очень понравилось! НЛО стоит обратить внимание.
Если пройтись по мелочам ↓
1. «Добавить пост» в ряду с личными сообщениями, трекером, настройками и т. д. Отличный кандидат в «найди лишнее» (нужно или в другое место или как-то визуально отделить, ибо не про пользовательские разделы).
2. Кнопка должна описывать действие. Глагол — часть речи, описывающая действие. Т. е. не «поиск», а, например, «найти» — глагол совершенного вида в начальной форме.
3. Время написания «06:30» (зачем показывать бесполезный с точки зрения информации нолик?). 12 августа в 6:30.
4. 12 августа в 6:30 в Устройства для гиков. Во-первых, два „в“ подряд, во-вторых, в русском языке есть падежи и склонения (пей «Кока-колу», а не пей «Кока-кола», как говорят в рекламе). Т. е. либо нужно склонять названия хабов, либо не использовать „в“.
5. Фраза выше с большим количеством хабов (или длинными названиями) становится слишком длинной. Чтобы длина была вменяемой, вы уменьшили шрифт — на планшете становится очень мелко (даже на вашем скриншоте).
6. Читать 10 минут, писать на E-mail (к слову, почему с большой буквы + не по-русски) — слишком много повелительного (а кому это нравится?). Посмотрите на тот же Medium, где 5 minutes read (5-минутное чтение).
7. 44597 просмотров (числа разбиваются на разряды — 44 597 просмотров). Плюс, имхо, кроме автора никому не нужно количество просмотров статьи (в отличие от количества комментариев). Это технический фетиш из разряда «время загрузки страницы — 132 мс».
1. «Добавить пост» в ряду с личными сообщениями, трекером, настройками и т. д. Отличный кандидат в «найди лишнее» (нужно или в другое место или как-то визуально отделить, ибо не про пользовательские разделы).
2. Кнопка должна описывать действие. Глагол — часть речи, описывающая действие. Т. е. не «поиск», а, например, «найти» — глагол совершенного вида в начальной форме.
3. Время написания «06:30» (зачем показывать бесполезный с точки зрения информации нолик?). 12 августа в 6:30.
4. 12 августа в 6:30 в Устройства для гиков. Во-первых, два „в“ подряд, во-вторых, в русском языке есть падежи и склонения (пей «Кока-колу», а не пей «Кока-кола», как говорят в рекламе). Т. е. либо нужно склонять названия хабов, либо не использовать „в“.
5. Фраза выше с большим количеством хабов (или длинными названиями) становится слишком длинной. Чтобы длина была вменяемой, вы уменьшили шрифт — на планшете становится очень мелко (даже на вашем скриншоте).
6. Читать 10 минут, писать на E-mail (к слову, почему с большой буквы + не по-русски) — слишком много повелительного (а кому это нравится?). Посмотрите на тот же Medium, где 5 minutes read (5-минутное чтение).
7. 44597 просмотров (числа разбиваются на разряды — 44 597 просмотров). Плюс, имхо, кроме автора никому не нужно количество просмотров статьи (в отличие от количества комментариев). Это технический фетиш из разряда «время загрузки страницы — 132 мс».
Использованы все основные тренды последнего времени. Совсем как в последнем детище Тематических Медиа. Надо думать, НЛО не идет на изменения сознательно. Тренды меняются, Хабр остается (:
Когда я читаю с телефона и голосую за пост или комментарий, иногда я попадаю по «минусу» вместо «плюса». Очень досадно, причем не только мне.
Прочитал комментарий — подумал «блин, да, каждый третий раз!» — потянулся в строну плюсика и… промахнулся :( Ирония такая ирония.
Так-то да, кнопки + / — и правда было бы круто бы разнести, хотя бы как для постов — через оценку комментария.
Так-то да, кнопки + / — и правда было бы круто бы разнести, хотя бы как для постов — через оценку комментария.
Я тоже, раньше, когда не мог влиять на рейтинг из-за кармы, но мог смотреть его величину, постоянно промахивался. Теперь же стал увеличивать область чтобы ткнуть точно туда, куда нужно ибо теперь могу голосовать. Хотя, очень часто просто лень ресайзить и я забиваю на оценку вообще. :)
А мне ещё всё время кажется очень нелогичным, что стрелка вверх размещена справа, а не слева от стрелки вниз.
Уберите псевдоскоп от лица.
Никогда не обращал внимание, но вот сейчас обратил и действительно, хочется стрелку вверх увидеть справа — проще нажать интуитивно
А если их поставить по разные стороны от оценки, как здесь? imageshack.us/f/208/magicalsnap201210160800.png/ (скриншот habrAjax)
Да, согласен с тем что в header'е можно играть футбол. Свободного пространства много, а меню весьма лаконично, за счет этого можно высоту шапки значительно уменьшить, <зануда>чтобы не прокручивать каждый раз лишние 100 пикселей </зануда>
Было бы хорошо если бы интерфейс физически не предоставлял возможности совершения некоторых действий пользователя, когда карма ограничивает его профиль-возможности.
А то пишешь-пишешь, а потом интерфейс сообщает тебе что и не стоило начинать.
Дизайн предложенный нравится!
А то пишешь-пишешь, а потом интерфейс сообщает тебе что и не стоило начинать.
Дизайн предложенный нравится!
Например, (я когда-то предлагал в техподдержку) скрывать панель форматирования в редакторе комментариев для юзеров с отрицательной кармой. Ну и плашку вместо редактора, если есть ограничение по времени между комментариями.
Скорее что-то вроде «с момента последнего обновления добавилось n комментариев».
Сделать виджет вертикальным, к примеру, слева от нужной ветки комментариев.
Нормально — это как?
В бурном обсуждении будет очень неудобно, особенно если комментарий влетает внезапно под мышку и кликается мимо или вообще не туда, куда хотелось. Поэтому плашки лучше.
В Disqus есть и там этот функционал реализован. Под каждым комментарием, на который отвечали, появляется строка «1 новый комментарий», ну и плашка на всю ширину для комментариев первого уровня.
Словлю, прикреплю скрин.
Словлю, прикреплю скрин.
Затем, что по-умолчанию, такой вариант меньше отвлекает. Особенно, если дискуссия бурная. В любом случае, настройки никто не отменял, можно сделать и так и так, одновременно, каждый поставит как ему удобно.
Мне было бы неудобно, я бы постарался каким-то образом выключить такую опцию. Думаю, что это удобно пока не воспользуешься.
От существующего механизма отличие в том, что явно видно, в текущей ветке активность или где-то в другой части топика.
Если я хочу написать что-то, что может озвучить кто-то до меня. то на уведомление о новом ответе не то сообщение, которое отвечаю и я, меня заинтересует и я на него нажму.
Если же пишу что-то, что не зависит от остальных комментариев (как, например, вот это), то проигнорирую и дальнейшая активность не будет мне мешать писать свой комментарий.
От существующего механизма отличие в том, что явно видно, в текущей ветке активность или где-то в другой части топика.
Если я хочу написать что-то, что может озвучить кто-то до меня. то на уведомление о новом ответе не то сообщение, которое отвечаю и я, меня заинтересует и я на него нажму.
Если же пишу что-то, что не зависит от остальных комментариев (как, например, вот это), то проигнорирую и дальнейшая активность не будет мне мешать писать свой комментарий.
Пара мелких моментов. В строке под заголовоком начинать с даты поста, возможно, не стоит. Учитывая хронологический порядок расположения топиков, её лучше убрать куда-то направо, очень быстро при просмотре кучи постов она станет шумом. То же самое со словом «читать» (но не показателем минут). Просмотры и комментарии сейчас показываются лучше, иконками вместо слов, время тоже можно с иконкой. В числах как у вас 44597 лучше делать разбивку — 44 597.
Не знаю, мне воздух вверху нравиться.
привязанным к верхней части экрана
то есть топ бар всегда будет показываться?
Вариантов несколько
— зафиксировать (скрывается, когда страница прокрутилась вниз)
— сделать плавающей (не скрывать при прокрутке)
— скрывать по таймауту после потери фокуса, но показывать, когда курсор приближаешь к верхней границе
— скрывать или показывать по клику на торчащий ярлык-закладку
Ещё надо?
— зафиксировать (скрывается, когда страница прокрутилась вниз)
— сделать плавающей (не скрывать при прокрутке)
— скрывать по таймауту после потери фокуса, но показывать, когда курсор приближаешь к верхней границе
— скрывать или показывать по клику на торчащий ярлык-закладку
Ещё надо?
Да нет, и так достаточно.
Мне нравится как сделан топ бар здесь
значок есть и до, и после прокрутки
второстепенные ссылки вместе формой поиска скрываются при прокрутке, а главные всегда наведу
Мне нравится как сделан топ бар здесь
значок есть и до, и после прокрутки
второстепенные ссылки вместе формой поиска скрываются при прокрутке, а главные всегда наведу
Да. добейте пользователей телефонов! Мало того, что в хроме кнопка отправки комментария закрывается полем ввода, так еще и меню сделайте динамическое.
Ах да — жаль что исчез значок Хабра. Какая-то бессмысленно-печальная потеря.
Может его в левый верхний угол?
(и тогда на него под ним будет указывать нынешняя стрелочка)
Может его в левый верхний угол?
(и тогда на него под ним будет указывать нынешняя стрелочка)
В целом нравится, но на мой взгляд не стоит переносить блок Хабралента на право
Да, ещё. Сейчас несмотря на новую навигацию сохраняется самый длинный путь — клик по профилю — «моё» — комментарии. А это очень легко вынести на бок. И здорово прямо туда крепить последний пост залогиненного юзера, за ним тоже часто ходить надо.
Насчет сайдбара при чтении с планшета — в точку. Каждый раз обращаю на это внимание и хочется как-то спрятать его.
<irony>Это человек с именем и внешностью, похожей на Mithgol'a</irony>
В самом деле, какая разница какую фотографию вставлять в пример шаблона?
В самом деле, какая разница какую фотографию вставлять в пример шаблона?
Гибрид Барсмонстра и Мицгола?
Ссылка в макете ведет на «Безопасность электронной почты: шифрование писем».
Кто-нибудь заметил, насколько Alexeyco разбирается в вопросе?
Моя фотография у него в комментарии существенно шире, нежели у меня в хабрахабровском профиле — стало быть, взята из другого источника.
Моя фотография у него в комментарии существенно шире, нежели у меня в хабрахабровском профиле — стало быть, взята из другого источника.
Подскажите, пожалуйста, какой шрифт использован в макете.
Учитывая что даже поддержки софта для блогов нету, и оформление больших постов легко может занять несколько часов, врядли можно на такое расчитывать…
Настройки хабра-ленты находятся далеко от кнопки самой ленты. Вы увеличили время серфинга вместо желаемого сокращения.
А я до сих пор не могу привыкнуть к красному нику автора поста. Машинально думаю, что его не существует / он удален.
Симпатично. А где подменю (захабренное-новое-отхабренное итд) в разделах? )
Я бы обратил внимание на сайдбар.
* Нет нужды иметь подчёркивания на ссылках, потому что там — весь текст — ссылки, а нессылочные элементы отличаются цветом;
* Фон сайдбара хорошо заменяется белым, особенно, если более полтный текст ссылок сам создаст необходимый контраст блоков;
* В то же время, правильно, что ссылки не чёрные, не контрастные и не отвлекают на себя основное внимание;
* Положительно, что сайдбару в проекте дизайна уделяется меньше ширины.
* Блоки типа «Популярные блоги» для постоянных пользователей становятся бесполезны — сворачивать их или убирать. То же — о работе, фрилансе и «событиях».
Такой подход к сайдбару можно увидеть на скриншотаз страниц сайта с применением юзерстилей ZenComment и юзерскрипта HabrAjax. Примерно так:
или так: imageshack.us/photo/my-images/208/hadocs20130515.png/ (текст немного побит пережатием). Или вся большая страница.
Все подобные изменения в силах поддержать юзерскрипты и юзерстили. Я более года назад бросал клич: дайте хороший дизайн, я натяну его на юзерскрипт HabrAjax, о котором в основном имеются претензии по неряшливой вёрстке. Один человек зимой сделал за 2 дня вёрстку с дизайном на Less (ссылки есть на странице скрипта HabrAjax), но больше этим не занимался. Сейчас у скрипта есть полсотни постоянных пользователей, но их могло бы в несколько раз быть больше при наличии хорошего дизайна.
Также, я интересовался вопросами дизайна очередной фичи скрипта: сделать загрузку картинок в статьи и комментарии одним перетаскиванием.
Сейчас у меня есть выработанный подход к вёрстке в юзерскриптах: не пользоваться юзерстилями, а парсить страницу и заново отрисовать её, чтобы вообще не зависеть от вёрстки сайта. Если данный дизайн автора статьи получит поддержку многих пользователей, я бы взялся переписать HabrAjax так, чтобы он мог поддерживать этот и любой другой дизайн, который мы смогли бы закодировать. Для меня требуется лишь пакет дизайнерских идей. От автора требуется принципиальная поддержка идеи и этой работы. Если коротко: сделаем?
* Нет нужды иметь подчёркивания на ссылках, потому что там — весь текст — ссылки, а нессылочные элементы отличаются цветом;
* Фон сайдбара хорошо заменяется белым, особенно, если более полтный текст ссылок сам создаст необходимый контраст блоков;
* В то же время, правильно, что ссылки не чёрные, не контрастные и не отвлекают на себя основное внимание;
* Положительно, что сайдбару в проекте дизайна уделяется меньше ширины.
* Блоки типа «Популярные блоги» для постоянных пользователей становятся бесполезны — сворачивать их или убирать. То же — о работе, фрилансе и «событиях».
Такой подход к сайдбару можно увидеть на скриншотаз страниц сайта с применением юзерстилей ZenComment и юзерскрипта HabrAjax. Примерно так:
или так: imageshack.us/photo/my-images/208/hadocs20130515.png/ (текст немного побит пережатием). Или вся большая страница. Все подобные изменения в силах поддержать юзерскрипты и юзерстили. Я более года назад бросал клич: дайте хороший дизайн, я натяну его на юзерскрипт HabrAjax, о котором в основном имеются претензии по неряшливой вёрстке. Один человек зимой сделал за 2 дня вёрстку с дизайном на Less (ссылки есть на странице скрипта HabrAjax), но больше этим не занимался. Сейчас у скрипта есть полсотни постоянных пользователей, но их могло бы в несколько раз быть больше при наличии хорошего дизайна.
Также, я интересовался вопросами дизайна очередной фичи скрипта: сделать загрузку картинок в статьи и комментарии одним перетаскиванием.
Сейчас у меня есть выработанный подход к вёрстке в юзерскриптах: не пользоваться юзерстилями, а парсить страницу и заново отрисовать её, чтобы вообще не зависеть от вёрстки сайта. Если данный дизайн автора статьи получит поддержку многих пользователей, я бы взялся переписать HabrAjax так, чтобы он мог поддерживать этот и любой другой дизайн, который мы смогли бы закодировать. Для меня требуется лишь пакет дизайнерских идей. От автора требуется принципиальная поддержка идеи и этой работы. Если коротко: сделаем?
Межстрочное расстояние в HabrAjax ужасно, одна строка налезает к другой «на голову».
Я настраивал под себя, чтобы расстояние считалось лично комфортным.
Кстати, оно разное для разных текстов (как в Хабре — не помню). Наиболее широкое — для статей — 1.31, а не 1.6, как на Хабре. У комментариев — шрифт Arial и 1.25, а у сайдбара — Arial и 1.1. Всё это тоже подбиралось по индивидуальным ощущениям. Комментарии тесноваты, но и чтение больших массивов в них — нечасто. А про сайдбары основания — как описал выше.
Дополнительное неудобство растянутого line-height в том, что при выделении видны пропуски между строками, а при клике мышью не всегда поадаешь на текст, если клик оказывается между. Там же меняется вид курсора мыши. Удобно читать ещё при 1.4-1.45. При большем интервале удобство не повышается, а увеличивается только субъективное ощущение, что много пролистал и вроде бы много воспринял. А на самом деле ведь не так, а просто много пролистал. Наоборот, контекста меньше передглазами.
Кстати, оно разное для разных текстов (как в Хабре — не помню). Наиболее широкое — для статей — 1.31, а не 1.6, как на Хабре. У комментариев — шрифт Arial и 1.25, а у сайдбара — Arial и 1.1. Всё это тоже подбиралось по индивидуальным ощущениям. Комментарии тесноваты, но и чтение больших массивов в них — нечасто. А про сайдбары основания — как описал выше.
Дополнительное неудобство растянутого line-height в том, что при выделении видны пропуски между строками, а при клике мышью не всегда поадаешь на текст, если клик оказывается между. Там же меняется вид курсора мыши. Удобно читать ещё при 1.4-1.45. При большем интервале удобство не повышается, а увеличивается только субъективное ощущение, что много пролистал и вроде бы много воспринял. А на самом деле ведь не так, а просто много пролистал. Наоборот, контекста меньше передглазами.
В таком случае можно сделать html/css-заготовку шаблона и пусть каждый пилит свой луна-парк. Можно даже сделать плагин, который в локал сторадж будет складывать все шаблоны.
Эх, мобилизирвоать бы себя и накидать красивую штуку.
Эх, мобилизирвоать бы себя и накидать красивую штуку.
Когда-то давно установил юзер скрипт от хорошего человека Inversion
Теперь пугаюсь, когда захожу с другого браузера без скрипта:
Теперь пугаюсь, когда захожу с другого браузера без скрипта:
Хороший вариант, из того что в глаза бросилось — слишком маленькая щель между основным текстом и сайдбаром.
UserCSS неудобен по причине, которую описал чуть выше в своём комментарии. Чуть меняется вёрстка сайта — стили начинают плыть, а то и не показывать новых элементов. Подход, который я хочу реализовать в новой инкарнации стилей — контроль вёрсток сайта через скрипты. Если скрипт замечает недопустимое изменение данных, которое не может прочитать, возникает кнопка отката или автоматический откат на модифицированную новую версию вёрстки сайта. В этом ключе хорошо бы сделать какой-то новый и признанный дизайн. А то вот мой дизайн в ZenComment устраивает не более 10% читателей, как это было видно из статей и опросов. Поэтому поддерживаю подход: сначала дизайн с обсуждением, потом вёрстка.
То, что будто бы было много дизайнов — не совсем так. За последний год, пока я жду появления дизайнера для Хабра, публично не было ни одного, который бы, как grokru, опубликовал проект в виде статьи.
То, что будто бы было много дизайнов — не совсем так. За последний год, пока я жду появления дизайнера для Хабра, публично не было ни одного, который бы, как grokru, опубликовал проект в виде статьи.
Они не поплывут, если юзерстили перебивают стили. Но сайт всегда может применить новые стили, переставить местами теги, сменить названия классов, добавить теги. Против таких вольностей стили бессильны, кроме случая, если они наложены на собственный HTML, который сгенерирован скриптами, а исходная вёрстка сайта просто скрыта.
А по изменениям интерфейса — и интерфейс менялся (логин был справа, логотип когда-то давно вообще внизу, помнится), и главное, раз в 1-2 года вёрстка настолько сильно менялась, что все самописные юзерстили просто валялись у всех неработающими по месяцу-два. Спросите у Inversion, например, он знает, проходил.
(А, ну что я Вам говорю, Вы же сами писали прототип Хабраякса.)
А вот использование скриптов для контроля да и вообще каких-либо серьезных изменений верстки, имхо, куда более чревато неприятными последствиями при малейших изменениях.Отвечу Вашими же словами: «на самом деле, при небольших изменениях скриптов (и естественно, при правильном написании юзерскриптов) неприятных последствий быть не должно». Ну как, кто правее стал?
А по изменениям интерфейса — и интерфейс менялся (логин был справа, логотип когда-то давно вообще внизу, помнится), и главное, раз в 1-2 года вёрстка настолько сильно менялась, что все самописные юзерстили просто валялись у всех неработающими по месяцу-два. Спросите у Inversion, например, он знает, проходил.
(А, ну что я Вам говорю, Вы же сами писали прототип Хабраякса.)
Я вижу идеальным Хабр с переключателями легкая/полная версия. В первом варианте минимум графики и акцент на тексте (без рекламы и картинок в постах сейчас как раз так), чтобы можно было нормально почитать статью. Со вторым вариантом делайте хоть какие плюшки, хоть призмочками увешайте.
Ну и конечно хотелось бы видеть не портянки ответов на комментарии, а группированные блоки. Показывать обновления ответов как на вконтакте — вполне отличная идея, только с поправкой на группировку ответов для каждого комментария.
Очень нужен адаптивный дизайн, чтобы не мучать себя постоянным зумом в rss-читалке на смартфоне. Да и в целом отойдет нужда в сторонних клиентах-обертках (привет автору, забросившему LHabr).
Что-то я реализовал в своем плагине и пока мне комфортно, но это полу-меры и хотелось бы удобного решения из коробки.
А зарабатывать, к слову, можно и без баннеров. С таким трафиком вполне доходны и более щадящие меры (привлечение в корпоративные блоги, контекст и пусть_дальше_думают_сеошники).
Ну и конечно хотелось бы видеть не портянки ответов на комментарии, а группированные блоки. Показывать обновления ответов как на вконтакте — вполне отличная идея, только с поправкой на группировку ответов для каждого комментария.
Очень нужен адаптивный дизайн, чтобы не мучать себя постоянным зумом в rss-читалке на смартфоне. Да и в целом отойдет нужда в сторонних клиентах-обертках (привет автору, забросившему LHabr).
Что-то я реализовал в своем плагине и пока мне комфортно, но это полу-меры и хотелось бы удобного решения из коробки.
А зарабатывать, к слову, можно и без баннеров. С таким трафиком вполне доходны и более щадящие меры (привлечение в корпоративные блоги, контекст и пусть_дальше_думают_сеошники).
Очень понравилось отображение инфы об авторе в вашей версии!
Хабру очень нехватает такой простой функции, как трекинг ответов на мои комментарии. Я бы хотел, чтобы если на мой комментарии где-то ответили — я бы сразу это видел. А «Трекинг» который недавно появился — это просто подписка на пост. А я не хочу на пост, я хочу «ответы мне».
Хабру очень нехватает такой простой функции, как трекинг ответов на мои комментарии. Я бы хотел, чтобы если на мой комментарии где-то ответили — я бы сразу это видел. А «Трекинг» который недавно появился — это просто подписка на пост. А я не хочу на пост, я хочу «ответы мне».
Хорошая работа
Главная ошибка адаптивного дизайна — адаптивный дизайн. Не надо мне упрощать страницу, я сижу не через GRPS, мой смартфон может это отрендерить, мобильные браузеры прекрасно умеют переносить фокус на основной блок с текстом.
Классная работа! Особенно понравилось краткое инфо о том, кто написал статью :)
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Удобный интерфейс Хабра? #2