company_banner

Редизайн Хабрахабра и Гиктаймс. Финишная прямая

    Предлагаем вашему вниманию очередную публикацию про редизайн Хабрахабра и Гиктаймс. Наверняка уже кто-то подумал про себя: «Хм, они там как плитку в Москве что ль перекладывают — уже третья или четвёртая публикация про редизайн, а сайт каким был, таким и остался?!» и будет частично прав: сложно «поменять плитку» сразу на всём сайте, поэтому мы решили делать это небольшими итерациями. Чтобы вы успели привыкнуть, а мы — вовремя отреагировать на ваш фидбек.



    Сегодня поговорим про финишную и, пожалуй, ключевую итерацию: редизайн ленты, публикаций и комментариев. Волнуемся!

    Лента


    Мы обновили вид «докатной» части публикации, и как следствие, поменялась вся лента в целом.

    Работа над этой частью редизайна чем-то напоминает игру «пятнашки»: у каждой публикации есть с десяток обязательных элементов (заголовок, автор, дата, поток, хабы и/или блог компании, метрики, флажки, несколько админских кнопок) и относительно немного места для манёвра. При каждой попытке вмешательства в этот фрагмент сайта приходится хорошенько взвешивать все «за» и «против»: какой элемент должен быть на первом месте, какой на втором, на третьем и т.д. Брейншторм выглядел примерно так:

    — По идее, самым первым должен быть заголовок, после прочтения которого пользователь понимает, о чём будет дальше идти речь и принимает решение, читать дальше или нет.
    — Хм, а если заголовок непонятный, например, «Вспомнить всё» — он то ли про бэкапы, то ли про развитие памяти — может быть тогда сначала выводить перечень хабов, чтобы по ним пользователь мог понять, из какой области публикация?
    — А может быть выводить сначала никнейм пользователя, ведь есть немало авторов, статьи которых читают, не глядя на заголовки?
    — Так, а что если в публикацию пришли из поиска — ведь тогда надо понять, свежая она или старая?
    — Ещё надо бы дать читателям понять, что статья из корпоративного блога и в ней может быть материал в том числе рекламного характера.
    — А может быть пользователи вообще стали смотреть сначала на рейтинг публикации и, если он высокий, автоматом залезать под кат?

    В общем, вопросов было больше, чем ответов. Ситуация усложняется тем, что текст до ката может быть большим (ещё и с картинкой) и часть информации может просто не влезть на экран.

    Прокручивая различные сценарии и варианты, глядя на сотни материалов, мы пересобрали отображение публикации в ленте, поменяв расположение некоторых привычных элементов. Вот как было:







    И как стало:







    Раз над заголовкам уже размещалась дата, то почему бы не попробовать вставить информацию об авторе? Тогда и снизу место освободится. Попробовали, померяли — всё влезает, даже ещё остаётся место для указания потока, который убрали из заголовка публикации. Местоположение флажков («Перевод», «Из песочницы», «Recovery mode», «Tutorial» и т.д.) постоянно зависело от длины заголовка, вплоть до нелепых переносов (особенно если флажков сразу несколько). Теперь же они не оттягивают на себя внимания, но аккуратно расположились в один ряд, будто являясь границей между «системной информацией» и началом публикации.

    Было:







    Стало:







    Говоря проще, мы постарались максимально безболезненно освежить и перегруппировать все основные компоненты превью публикации в ленте, не нанеся ущерб старому опыту и паттернам поведения пользователей (ну то есть всему тому, что принято называть user experience).

    Страница публикации


    Прошлась волшебная палочка и по тому, что находится под катом:

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

    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;

    Увеличили кегль шрифта. Не потому, что у нас появились проблемы со зрением, а потому, что сейчас это вполне правильный тренд современной веб-типографики, да и многие из вас не раз жаловались на мелкий шрифт. Даже не столько жаловались, сколько периодически писали в комментариях, что читают сайт на +110%.

    Причесали заголовки. Раньше на «Хабре» заголовки были «жидкими» (без веса), поэтому многие пользователи частенько добавляли болда для придания заголовку того веса, который должен быть. Теперь это в прошлом, заголовки стали заголовками. Кстати, вместе с этим мы избавились от заголовков H1 — теперь он используется только в заголовке публикации, поэтому основными станут H2 и H3.

    — Переосмыслили другие компоненты публикации, такие как спойлер, цитирование, маркированные и нумерованные списки (они стали более разряженными), тег source (появилось обрамление), теги abbr/sub/sup и тд. Цитирование было таким:



    А стало таким:



    — Причесали голосования. Часто голосования сливались с основным текстом, иногда было неудобно считывать результаты. Было так:







    А стал кингсайз:







    Пересобрали блоки в конце публикации:

    • Блок с метриками и системными кнопками: редактирование, жалоба, секретная фича;
    • Блок с информацией об авторе публикации: теперь полноценно умещаются описание профиля, контактная информация; наконец-то появились крупные стрелки голосования за карму;
    • Если публикация из корпоративного блога, то информация о компании гармонично и ненавязчиво «прилипает» к информации об авторе:



    Стало:






    Комментарии


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

    Ну и так, «по мелочи» — перерисовали форму написания комментария, а также все иконки, немного «разрядили» пространство вокруг самих комментариев. Было:







    Стало:







    Старая форма написания комментария:







    И новая:







    Кстати, как показал наш внутренний опрос, многие не знают о двух функциях комментариев:

    Можно посмотреть, к какому комментарию написан тот или иной комментарий (а потом от него вернуться обратно).

    Для удобства чтения можно оставить лишь одну ветку, скрыв всё остальное.

    Продолжение следует


    Обладающие опытом работы с крупными проектами не понаслышке знают, чего стоят любые перемены и к чему они иной раз приводят. Нам же предстояло действовать ещё более осторожно, поскольку на сайте опубликованы тысячи публикаций и комментариев, многие из которых будут актуальны спустя годы. Важно было сохранить этот ценный багаж без повреждений — в том числе поэтому некоторые наши изменения кажутся несколько компромиссными.

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

    P.S. В ближайшее время мы ещё повозимся с «плиткой»: нужно улучшить работу с формами (в настройках профиля и т.д.) и полностью обновить мобильную версию. Не переключайте!
    Метки:
    ТechMedia 181,42
    Создаем и развиваем сервисы для гиков
    Поделиться публикацией
    Реклама помогает поддерживать и развивать наши сервисы

    Подробнее
    Реклама
    Похожие публикации
    Комментарии 589
    • +2

      То-то я смотрю у меня все кастомные стили StyleBot сломались

      • 0
        У меня только для стиль для КПВ 50%-ой ширины поломался. Стиль для 100%-ой ширины перепроверю, но он вроде не поломался.
      • –7
        Все здорово, но умоляю — сделайте шрифт побольше! Уже несколько лет читаю хабр в 150% зуме. Ваш ресурс и дизайн хуже от этого не станет.
        • 0
          Причесали голосования

          Dear habr, можно пожалуйста сделать так чтобы «незалогинненым» пользователям показывались результаты вместо выбора вариантов?
          А то никакой логики…
          • +1
            Нельзя. Иначе результаты голосования будут видны сразу всем, что не есть гуд.
            • +1
              Почему сразу всем? Только незалогиненным пользователям же.
              Если вы про то что можно будет разлогиниться и подсмотреть — лично я не вижу в этом ничего плохого и думаю большинство так делать не будет.
              • 0
                Бытует мнение, что если видишь результаты голосования, то это влияет на выбор. Так, например, частенько слетает карма у людей, или рейтинг у комментария/вопроса, если есть несколько минусов.

                Не удивлюсь, если все эти плюсики-минусики совсем уберут и будут показывать только в конце.

                Мне бы хотелось видеть результаты голосования до того времени, как опросник протухнет, потому что к однажды прочитанной статье я могу больше не вернуться, а голосовать мне нечем, если я в этой теме не варюсь.
                • –1
                  Кстати, очень интересная идея — полностью скрыть карму из профиля, что бы она была доступна только самому пользователю и никому больше.
                  • +1

                    Нет, не интересная.
                    Для невыносимо страдающих от кармы есть фейсбуки и твитторы с лайками и смайликами.

                  • 0
                    Если вы не хотите голосовать, а хотите просто посмотреть результат — такая возможность есть. Достаточно ткнуть по тире, которое отображается вместо результатов голосования.
                    • –1
                      Ого, спасибо! Не знал.
                      Никогда не замечал это «тире». Пока не могу найти поста с голосованием чтобы проверить.

                      В таком случае, раз это можно все-равно всегда посмотреть — почему не показывать результаты голосования незалогинненым пользователям по умолчанию? Ведь показывать им только варианты с припиской «Только зарегистрированные могут голосовать» — бессмысленно.
                      • 0
                        После того как посмотришь — голосовать уже нельзя.
                        • 0
                          Недавно же убрали тире, теперь рейтинг всегда показывается.
                          • 0
                            Хмм, ну тогда не понимаю чем это отличается от пункта «Воздержаться» и зачем это тире в принципе тогда нужно.

                            Оу, не обновил до появления комментария выше. Теперь понял что тире больше нет. Туда и дорога :)
                            • 0
                              Вы немного про разные вещи, кажется, разговариваете сейчас. Один про голосовалки, внедрённые в статьи (которых может и не быть, и у которых просмотр доступен только после «Воздержаться»), другой — про голосования за рейтинг статьи (который раньше нельзя было посмотреть, не поставив оценку или не тыкнув по тире, и который теперь показывается всем сразу, как оценки у комментариев).
            • +1

              Баг: некоторые ссылки в шапке не закрыты, например тут https://geektimes.ru/post/72427/

            • +32
              И вас покусала windows 10. Печально.
              • +45
                Я называю это дизайном не для людей, а для свиборгов, у которых глаза как у рыбы — по разную сторону головы.
                У всего огромные отступы, все такое большое, неконтрастное, невзрачное.

                Было:
                image

                Стало:
                image

                Что такое «Go»? Если не знать, что на этом месте должны быть хабы, то совсем не очевидно, что это такое. В старом дизайне был значок портфеля, если человеку, первый раз зашедшему на сайт, не сразу будет понятно, что это такое конкретно, то по уменьшенному серому шрифту и значку он поймет, что это еще не тело статьи.
                Флаеры из контрастных превратились в скучные, неприметные письки.

                Даже не столько жаловались, сколько периодически писали в комментариях, что читают сайт на +110%.
                Ну спасибо, придется читать его на 90% теперь.

                Радуют только контрастные заголовки. Они действительно стали заметнее.
                • +12
                  Такое ощущение, что я теперь на постоянном зуме +20-30%. И это очень сильно портит читабельность различных элементов вроде рейтинга, стрелочек, ников и разной «технической информации». Тут нужно как минимум увеличить и цифры рейтинга, и стрелочки констрастнее делать, и плашки ник-дата-ссылка-избранное как-то выделять из текста. Пока такое ощущение, что дизайн смаштабировали и он разъехался.

                  И шрифты. Они просто У Ж А С Н Ы. Пытка какая-то.
                  • +17
                    И шрифты. Они просто У Ж А С Н Ы. Пытка какая-то.

                    Почти уверен, что чуваки их вообще не тестировали — посмотрели как это выглядит на своих маках с HiDPI и пустили в релиз.
                    • +7

                      у меня мак, и все равно выглядит не очень


                      везде паддинги, даже у textarea для набора коммента, теперь пока до конца страницы долистаешь — палец устанет

                      • +2
                        Кстати да, набираешь новый комментарий и впечатление, что он начинается с табуляции.
                      • 0
                        На Windows с HiDPI, кстати, выглядит весьма приятно.
                        • +2
                          Проблема в основном у пользователей с браузерами от MS, на скриншоте данные по хабру за последние 30 дней, десктоп-пользователи. Мы эту проблему признаем, сожалеем и сегодня выпустим обновление.

                          • 0
                            В Хроме у меня тоже вчера вытекали глаза.
                            Под виндой есть большая проблема со сглаживанием шрифтов на мониторах без HiDPI и некоторые гарнитуры её усугубляют.
                            • 0

                              Проблема в цвете шрифта — толи недостаточно контрастно, толи слишком контрастно — режет глаза.

                              • 0

                                Да, если сделать темнее фон — становится лучше.

                            • +2
                              Шрифты ужасны до полной нечитабельности. Я может смогу читать на 90% зума, но это не исправит интерлиньяж.

                              Откуда такое соотношение font-size / line-height и отступы между абзацами? И то, и другое прерывает нормальный поток чтения.
                          • +3
                            Тут видна концептуальная проблема.
                            Есть вот «потоки», есть «хабы», есть эти (бывшие) флажки непонятные, есть ещё «метки» в самих статьях. Какой-то слишком большой набор пересекающихся сущностей для категоризации, которые при каждом редесигне пытаются совать в разные места, а на деле надо упорядочивать саму концепцию и иерархию этих фитюлек сначала, как мне кажется.

                            Отдельный маразм, конечно, когда на одной фитюльке по-русски «Перевод», а на второй по-английски «Tutorial». Даже в этом бардак.
                        • +6
                          Какой хороший редизаин. Если бы не статья, я бы его и не заметил.
                          • +5
                            Глупости, как открыл хабр — сразу понял что опять начудили с дизайном.
                          • +25
                            А стрелочки разнести по разным сторонам от комментария, насколько я помню, просили еще лет 10 тому назад… я таки дождался этого знаменательного события :)
                            • 0
                              Лично я давно исправил этот баг при помощи пользовательских стилей.
                            • +48
                              Пока читал, постоянно путался при виде скриншотов, думая, что это элементы и их можно потыкать.
                              • +7

                                Я на секунду подумал, что статья в блоге яндекса.


                                ПС сломалась клавиатурная навигация

                                • 0
                                  vanga mode: У вас не retina экран, ибо картинки мыло сплошное. Спутать с интерфейсом невозможно.
                                  • 0
                                    Надо было добавить скринам теней, это позволяет отделить скрины от элементов интерфейса.
                                  • +22
                                    А почему убрали иконку портфеля? Мне казалось, так удобно, сразу видно, что это хабы, а не теги какие-нибудь. И для тегов вместо картинки теперь текст. А в целом очень классный дизайн!

                                    image
                                    • +16
                                      — Здравствуйте, мы из компании Samsonite и хотели бы забрендировать ваш чемодан у хабов под нашу продукцию.
                                      — Здравствуйте! Мы такое не делаем.
                                      — Жаль. Ладно, всё равно будем думать, что это наш чемодан в каждой статье…
                                      — Не будете
                                      • 0

                                        Поддержу! Верните иконку портфеля :)

                                      • +2
                                        Спасибо, что показали, что у меня не разу в жизни на дефолтных windows (не на firefox, не на chrome), не отображается шрифты так как вы задумали.
                                        • 0

                                          Да, кстати, кто скажет как сделать шрифт такой же, какой показан на скриншотах "как стало"?


                                          А то как-то в Хроме (Win 10) оно совсем не так смотрится.

                                          • +3

                                            В CSS написано


                                            font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto", ... // и т.п.

                                            в общем, первым идет системный шрифт Apple, скриншоты видимо тоже делались на Маке.


                                            Так что, как ни крути, но такие же точно шрифты в Windows не завезти.

                                            • +24
                                              Вот лучше бы шрифты не трогали — от этого уже глаза болят.
                                              • +1
                                                Courage, блин.
                                                • –5

                                                  Шрифты на Виндоусе — это та еще боль, к сожалению. Тоже постоянно с этим сталкиваемся.

                                                  • 0

                                                    Кто-то подумал, что я отвечаю от лица Хабра, видимо)

                                          • +20
                                            1. Дата и время — это важно. Имя автора — это не важно. Но у вас теперь сначала имя автора, а уже потом — дата и время. Зачем? Мне одному кажется, что имя автора, как и плюсы-минусы, должны идти в самом конце, чтобы у человека возникало непредвзятое впечатление хотя бы в самом начале?
                                            2. Поток — это важно. Это как раз то, что позволяет предположить, про бэкапы «Вспомнить всё» или про ретро-компьютеры в фильмах девяностых. Связка «Поток — Название» была разумной. Сейчас поток засунут в конец одной строки, маленькими буквами, а потом уже стоит одно название. Зачем?

                                            Это я ещё дальше первого примера не дочитал, сразу захотелось высказаться.

                                            Серьёзно, ребята, вы видели хотя бы один редизайн, когда пользователям он бы сразу понравился? Вообще, зачем делать редизайн, если и так всё работает? Это, конечно, риторический вопрос, я понимаю, что дизайнеры тоже хотят кушать. Но, может, всё-таки разносить это дело на новые и старые стили? Пусть те, кому не нравится новый дизайн, сидят на старом — и дизайнеры сыты, и юзеры целы.
                                            • +15
                                              > Имя автора — это не важно.
                                              А если Alizar ;)? Тут нужно быть заранее предвзятым.
                                              • +20
                                                Его узнают по заголовку.
                                              • +2
                                                Укажите пожалуйста успешные варианты поддержки новых и старых дизайнов на сайтах
                                                • 0
                                                  Вы таки не поверите, но, например, в ЖЖ когда-то ввели новую, модную ленту. Уж не знаю, сколько человек ей пользуется, но старый вид до сих пор существует. Это я уж не говорю о том, сколько с тех пор там поменялось дизайнов интерфейса, а у меня до сих пор стоит не поддерживаемый уже лет 5 минимум вариант, который даже выбрать больше нельзя. Однако ж работает.
                                                  • 0
                                                    Тогда всеобщего счастья нельзя добиться, общество становится расколотым и вольно думающим.
                                                    • +1
                                                      Дайте им хоть один дизайн нормально сделать, а то будет два косячно-работающих.
                                                  • +1
                                                    GitLab
                                                    • 0

                                                      youtube


                                                      ЗЫ: По новому дизайну, на Win 10 x64 шрифты ужасны :(

                                                    • 0

                                                      В таких проектах админский подход «работает — не трожь» не подходит. Всё-таки сайт с огромной аудиторией это суть живой организм и эволюция неизбежна)

                                                    • +51
                                                      В новом дизайне при наведении на комментарий не появляются точки слева от него, указывающие на вложенность. Удобная была фича.
                                                      • +4

                                                        Поправим, потеряли.

                                                        • 0

                                                          После добавлении ответа при наведении на ник не появляется информация о пользователе. Я даже вам баг-репорт писал на эту тему) И еще. Сделайте пожалуйста отправку комментария по Ctrl/Cmd + Enter, оч прошу :)

                                                          • +1
                                                            Попап с информацией о пользователе поправили. Хоткеи на подходе :)
                                                            • 0
                                                              Boomburum А можно поправить логику хоткеев «J» «K» для тех кто вырезает с помощью CSS или uBlock ненужные им блоки. К примеру на странице список статей. Я вырезал какую то компанию или к примеру блок «Мегапосты». Затем как только я с помощью хоткеев дохожу до вырезанного блока, то начинаются скачки вниз страницы или чего похуже. Можно сделать так, чтобы вырезанный блок перескакивался хоткеем или просто не замечался?
                                                              • 0
                                                                Мы точно починим хоткеи для штатных функций сайта (листание постов, каментов, подписки и т.д.), но не обещаю насчёт полной поддержки сторонних расширений.
                                                                • 0
                                                                  Спасибо Boomburum что принимаете во внимание. Вроде уже прогресс. Со Stylish работает. А вот с uBlock на таком коде заваливается:

                                                                  ! Вырезали компанию
                                                                  habrahabr.ru##:xpath(.//a[contains(@href,'https://habrahabr.ru/company/pentestit/')]//ancestor::li[1])

                                                                  ! Мегапосты
                                                                  habrahabr.ru##:xpath(.//a[contains(@href,'https://tmtm.ru/megapost')]//ancestor::li[1])

                                                                  • 0
                                                                    А вот если оставить заголовок li, а убрать ниже стоящий article, то кажись работает.

                                                                    habrahabr.ru##:xpath(.//a[contains(@href,'https://habrahabr.ru/company/pentestit/')]//ancestor::article[1])
                                                              • 0

                                                                Только с галочкой соответствующей. А то я иногда теряюсь в догадках. то ли я щас перенос строки кода сделаю, то ли неготовый комментарий отправлю

                                                            • +5

                                                              Это мы вернем, потерялось странным образом.

                                                              • +2

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

                                                                • +22
                                                                  Вечно виновная девочка добралась до ТМ...
                                                              • +1
                                                                Насколько я помню, непрочитанные комментарии автора статьи раньше помечались как непрочитанные (голубым в заголовке), а теперь помечаются так же, как все комментарии автора статьи (зелёным). Т.е. теперь не видно, что они не прочитанные. Это специально сделано?

                                                                И ещё, раньше перемещение к первому непрочитанному сообщению было плавным, а теперь как-то рывком (Firefox Windows).
                                                              • 0
                                                                проверка
                                                                https://habrahabr.ru/company/tm/blog/335642/
                                                                • +11
                                                                  Проверка не пройдена.

                                                                  Ссылки все еще не парсятся и не распознаются автоматически. Такого простого и привычного функционала — нет до сих пор. А значит все будут по привычке копипастить ссылки без оборачивания их тегами, потому что так привыкли и лень, а читатели будут возиться с «выделить-скопировать-вставить-перейти», особенно это «приятно» на смартах и планшетах.

                                                                  Я стараюсь оборачивать ссылки тегами, даже на смарте, хоть это тот еще гимор, но похоже — перестану заморачиваться. Пусть все мучаются одинаково, чем я хуже?

                                                                  ___
                                                                  При переключении между полем ввода комментария и кнопками Предпросмотр-Отправить — пропала рамка выделения фокуса, нажал на Таб и не понимаешь — на какой кнопке фокус.
                                                                  • +2

                                                                    Метод научного тыка подсказывает, что при включенном Markdown автораспознавание ссылок присутствует

                                                                    • +2
                                                                      А почему это не работает в привычном для многих html? Я умею верстать и стандартные теги меня устраивают, а это md для меня категорически непонятен — никогда им не пользовался и не планирую.

                                                                      Судя по количеству некликабельных ссылок в комментариях — не только я предпочитаю html.
                                                                      • +2
                                                                        Причем раньше все работало корректно, сломали с введением markdown.
                                                                        • –13
                                                                          Откуда вообще этот md взялся? Хабр — первый ресурс, где я его вижу.
                                                                          • +7
                                                                            На Github, Vanillaforums, Slack есть поддержка Markdown. Люди просили поддержку, ее сделали.
                                                                            • +1
                                                                              wiki-like
                                                                              stackoverflow
                                                                              • 0

                                                                                Пришлось учиться md. Только в нём есть id на заголовках.

                                                                                • +1
                                                                                  Хм… А зачем это надо?
                                                                                  • 0
                                                                                    Для создания оглавления с ссылками на главы статьи.
                                                                                    • 0
                                                                                      В html это запросто решается с помощью label, я пробовал — у меня все получилось, работает даже в комментариях.
                                                                                      • 0

                                                                                        А можно пример а то я не совсем понял как?

                                                                                        • +1
                                                                                          В тексте публикации я ставлю якорь:
                                                                                          <anchor>dervish</anchor>
                                                                                          А потом делаю ссылку на него:
                                                                                          <a href="#dervish">
                                                                                          Ссылка выглядит — как обычная ссылка, можно добавить ей любой текст, который будет подсвечен. Я даже в комментарии эту ссылку указывал — и она кидала на то место в статье, где стоит якорь. Все это есть в хелпе к редактору статей.
                                                                                          • 0

                                                                                            Кстати, я как‐то наткнулся на подобную ссылку на главной, она не работала, а вела на главную (т.е. для списка публикаций с ссылками на раздел до ката, ссылки на раздел не переделывались из #link во что‐нибудь вроде /company/tm/blog/335642/#link). Не знаю, поправили ли.

                                                                                            • 0
                                                                                              Просто надо указывать абсолютную ссылку — habrahabr.ru/p/ID_поста/#link (где вместо p может быть алиас компании или ещё что-то, но привязка всё равно к айдишнику) — тогда можно сослаться на якорь внутри поста даже из докатной части в ленте.
                                                                                              • 0

                                                                                                Что не очень удобно, требует знания собственно ID (т.е. придётся заменять после отправления на хабр) и вообще, зачем напрягать авторов, если такую замену можно сделать автоматически на сервере?

                                                                                      • +1
                                                                                        А чем вас не не устраивают якоря?
                                                                                        • +2

                                                                                          Всем устраивают только никак не получалось их сделать.

                                                                                  • +3

                                                                                    Это вы зря. Мне вообще в многословном html писать ничего не хочется.

                                                                                    • +2

                                                                                      В markdown ширину картинок нельзя менять, что печально.

                                                                                  • +2
                                                                                    Да и сам markdown работает парсится через пень-колоду.
                                                                                    Репорты отсылать бессмысленно, читает только робот.
                                                                                    • +1

                                                                                      Полностью согласен. Внедряют сомнительные дизайнерские новшества вместо фиксов Markdown, вот сколько их уже: https://github.com/limonte/dear-habr/issues?q=is%3Aissue+is%3Aopen+label%3Amarkdown

                                                                                      • +1
                                                                                        Можно шестой добавить: некорректно обрабатывает вложенное цитирование.
                                                                                        Еще какой-то баг всплывал, но память дырявая и заявки в «обратной связи» не прочтешь.

                                                                                        > This is the first level of quoting.
                                                                                        >
                                                                                        > > This is nested blockquote.
                                                                                        >
                                                                                        > Back to the first level.
                                                                                        
                                                                                        > This is the first level of quoting.
                                                                                        >
                                                                                        > > This is nested blockquote.
                                                                                        >
                                                                                        > Back to the first level.
                                                                              • 0
                                                                                В качестве костыля посоветую юзерскрипт, который будет делать из текстовых ссылок кликабельные. Конечно, каждому пользователю придётся устанавливать его в браузер на каждом своём устройстве…
                                                                                • 0
                                                                                  Я за десктопным браузером только на работе, дома практически все время со смарта, так что этот костыль мне не поможет :(
                                                                                  • 0
                                                                                    На смартфонах тоже можно использовать юзерскрипты. Например, для мобильного Firefox есть дополнения Tampermonkey, Violentmonkey и USI, каждое из которых позволяет использовать юзерскрипты. Хотя, со скриптами, заточенными под особенности Greasemonkey, могут быть проблемы, да и в целом эти дополнения ещё не так «вылизаны» как Greasemonkey (но последний для мобильных браузеров отсутствует, увы).
                                                                                    • +1
                                                                                      Я не смог заставить себя пользоваться мобильным Фоксом, с Оперой ничего пока не может сравниться.
                                                                                • +1

                                                                                  Всегда вставлял ссылку с помощью кнопочки "вставить ссылку". Не знаю, может это я такой ретроград, зато гарантированно не ломается из-за недостаточно умных парсеров, которые не смогли распарсить урл со всеми запятыми, хэштегами и прочими знаками. Попробуйте какой-нибудь урл от яндекс.маркета в режиме сравнения передать — большая часть "парсеров ссылок" на нем сдыхает, чаще всего — вконтактовский.

                                                                                  • +1
                                                                                    Пофиксили, теперь распознаются. Извините за неудобства.
                                                                                    • +2
                                                                                      Тест
                                                                                      habrahabr.ru/company/tm/blog/335642/#first_unread

                                                                                      upd
                                                                                      РАБОТАИТ!!! Несколько лет этого ждал! Спасибо!!!

                                                                                      upd
                                                                                      Таки на кнопках Предпросмотр-Ответить — нет внешнего признака фокуса при переключении по ним Табом, весьма неудобно.
                                                                                • +30
                                                                                  Шрифты! Мои глаза! За что?!
                                                                                  *я всего-лишь минуту назад в другом топике комменты обновил и увидел, как ленту «порвало» собрался писать баг-репорт, сделал скрин. Но вдруг холодок пробежал по пятой точке: «неужели редизайн, опять»? Полез в ленту — да, это опять редизайн…
                                                                                  • +4
                                                                                    Я тоже увидел "ЭТИ ЧУДО ШРИФТЫ" после отправки комментария. Подумал CSS разъехался… а нет — редизайн.
                                                                                    • 0
                                                                                      Я пофиксил пользовательскими стилями
                                                                                      @namespace url(http://www.w3.org/1999/xhtml);
                                                                                      
                                                                                      @-moz-document domain("habrahabr.ru"), domain("geektimes.ru") {
                                                                                      	body {
                                                                                      		font-family: sans-serif;
                                                                                      	}
                                                                                      }

                                                                                      Впрочем это черновой вариант, тут ещё фиксить и фиксить.
                                                                                    • +3
                                                                                      к офтальмологу за Вами буду
                                                                                    • 0
                                                                                      Меня больше всего кумарит, когда из-за разных размеров картинки и докатового текста получается разная длина между статьями. Сделайте один обязательный стандарт, плиз…
                                                                                      Могу даже предложить — картинка на пол ширины ленты, а место справа от нее занимает докатовый текст. Причем текст по высоте равен высоте картинки. Будет очень красиво — плотно и единообразно.

                                                                                      И еще — сделайте, пожалуйста, прыжки табуляцией по новым непрочитанным сообщениям, а Shift+Tab или Ctrl+Tab — по всем своим.
                                                                                      • 0
                                                                                        А-а… увидел изменения )) Спасибо! Тогда остается только предложение прыгать еще и по свои сообщениям.
                                                                                      • +2
                                                                                        В трекере, при нажатии на заголовок статьи — автоматом кидало к первому не прочтенному комментарию. Теперь выбрасывает к заголовку и надо руками тыкать на кнопку счетчика новых постов справа.
                                                                                        • +10
                                                                                          Пожалуйста верните точки, которые характеризуют уровень вложенности ветки комментария. Учитывая, что на широких экранах левая часть экрана — огромная белая пустота, то невозможно быстро понять после кучи разных веток, на какую теперь был ответ:

                                                                                          --.
                                                                                          ----.
                                                                                          ------.
                                                                                          -----.
                                                                                          ------.
                                                                                          ----.
                                                                                          --ответ на 2ю ветку (сложноотличим от первого комментария).
                                                                                          -новый комментарий без ветки


                                                                                          Нажимать постоянно скрыть/раскрыть ветку нехочется
                                                                                          • +1
                                                                                            Это баг, вернём точки.
                                                                                            • 0
                                                                                              Значит, автоматического парсинга ссылок не ждать?..
                                                                                              • +1

                                                                                                Это тоже пофиксим.

                                                                                                • 0
                                                                                                  Вот это было бы офигенно удобно!
                                                                                                  Еще бы вернуть подсветку кнопок в таб-ордере, а шрифты и стили все равно каждый сам колбасит через плагины.
                                                                                                  • 0
                                                                                                    К слову.
                                                                                                    Похоже что таб-ордер вообще пропал. Нельзя из формы камента перейти двумя табами на отправить и нажать ее пробелом.

                                                                                                    upd
                                                                                                    А нет — работает, но такое впечатление, что только на хабре, на гт тупит.
                                                                                          • +3
                                                                                            Верните старый дизайн. Очень плохо читать стало.
                                                                                            Сделали как вконтакте в прошлом году.
                                                                                            • 0
                                                                                              Теперь бы еще разнести «Ответить» и «Пожаловаться»
                                                                                              • +7
                                                                                                Шрифт в комментах мелковат, за что вы так с нашими глазами?
                                                                                                16px еще бы куда ни шло…

                                                                                                Отвалилась отправка комментария по Ctrl+Enter.
                                                                                                • +6
                                                                                                  Ладно кегль статьи, но комментарии теперь читать неудобно. Кегль меньше и не совпадает со статьёй. Приходиться щуриться.
                                                                                                  • 0
                                                                                                    У меня под Debian 8 вообще какой-то ад с текстом. :(
                                                                                                    • +4
                                                                                                      У меня под Ubuntu 16.04 шрифт комментариев и статьи стал настолько жирным, что с них жир на футер капает.
                                                                                                      • +1
                                                                                                        Похоже жир вытек — шрифты нормализовались.
                                                                                                    • +5
                                                                                                      Зачем вам буквы читать? Любуйтесь отступами, смотрите, сколько отступов завезли!
                                                                                                    • +3
                                                                                                      Некоторые элементы стали крупнее, это круто. Об остальном —
                                                                                                      под спойлером
                                                                                                      Нельзя просто так взять и сделать было/стало в одной картинке с горизонтальным сравнением. Ведь скролить туда-сюда в попытках поймать изменения шрифта на кегль — так удобно

                                                                                                      • +14
                                                                                                        Кстати спойлер раньше же выделялся? А то сейчас раскрыл его и не понятно, где он заканчивается.
                                                                                                        • 0
                                                                                                          Было бы еще здорово если бы спойлер пометили как кликабельный элемент. Использую в браузере плагин для эмуляции вима, но по спойлерам приходится курсором кликать.
                                                                                                          • +2

                                                                                                            Лично у меня спойлер еле-еле разъезжается, Как будто CPU загружен на 100% и кадры пропадают. У кого-нибудь тоже так?

                                                                                                            • 0
                                                                                                              Кстати да, чрезвычайно медленная и дерганная анимация выходит. Интересно — почему?
                                                                                                              • 0
                                                                                                                Да ещё и при попытке зумить браузер на пару замирает.
                                                                                                            • +4
                                                                                                              «Верните старый дизайн» от создателей «Верните стену» от создателей «Раньше было лучше»…
                                                                                                              • +6
                                                                                                                Сделайте, пожалуйста, вверху страницы ссылку «Перейти к комментариям». Кейс: я уже прочитал статью в RSS-ридере и теперь меня не интересует ее полный текст, хочу посмотреть комментарии. Сейчас в таком случае открываю статью в браузере и долго мотаю вниз через уже прочитанное. А хочется открыть, кликнуть и сразу оказаться на комментариях.
                                                                                                                • +5
                                                                                                                  Как по мне, менять звездочку на флажок было не обязательно, а в целом все очень даже хорошоэ
                                                                                                                  • +5

                                                                                                                    Мне нравится идея с системными шрифтами, но вот segoe в windows — ужасный шрифт (и fira sans туда же). Слишком тонкий.

                                                                                                                    • 0
                                                                                                                      — Новые шрифты. Как и на многих ресурсах, шрифты на сайте подгружаются в зависимости от операционной системы пользователя:

                                                                                                                      А какой шрифт был раньше по умолчанию?
                                                                                                                      • +1

                                                                                                                        Да, очень хотелось бы список старых шрифтов, чтобы можно было хотя бы user style сделать.

                                                                                                                        • +4

                                                                                                                          Пока что такой юзерстиль получается:


                                                                                                                          Заголовок спойлера
                                                                                                                          :root {
                                                                                                                            --fontMain: Verdana, sans-serif;
                                                                                                                            --fontComments: Arial, sans-serif;
                                                                                                                            --colorText: #000;
                                                                                                                          }
                                                                                                                          
                                                                                                                          .comment__message, .comment-form__preview {
                                                                                                                            font-size: 14px;
                                                                                                                            font-family: var(--fontComments);
                                                                                                                            line-height: 140%;
                                                                                                                          }
                                                                                                                          
                                                                                                                          .post__text {
                                                                                                                            font-size: 14px;
                                                                                                                            line-height: 160%;
                                                                                                                            font-family: var(--fontMain);
                                                                                                                          }
                                                                                                                          
                                                                                                                          body,
                                                                                                                          .post__text-html,
                                                                                                                          .post-info__title,
                                                                                                                          .post__text,
                                                                                                                          .comment__message, .comment-form__preview {
                                                                                                                            color: var(--colorText);
                                                                                                                          }
                                                                                                                          
                                                                                                                          body {
                                                                                                                            font-family: var(--fontMain);
                                                                                                                          }
                                                                                                                        • +3

                                                                                                                          Посмотреть старый дизайн можно через веб-архив и аналоги. Пример поста.


                                                                                                                          Раньше основной шрифт текста был Verdana, sans-serif. Но для комментов использовался Arial, sans-serif. Так же нужно скорректировать размер, цвет (сейчас слишком бледный, а раньше #000).

                                                                                                                          • 0

                                                                                                                            Verdana

                                                                                                                          • 0
                                                                                                                            Ну и, чтобы совсем нельзя было оторваться )), можно сделать вкл/выкл автоматическую подгрузку новых сообщений с отображением их числа в хвостике-шапке вкладки.
                                                                                                                            • +3
                                                                                                                              Dark theme короче не дождемся.
                                                                                                                              • 0
                                                                                                                                А могли бы за образец взять эту (мега-популярная для всей линейки stack***) — https://userstyles.org/styles/37035/github-dark

                                                                                                                                Ув. Boomburum и deniskin — дайте пожалуйста знать, что думаете об этом? Более 90к юзеров уже у этого юзер-стиля, сам использую уже давно, он просто шикарен. Вот бы его за основу! Вы же IT-ки, прогрессивные люди — SASS/SCSS/LESS вас же не должны пугать.
                                                                                                                                • 0

                                                                                                                                  NegativeScreen (http://arcanesanctum.net/negativescreen/). У нас печеньки! (Грустный злодейский смех сквозь слёзы). Только под Windows + Aero. Отсутствие адекватных и беспроблемных аналогов даже отвернуло меня от повседневного использования дома убунты.


                                                                                                                                  P.S. даже не могу уже понять, как можно ждать тёмную тему от каждого производителя и продолжать терпеть эти белые глазовыколупывательные пятна на экране. А если работаешь работу с кучей неподдерживаемой давно проприетарщины?

                                                                                                                                • +1
                                                                                                                                  Не знаю с этим обновлением или нет, но анимация перехода к новому комментарию стала значительно быстрее — это здорово!
                                                                                                                                  • +3
                                                                                                                                    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;

                                                                                                                                    Это же шрифт, которым выводятся надписи в интерфейсе Windows. Для текстов сама Microsoft подразумевает применение Calibri (шрифт по умолчанию в Microsoft Office), а не Segoe UI.
                                                                                                                                    • +3

                                                                                                                                      Причём Calibri 15px действительно очень хорошо смотрится, а вот Segoe в браузерной отрисовке неприятен :(

                                                                                                                                    • –1
                                                                                                                                      Полужирный — работает
                                                                                                                                      Наклонный — работает

                                                                                                                                      На Хабре работает, а на ГТ кнопки в формах ответа перестали оборачивать выделенное тегами.

                                                                                                                                      тест
                                                                                                                                      А я вообще не вижу иконки отредактированного комментария. Видно только в чужих.
                                                                                                                                      • +1
                                                                                                                                        Иконка того что комментарий был изменён находится рядом с юзернеймом, и кажется, что это кнопка для редактирования юзернейма (что конечно же не так). Лучше унести эту иконку в другое место. Например, разместить её справа у кнопок ↓ и ↑. Или разместить эту информацию внизу, у кнопок ответа и жалобы.
                                                                                                                                        • 0

                                                                                                                                          в новой форме комментариев не работает отправка по Ctrl+Enter (хотя и в старой оно работало только с Ctrl, но не с маковским Cmd, но уже ладно)

                                                                                                                                          • +3
                                                                                                                                          • 0
                                                                                                                                            — Увеличили кегль шрифта. Не потому, что у нас появились проблемы со зрением, а потому, что сейчас это вполне правильный тренд современной веб-типографики, да и многие из вас не раз жаловались на мелкий шрифт. Даже не столько жаловались, сколько периодически писали в комментариях, что читают сайт на +110%.

                                                                                                                                            Интереса ради прыгнул на зум 100% (без увеличения)… Имхо вообще нечитабельно. Ни статья, ни тем более комментарии… уехал обратно на свои любимые 150% (благо и экран в таком случае используется полностью, а не узенькая колонка в пол-экрана).


                                                                                                                                            PS поверьте, у большинства пользователей матрица — tn. Не надо таких слабовыраженных выделений, как для блока комментария и правой информационно-рекламной колонки. От них глазкам бо-бо. И если на правую колонку можно просто забить, то блока со вводом комментария во время набора комментария развидеть не получается. Да и в целом предыдущий блок ввода комментария был сугубо удобней

                                                                                                                                            • +8
                                                                                                                                              image
                                                                                                                                              Выглядит так, будто стрелка вверх «уплыла» влево.
                                                                                                                                              • +3

                                                                                                                                                Из той же оперы: рейтинг своих комментариев некрасиво выравнивается по правому краю


                                                                                                                                                screenshot

                                                                                                                                              • +11
                                                                                                                                                Сократите межстрочный интервал, а то как в дипломе текст
                                                                                                                                                • +1