Image
    Уже завтра у вас будет установленный и настроенный сайт на CMS Joomla
    Image
    Центр обучения Joomla
    Интерфейс панели управления Joomla 4

    Интерфейс панели управления Joomla 4

    Пользовательский интерфейс Joomla 4 претерпел множество изменений в отношении юзибилити и функциональности. В данном обзоре рассмотрим ключевые особенности новой панели управления.

    Общий стиль админки

    Типография

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

    Roboto

    Цветовая гамма

    Цвет пользовательского интерфейса подбирался с учетом доступности для людей с ограниченными возможностями: согласно рекомендациям WCAG 2.0, контраст цветов переднего и заднего плана (фона) должен составлять не меньше 4.5:1.

    Контраст цветов админки Joomla 4 равняется 4.8:1:

    Контраст цветов админки Joomla 4

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

    Новый фирменный паттерн Joomla

    Шаблон панели управления Joomla 4 использует новый фирменный паттерн (фоновый узор) символизирующий единство сообщества Joomla.

    Кликните по изображению, чтобы ознакомиться с презентацией нового фонового узора в формате PDF:

    Новый паттерн Joomla

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

    Страница входа в админку

    По умолчанию страница авторизации применяет упомянутый выше паттерн в сочетании с градиентом синего цвета:

    Страница входа в админку Joomla 4 по умолчанию

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

    Кастомизированная страница входа в админку Joomla 4

    Также для фирменного оформления страницы входа в админку можно указать:

    • логотип, отображаемый над формой авторизации
    • ссылку на сайт под формой

    Изменения в структуре интерфейса

    1. Для облегчения рабочего процесса главное меню админки Joomla 4 претерпело следующие изменения:

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

    2. Панель, размещенная вверху страницы, содержит следующие элементы в виде иконок:

    • меню пользователя
    • уведомления
    • приватные сообщения
    • ссылка во внешний интерфейс

    3. Под верхней панелью размещаются элементы управления, относящиеся к текущей странице.

    Структура интерфейса админки Joomla 4

    Логика нового меню

    Пункты меню верхнего уровня по прежнему имеют своё подменю, элементы которого ведут на соответствующие страницы. Отображение подменю происходит по клику.

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

    Управление элементами контента

    Функционирование кнопок для управления элементами контента (материалами, категориями, пунктами меню и т. д.) было пересмотрено и улучшено: теперь кнопка Удалить не будет активной, если материал в списке не отмечен, таким же образом кнопка Опубликовать не будет активной, если выбран уже опубликованный материал. Иными словами, функционирование кнопок теперь зависит от выбранного контекста.

    Для способствования запоминанию значения той или иной кнопки каждой из них был присвоен определенный цвет.

    Новые возможности редактора TinyMCE

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

    Структура интерфейса админки Joomla 4

    Отображение на мобильных устройствах

    Новый интерфейс админки Joomla 4 отлично отображается и функционирует на мобильных устройствах:

    Админка Joomla 4 на смартфоне

    Кастомизация представления админки

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

    Кастомизированная админка Joomla 4

    Другие материалы по Joomla 4

    Интерфейс панели управления Joomla 4
    Улучшения медиа-менеджера в Joomla 4
    Поддержка доступности в Joomla 4
    Первый взгляд на Joomla 4
    previous arrow
    next arrow
    Slider

      Joomla.center is not affiliated with or endorsed by the Joomla! Project or Open Source Matters. The Joomla! name and logo is used under a limited license granted by Open Source Matters the trademark holder in the United States and other countries.

      Joomla!® является торговой маркой компании Open Source Matters inc в США и др. странах. Название Joomla! и его вариации используются в рамках ограниченной лицензии, определённой компанией Open Source Matters. Проект joomla.center не относится к компании Open Source Matters или проекту Joomla! Точки зрения представленные на данном сайте не являются официальными точками зрения Joomla Project или Open Source Matters. Торговая марка Joomla® и логотип используются в рамках ограниченной лицензии, предоставленной Open Source Matters.

      © Александр Куртеев. Центр обучения Joomla.
      ОГРНИП 307434525600161, ИНН 434540800305
      Все права защищены. © 2008 - 2019

      Договор оферты | Политика обработки персональных данных
      Согласие с рассылкой | Отказ от ответственности