Современный сайт должен быстро загружаться, иначе посетители просто уйдут. К счастью, даже без программирования и сторонних плагинов вы можете заметно ускорить WordPress-сайт на Elementor. Мы расскажем о трёх простых шагах – через стандартные настройки WordPress и инструменты Elementor – которые помогут вашему сайту летать!
Шаг 1: Убедитесь в хорошем хостинге и лёгкой теме
- Выберите надёжный хостинг. WordPress – однопоточное PHP-приложение, поэтому скорость сайта очень сильно зависит от характеристик хостинга: частоты процессора, объёма памяти и близости серверов к вашей аудитории. Лучше использовать VPS или облачный хостинг с современным PHP (7.4+) и достаточным CPU, чем «дёшевый» шаред без гарантий ресурсов.
- Используйте лёгкую тему. Тема задаёт основу внешнего вида сайта, и тяжёлая тема с множеством скриптов сильно замедляет загрузку. Для Elementor идеально подходит официальная тема Hello Elementor – она создана для максимальной скорости и содержит минимум лишнего кода. Также хорошо проявили себя темы Astra, Neve, GeneratePress и OceanWP, оптимизированные для быстрой работы.
Кстати, если вы ищете удобные и бесплатные инструменты для сайта, посмотрите подборку полезных плагинов для Elementor и WordPress.
Шаг 2: Оптимизируйте изображения и медиа
- Сжимайте картинки перед загрузкой. Большие изображения – самая частая причина медленной страницы. Перед загрузкой в медиабиблиотеку используйте онлайн-сервисы (TinyJPG, TinyPNG и др.) или графические редакторы, чтобы уменьшить вес файла без заметной потери качества. Сжимайте фото до разумного размера (например, 150–300 KB).
- Настройте размеры в WordPress. В админке перейдите «Настройки → Медиа» и установите максимальный размер «Крупных» изображений (Large) равным ширине области контента вашей темы. Например, если область контента у темы 1200 px, поставьте 1200. Это уменьшит создание лишних миниатюр и вес картинок.
- Используйте подходящий формат. Для главного баннера или обложки лучше загружать JPEG, а остальные изображения можно конвертировать в WebP с потерей качества (~60%). Формат WebP при прочем качестве заметно «легче» по размеру, что ускоряет загрузку.
- Активируйте ленивую загрузку. Начиная с версии WordPress 5.5 все изображения по умолчанию получают атрибут
loading="lazy", и браузер загружает их «по мере прокрутки». Вам не нужно ставить плагин – WordPress сам откладывает загрузку дальних изображений, ускоряя первоначальную загрузку страницы.
Если вы используете сторонние макеты или шаблоны, и хотите адаптировать их под себя, обязательно прочитайте инструкцию по редактированию чужих макетов в Figma. Это поможет вам быстро адаптировать дизайн и экспортировать оптимальные изображения.
Шаг 3: Скорость через настройки Elementor и WP
- Отключите лишние глобальные шрифты и цвета. Перейдите в админке «Elementor → Settings». На вкладке General установите галочки Disable Default Fonts и Disable Default Colors. Так вы запретите Elementor загружать свои стандартные шрифты и стили (Google Fonts), а браузер будет использовать настройки вашей темы. Это уменьшит число запросов и ускорит загрузку CSS.
- Включите оптимизацию загрузки в Elementor. На вкладке Performance (или Эксперименты → Производительность) включите опции Optimized Image Loading и Lazy Load Background Images. Первая добавит к самым важным картинкам атрибут
fetchpriority="high", а ко второстепенным –loading="lazy". Вторая – сделает ленивой загрузкой все фоновые изображения на странице, кроме первого экрана. Эти встроенные фичи Elementor добавляют браузеру указания на приоритет загрузки без плагинов. - Регенерируйте кэш и CSS (если нужно). После изменения настроек Elementor зайдите в «Elementor → Tools» и нажмите Regenerate Files & Data, Sync Library и Regenerate CSS. Это обновит внутренний кэш Elementor. Затем обновите страницу и убедитесь, что старые стили не остались в кеше браузера.
- (Опционально) Включите «Switch Editor Loader Method». В «Elementor → Settings → Advanced» есть пункт Switch Editor Loader Method. Если вы используете слабый сервер или у вас были ошибки при загрузке редактора, включите его. Он разбивает код на более мелкие части и улучшит работу без снижения скорости сайта. Эта настройка никак не вредит производительности, а наоборот иногда её немного повышает.
А если вы хотите не только ускорить сайт, но и сделать его более функциональным, посмотрите, как отправлять заявки с Elementor в Telegram — это можно реализовать за пару минут и без кода.
Выполнив эти три шага — качественный хостинг + простая тема, оптимизация изображений через WP Media и включение встроенных функций ускорения Elementor — вы получите быстрый сайт без единой строчки кода и без дополнительных плагинов. Проверяйте скорость после изменений (PageSpeed Insights, Lighthouse и др.) — вы увидите заметный прирост скорости и более высокие показатели производительности. Успешной оптимизации!
