Як збільшити швидкість завантаження сайту
Швидкість роботи сайту - один з найважливіших показників при створенні сайту і інтернет-додатків.
виходячи з цього, для вас було б доцільно зробити завантаження контенту сайту настільки швидкої, наскільки це можливо, щоб користувачі могли прийняти рішення, використовувати його далі чи ні.
Може це і поверхневе судження, але люди судять про сайтах по швидкості їх завантаження, так буває часто, і ми повинні приймати такий стан справ як належне.
Оптимізуючи роботу сайту, потрібно приділити особливу увагу швидкості його завантаження. На щастя, в WordPress і в інших двигунах існує багато хороших плагінів, які допомагають нам у цьому. Однак в цій статті буде враховано, що ваш сайт може бути на іншій платформі, відмінної від WordPress, тому ми розповімо про декілька ефективних способах оптимізації сайту, не залежних від того, де він розміщений. Перед тим як почати прискорювати сайт, воспользутесь сервісами в статті про онлайн перевірці швидкості зарузкі вашого блогу, щоб заміряти результати до і після оптимізації.
Прискорення сайту методом оптимізації зображень
Оптимізація розміру зображень може бути складним завданням, а її рішення має безліч варіантів, з яких можна вибирати. Це можуть бути формати файлів, різні інструменти оптимізації зображень, кращі приклади використання коду і CSS, які допоможуть вам зберігати зображення і взаємодіяти з ними найкращим чином.
Це не настільки актуально для веб-розробників і дизайнерів, але показує, наскільки важливо відображення зображення на різних платформах. Нижче наведено кілька найбільш важливих, на мій погляд, рекомендацій, які необхідно враховувати, оптимізуючи зображення для інтернету.
Форматування зображень - це найбільш важлива тема, і є такою тому, що кожен знає, що різні формати впливають на швидкість завантаження зображення. Однак існує сформовану думку на цей рахунок, яке ми можемо використовувати де-факто як стандарт. JPEG - для фотографій, GIF - для плоских зображень, що містять малу кількість квітів, і PNG - для всіх інших. Більшість веб-дизайнерів і розробників, яких я знаю, використовують PNG практично для всього, крім одноколірних і двоколірних кнопок, де вони використовують GIF.
Тепер ви можете погратися з наведеними специфікаціями, але завжди пам'ятайте про існування стандартів при збереженні маленьких легких картинок і великих і важких. Якщо ви займаєтеся сайтом по фотографії, а ваші картинки завантажуються довше, ніж на інших сайтах, то спробуйте скористатися наведеними нижче методами.
Найгірше, що ми можемо зробити і негативно вплинути на швидкість завантаження зображення, це дозволити коду автоматично виставляти розміри зображення. Ну що ж, можна сказати: «Дозволимо коду зробити ___ для нас». В такому випадку зазвичай кажуть: «Можеш зробити краще - зроби сам», і це дійсно правильно. Використовуючи такі показники, як width = '60px' height = '50px', можна дійсно знизити навантаження на сервер і час завантаження їм зображення, так як сервер зчитує інформацію про сторінку і бачить поставлені перед ним завдання. Тому, переконайтеся, що ви на вірному шляху і зробіть так з усіма вашими зображеннями.
Інструменти оптимізації зображень
- Якщо ви можете зробити це в CSS. то робіть в CSS
- Зменшуйте, зменшуйте, зменшуйте!
По можливості зменшіть DOM. Наприклад, ви часто використовуєте jQuery, який створює багато елементів DOM або все зчитує через DOM - все це значно уповільнює роботу вашого сайту. Є одне прислів'я, яка мені подобається і її можна використовувати в цьому випадку: «Якщо ви так робите тому, що це єдиний вірний спосіб, значить, існують і більш вірні способи». Ще можна сказати, «Якщо ви так робите тому, що це єдиний вірний спосіб, який ви знаєте, значить, ви робите це неправильно», але ця версія трохи жестковата.
Шукайте і знайдете шукане. Якщо ви працюєте з div-елементами в HTML тільки тому, що вони необхідні для якихось маленьких завдань, і знаєте тільки цей єдиний спосіб роботи, то він може бути не найкращим способом. Тепер, звичайно, я розумію, що використання тегів div необхідно для CSS, але можна знайти й інші способи їх застосування, крім стилізації.
Якраз нещодавно я сам прийшов до цього, так як вів роботу над проектом на Ruby on Rails. Трохи раніше на цьому тижні я зробив те, що давно хотів - один в один перевів близько 5 div-елементів в HAML (перемістив папку в папку і потім ще раз в папку). Я так зробив тільки тому, що не знав кращого способу, і в результаті у мене вийшла якась гидота, яку довелося переробляти. Така робота виявилася набагато складніше, але з неї я дізнався багато корисних речей, вона змусила мене вивчити новий спосіб вирішення подібних питань в майбутньому. Рухайтеся далі і отримуйте нові знання! Істина дуже близько.
Основні роботи по збільшенню швидкості завантаження сайту
Це настільки велика тема для розмови, що просто не вписується в рамки цієї статті, однак, я вважаю, заслуговує на окрему увагу. Фактично, деякі такі важливі речі можна використовувати для прискорення роботи вашого сайту або веб-додатки.
Браузери завжди шукають файли favicon.ico в кореневій папці вашого сервера, так що ви спокійно можете йти вперед і додавати favicon. Навіть якщо ви зробили щось тимчасове, favicon потрібно створити. Якщо favicon немає, браузер для себе видає помилку і лише кешируєт таку помилку в своєму розділі favicon.ico, що збільшує час на завантаження.
Підіб'ємо попередні підсумки. Це не всі способи, що допомагають поліпшити швидкість завантаження сайтів, але хороший початок для подальших пошуків і вдосконалення вашої роботи.