Web Studio

WEB-CLASSIC

··· Загрузка ···



Как ускорить WordPress

16 способов ускорить загрузку вашего сайта

Как ускорить WordPress

Ускорение вашего сайта - единственный гарантированный способ получить больше трафика и увеличить продажи.

В 2010 году Google подтвердила, что скорость сайта является одним из более чем 200 показателей, которые влияют на ранжирование поиска. Их данные показывают, что, когда страницы загружаются медленно, люди тратят меньше времени. Тем не менее, большинство из нас мало внимания уделяет тому, чтобы наши сайты были быстрее. Возможно, тонкая настройка триггеров внутренней скорости вашего веб-сайта WordPress слишком сложна...

Если время загрузки составляет более 3 секунд или размер вашей страницы превышает 2 МБ, это может быть большой проблемой, которая стоит вам денег, как в случае потери продаж, так и за счет платы за сервер.

Существует множество бесплатных онлайн-инструментов, таких как WebPageTest , GTmetrix , Google PageSpeed Insights и Pingdom, которые могут помочь вам определить проблемы, которые вызывают медленное время загрузки и плохой пользовательский опыт для вашего сайта.

1. Включить сжатие

Сжатие ваших файлов CSS и Javascript поможет браузерам быстрее загружать их.

Сжатие Gzip может легко уменьшить размер файлов с 200 + KB (без сжатия) до менее 40 КБ (сжатый). До тех пор, пока ваш сервер имеет сжатие, используйте его.

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

Добавьте следующий фрагмент кода в файл .htaccess, чтобы включить сжатие для статических файлов.

AddOutputFilterByType DEFLATE application / x-httpd-php text / php text / html text / plain text / css text / xml application / x-javascript text / javascript application / javascript text / x-js

BrowserMatch ^ Mozilla / 4 gzip-only-text / html

BrowserMatch ^ Mozilla / 4 \ .0 [678] no-gzip

BrowserMatch \ bMSIE! No-gzip! Gzip-only-text / html

Заголовок добавить Vary User-Agent

2. Оптимизация изображений

Изображения являются основным виновником замедления работы сайта. Всегда оптимизируйте свои изображения (особенно те, что выше 50 КБ), прежде чем загружать их на свой сайт.

Оптимальным способом их оптимизации является использование Photoshop или любого другого программного обеспечения для обработки изображений. Сохраняйте изображения для Интернета с качеством изображения до 60%.

Вы также должны использовать прогрессивные изображения для JPG-файлов, потому что прогрессивная обработка изображений обеспечивает более плавный пользовательский интерфейс.

3. Переместите файлы Javascript в нижний колонтитул

Хотя библиотеки Javascript, такие как jQuery, Mootools и Prototype, являются удивительными, поскольку они расширяют функциональность вашего сайта, они также могут блокировать рендеринг ваших страниц.

Браузеры не загружают контент до тех пор, пока не будут загружены все файлы Javascript в заголовке страницы.

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

Если вы используете WordPress, вы можете перемещать вызовы скриптов из header.php в footer.php в свою тему и использовать true в качестве четвертого параметра всякий раз, когда вы используете функцию wp_enqueue_script.

4. Убедитесь, что у вас включен KeepAlive.

Apache (наиболее часто используемый сервер для общедоступных хостинговых планов в недорогих хостинговых компаниях) имеет отличную «функцию», называемую KeepAlive, которая поддерживает соединения для более чем одного HTTP-запроса.

Убедитесь, что KeepAlive включен в вашей хостинговой компании.

Если у вас есть доступ к вашему файлу httpd.conf, включите KeepAlive, убедившись, что у вас есть «KeepAlive On», иначе просто добавьте следующий фрагмент кода в ваш файл .htaccess.

  • <IfModule mod_headers.c>
  • Набор заголовков
  • </ IfModule>

5. Слияние файлов CSS. Встроенные небольшие CSS-файлы.

Браузеры обрабатывают столько запросов HTTP одновременно. Когда этот предел достигнут, некоторые файлы ждут, пока другие загружаются.

Объединив все ваши файлы CSS только в один файл CSS, страница становится намного быстрее.

Если у вас есть файлы CSS размером менее 2 Кбайт, тогда вы должны встраивать их вместо того, чтобы делать дополнительный HTTP-запрос.

В WordPress есть несколько отличных плагинов, таких как Autoptimize и Better WordPress Minify,которые могут помочь вам объединить или даже встроить ваши таблицы стилей CSS.

6. Включить кеширование

Кэширование значительно улучшает время загрузки страниц, которые часто не меняются.

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

W3 Total Cache , WP Super Cache и WP Fastest Cache - это всего лишь небольшой выбор бесплатных плагинов WordPress, которые обеспечивают различное кэширование, например кэширование страниц, кэширование базы данных и кэширование объектов.

7. Используйте сеть доставки контента

Независимо от того, используете ли вы CMS, например WordPress, Joomla, Magento, Drupal или пользовательский сайт PHP или HTML, я настоятельно рекомендую настроить сеть доставки контента (CDN).

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

Кстати, загрузка на вашем сервере также значительно сокращается благодаря CDN.

