Що таке GIF? 256 кольорів, анімація та стиснення LZW

GIF (Graphics Interchange Format) - один із найстаріших форматів зображень у вебі. Фотографії він давно поступився JPG, а графіку - PNG, але досі першим спадає на думку, коли йдеться про короткі зациклені анімації. У цій статті пояснюємо, як з'явився GIF, як працюють його стиснення та анімація, що насправді означає обмеження в 256 кольорів і які формати можна розглянути натомість.

Коротка історія

GIF розробила CompuServe, одна з великих онлайн-служб того часу. Згідно з реєстром PRONOM Національного архіву Великої Британії, перша версія, GIF87a, вийшла 15 червня 1987 року. Наступна версія, GIF89a, отримала назву від 1989 року; текст специфікації, зазначений у PRONOM і розміщений на сайті W3C, датований 31 липня 1990 року. Версія 89a додала розширення Graphic Control Extension, яке визначає затримку кадру, прозорість і спосіб утилізації, а також розширення для коментарів, звичайного тексту та застосунків. Сучасні анімовані GIF побудовані саме на цих розширеннях.

Найвідоміший розділ історії GIF - патентна суперечка. GIF стискається алгоритмом LZW, який запатентувала Unisys. Згідно з описом формату від Бібліотеки Конгресу США, GIF здобув сумну славу 1994 року, коли Unisys почала брати плату за ліцензування LZW. Це призвело до розробки PNG як вільної від патентів альтернативи. За тим самим джерелом, американський патент Unisys сплив у червні 2003 року, а європейський і японський - у червні 2004 року, тож сьогодні для використання GIF ліцензія не потрібна.

Як працює GIF

Палітра та обмеження в 256 кольорів

GIF не зберігає колір кожного пікселя безпосередньо; він зберігає індекс у таблиці кольорів (палітрі). Згідно зі специфікацією, таблиця кольорів може містити щонайбільше 256 записів, кожен із яких є 24-бітним кольором RGB. Глобальна таблиця може застосовуватися до всього файлу, а кожен кадр може мати ще й власну локальну таблицю. Логотипи та ілюстрації з невеликою кількістю кольорів легко вміщаються в цей ліміт, а фото з тисячами відтінків після зведення до 256 кольорів показують смуги або візерунки дизерингу.

Стиснення LZW

Індекси пікселів стискаються без втрат алгоритмом LZW, який використовує коди змінної довжини; специфікація дозволяє кодам зростати до 12 бітів. LZW додає повторювані послідовності пікселів до словника, тож добре справляється з великими однорідними ділянками кольору і погано - із зашумленими фотографіями.

Прозорість

У GIF89a розширення Graphic Control Extension може позначити один колір палітри як "прозорий". Це прозорість за принципом "увімкнено/вимкнено" (двійкова): піксель або повністю видимий, або повністю прозорий. Тому напівпрозорі тіні та м'які краї в GIF виглядають зубчастими, а світлий "ореол" довкола країв на кольоровому тлі - така поширена проблема.

Анімація

Анімований GIF - це послідовність кадрів в одному файлі. Розширення Graphic Control Extension кожного кадру задає, скільки він залишається на екрані (у сотих частках секунди) і як очищується його ділянка перед наступним кадром. Відомості про зациклення зберігаються в розширенні застосунку. Необов'язкове черезрядкове відображення дозволяє зображенню з'являтися поступово під час завантаження.

Способи утилізації кадрів

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

Наскільки поширений GIF?

Дані W3Techs за жовтень 2026 року показують GIF на 13,2% вебсайтів, які вони відстежують. Згідно з Web Almanac 2024 від HTTP Archive, 16,8% зображень на мобільних сторінках - це GIF; за звітом, 32% із цих GIF анімовані. Там також зазначено, що близько 6% усіх запитів зображень - це зображення 1x1 піксель, найімовірніше, маячки відстеження та GIF-розпірки, тож висока частка GIF пояснюється не лише анімаціями.

За ефективністю GIF значно відстає. Той самий звіт оцінює медіанний GIF у 6,7 біта на піксель, проти 3,8 у PNG, 2,0 у JPEG і 1,3 у WebP. Для анімованих GIF медіана зростає до 32,6 біта, а неанімовані GIF залишаються на рівні 3,5 біта.

