Неделя заказов на ускорение сайта WordPress дала о себе знать. Хороший временный эксперимент для дополнительного заработка с положительным опытом.
Иногда оптимизация WP занимает много времени, сил/нервов и денег клиента, поэтому данными услугами я больше НЕ занимаюсь!
В статье речь пойдет о сайтах на CMS WordPress, в основе которых лежат шаблоны из ThemeForest/TemplateMonster и nulled темы.
Кто обратился
• Владельцы микробизнеса, которые самостоятельно создали себе сайт по урокам на YouTube.
• Владельцы микробизнеса или интернет-блога, которые заказали сайт у фрилансеров за 150$ или меньше.
Основные моменты
WordPress — это система управления содержимым сайта с динамическим контентом и базой данных. Это не конструктор для создания веб-сайтов. И от слова «WordPress» не зависят Ваши позиции в ПС или скорость работы сайта.
При верном подходе к разработке — никто и никогда не пользуется плагинами, чтобы ускорить сайт на WordPress!
Зачем писать заранее лишний код под дизайн шаблона, чтобы его потом сжимать 3-4 плагинами?
Код — это набор символов,его минимум нужно писать грамотно и под дизайн, максимум — сжать в одну строчку.
Популярная проблема
Если у сайта есть проблемы со скоростью, скорее всего, он создан на шаблоне из Themeforest неопытным фрилансером или вами самостоятельно по урокам на YouTube.
А дизайн уникальный? — Да!
Многие владельцы сайтов даже не знают, что у них nulled-шаблон с Themeforest в основе сайта. Как показала практика, исполнители часто переименовывают название тем и убирают ссылки на реальных разработчиков, выставляя работу «за свою».
Themeforest и другие аналогичные маркетплейсы не являются злом. Я ничего не имею против! Там всегда можно найти гениальные дизайнерские решения и качественные шаблоны для запуска сайта в пару кликов/для проверки идей.
Но. Проблематика таких шаблонов в том, что они рассчитаны обычно на 15 и более универсальных демо-конструкций на все случаи жизни. То есть CSS/JS библиотеки шаблона содержат в себе 70% кода, который владельцами сайтов на деле не используется. (У некоторых популярных шаблонов возможно удалять неиспользуемые библиотеки через настройки.)
Помимо данного факта, в любой шаблон встроены 20+ плагинов — от слайдеров и контактных форм до конструкторов или билдеров и интернет-магазинов на Woo.
Даже для виджета фильтра товаров — отдельный плагин. Да и вообще часто встречаю тенденцию у владельцев WP: по всем задачам всегда установка плагина. Иконки в меню — плагин. Поменять цвет иконок — второй плагин. Перевести плагин на русский язык — третий плагин.
Вот так и копится хлам, лишние библиотеки в коде. Иногда до смешного доходит: 3 одинаковых JQuery библиотеки в хедере от разных модулей.
Банальный пример. Contact Form 7 для форм не используется на большинстве страниц, при этом загружает везде свои библиотеки глобально. Тем самым замедляя загрузку страниц сайта.
Разработчики WordPress-тем Themeforest пытаются сделать продукт универсальным для всех сфер бизнеса. Поэтому и имеем 100+ демо страниц после нажатия кнопки «импорт демо», которые глубоко осядут в БД даже после их удаления.
Вот и главные источники проблем со скоростью: визуально сайт простой, а в коде DOM вложенность на 2500+ классов, 200+ скриптов и стилей. Все это «добро» динамически генерируется с помощью базы данных, когда пользователь пытается зайти на ваш сайт.
По советам из интернета, или «как жигули не тюнингуй — мерседесом он не станет»
Десятки тысяч статей на тему: «как ускорить WordPress», «тесты модулей оптимизации и кэширования».
Плагин — это инструмент. Я считаю, что установить себе на сайт маленький модуль для чистки мусора в БД или модули для импорта или экспорта, автопостинга в соцсети — это нормально.
Но все известные бесплатные, платные плагины оптимизации максимум могут: сжать код, изменить очередь загрузки скриптов/стилей, включить кэширование и lazy load. Все! WP Fastest Cache, Autoptimize, WP Rocket и т.д — плюс минус одно и тоже.
А кто имеет административные права работать с версткой шаблона? DOM-деревом? Исправлять ошибки валидации кода? Человек!
В шаблоне всегда основная проблема. Как он сделан, на каком фреймворке построен, откуда подгружает шрифты и библиотеки. Возьмите стандартную тему WordPress из коробки, она работает молниеносно.
- Банальный пример № 1. В шаблоне через wp_enqueue_style() настроена подгрузка 5 библиотек иконок, при этом на деле используется всего 1. Плагинам оптимизации это по-барабану, удалить лишние они не могут. В итоге на вашем сайте загружаются 4 лишних бесхозных библиотеки. Мейнстримом бесхозности в коде являются библиотеки встроенного редактора Gutenberg (block_scripts_and_styles).
- Банальный пример № 2. Гражданин А. решил настроить у себя на сайте кэширование и устанавливает для этого плагин. Плагин в свою очередь вносит записи в. htaccess, добавляет свою рекламу в комментарий кода и создает отдельную папочку в корне сайта для статических файлов. Вставить код в. htaccess можно самостоятельно или попросить поддержку хостинга (в худшем случае) проделать тоже самое. В ips manager и вовсе это решается почти одной кнопкой.
Количество HTTP запросов — да, можно сократить плагином за счет объединения библиотек, но это может сделать программист на этапе разработки сайта.
Мошенники и супер-оптимизаторы с $5-бирж
Как накручивают 100 баллов на Google PageSpeed описано в этой статье.
Большинство фрилансеров с дешевых бирж удаленной работы вешают на ваш сайт те самые плагины оптимизации и пытаются задушить шаблон сайта кэшированием и сжатием.
Безусловно это дает прирост к скорости в тестах, уменьшает время до первого взаимодействия с сайтом, но по факту основные проблемы не искореняются.
Какой в здравом уме человек будет работать 3 дня за 500 рублей с кодом сайта? За 500 рублей Вам в течение часа поставят парочку модулей, попивая кофе! А кто-то за аналогичную работу возьмет и 1500 рублей. Вот и вся «оптимизация».
Что имеем по итогу
На выходе имеем франкенштейна с тоннами плагинов и мусора в коде. С чрезмерной DOM-вложенностью, высокой нагрузкой на сервер. А еще хуже — задушенный сжатием и кэшированием сайт. Подобные сайты могут иметь ответ от сервера ниже 0,2 секунды, но пока из SQL базы «выковыриваются» блоки билдера, слайдера, контактных форм, товаров и второстепенных плагинов — проходит вечность.
Некоторые фрилансеры умудряются создавать лендинги на тяжелых шаблонах интернет-магазинов, использовать сразу два билдера на сайте (Elementor + Visual Composer).
Банальный пример. Ради одного слайдера на главной странице, горе-вебмастеры устанавливают тяжелый Slider Revolution. На Slider Revolution с его функциональностью легко создать отдельный сайт, а использовать его ради парочки слайдов и 1 строчки текста — верх безумия. Возьмите с гитхаба или codepen качественные решения. Быстро. Бесплатно. Без рекламы.
Интересный факт. Большинство людей думают, что Yoast SEO — это кнопка «SEO-продвижение», установил и завтра в топ. Господа, у Yoast SEO есть еще 200+ инструментов, например: анализ текста и микроразметка для соцсетей. А простые метаописания легко вывести в шаблоне руками и работать с function.php без Yoast и его рекламы в комментарии кода.
Как нужно делать
Все просто и равнодушно. Скупой — платит дважды. Заказчик 500-рублевых бирж — платит шестнадцатикратно. Есть конечно исключения, но в основном это так.
Для долгосрочной перспективы разрабатывать сайт необходимо c нуля из дизайна верстать под WordPress.Собирать семантическое ядро и писать контент. И будет здесь, и зеленая зона в PageSpeed Insights, и поисковой трафик.
Либо, если нет денег, тщательно подбирать качественный шаблон, на основе которого возможно запустить хороший проект. Оптимизировать шаблон руками и максимально снижать количество используемых плагинов.
Если необходимо проверить идею и совсем нет денег — лучше воспользуйтесь конструктором сайта. Поверьте, на тяжелых сборках из трех десятков плагинов — результатов в поиске не будет.
Что выгодно для разработчика — не всегда выгодно для вас. К сожалению, но многие удаленные исполнители обещают золотые горы и уникальные дизайны, а на самом деле скачивают nulled из бесплатных файлообменников шаблон WordPress и собирают подобные «солянки».
Фрилансер, веб-студия — заработали, вы в будущем будете переделывать сайт, переходить на «Битрикс» или OpenCart и говорить: «WordPress — хлам, ужас, не очень:(»
Но ведь WordPress именно хлам, ужас и не очень. Он как раз сидит в нише «500 рублевых бирж». Есть исключения, но за годы наблюдения видно, что там 99% проектов именно из говна и палок или темы темфореста собраны. И собирают именно так, как вы описали, на каждую задачу ставится новый плагин, а потом плагины, чтобы пофиксить другие плагины. Если почитать популярные WP чаты, даже по ним видно, что разработчиков, кто реально сможет сам собрать на ВП качественный проект — единицы. Но там бюджеты начнут расти быстро, и потребность в ВП там становится ещё более сомнительной.
Это неплохо, это позволяет быстро и дёшево обкатать свои идеи и попробовать получить сайт не вливая бюджеты. Но сейчас, попробовать проще, дешевле и быстрее будет на конструкторе. Понять свои потребности, составить требования к сайту и идти делать на чём-то более серьезном.
Почти все, если не все проблемы что вы описали, это следствие того что "WordPress - хлам, ужас, не очень:(". WordPress сам побуждает делать всё криво и косо, просто потому что он не предоставляет практически никакого API для разработчика. Из-за чего каждый разработчик плагинов и сайтов делает как он считает нужным и переизобретает велосипед. Вы же сами приводите последствия данной проблемы:
Банальный пример. Contact Form 7 для форм не используется на большинстве страниц, при этом загружает везде свои библиотеки глобально. Тем самым замедляя загрузку страниц сайта.Что это, как не полное отсутствие внятного API для работы с библиотеками проекта? Это ведь одна проблема. А если дальше рыть? Как убрать эту библиотеку со страниц, где нет Contact Form, со всеми её зависимостями и мусором, что она подключает? Это не тривиальная задачка, я видел как такие задачи решают в WP, это костыли, а не решение. В нормальных системах такая проблема будет отсутствовать в принципе. Это уже давно научились автоматизировать.
Раз вы упомянули Contact Form. У WordPress полностью отсутствует Form API. В итоге каждый плагин, которому нужна форма, делает свои велосипеды, чтобы создавать формы. Кто-то сразу html хардкодит, кто-то тянет вообще сторонние библиотеки, кто-то придумывает свой From API и юзает его, и больше никто им не пользуется. Это приводит к полнейшему хаосу на проекте и неразберихе. Нет единой точки входа и выхода. Из-за чего также часто хакают плагины и делают полный копипаст всего, чтобы поправить формочку.
И таких проблем очень и очень много. Если почитать вопросы по WP на том же тостере, почитать их телеграм чаты очень продолжительное время (или пройтись по хистори за год, например), вы поймете, что там решают одни и те же проблемы из года в год каждый день. Наверное там каждый день задают вопрос связанный с тем, что после переноса проекта сайт развалился, потому что WP до сих пор хранит домен сайта в БД. Подавляющее большинство вопросов является причиной того, что нет внятного API. И судя по всему, решать этот вопрос никак не хотят.
Не говоря уж о том, что современных техник, инструментов и подходов там крайне мало, ибо они держатся за легаси код и защищают его всеми силами, по непонятным для меня причинам. Рынок уже поменялся, сейчас не 2010, а они все примерно там, с проблемами тех лет.
Я бы посоветовал смотреть вообще в другую сторону от WordPress, с точки зрения разработчика, если вы не тот самый исполнитель за 500 рублей. Ибо о проблемах, что ежедневно решают в WP и на каждом проекте, в современных системах даже не думают, ибо уже годами отлажено и работает как часы. Вы не только перестанете воевать с надуманными проблемами в 2020, узнаете множество новых техник, лучших практик, подходов и будете расти как специалист.
Да нету альтернатив вп. При всех недостатках есть один, очень существенный плюс. Стоимость разработки. На любую задачу уже есть плагин вп. Да, иногда он решает не идеально. А нам и не надо идеально. И так сойдет.
Ваш вариант — чем заменить WP?
Комментарий удален модератором
Вы серъезно про отсутствие внятного API у WP или просто неделя выдалась тяжелой?)))
Contact Form... Ну один из первых плагинов, поэтому и такое дикое кол-во установок, количество не всегда переходит в качество... За 6 лет ребята так и не дошли до 5 звезд. Из 1800 отзывов 22% - это отзывы тройка, двойка и кол. Как по мне полный провал для плагина.
Для любых вещей, где с одной стороны хочется готовую админку, с другой стороны хочется оставить возможность дописывать в нормальном современном окружении (это чтобы не было проблем с деплоем, чтобы была куча вариантов docker-окружений с отладкой и лдогироавнием, чтобы внутри фреймворк типа Symfony) мы используем Drupal. В тогде - быстрый старт и цельное api, где нет такого как в WP - где каждый плагин живет своей жизнью.
Для интернет-магазинов и нагруженных сайтов WP явно не идеал.
Но для информационного, корпоративного сайта с услугами или для сайта-визитки WP вполне подходит. Соглашусь с автором, что при создании сайта лучше сразу сделать нормально с нуля, чем на шаблоне. Выгоднее один раз пройтись по стандартным этапам цели-структура-прототип-дизайн-верстка-наполнение, чем выгребать лишнее из шаблонов, добавлять кучу плагинов, оптимизировать, допиливать, подкручивать и так далее.
В статьях я описывал создание и продвижение корпоративных сайтов. Они на WP с уникальным дизайном и трафик постоянно растет (ежемесячный seo трафик за год с нуля до 20тыс).
Так что поисковики любят нормальные сайты на WP.
Взять информационные блоги из топов, они на WordPress. Некоторые лоты WP сайтов на телдери иногда стоят пару миллионов рублей. Трафик на проектах бывает и 50 тысяч в день.
"Так что поисковики любят нормальные сайты на WP." Вы правы! Все зависит от подхода.
Вижу тут не очень то WP жалуют. Почитайте мое мнение о переходе с Django на Wordpress
https://alimuradov.ru/kak-ja-pereshjol-s-django-na-wordpress/
Это очень печальная статья, на самом деле. И она отлично иллюстрируют контингент "разработчиков" WordPress.
Вы только вчитайтесь:
Меня лично побудило перейти с Django на WordPress несколько факторов.Для правильной разработки на Django нужен общий высокий скил. Как в программировании на Python так и в администрировании на Linux.
Сложность обновления. Грамотная разработка на Django требует разработки в GIT. Я с GIT знаком на ВЫ, поэтому у меня часто при обновлении проекта случались конфузы. ТО миграции не так применятся, и база поломается, то что то еще.
Вместо того чтобы разобраться с инструментом, посидеть, покурить мануалы, попробовать на своих проектах исправить проблемы и заткнуть пробелы в знаниях, было решено взять инструмент попроще? Что? Это не мышление и подход разработчика. Если минимальные проблемы сразу заставляют искать вообще другие инструменты, вместо того чтобы разобраться в проблеме и больше не нарываться.
Особенно Git? Серьезно? Там минут 30-60 и можно пользоваться, неделя-две практики, и он уже от зубов отскакивает.
Так и получается взрывная смесь для заказчика. Голая система, без внятного API, побуждающая изобретать велосипеды, и разработчики, которые её взяли как раз потому, что у неё API как две копейки, и кажется что легко на ней делать. Но любой шаг в сторону заканчивается костылями и часами непонятной работы.
Грустно от всего этого.
Да, все так. Но практика показывает, как не оптимизируй вп, не будет он грузиться меньше 3 секунд. Если это woocommerce, конечно. Да, можно вложить кучу времени и сил, разработать свой шаблон где все будет гладко. Но, по моему мнению это секунда загрузки того не стоит. Пользователи не заценят, поисковикам пофиг. Единственный Профит это сокращение запросов в бд и повышение производительности. Актуально когда большая посещаемость.
За идеи на WordPress поднимать интернет магазин нужно в голову гвоздь вбивать сразу.
А скорость загрузки WP как движка (про не меньше 3 секунд) решается кешированием страниц.
Просто не используйте темы, а заказывайте разработку и все будет отлично!
Спасибо за упоминание статьи про фейковое ускорение. Это набрало и правда неприличные масштабы после публикации сервиса. Его поддержку мы прекратили с недавнего времени. Но принцип и суть работает до сих пор.
С Вордпресс всё хорошо. Если его использовать как хедлесс, то он прекрасен и супер универсален. С нуля сделанная тема по хорошему ТЗ может решать отличные задачи как сайта услуг так и интернет-магазина.
Всё зависит от прямых рук и возможности учиться у лучших, экспериментируя и тестируя разные практики.
А подскажите как решить задачу, чтобы заказчик в дальнейшем мог менять слайдеры через панель управления без кода, если я буду пользоваться не Slider Revolution, а кодом из codepen?
Костылем, разумеется. А если без шуток, то все эти статьи клепают веб-разработчики, у которых за последние пару лет замаячила реальная перспектива остаться без работы. И с каждым годом схема "сделай очередное самописное недоразумение и посади клиента на абонку" работает все хуже и хуже. Отсюда и горение в адрес готовых решений. Это вы еще и мнения про no-code сайты не читали :)
Напишите мини плагин конкретно под ваш слайдер. Который не будет добавлять лишнего кода.
Для простых каруселей можно взять легкие плагины, например smart slider 3.
На revolution создают сложные параллакс слои, 3D анимации и т.д. Его потенциал безграничен. В версии 6.0 добавили более тонкую настройку оптимизации, но скорость загрузки и тяжесть библиотек оставленных на всех страницах - оставляет желать лучшего, особенно когда на сайте пара строчек текста и 1 слайд.
Простой вариант- придется поставить плагин ACF. Золотой стандарт плагина.
Создаете поле Картинка - в необходимом кол-ве.
Для нужной страницы заполняете эти поля картинками (или меняете в дальнейшем на новые картинки).
В шаблоне выводите это поле, добавив обертку слайдера.
Вот собственно и все)))
Можно добавить условия в настройках - использовать поле для какой-то определенной страницы и т.д. Если поле не пустое, то выводить нужный скрипт инициализации слайдера и прочая.
Или вообще без плагинов - https://wp-kama.ru/id_7686/miniatyury-dlya-elemetov-taksonomij.html
Спасибо большое за статью, очень интересно было читать. На мой взгляд имеет место быть и возможность создавать сайты на переработанном nulled шаблоне. С каждым проектом улучшая саму систему. Как один из инструментов для создания может быть. А более сложные проекты уже более серьёзным системам.
Вы серьезено? nulled шаблон на wordpress? а что мешает купить официальный шаблон? А потом 100500 тысяч зараженных сайтов.
Я с Вами согласен. Nulled шаблоны с новой версией темы кто-то продает даже официально через paypal, за 5-10$. Складчины. В руках грамотного человека все будет работать нормально)
В статье я именно хотел обратить внимания на паблик nulled шаблоны с файлообменников, с вирусами и дырами (например Wp Vcd).
ВП это идеальное решение под практически любой проект. А вот то, что большинство проектов из говна и палок, так это на любом движке так будет, который бесплатный и в который не надо вливать денег. Ну и рукожопство никто не отменял ) У меня в работе проект, по функционалу затачивался как этот проект vc.ru, только тематика узконаправленная, практически все реализовано как на данном проекте. Зеленая зона гугла. Сайт шустрый. Плагинов минимум.
ни о чем
По мне так, 90% статей на vc-коммерческие