АМА с Хабром #20. Тестируем новый WYSIWYG
У меня есть причины не любить аббревиатуру WYSIWYG. Во-первых, я до сих пор не могу сходу её написать — всё время сначала проговариваю про себя расшифровку (What You See Is what You Get) и только потом пишу. Во-вторых, она ужасно читается, «визивиг» или, что ещё хуже, «висивиг» — отвратительнее только иметь дело с бандой tough-though-trough-through-thorough-thought-throw. В третьих, в ней аж две буквы «y», которая залипает в моём ноутбуке, но это так, совсем уж личное.
Есть ещё четвёртая причина, которая за годы присутствия в интернете стала граничить с фобией — как правило, говоря «визивиг» (ааа!), в мыслях мы представляем какой-то кухонный комбайн, за которым прячется КаМАЗ кода. И в итоге всё это если и работает «как задумывалось», то в лучшем случае в каком-то одном браузере. И даже в нём лишь с костылями. Ну или это всё мой негативный опыт, «просто ещё не встретил» идеальный редактор.
Тем не менее последние полгода (а может и больше) мы работали именно над этим — над новым редактором публикаций. Можно было бы прокачать текущую форму создания публикаций (которая практически не менялась с момента создания Хабра), но всё же мы подумали, что вёрстка постов с помощью HTML-тегов в 2020 году — это в принципе не дело, а для части пользователей так вообще неподъёмное дело.
Новый редактор условно делится на две части: на первой странице находятся только поле для заголовка и простыня для написания текста публикации из блоков. Мы решили пойти по пути блочного конструктора — для вставки блоков можно пользоваться как «плюсиком» в левой части (для вставки блоков), так и клавишей »/».
Поддерживается markdown-разметка, горячие клавиши (CTRL/⌘ + B, U, I, S, K) и вставка из буфера обмена (с форматированием).
Вторая страница отведена под настройки: выбор типа поста и языка, поля для добавления хабов, тегов и текста анонса, а также загрузку картинки для соцсетей.
Что поддерживает новый редактор
Заголовки (в том числе через #)
Цитаты (с отбивкой слева, как раньше, а не в жёлтом блоке как в текущем редакторе)
Маркированные и нумерованные списки (вложенность добавляется через Tab)
Медиаэлементы (посты из соцсетей, треки, видеоролики, Codepen и т. д.)
Изображения (вставка с диска, минуя Habrastorage, либо из буфера обмена), включая SVG
Разделители
Таблицы (с поддержкой выравнивания, вставки и удаления строк и столбцов, а также объединения ячеек)
Код (с подсветкой синтаксиса) — как строчный, так и блочный (в том числе через ``)
Формулы в TeX-формате
Спойлеры
Мы делали WYSIWYG с мыслью о том, что для создания поста не нужно пользоваться сторонними редакторами — садись и пиши прямо на Хабре, сохраняй в черновики, если не удалось написать всё в один заход. Но даже если вы хотите перенести наброски откуда-то извне, в 9 из 10 случаев достаточно будет нажать Ctrl/⌘+A → Ctrl/⌘+C → Ctrl/⌘+V, и всё перенесётся само, включая ссылки, форматирование и даже картинки — они сами зальются на наш Habrastorage.
Естественно, это не финал — это бета-версия. Поэтому все предложения, замечания и идеи оставляйте на странице бета-тестирования «визивига». Изучим весь поступивший фидбек и вместе сделаем новый редактор ещё лучше.
Что и как проверятьПока мы не делаем новый редактор доступным для всех, а только тем, кто является бета-тестером Хабра. Если хотите присоединиться — жмите на свою аватарку в правом верхнем углу и выбирайте в меню пункт «Бета-тестирование». Там уже создан новый эпик про редактор — все найденные баги и аномалии следует писать в комментариях к нему. |
Что ещё сделали за август
Так как все силы были брошены на доделывание редактора, больше особо ничего не успели сделать. Тем не менее:
Поменяли логику работы блока «Новости». Раньше там выводилось 5 новостей и ссылка «Все новости» для перехода в новостной раздел. Теперь — 5 новостей и кнопка «Показать ещё», показывающая ещё 5 новостей, и только после неё ссылка для перехода в раздел новостей.
Пофиксили прогрузку списка хабов на странице управления подпиской
Починили вывод даты последней активности в некоторых профилях
Исправили ссылку «Написать в ЛС» в блоке автора под постом
Починили локализацию времени в некоторых закромах
Поколдовали над сервисом вывода похожих постов
Исправили отступы в блоках читают сейчас
Исправили поведение правого сайдбара
Починили открытие якоря публикации в новом окне
Исправили отображения футера на страницах ошибок
Наладили отображение AMP-публикаций, созданных через новый редактор
Сделали подгрузку картинок в постах и комментариях за 500 px до скролла
Всем визивиг!