Якщо у вас є власний веб-сайт або ви розробляєте його для когось іншого, вам слід налаштувати піктограму збереженої закладки, яка з’являється на головному екрані користувача iOS. На скріншоті вище ви побачите спеціальну піктограму OSXDaily на екрані iPhone.

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

Як налаштувати та встановити значок Apple Touch для веб-сайту

• Створіть піктограму, переконайтеся, що вона має квадратну форму, тут на OSXDaily.com має розмір 512 × 512 пікселів, але ви можете вибрати інші квадратні розміри, якщо дійсно хочете – зауважте, що більший підходить для Retina дисплеї
• Збережіть піктограму головного екрана у форматі PNG і позначте її: apple-touch-icon.png
• Перемістіть apple-touch-icon.png у кореневий каталог веб-сервера, щоб отримати до нього доступ за адресою domain.com/apple-touch-icon.png
• Перевірте значок закладки на головному екрані свого веб-сайту, відвідавши сайт із Safari в iOS, а потім торкнувшись «Додати на головний екран»
• Подивіться на головний екран пристрою iOS, і ви побачите там збережену закладку з новою спеціальною піктограмою, як на знімку екрана вище

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

Для довідки, ось наше власне зображення apple-touch-icon.png, яке ми використовуємо для OSXDaily.com, цей приклад значка закладки створено та має відповідний розмір для дисплеїв Retina ():

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

Це, очевидно, не те саме, що мати спеціальну програму для iOS, але хороша ідея для мобільного користувача з Інтернетом — це гарна ідея, яка дозволяє уникнути високої ціни розробки програми для iOS.

І привіт, якщо вас турбують подібні речі, ви, напевно, використовуєте Photoshop принаймні для правильного дизайну значків? Тож подивіться, поки ви там.