Пользователи на просторах интернета постоянно взаимодействуют с различными выпадающими меню, «флажками» и другими элементами интерфейса. И теперь в Google приняли решение изменить дизайн элементов управления HTML-форм в браузере Chrome, чтобы существенно повысить удобства пользователя при сёрфинге интернета.
Проблема старого дизайна нативных элементов управления формами и выпадающими меню заключалась в несогласованности их стиля. Элементы вроде <button> и <select> были оформлены в соответствии с операционной системой пользователя, из-за чего достаточно часто в Chrome пользователь видел устаревший дизайн. Кроме того, несоответствие дизайна компонентов на различных устройствах приводило к тому, что разработчикам нужно было тратить гораздо больше времени на код, чтобы настроить все параметры. Теперь ситуация изменится — после внедрения нового пользовательского интерфейса браузер и информация в нём воспринимаются гораздо легче и приятнее.
Дизайнеры Google используют современный принцип «плоского» дизайна «флажков», кнопок, текстовых полей, выпадающих меню, индикаторов прогресса и ползунков.
Слева старый дизайн, справа — новый
Также дизайнеры представили более «заметное» кольцо фокусировки, которое помогает людям, использующим клавиатуру или другие устройства ввода понять, с каким элементов в браузере они на текущий момент взаимодействуют. Новое кольцо имеет более толстую рамку с тонким белым контуром, благодаря чему его легче заметить на экране.
Новое кольцо фокусировки (Gif доступна по клику)
Улучшения дизайна, упрощающие сенсорный ввод, привели к увеличению некоторых компонентов. К примеру, средство выбора даты теперь может похвастаться новым всплывающим окном с поддержкой прокрутки.
Слева старый дизайн, справа — новый
Все вышеуказанные изменения уже доступны в браузере Edge на операционной системе Windows. Кроме того, пользователь может включить обновлённый дизайн на Chrome версии 81 при помощи команды в адресной строке:
chrome://flags/#form-controls-refresh
В полноценный релиз новый дизайн элементов управления выйдет в мае на MacOS, Windows, Linux и Chrome OS с версией браузера под индексом 83. А в конце года аналогичный дизайн будет отправлен и на Android.
Проблема старого дизайна нативных элементов управления формами и выпадающими меню заключалась в несогласованности их стиля. Элементы вроде <button> и <select> были оформлены в соответствии с операционной системой пользователя, из-за чего достаточно часто в Chrome пользователь видел устаревший дизайн. Кроме того, несоответствие дизайна компонентов на различных устройствах приводило к тому, что разработчикам нужно было тратить гораздо больше времени на код, чтобы настроить все параметры. Теперь ситуация изменится — после внедрения нового пользовательского интерфейса браузер и информация в нём воспринимаются гораздо легче и приятнее.
Дизайнеры Google используют современный принцип «плоского» дизайна «флажков», кнопок, текстовых полей, выпадающих меню, индикаторов прогресса и ползунков.
Слева старый дизайн, справа — новый
Также дизайнеры представили более «заметное» кольцо фокусировки, которое помогает людям, использующим клавиатуру или другие устройства ввода понять, с каким элементов в браузере они на текущий момент взаимодействуют. Новое кольцо имеет более толстую рамку с тонким белым контуром, благодаря чему его легче заметить на экране.
Новое кольцо фокусировки (Gif доступна по клику)
Улучшения дизайна, упрощающие сенсорный ввод, привели к увеличению некоторых компонентов. К примеру, средство выбора даты теперь может похвастаться новым всплывающим окном с поддержкой прокрутки.
Слева старый дизайн, справа — новый
Все вышеуказанные изменения уже доступны в браузере Edge на операционной системе Windows. Кроме того, пользователь может включить обновлённый дизайн на Chrome версии 81 при помощи команды в адресной строке:
chrome://flags/#form-controls-refresh
В полноценный релиз новый дизайн элементов управления выйдет в мае на MacOS, Windows, Linux и Chrome OS с версией браузера под индексом 83. А в конце года аналогичный дизайн будет отправлен и на Android.
