- Інструменти тестування швидкості сайту
- Оптимізація властивостей зображень
- Розмір файлу зображення
- формат
- Content Delivery Network (Мережа доставки контенту)
- Додаткова оптимізація
Зображення великого розміру можуть уповільнити швидкість вашого сайту, що негативно позначиться на його позиції в результатах пошуку, і рівні конверсій. Зображення повинні бути оптимізовані так, щоб домогтися кращого балансу між чіткістю, і розміром файлу.
Нижче, ми запропонуємо кілька інструментів для вимірювання швидкості сайту, і дамо поради щодо оптимізації зображень.
Інструменти тестування швидкості сайту
Швидкість сайту або швидкість сторінки є важливими факторами, що визначають їх рейтинг в пошукових системах. Такі інструменти, як PageSpeed Tools від Google і Website Speed Test від Pingdom скажуть вам, розмір яких зображень перевищує необхідний.
Сучасні веб браузери, також, включають в себе інструменти для розробників (наприклад, Chrome DevTools і Firefox Developer Tools ), Які, крім іншого, допоможуть вам виміряти швидкість сайту.
Оптимізація властивостей зображень
фізичний розмір
Переконайтеся, що фізичний розмір зображення (висота і ширина), не перевищує 1000 пікселів з найдовшої сторони. Фотографія, зроблена 5 мегапіксельною камерою матиме розмір в 5000 пікселів з найдовшої сторони, що набагато перевищує оптимальне дозвіл для веб-контенту.
Порада: при завантаженні зображень з камери, змініть ім'я файлу на щось, що пошуковому движку буде простіше індексувати. Наприклад, дефолтний ім'я файлу буде схоже на DSC00101.JPG. змініть його на щось, на кшталт longsleeve-kashmir-sweater.jpg.
Також, щоб урізати зображення з камери, ви можете використовувати програми для обробки графіки, або безкоштовні веб-сервіси, на зразок Pixlr .
Розмір файлу зображення
Розмір файлу ваших зображень не менш важливий, тому що він говорить про те, скільки місця він буде займати. Сайти, на кшталт TinyPNG і JPEG-Optimizer допоможуть стиснути ваші зображення, скоротивши час завантаження сторінок. Деякі графічні редактори, наприклад, Adobe Photoshop використовують функцію «Save for Web», яка робить те ж саме.
Зверніть увагу, що зображення вище не сильно відрізняються один від одного, але стислий варіант праворуч, завантажиться в 5 разів швидше.
формат
Формат зображення, це спосіб його кодування. Зображення можуть бути закодовані в різних форматах. У більшості ситуацій, JPG формат запропонує найкращий баланс швидкості завантаження і чіткості зображення. PNG файли зазвичай використовуються для такої веб графіки, як іконки або візерунки.
Content Delivery Network (Мережа доставки контенту)
Content Delivery Network (CDN) дозволяє оптимізувати доставку і дистрибуцію контенту кінцевим користувачам, кешіруя певні дані на мережевих вузлах. Наприклад, якщо хтось із Японії зайде на ваш сайт, то він буде отримувати дані з локального сервера CDN, розміщеного в Азії.
Додаткова оптимізація
Хоча це не пов'язано зі швидкістю сайту, ваші зображення повинні містити описові alt-теги, які будуть відображатися в разі, якщо з якоїсь причини зображення не буде завантажено. Це може бути корисно з кількох причин:
- Користувач сліпий, і для перегляду мережі використовує спеціальне програмне забезпечення
- У користувача ненадійне інтернет з'єднання
- Користувач відключив показ зображень в настройках браузера
Засіб Пошуку використовують alt-теги, щоб більше дізнатися про природу сайту, і використовувати цю інформацію для визначення його рейтингу в результатах пошуку.
джерело: bigcommerce.com
