Джумла 4 – это бесплатная русскоязычная платформа для создания сайтов различного типа: лендинги, визитки, блоги, форумы, каталоги, интернет-магазины, доски объявлений, социальные сети и т.д.
Видео обзор
- Ленивая загрузка (Lazy Loading) – 00:00:58.
- Сайт для слабовидящих (ГОСТ Р 52872-2019 и WCAG) – 00:04:43.
- Изменения в переопределениях – 00:07:24.
- Управление HTTP заголовками – 00:10:00.
- Другие отличия Joomla 4 от 3 – 00:11:14.
Видео лучше просматривать с качеством 720 HD. Этот и другие видео уроки можете найти на каналах сайта Aleksius.com в YouTube и Mail.ru.
Ссылки из видео:
- «Обзор Joomla 4 (часть 1). Что нового по сравнению с 3-й версией».
- «Обзор Joomla 4 (часть 2). Подготовка статьи к публикации (Процесс/Workflow)».
- «Обзор шаблона Joomla JM University. Как сделать версию сайта для слабовидящих».
Для расширения возможностей системы есть тысячи готовых платных и бесплатных шаблонов, компонентов, модулей и плагинов. Платформа переведена на десятки языков, включая украинский, английский, немецкий, французский и т.д. В первой части цикла статей «Обзор Joomla 4 (часть 1). Что нового по сравнению с 3-й версией» мы начали обзор новинок 4-й версии, во второй весьма подробно рассмотрели новый компонент Процессы (com_workflow). В этой части поговорим об изменениях, позволяющих повысить скорость загрузки сайта и упростить его использование людьми с плохим зрением.
Будут рассмотрены отличия Джумла 4.0.4 от Joomla 3.10.3.
В обзоре участвует последняя доступная мне, на момент написания статьи (30.10.2021), русскоязычная версия Joomla 4.0.4 на локальном сервере с PHP 8.0.1. На сайте установлены демонстрационные данные «Блог» и используется встроенный шаблон Cassiopeia 1.0.
В следующей статье «Самостоятельное создание сайта (часть 1). Как сделать сайт на Joomla 4» мы рассмотрим пошаговый процесс разработки сайта без программирования с нуля, от установки локального сервера и до выгрузки готового сайта с адаптивным дизайном на реальный хостинг.
Что нового в Джумла 4
Ленивая загрузка (Lazy Loading)
Ленивая загрузка изображений (Lazy Loading) или отложенная загрузка изображений – это «метод» оптимизации скорости загрузки сайта путём загрузки изображений по мере их появления в видимой части окна браузера. Например, на странице (рисунок ниже) есть 4 изображения. Пользователь попадает на эту страницу и сразу видит текст (на рисунке ниже голубой рамкой обведена часть страницы, которая отображается у него на экране). При этом рисунки №1-4 не загружаются ему в браузер. Потом пользователь начинает прокручивать страницу вниз и видит следующий фрагмент (на рисунке ниже зелёной рамкой обведена часть страницы, которая отображается у него на экране). При этом загружаются только рисунок №1, так как при дальнейшей прокрутке страницы вниз этот рисунок должен отобразиться на экране. По такому же принципу будут загружены рисунки №2-4, если пользователь докрутит страницу к этим рисункам.
Этот «метод» позволит увеличить общее время загрузки страницы, сэкономит трафик пользователю и Вашему сайту (хостингу), плюс, если у Вас и пользователя включено кэширование картинок в браузере пользователя, сэкономит место на устройстве посетителя сайта. В случае с множеством больших (в килобайтах) картинок это может дать ощутимый положительный эффект.
Как включить отложенную загрузку изображений (Lazy Loading) в материалах Joomla. Для этого перейдите в Контент – Материалы, создайте новый материал или перейдите в существующий. Затем перейдите в Контент CMS – Медиа (кнопка в левом верхнем углу окна текстового редактора) (рисунок ниже).
И просто выберите изображение, которое нужно добавить (рисунок ниже). Просто отметьте нужное изображение и в появившемся окне не отключайте опцию Ленивая загрузка изображения.
В коде страницы для этого изображения Вы увидите:
<img src="/images/19.jpg" alt="" width="1920" height="1080" loading="lazy" data-path="local-images:/19.jpg" />Если не нужно применять к изображению ленивую загрузку, удалите «loading="lazy"» из кода или отключите опцию Ленивая загрузка изображения при вставке изображения.
Ленивая загрузка работает не только в менеджере материалов, но и в модуле тип HTML-код и, скорее всего везде на сайте, где к изображениям добавлен атрибут «loading="lazy"». Проверял на странице компонента конструктора контента SP PageBuilder Pro 3.8.0.
В видео обзоре показано, как можно проверить ленивую загрузку.
Сайт для слабовидящих (ГОСТ Р 52872-2019 и WCAG)
В статье «Обзор шаблона Joomla JM University. Как сделать версию сайта для слабовидящих» мы уже рассматривали вопрос версии сайта для слабовидящих. В Джумла 4 шаблон админки «Atum» и фронтальной части сайта «Cassiopeia» соответствуют требованиям для слабовидящих уровень AA согласно WCAG 2.1. В России есть национальный стандарт ГОСТ Р 52872-2019 «Интернет-ресурсы и другая информация, представленная в электронно-цифровой форме. приложения для стационарных и мобильных устройств, иные пользовательские интерфейсы. Требования доступности для людей с инвалидностью и других лиц с ограничениями жизнедеятельности».
Сайты, соответствующие этим стандартам более удобные в плане использования людьми с ограниченными возможностями (инвалидов).
Для активации соответствующих инструментов перейдите в Система – Плагины и включите плагин «Система - Панель функций доступности». В настройках плагина можно включить отображение панели с инструментами только в админке, только во фронтальной части сайта или и там, и там (рисунок ниже).
А в Joomla 4.1 был добавлен специальный инструмент для проверки доступности контента пользователям с ограниченными возможностями. Также там появился инструмент для языковой разметки фрагментов текста на странице. Это улучшит воспроизведение текста программами для чтения с экрана.
В Joomla 5.1 данный инструмент был улучшен и обновлён.
Появившаяся панель содержит инструменты, которые позволяют:
- Увеличить/уменьшить размер текста и расстояния между словами.
- Инвертировать цвет интерфейса (рисунок ниже).
- Включить подчёркивание ссылок.
- Увеличить курсор мыши.
- Добавить горизонтальную линию для чтения (рисунок ниже).
- Озвучить текст на экране. Проверял в Mozilla Firefox 93.0, Windows 10 (сборка 19043.1320) с русскоязычным интерфейсом.
Также стоит отметить, что весь контент и ссылки на Вашем сайте доступны с клавиатуры. Для этого используются специальные HTML теги.
А в Пользователи – Пользователи – «Имя пользователя» появилась новая вкладка Доступность (рисунок ниже). Там можно сразу активировать некоторые из опций, полезных для улучшения восприятия сайта слабовидящими людьми.
Изменения в переопределениях
В предыдущих версиях Joomla уже была возможность создания переопределений макетов страниц (PHP файлы). В Джумла 4 этот механизм был усовершенствован. Если Вы сделали переопределение какого-то файла через Система – Шаблоны сайта – Редактировать «Название Вашего шаблона» – Создание переопределений и после этого обновили компонент, исходный файл для которого Вы создали переопределение, Joomla сообщит Вам об этом сразу после установки (рисунок ниже).
Плюс, сообщение об этом будет доступно в панели управления (рисунок ниже).
Если перейти в Система – Шаблоны сайта, то напротив шаблонов с переопределениями будет сообщение вида «Найдено 1 изменение». При условии, что был изменён исходный файл, для которого Вы создали переопределение. Цифра зависит от количества таких обновлённых исходных файлов.
Перейдут в Редактировать «Название Вашего шаблона» – Обновление переопределений и увидите краткую информацию о переопределении, для которого был изменён исходный файл (рисунок ниже).
Нажав на ссылку с файлом, включив опции Показать исходный файл и Скрыть различия Вы сможете увидеть файл с переопределением (и возможностью его редактирования), исходный файл (уже новый) и различие между файлами (рисунок ниже).
Это очень удобно и может сэкономить массу времени и нервов.
Ситуация достаточно распространённая. Вы могли создать переопределения для какого-то расширения, чтобы оно соответствовало Вашим требованиям. После этого могла выйти новая версия этого расширения, Вы её установили, а в ней был изменён тот файл, для которого Вы создали переопределение. В таком случае расширении могло вообще не работать (во фронтальной части сайта), выдавать ошибки, привести к белому экрану вместо страницы сайта или, как минимум, Вы бы не получили новые возможности, которые заложены в коде обновлённой версии расширения.
Управление HTTP заголовками
В Джумла 4 появился новый плагин «Система - HTTP Headers». В большинстве случаев он может понадобиться для более тонкой настройки сайта опытными пользователями. Подробнее об HTTP заголовках Вы можете узнать в статьях «HTTP Headers для "чайников"» и «Заголовки HTTP».
Настройки плагина разделены на три вкладки. На первой, Плагин (рисунок ниже) можно изменить настройки некоторых заголовков и задать дополнительные.
На вкладке Strict-Transport-Security (HSTS) (рисунок ниже) можно включить применение HSTS механизм, принудительно активирующий защищённое соединение через протокол HTTPS.
А на вкладке Content-Security-Policy (CSP) (рисунок ниже) можно сконфигурировать опции для одноимённого заголовка.
Другие отличия Joomla 4 от 3
Редактор TinyMCE. Визуальный текстовый редактор TinyMCE был обновлён до версии 5.9.2 (рисунок ниже)
При этом был обновлён не только сам редактор, но и его параметры в плагине «Редактор – TinyMCE» (рисунок ниже). Например, появилась возможность использования синтаксиса Markdown и возможность подключения внешних плагинов.
Отслеживать метаданные сессии. В Система – Общие настройки – Система появилась новая опция Отслеживать метаданные сессии, которая позволяет: «Включить или отключить функцию отслеживания метаданных сессии пользователя. Если установлено Да, метаданные сессии (включая имя пользователя, его ID и расширение, в которое он вошел) будут регистрироваться в таблице базы данных сессии. Если установлено Нет, функции, которые зависят от метаданных, будут недоступны».
Включить CORS. В Система – Общие настройки – Сервер появилась новая опция Включить CORS (рисунок ниже), которая позволяет: «Включить или отключить использование дополнительных заголовков Cross-Origin Resource Sharing (CORS), которые позволяют запущенным в браузере скриптам взаимодействовать с ресурсами другого источника».
Балансировщик нагрузки. В Система – Общие настройки – Сервер появилась новая опция Балансировщик нагрузки (рисунок ниже), которая позволяет: «Включить или отключить использование балансировщика нагрузки, если сайт находится за балансировщиком нагрузки или обратным прокси-сервером. Использование параметра позволяет получать реальный IP-адрес пользователя сайта, который может регистрироваться в логе действий пользователей».
Включить исходящий прокси-сервер. В Система – Общие настройки – Сервер появилась новая опция Включить исходящий прокси-сервер (рисунок ниже), которая позволяет настроить работу сайта через исходящий прокси сервер.
Логирование. В Система – Общие настройки появилась новая вкладка Логирование (рисунок ниже). Запись логов была и в 3-й версии, а в 4-й появились опции, которые позволят настроить этот процесс. Например, записывать в лог только события с определённым приоритетом.
Токен API Joomla. В Пользователи – Пользователи – «Имя пользователя» появилась новая вкладка Токен API Joomla (рисунок ниже) (для супер администраторов). Опции, находящиеся на ней, могут помочь при использовании Web API, которое появилось в Джумла 4. Это надо только для программистов.
Настройка времени отметки материала как избранного. В Контент – Материалы – «Название материала» – Публикация появились две опции Начало избранного и Завершение избранного. При помощи них Вы можете указать дату и время начала и окончания отметки материала как избранного.
На этом новшества Joomla 4 не заканчиваются. Их ещё очень много. О некоторых из них есть упоминания в статьях «Вышла Joomla 4» и «12 новых возможностей Joomla 4».
Стоит ли переходить на Joomla 4
Для себя точно решил, что переходить буду. На Joomla 4 планирую мигрировать свои проекты где-то в феврале-апреле 2022. Жду пока разработчики обновят бóльшую часть нужных мне расширений.
О моём опыте обновления 3-й Джумла на 4-ю Вы можете прочесть в статье «Обновление Joomla 3 до 4 на примере сайта Aleksius.com» (добавлено 11.12.2022).
Если верить планам разработчиков Джумла, 3-я версия будет поддерживаться до 17 августа 2023 года. Думаю, что большинство расширений и шаблонов от сторонних разработчиков тоже.
На 30.10.2021 считаю, что стоит использовать Joomla 4 только для тех новых проектов, для которых Вы проверили наличие соответствующих версий всех нужных Вам шаблонов и расширений. На данный момент на официальном сайте расширений Joomla для 3-й версии зарегистрировано 6463 расширения, а для 4-й – 1661 расширение.
Причины, по которым стоит переходить на Joomla 4 (когда для новой версии есть все нужные Вам шаблоны и расширения)
- Новые возможности.
- Более удобная админка.
- Более защищённый код.
- Увеличенная скорость загрузки сайта.
- Возможность работы на более новом серверном программном обеспечении (на хостинге).
- Применение более современной «кодовой базы». Это позволит создавать расширения и шаблоны, отвечающие современным тенденциям.
- После 17 августа 2023 года прекратится поддержка Joomla
- Рано или поздно разработчики сторонних расширений и шаблонов прекратят поддержку своих программ для 3-й версии.
- Рано или поздно Joomla 3 не сможет работать на актуальном серверном программном обеспечении (на хостинге).
- Рано или поздно, существующие, для 3-й версии, расширения и шаблоны, перестанут отвечать современным тенденциям.
В следующей статье «Обзор Joomla 4 (часть 4). Установка и русификация Joomla 4» рассмотрим процесс установки 4-й версии на локальный сервер OpenServer и её русификацию. А в статье «Что нового в Joomla 4.1» поговорим об изменениях в версии 4.1.
| Похожие материалы |
|---|
| Автор статьи – Хорошевский Алексей |
|---|
 Кандидат технических наук, преподаватель Харьковского национального университета радиоэлектроники, веб-мастер и SEO-оптимизатор с опытом более 15 лет. Специалист по созданию сайтов на Joomla и WebSite X5. Автор научных публикаций, видеокурсов и обучающего контента по веб-разработке и SEO. Ведёт блог и YouTube-канал, где делится своими знаниями и практическим опытом. Предоставляет услуги по созданию, доработке, сопровождению и продвижению сайтов. Подробнее об авторе… Публикации и работа: |
Полезные ссылки:
