20 способів пришвидшити веб-сайт

Менше речей розчаровує веб-сайт, який вимагає часу на завантаження. Тож не дивно, що не лише люди, а й пошукові системи намагаються уникати млявих сайтів. Маючи це на увазі, ось кілька найкращих порад, які ви можете застосувати, щоб уникнути набридливих відвідувачів та відхилення їх під час першого відвідування вашого веб-сайту.

1. Впорядкуйте свій код

Найкращий конструктор веб-сайтів зробить його розміщення досить простим. Хоча їх багатий набір шаблонів допомагає легко стилізувати веб-сайт, вони мають один недолік. Багато шаблонів мають брудний код, який може уповільнити ваш веб-сайт.

Щоб подолати проблему, ви можете видалити весь непотрібний код та форматування у файлах HTML, CSS та JavaScript. Цей процес видалення зайвого називається мініфікацією, і ви можете використовувати прості онлайн-інструменти, такі як мініфікатор Уіла Піві, щоб допомогти вам розпочати. Користувачі WordPress можуть використовувати плагін Autoptimize, щоб зробити процес досить простим.

2. Стисніть свій веб-сайт

Не потрібно довго, щоб веб-сайти ставали великими та важкими. Всі зображення і навіть текстові файли HTML, CSS та JavaScript швидко роздуваються. Одним з найкращих механізмів прискорення веб-сайту є увімкнення стиснення за допомогою Gzip. Це зменшить розмір відповіді HTTP, тим самим зменшуючи час відгуку.

Вам потрібно буде увімкнути відповідний модуль стиснення на своєму веб-сервері, перш ніж увімкнути його для свого веб-сайту, відредагувавши файл .htaccess. Точні кроки залежать від вашого веб-сервера, але ось як це зробити в Apache.

3. Оптимізуйте зображення

Зображення є однією з найкрутіших частин веб-сайту і, як правило, найповільнішим завантажувальним елементом на будь-якій веб-сторінці. Щоб запанувати в поведінці, замість того, щоб масштабувати великі зображення за допомогою HTML, почніть із зміни розміру всіх зображень на вашому веб-сайті до точного розміру, в якому ви їх хочете.

Насправді ви повинні зберігати список різних розмірів зображень для різних елементів на своєму веб-сайті, щоб ніколи не завантажувати більше пікселів, ніж вам потрібно. Якщо у вас є веб-сайт із важким зображенням, вам також слід подумати про його стиснення. Одним з найпоширеніших інструментів для цієї мети є reSmush.

Він працює з усіма популярними системами управління вмістом (CMS), а також має клієнт Linux CLI для стиснення зображень для використання на статичних сайтах. Ви також можете використовувати Compressor.io, щоб моментально стиснути кілька зображень.

4. Ліниве завантаження мультимедіа

Ледаче завантаження означає, що зображення, відео та фрейми завантажуються лише після того, як користувачі прокручують сторінку вниз і фактично їх бачать. Це може значно покращити початковий час завантаження ваших сторінок.

Раніше це було те, що ви могли б реалізувати за допомогою JavaScript, але не ліниве завантаження вбудоване у веб-браузери. Користувачі WordPress мають кілька варіантів, і два з наших фаворитів - Lazy Load by WP Rocket та a3 Lazy Load, який призначений для мобільних пристроїв.

5. Використовуйте швидкі посилання для обміну соціальними мережами

У наш час ви хотіли б, щоб люди ділились вашим вмістом у соціальних мережах. На простих веб-сайтах HTML ви можете використовувати інструмент генератора посилань, такий як безкоштовний генератор посилань Share, який допомагає створювати соціальні посилання для спільного використання для Facebook, Twitter, LinkedIn та Pinterest, не покладаючись на вставки або JavaScript. Як зазвичай, у користувачів WordPress не вистачає плагінів, які вони можуть використовувати для цієї мети, включаючи Social Warfare та Grow.

6. Видаліть непотрібні плагіни

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

Тим не менш, не всі плагіни розроблені однаково добре, і ви можете пришвидшити роботу веб-сайту, замінивши плагін на швидший альтернативний. Інтернет-інструмент GTmetrix безкоштовно проаналізує ваш веб-сайт і покаже вам список плагінів, які мають високий час завантаження. Розгляньте можливість заміни цих плагінів, особливо якщо вони викликаються кілька разів на більш легку альтернативу.

