Що саме є веб-шрифтом, і що передбачає перетворення в один?

Я прочитав кілька статей з цього приводу, але фактичні технічні відмінності між веб-шрифтами та шрифтами на робочому столі все ще уникають мене. Чим більше я читаю тему, тим сильніше відчуваю, що ніхто не має чіткого технічного визначення того, що саме є веб-шрифтом.

Коли я завантажую "настільний" шрифт до служби, що генерує веб-шрифти, наприклад FontSquirrel, що саме вони роблять з файлом шрифту, щоб зробити його веб-шрифтом? Якщо основним використанням цих сервісів є перетворення у різні формати, які формати фактично потрібні в сучасній мережі для підтримки розумної кількості браузерів станом на 2019 рік?

"Веб-шрифт" - це лише шрифт, який використовується в Інтернеті чи в браузері. Що роблять ці генератори веб-шрифтів, це просто полегшити ваше життя, надаючи вам необхідний файл css для подання шрифту відвідувачам та перетворення вашого шрифту у всі формати файлів, які вам потрібні, щоб переконатися, що шрифт працює перехресним браузером.

Деякі шрифти вважаються "безпечними для Інтернету", просто настільки поширеними, що кожен комп'ютер має їх, як "Arial". Вам не потрібно нічого робити, але скажіть веб-сайту використовувати цей шрифт. Веб-шрифти потрібно завантажувати у веб-переглядачі, оскільки якщо шрифт відсутній на вашому комп’ютері, ви його не бачите.

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

Досить важливо відзначити, що деякі шрифти можуть мати окрему ліцензію веб-шрифту, якої у вас може не бути, навіть якщо у вас є файли шрифтів. Як і зображення Google ... Тільки тому, що ви змогли завантажити зображення, не означає, що ви можете використовувати його для продажу після гоління вашої компанії.

Developers.google.com має хороший пост, який зосереджується на оптимізації веб-шрифтів, але також має щось про основи.

У цій статті є досить хороший уривок про різні формати:

Сьогодні в Інтернеті використовуються чотири формати контейнерів шрифтів: EOT, TTF, WOFF і WOFF2. На жаль, незважаючи на широкий вибір, не існує єдиного універсального формату, який працює для всіх старих і нових браузерів: EOT - це лише IE, TTF має часткову підтримку IE, WOFF користується найширшою підтримкою, але недоступний у деяких старих браузерах. , а підтримка WOFF 2.0 - це робота, що працює у багатьох браузерах.

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

Transfonter також має досить непогану таблицю щодо підтримки браузера:

Після того як я поставив це запитання, я провів більш детальне дослідження, і тому додаю цю відповідь як своєрідне доповнення до Joonas ', що було добре, але не відповів на моє останнє запитання досить детально для мене:

Якщо основним використанням цих сервісів є перетворення у різні формати, які формати фактично потрібні в сучасній мережі для підтримки розумної кількості браузерів станом на 2019 рік?

Багато розробників стверджують, що WOFF і WOFF2 - єдині формати шрифтів, необхідні в сучасній веб-розробці . Ці відповіді, однак, не є добрими, і я також думаю, що вони злегка надмірні, тому почнемо з перегляду фактичних даних про підтримку WOFF та WOFF2, люб'язно надавши CanIUse.com, який є галузевим стандартом для документування цього. щось таке.

Підтримка WOFF2

WOFF2 всіляко покращує WOFF, підтримується більшістю настільних браузерів, випущених після 2014 року, але лише з 2018 року він став підтримуватися більшістю мобільних браузерів. Це підтримується приблизно 93% браузерів у всьому світі.

Підтримка WOFF

WOFF почав підтримуватися Internet Explorer в IE9 (випущений у 2011 році), що робить формат EOT застарілим для версій IE, що випускаються з 2011 року. Його підтримують приблизно 97% браузерів у всьому світі.

Інші браузери настільних комп'ютерів почали підтримувати WOFF приблизно в той самий час, включаючи Firefox з Firefox 3.6, Chrome з Chrome 5 та Safari з 5.1 (випущені відповідно у 2010, 2011 та 2011 роках), завдяки чому формати TTF та OTF ¹ застаріли в попередніх версіях . Більшість мобільних браузерів підтримують WOFF з 2013 року.

Застереження та висновки

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

Частка версій веб-переглядача може істотно відрізнятися залежно від демографічних показників: такі фактори, як країна, соціальний клас та дохід, значно впливають на те, якими пристроями (а отже, і версіями браузерів) користувачі користуються. Як розробник, подумайте, чи буде сайт, який ви будуєте, використовувати демографічні показники, які, швидше за все, використовують ті старіші версії.

Якщо ви вирішили, що це так, і вам потрібно підтримувати настільні браузери старші 2011 року або мобільні браузери старші 2013 року, використовуйте повний стек шрифтів: WOFF2, WOFF, TTF (або OTF) та EOT.

Якщо вам не потрібно підтримувати ці старовинні веб-переглядачі, і все-таки вірно, що вам, швидше за все , ні, просто використовуйте WOFF2 і WOFF як стек шрифту з цього приводу.

_{(1) TTF і OTF - це традиційні формати шрифтів на робочому столі, і будь-який браузер, який підтримує один, підтримує інший, тому ніколи не використовуйте обидва}

Не багато.

WOFF - це не що інше, як стислий формат для TTF, що призводить до менших розмірів. Внутрішня внутрішність не змінюється. WOFF2 піде трохи далі, він трохи модифікує подання шрифту, щоб зробити трохи більше стиснення. EOT, будучи форматом лише для MS, взагалі не рахується. SVG - це практично лише контури, навряд чи більше, тому він не вважається справжнім шрифтом, використовуйте його лише для значків, якщо вони є.

Просто використовуйте WOFF і будьте з ним. Якщо ви хочете видавити останній байт, ви можете також запропонувати WOFF2, але різниця буде незначною.

Хочеться підкреслити щось дійсно базове: «веб-шрифт», окрім технічних відомостей про реалізацію, - це шрифт, на який ви отримали ліцензію, його автор або правовласник для конкретного завдання використання на веб-сайті. І вони надходять у форматі веб-шрифту. Якщо ви сидите перед генератором, щоб перетворити шрифт у формат веб-шрифту, і це не з відкритим кодом або той, який ви намалювали самостійно, зупиніться прямо там! Ви майже напевно зламаєте ліцензію і можете подати до суду. А оскільки це є в Інтернеті, людям легко знайти те, що ви робите, і перевірити їх список продажів.

Дивіться, наприклад, цього doofus , який зробив роботу в Facebook та Google, який не усвідомив, поки хтось не сказав йому, що технічно використовує піратський шрифт на своєму веб-сайті. У нього була ліцензія на підписку на робочий стіл, але це не ліцензія для використання в Інтернеті.