Jump to content

дизайн Кнопки редактора


KVentz

355 views

 Share

Я ещё раз переосмыслил панели редактора публикаций.

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

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

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

Панель смайликов (кнопка «Эмодзи») прыгает из нижней строчки в десктопной версии в верхние строчки на мобильных, потому что на настольных компьютерах эта кнопка — единственный способ вставить смайлик без боли и используется чаще, чем на мобильных. На мобильных для этого есть отдельная раскладка на клавиатуре. Кстати, о смайликах: наши старые форумные анимированные смайлики никуда не делись, они доступны через всё ту же кнопку «Эмодзи», находятся в самом конце списка. Можно промотать вниз до конца или выбрать категорию «Смайлики» в меню этой панели.

Ещё раз напоминаю, что при вставке текстов с других сайтов нужно обязательно использовать полезную кнопку очистки формата:

Снимок экрана 2021-06-16 в 10.53.49.png

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

 Share

0 Comments


Recommended Comments

There are no comments to display.

Guest
Add a comment...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.



×
×
  • Create New...