Версия платформы 2022−2
3 мая 2022
Весна в этом году богата обновками, не успели ещё как следует насладиться версией 1.7, как подоспела новая! В этот раз уделили много внимания маленьким экранам мобильных устройств, поработали над оптимизацией и закрыли несколько мелких багов (куда без них).
Добавили новое
🟢 364 Настройки → Оформление → Заголовки: Можно настраивать размер
Раньше настраивался только размер основного текста, а размер заголовков автоматически рассчитывался исходя из него. С одной стороны, удобно, настроил основной шрифт и всё будет хорошо. С другой стороны, дизайнерам этого мало, они иногда хотят гигантские заголовки в качестве художественного приёма и ещё бог знает что нестандартное, гибкости им подавай! =)
Ну, а мы любим дизайнеров и не хотим обижать. Так что теперь размер любого уровня заголовков настраивается, как душе угодно: Н1 размером 74 px — пожалуйста, хотите 174 px — всё можно!
Но ещё мы очень не хотим усложнять жизнь остальным пользователям, которых радовала простота, так что позаботились о дефолтах. Не хотите — не настраивайте, тогда всё будет, как раньше.
🟢 247 Общее → Заголовки и обычный текст: Умная адаптация размеров шрифта под различные разрешения
Шрифт и раньше адаптировался, но адаптация была простой, линейной и касалась только самых маленьких разрешений. В результате, к примеру, если вы задавали, очень-очень большой размер текста дизайнерского приёма ради, то на компах это выглядело хорошо, как и задумано, но на мобилках не очень.
Теперь же адаптация всех размеров шрифтов происходит по какой-то невероятной формуле. Нам даже пришлось привлечь стороннего консультанта-математика для её разработки (Андрей, привет, спасибо тебе)! Адаптируется как основной шрифт, так и все уровни заголовков. Учитывается аж 15 (!) диапазонов разрешений, подстраивая шрифты для оптимального отображения под каждое из них.
Во-первых, какой бы размер текста ни задали, хоть 300 px, в маленьких разрешениях он будет выглядеть корректно:
При этом учли, что текст не может бесконечно уменьшаться. Даже если поставить очень маленький размер, в мобильной версии он не сожмётся до атомов.
Во-вторых, учитываются соотношения размеров текста между собой.
Например, для первых трёх уровней заголовков поставили 50, 40 и 30 px. Разница между ними 10 px — визуально равномерно уменьшаются, а система стремится сохранить эту визуальную зависимость при адаптации под любой экран. Потом пришёл дизайнер и увеличил первый заголовок в 2 раза. Равномерность испарилась, первый стал сильно больше собратьев, а система умна и отразит эту визуальную разницу под любым разрешением:
Улучшили
🔵 666 Общее → Сетка: Улучшили адаптацию под самые маленькие экраны
Раньше для экранов, шириной меньше 410 px, две и четыре колонки контента превращались в одну, а шесть — в три.
Хотелось сохранить красоту колонок даже на столь маленьких экранах и избавить пользователей от скроллинга слишком длинных страниц. Поработали над ширинами элементов, добавили пару дополнительных диапазонов разрешений и сдвинули в результате нижнюю границу, теперь превращение в одну колонку происходит только при ширине меньше 320 px. Отчасти это стало возможно благодаря умной адаптации размеров шрифта.
На скриншоте пример адаптации 4 колонок при разрешении 375 px, как было и стало:
🔵 665 Секция «Отзывы» → Отзыв → Автор: Улучшили выравнивание в мобильной версии
На мобильных фото автора, имя и дата сдвигались левее текста отзыва, ибо у текста есть подложка, а у них — нет. Получалась некрасивая лесенка, усложняющая чтение.
Выровняли всё по одной линии. Красота!
🔵 391 Общее: Статические файлы скриптов, стилей и изображений платформы подключаются с централизованного домена
Каждый раз, когда вы открываете сайт, сервер отдаёт используемые сайтом файлы скриптов, стилей и изображений, а браузер загружает их на ваше устройство. Чем быстрее сервер отдаёт такие файлы — тем быстрее загружается сайт.
Ещё их можно сжимать архиватором перед отдачей, чтобы меньше весили и быстрее передавались, а также настраивать кэширование, чтобы браузер загружал только один раз, используя в дальнейшем ранее загруженные.
Скорость работы сайта — важнейший приоритет для нас, ибо от этого зависят позиции ваших сайтов в поисковиках. Само собой, как сжатие, так и кэширование уже были настроены, но переборщить с этим для всего остального на сайте нельзя, иначе вы что-то поменяете, а пользователи ещё долго будут видеть старое содержимое. Да и в целом, единая политика кэширования и сжатия для статики и динамики — всегда компромисс.
Увидели ещё одну возможность ускорения сайтов — вынесли статические файлы на отдельный сервер, специально заточенный под них (иначе настроены сжатие, кэширование и другие штуки):
- Теперь статика отдаётся ещё быстрее и сайты на платформе ускорились уже за счёт этого.
- Плюс, основному серверу стало чуть легче, ибо с него сняли часть обязанностей — ещё ускорение сайтов.
- Но и это ещё не всё, если ваши пользователи посетят более одного сайта, созданного на Cubona, второй и следующие будут загружаться быстрее, т. к. статика у них уже закэширована с первого сайта. Этот же принцип работает и для роботов, проверяющих скорость сайтов (по крайней мере, для части из них). Так что чем больше сайтов на Cubona — тем всем быстрее и лучше!
🔵 611 Настройки → Окна: Переименовали
Папка со всплывающими окнами называлась «Формы (окна)». Мы думали, что так будет понятнее, но практика показала, что от этого только больше путаницы. Переименовали просто в «Окна».
Пофиксили баги
🔴 663 Виджет «YouTube»: Не всегда занимал 100% ширины колонки
На платформе видео автоматически занимает всю ширину колонки. В большинстве случаев всё так и работает, но когда несколько видео находятся рядом, некоторые ролики не растягиваются, как задумано.
Выяснили, что ошибка проявляется, когда вставленное видео изначально шире колонки. Из-за этого растягивалась соседняя колонка, а виджет неправильно делал расчёты. Запретили содержимому растягивать колонки, теперь всё ок.
🔴 594 Общее → Навигационная панель → Фон → Изображение: Не отображалось
В навигационной панели можно установить картинки на фон с наложениями, зависаниями и прочим блэкджеком (всё как у секций). В процессе каких-то улучшений картинки перестали отображаться. Нашли и пофиксили, всё снова хорошо.
🔴 657 API → Уведомления об отправке форм: Сообщения в Telegram иногда не приходили
Клиент заметил, что у пары заказов уведомления на почту пришли, а в Телеграм нет.
Оказалось, что если у пользователя в почтовом адресе был символ подчёркивания _
, то Телегой он воспринимался как символ Markdown, ломая разметку сообщения.
Добавили экранирование всех спец. символов во всех полях, куда пользователь вводит текст.
🔴 654 Секция → Оформление → Вертикальные отступы: Двойные не работали
Когда запустили предыдущую версию платформы обнаружили, что перестали работать двойные отступы. Oops! Быстро обнаружили и сразу исправили.
🔴 667 Общее: Сайты иногда притормаживали при скроллинге на мобилках
Заметили, что сайты на мобильниках иногда притормаживают, иногда нет.
Выяснили, что в JS срабатывали лишние вычисления при прокрутке и изменении разрешения экрана. Доработали код, сайты теперь летают.
🔴 668 Общее → Навигационная панель: На мобилках иногда обрезалась снизу
Обнаружили, что иногда навигационная панель «обрезалась» снизу в мобильной версии.
Предположили, высота в скрытом состоянии некорректно рассчитывалась. Дописали код, чтобы пересчитывал высоту панели при открытии.
Новая версия уже у вас на сайте, пользуйтесь на здоровье, а нам не забывайте сообщать о неполадках и пожеланиях, за что вам огромное спасибо! Смело обращайтесь за любой помощью, команда Cubona на связи 💙
Публикуем и обсуждаем релизы.
Подписывайтесь ;-)
основатель, CEO