Зображення у Base64

Цей конвертер зображень у Base64 перетворює картинку на data URI, тобто довгий текстовий рядок, який вбудовує зображення безпосередньо, а також дає готовий фрагмент CSS для тла. Ви можете вбудувати зображення замість посилання на окремий файл.

Він працює локально у вашому браузері, тож ваше зображення зчитується на вашому пристрої і ніколи не завантажується.

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

Заковика в розмірі й кешуванні. Base64 додає приблизно 33 відсотки накладних витрат, бо подає двійкові дані обмеженим текстовим алфавітом, а вбудоване зображення не можна кешувати окремо, тож воно завантажується знову з кожною сторінкою, яка його містить.

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

Data URI працюють усюди, де приймається URL-адреса: в атрибуті src елемента img, у тлі CSS або в полі JSON чи поштового шаблону. Це робить їх зручними для самодостатніх фрагментів.