Користувачі WordPress також можуть використовувати плагін Query Monitor для детального аналізу плагінів, що використовуються на їх веб-сайті. Звичайно, не забудьте видалити сам плагін Query Monitor, коли він служить своєму призначенню.

7. Скоротіть переспрямування

Перенаправлення часто необхідні при переміщенні та видаленні сторінок і є найкращим способом усунення проблем із непрацюючими посиланнями. Але хоча 301 переспрямування є кращим перед 404 помилками, вони все ще не є ідеальними, оскільки уповільнюють час, необхідний браузеру для досягнення правильної версії сторінки. Ви можете скористатися засобом перевірки масового переспрямування Screaming Frog, щоб проаналізувати переспрямування на вашому веб-сайті та спробувати мінімізувати їх використання.

8. Робіть менше HTTP-запитів

Скорочення запитів HTTP - це хороший спосіб оптимізувати ваш веб-сайт. Кожен елемент, який ви додаєте на сторінку, перетворюється на запит HTTP. Чим більше браузеру потрібно робити ці запити, тим довше ваша сторінка займе повне завантаження. Ось чому, хоча це вимагає певних зусиль, результати зменшення кількості запитів дуже вражають.

Ви можете скористатися Інструментами розробника у браузері та перейти на вкладку Мережа, щоб детально переглянути запити HTTP. Отримавши уявлення про те, які файли завантажуються найдовше, ви можете шукати файли, які ви можете комбінувати (особливо файли CSS), і ті, які ви можете взагалі взяти.

9. Поставте CSS перед сценаріями

Правильне розміщення таблиць стилів та сценаріїв вплине на завантаження вашого сайту. Ви завжди повинні розміщувати свій CSS вгорі в розділі. Це дозволяє браузеру спочатку завантажити ваш CSS, щоб користувачі могли бачити вміст на вашому сайті.

Javascript, навпаки, повинен бути якомога ближче до нижньої частини. Це пов’язано з тим, що браузери повинні спочатку проаналізувати JavaScript, перш ніж він зможе перейти до наступного тегу. Якщо розмістити сценарії перед фактичним вмістом, користувачі будуть дивитись на порожню сторінку, поки браузер хрустить JavaScript.

10. Ходіть в олдскул, де це можливо

Використовуючи мову сценаріїв, як PHP, ви можете робити те, що неможливо за допомогою звичайного HTML. Однак обробка PHP займає більше часу, ніж розбір HTML, тому уникайте запиту інформації через PHP, якщо її можна отримати за допомогою статичного HTML.

Так само не завжди є гарною ідеєю використовувати механізм CSS @import для включення зовнішніх таблиць стилів на ваші веб-сторінки замість тегу HTML. Хоча обидва вони досягають однієї мети, @import використовує більше ресурсів, ніж пряме посилання на ваші таблиці стилів.

11. Увімкніть кешування

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

Якщо ви запускаєте сайт WordPress, ви можете використовувати такий плагін, як плагін W3 Total Cache, щоб легко включити кешування. З іншого боку, якщо у вас є статичний сайт HTML, ви можете ввімкнути кешування, використовуючи те, що називається заголовком Expires у вашому файлі .htaccess. Після ввімкнення заголовків із закінченням терміну дії не лише економить час, необхідний для завантаження вже кешованих файлів, але також допоможе зменшити кількість запитів HTTP.

12. Весняно чисті бази даних

Швидше за все, ви використовуєте CMS, як WordPress або Joomla, для розміщення вашого веб-сайту. У міру того, як ви возитиметеся з установкою (додавати та видаляти плагіни, створювати та оновлювати публікації, встановлювати оновлення тощо), база даних, що живить CMS, стане досить роздутою та повільною. Щоб цього уникнути, слід регулярно чистити базу даних за допомогою плагіна WP-Optimize.

13. Блок гарячих посилань

Гарячі посилання трапляються, коли хтось відображає зображення з вашого веб-сайту, використовуючи його веб-посилання безпосередньо. Щоразу, коли воно завантажується, зображення витягується із сервера вихідного веб-сайту.

У вас є кілька варіантів запобігання гарячим посиланням. Багато відомих хостів пропонують перемикання в інтерфейсі адміністрування, щоб запобігти гарячим посиланням. Потім є плагіни WordPress, такі як All In One Security & Firewall, які забезпечать захист від гарячих посилань. Нарешті, ви можете додати інструкції у файл .htaccess.

