Використання нового типу зображень може стати відмінним способом прискорити роботу вашого сайту, зменшивши розмір файлу в кілька разів. У сьогоднішньому тексті ми вирішили провести невелике порівняння, стиснувши розміри картинки й перетворивши з PNG у WebP. Ми покажемо вам різницю між оригінальним видом і покращеним варіантом.
Усі ці процеси дадуть можливість накладати текст на зображення, не навантажуючи мережу клієнта. Це дозволить краще контролювати як екранну, так і мобільну версію сайту.
Конвертація ваших зображень з PNG у WebP може бути дуже доречною, коли справа доходить до прискорення роботи вашого сайту. І якщо ви використовуєте плагіни Optimus і WordPress Cache Enabler (допоміжний код, який спрощує публікацію інформації на онлайн-порталі), додаткова робота не буде потрібна. Зображення автоматично упаковуються до архіву та зменшують розмір у разі завантаження в медіатеку. Сидіть і насолоджуйтесь більш швидким часом завантаження. Ви також можете інтегрувати їх до будь-якого проєкту з нашими поліпшеними зображеннями. Маленька, але важлива деталь: наразі картинки нового формату підтримують вже всі популярні веббраузери – Google Chrome, Opera, Firefox, Safari, Internet Explorer, але – саме найостанніші їх версії, а ось попередні – далеко не завжди. Слід врахувати цей факт, якщо ви розробляєте сайт для інтернет-платформ.
У WsizardsDev провели невеликий експеримент: використовували свій тестовий домен і завантажили 20 різних PNG-зображень з повною роздільною здатністю 512 x 512 пікселів. Потім запустили їх через свій плагін, щоб перетворити у WebP. І, прогнозовано відзначивши проблему із завантаженням контенту сайту при відмові коректного відображення картинки png-формату, вони спробували застосувати просте стиснення картинок PNG-формату. Що в підсумку? Стиснення їх PNG призвело до зниження середнього розміру зображення на 31,86 %. Optimus в свою чергу здійснює подібну операцію без втрат якості. Тобто, перекладаючи на людську мову, зображення виглядають такими ж чіткими, як і раніше. Але найцікавіше те, що WebP привів до зниження середнього розміру зображення на 42,8 %. Таким чином, у цьому сценарії просте перетворення в даний тип зменшило вже стислі PNG ще на 11 %. Завдяки отриманому результату стало можливим вставити більше файлів нового формату, зберігаючи стабільну швидкість роботи сайту на пристрої клієнта.
Потім у компанії провели інші тести з новим форматом зображень і старим PNG. «Перемогла наша поліпшена версія (WebP). Це дозволило працювати сайту більш плавно на мобільних пристроях.
Час завантаження: 2,145 сек. проти 5 секунд.
Загальна вага сторінки: 849 кілобайт замість 1,2 мегабайта.
Висновок: ця технологія як мінімум варта вашої уваги.
Ми, команда WizardsDev, розробимо професійний сайт для вашого бізнесу. Оптимізуємо вебсторінки належним чином. Коректне відображення всіх елементів сайту дозволить збільшити потік нових клієнтів і зберегти старих постійних відвідувачів. Ми маємо великий досвід роботи з великими корпораціями та фірмами, що представляють малий бізнес. Чарівники впораються!
А тим, хто хоче стати членом нашої дружної команди, але відчуває, що потрібно трохи підучитися, порадимо курси, які проходять у нашому коледжі deveducation.com. Майже безкоштовно (компанія надасть грант на навчання тим, хто зарахований на курс, у розмірі 85 % від вартості навчання), від 4 до 8 місяців, в залежності від курсу», – кажуть у компанії. Тим, хто успішно закінчить навчання, запропонують працевлаштування у WizardsDev. Лети в IT!
← Було дуже весело!