CloudFlare - бесплатный поставщик CDN и DNS среди других. MaxCDN также является отличным и доступным вариантом для оптимизации времени загрузки вашего сайта. Они оба хороши, как могут.

8. Минимизировать количество HTTP-запросов

Чем больше запросов HTTP вы получите, тем медленнее будет время загрузки вашего сайта.

Объедините ваши файлы CSS, объедините файлы Javascript и объедините изображения в спрайтах данных среди других, чтобы сделать как можно меньше HTTP-запросов.

Когда я работаю на сайте клиента, одной из моих основных целей является минимизация количества HTTP-запросов, загружаемых на страницу.

9. Выберите правильный тип файла для своих изображений.

Используйте JPG как свой по умолчанию. Это самый маленький и быстрый тип файла загрузки.

Используйте PNG только для изображений с текстом (JPG растеризует текст, который делает его размытым), или если вам нужен прозрачный фон.

Минимизируйте или даже устраните любые тяжелые файлы GIF, потому что они могут значительно замедлить время загрузки вашего сайта.

10. Исправить ошибки 404

Верьте или нет, любой недостающий файл генерирует ошибку 404 HTTP и определенно замедлит время загрузки вашего сайта.

Всегда проверяйте наличие ошибок 404 во время рендеринга ваших страниц для достижения наивысшего времени загрузки.

11. Позаботьтесь о размере своей страницы.

Хотя заманчиво отображать много контента на каждой странице, вы должны стараться, чтобы ваш размер страницы был минимальным.

Это еще более важно для мобильных телефонов. Необходимость загрузки сайта с 2 Мб через мобильный телефон в 3G-соединении - это рецепт катастрофы. Учтите, что пользователям не нравится ждать более 2-3 секунд для отображения страницы.

Добавляет ли новое изображение сайт? Если нет, то вы не должны добавлять его на свой сайт. Просто так.

12. Масштабирование изображений

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

Например, если у вас есть изображение размером 1200px x 675px, и вы хотите использовать «масштабированную» версию на 480px x 270px, создайте новую измененную версию исходного изображения и используйте это вместо этого.

Это изображение связано с «большой» версией изображения с использованием уменьшенного эскиза вместо изменения размеров изображения в HTML.

13. Использовать кеширование браузера

Google рекомендует минимальное время кеша в одну неделю и предпочтительно до одного года для активов, которые редко меняются.

Установите политику кэширования для всех ответов сервера на статические файлы (изображения, CSS и Javascript), чтобы браузер мог определить, может ли он повторно использовать ранее загруженный файл или нет.

Обычно это делается путем добавления этого фрагмента кода в файле .htaccess для планов совместного размещения

  • <Ifmodule mod_expires.c>
  • ExpiresActive On
  • ExpiresByType text / html "доступ плюс 7200 секунд"
  • ExpiresByType image / gif "доступ плюс 864000 секунд"
  • ExpiresByType image / jpg "доступ плюс 864000 секунд"
  • ExpiresByType image / png "доступ плюс 864000 секунд"
  • ExpiresByType text / Css «доступ плюс 864000 секунд»
  • ExpiresByType text / javascript «доступ плюс 864000 секунд»
  • ExpiresByType application / javascript «доступ плюс 864000 секунд»
  • </ ifmodule>

14. Оптимизируйте свою базу данных.

До тех пор, пока у вас есть сайт, основанный на базе данных (который включает WordPress и все другие сайты на основе CMS), убедитесь, что вы оптимизировали свою базу данных.

Контролируйте свой код для медленных запросов. Если вы находитесь на VPS или выделенном сервере, включите кеширование запросов и оптимизируйте конфигурацию сервера базы данных.

Хотя полная оптимизация базы данных может быть очень сложным и трудоемким процессом, phpMyAdmin предлагает вам несколько базовых вариантов оптимизации путем «оптимизации ваших таблиц».

15. Выберите свою хостинговую компанию с умом

Выберите план хостинга, соответствующий потребностям вашего сайта.

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

Ты получаешь то, за что платишь. Если у вас есть сайт электронной торговли, тяжелая CMS, много трафика или трафик, избегайте общих планов хостинга.

Я настоятельно рекомендую WPEngine управляемую хостинговую компанию WordPress для любого сайта электронной коммерции WordPress или любого сайта WordPress с шипами трафика.

16. Нанять специалиста

Моя цель - предоставить вам достаточно информации, чтобы начать оптимизацию скорости вашего сайта.

Но, как вы знаете, лучше всего нанять специалиста, когда важно правильно это сделать.

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

Я обновил WordPress до своей последней версии, перенес веб-сайт в надежную хостинговую компанию и применял корректировки оптимизации скорости для достижения наилучшего возможного времени загрузки.

Время загрузки - от 8.2 до 2.6 секунд. Первый байт и время начала рендеринга были оптимизированы до 0,147 и 0,384 секунды соответственно, а количество HTTP-запросов было уменьшено с 96 до 78. Google PageSpeed Insights также была оптимизирована до 88%.

Показатель отказов снизился примерно на 10% в течение нескольких недель. Клиент и, что еще важнее, пользователи веб-сайта были счастливы, и обслуживание сайта стало отличным опытом.

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

Представьте, насколько счастливы ваши пользователи, увидев супер быструю загрузку!