14. Увімкніть / вимкніть параметр «Зберегти живим»

Повідомлення Keep Alive обмінюється між веб-сервером та клієнтською машиною, щоб дозволити одне і те ж з'єднання tcp для розмови HTTP, замість того, щоб відкривати нове з кожним новим запитом. Також відомий як постійне з’єднання, Keep Alive допомагає зменшити затримку наступних запитів. Більшість хостингових компаній, особливо у спільному хостингу, вимикають цю функцію.

Налаштування найкраще контролюється налаштуванням веб-сервера. Однак ви можете замінити стандартний сервер, додавши наступні рядки у файл .htaccess:

Набір заголовків Підключення, що підтримує життя

15. Прискорення WordPress

WordPress має кілька плагінів для підвищення продуктивності, які допоможуть оптимізувати різні аспекти веб-сайту. Одним з найбільш всеосяжних є перфматер, який використовує багато загальновживаних методів прискорення продуктивності. Хороша сторона цього преміум-плагіна полягає в тому, що більшість його методів оптимізації відображаються через простий користувальницький інтерфейс, що робить його доступним для всіх типів користувачів.

16. Встановіть Google PageSpeed

Google PageSpeed ​​- це набір модулів з відкритим кодом для веб-серверів Apache та Nginx. Вони допомагають оптимізувати ваш веб-сайт, впроваджуючи деякі найкорисніші методи підвищення ефективності, подібні до тих, про які ми розповіли в цій статті. Ви можете завантажити та встановити модулі на свій веб-сервер, якщо ви є його власником. В іншому випадку вам доведеться шукати хостинг-провайдера, який це робить. Зазвичай веб-хости пропонують це лише за допомогою спеціальних планів хостингу найвищого рівня, хоча деякі, як GoDaddy, встановлюють його на своїх хостингових серверах Linux.

17. Скоротіть пошук DNS

Одним з основних факторів, який безпосередньо впливає на те, як швидко завантажується ваш веб-сайт, є кількість часу, необхідного для пошуку DNS. Пошук DNS - це процес пошуку IP-адреси, пов’язаної з URL-адресою.

Одним із способів пришвидшити роботу веб-сайту є зменшення кількості унікальних імен хостів. Менша кількість запитів DNS зменшить час відгуку та спричинить швидше завантаження веб-сайтів. Також враховуйте той факт, що кількість часу, необхідного для запиту записів DNS, залежить від швидкості роботи постачальника DNS.

Якщо ви не задоволені роботою вашого постачальника послуг DNS, спробуйте перейти на інший. DNSperf відстежує швидкість запитів різних авторитетних постачальників DNS.

18. Оновіть до кращого веб-хоста

Якщо ви намагалися пришвидшити роботу веб-сайту, але не помітили великої різниці, цілком може виникнути проблема у веб-хостингу. Багато найдешевших веб-хостів, особливо загальних, переповнені і використовують сервери, на яких бракує ресурсів, щоб виділити достатньо для кожного веб-сайту. Натомість вам слід витратити деякий час на вивчення різних пропонованих варіантів, перш ніж навести хоста та план хостингу для вашого веб-сайту.

19. Використовуйте мережу доставки вмісту

Окрім переходу на кращий веб-хост, вам слід також розглянути можливість використання мережі доставки вмісту (CDN). На відміну від вашого сервера, який знаходиться в певному місці, CDN використовує мережу серверів, які в певному сенсі розподіляють ваш вміст на сервери по всьому світу, по суті, наближаючи його до своїх відвідувачів, незалежно від їх місцезнаходження. CDN прискорюють веб-сайт, зменшуючи фізичну відстань між вмістом та відвідувачами. Ви можете розміщувати всі типи вмісту за допомогою CDN і навіть використовувати декілька для націлювання на певні місця.

20. Регулярно контролюйте продуктивність

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

Подібним чином ви можете використовувати тест Google My Site для аналізу ефективності вашого веб-сайту на мобільних пристроях. На додаток до надання корисних показників, інструмент також поділиться рекомендаціями, які допоможуть вам пришвидшити роботу вашого веб-сайту для мобільних пристроїв.

  • Ми запропонували найкращий веб-хостинг Wordpress.

Цікаві статті...