Собственное контекстное меню с использованием JavaScript

[lolmaus]

> display: flex;

Завидую людям, которые могут отказаться от поддержки IE 10 и ниже.

[gwer]

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

[lolmaus]

А как насчет поддержки устройств, не имеющих мыши? Больше половины пользователей останутся за бортом?

[gwer]

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

Либо вешать свои обработчики, либо дублировать действия в панели команд.

[lolmaus]

Либо использовать целостное решение, которое одинаково хорошо и очевидно работает с любым типом ввода. :/

[movl]

Не могу согласиться. Достаточно простой пример это продукты google, тот же Google Drive. На десктопе на интуитивном уровне нажимаю правой кнопкой, чтобы произвести некоторые действия над файлом (как впрочем и клацаю по горячим клавишам), это удобнее чем каждый раз искать иконки в тулбаре и достаточно очевидно. На телефоне же приходится удерживать тап, чтобы можно было выделить файл и произвести над ним манипуляции, для телефона это тоже достаточно очевидный подход. Как создать из этого целостное решение, которое будет одинаково удобно и для тач устройств, и для обычной мышки, мне не совсем понятно. Но я и не UX специалист, мне просто нравится пользоваться понятными и удобными интерфейсами, к которым давно привык.

[lolmaus]

Просто добавить треугольничек ▼ в правой части каждого элемента.

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

Заметьте, отказываться от правого клика никто не заставляет. А удержание пальцем останется полезно для выделения нескольких файлов.

[Everlier]

Немного не хватает клавиатурной навигации, 508 Section и, банально, модульности.

[gwer]

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

[Everlier]

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

[gwer]

Это IT, тут ничего не поделаешь. Но, если честно, лично я очень люблю обычные информационные сайты. Без хитровы… деланного оформления и всяких современных плюшек. Многим сайтам не хватает именно информации.

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