Чим можна замінити GIF?

Посібник MDN із форматів зображень вважає GIF добрим вибором для простих зображень і анімацій, але пропонує PNG для нерухомих зображень без втрат та індексованих, а WebP, AVIF або APNG - для анімаційних послідовностей. Для довгих анімацій або анімацій із реальних кадрів відео значно ефективніше: у прикладі на web.dev GIF розміром 3,7 МБ зменшується до 551 КБ у форматі MP4 і до 341 КБ у форматі WebM.

Поштові клієнти та деякі месенджери не відтворюють відео й не показують анімований WebP. Саме ця універсальна сумісність і є справжньою причиною, чому GIF прожив понад три десятиліття.

Типові проблеми

GIF завеликий

Кількість кадрів, розміри в пікселях і обсяг руху безпосередньо збільшують розмір файлу. Найефективніше зменшити розміри зображення, обрізати кадри або вирізати короткий фрагмент; для довгих кліпів краще перейти на відео.

Кольори виглядають смугастими чи крапчастими

Це природний наслідок обмеження в 256 кольорів. Найбільше страждають плавні градієнти, як-от небо чи тон шкіри. Для схожого на фото вмісту використовуйте JPG, WebP або відео замість GIF.

Довкола країв з'являється білий ореол

Оскільки прозорі GIF не можуть бути напівпрозорими, зображення, підготовлене на світлому тлі, на темному показує проміжні відтінки країв. Для прозорих зображень із м'якими краями використовуйте PNG або WebP.

Після конвертації анімація зупинилася

PNG і JPG не підтримують анімацію, тож анімований GIF, конвертований у будь-який із них, зберігає лише один кадр.

Поради щодо роботи з GIF

• Щоб отримати нерухоме зображення, конвертуйте GIF у PNG. Перший кадр GIF зберігається як PNG без втрат разом із прозорістю.
• Щоб зменшити розміри анімованого GIF, скористайтеся зміною розміру зображень. Під час зміни розміру анімовані GIF зберігають усі кадри та час їх показу (до 600 кадрів).
• Щоб обрізати анімацію, обрізання зображень застосовує однакове обрізання до кожного кадру й зберігає таймінги кадрів.
• Щоб зменшити розмір файлу, стиснення зображень залишає анімовані GIF у форматі GIF з усіма кадрами, а нерухомі GIF за замовчуванням конвертує у WebP, щоб зробити їх меншими.
• Щоб перетворити інше зображення на GIF, оберіть GIF як цільовий формат у конвертері зображень. Результат - один кадр до 256 кольорів, а напівпрозорі ділянки зводяться до прозорості "увімкнено/вимкнено".
• Усе це виконується у вашому браузері, тож ваші файли не залишають вашого пристрою.

Часті запитання

GIF - формат із втратами?

Стиснення LZW відбувається без втрат. Але щоб конвертувати повнокольорове зображення в GIF, його треба звести до 256 кольорів, і саме на цьому кроці зменшення кольорів відбуваються втрати.

Чи є різниця між GIF і анімованим GIF?

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

Чому GIF досі використовують?

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

Чи має сенс конвертувати GIF у MP4?

Якщо ви показуєте його на своєму сайті, зазвичай так. У прикладі web.dev відеоверсії займають приблизно від сьомої до десятої частини розміру GIF. Відео, що відтворюється з атрибутами autoplay, loop, muted і playsinline, поводиться на сторінці точно як GIF.

Скільки кольорів може мати GIF?

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

Джерела

• CompuServe: Graphics Interchange Format Version 89a (копія на сайті W3C)
• Національний архів Великої Британії, PRONOM: Graphics Interchange Format 87a
• Національний архів Великої Британії, PRONOM: Graphics Interchange Format 89a
• Бібліотека Конгресу США: опис формату GIF 89a
• MDN: посібник із типів і форматів файлів зображень
• web.dev: Replace animated GIFs with video for faster page loads
• W3Techs: статистика використання форматів зображень на вебсайтах
• HTTP Archive Web Almanac 2024: Media