Как добавить иконки на сайт iPhone, iPad и iPod Touch

Favicon.ico - Значок веб-сайта в браузере

Перед тем как она запустила веб-сайт и добавить графический файл, Favicon, чтобы появиться в браузере в адресной строке. В большинстве случаев значок - это миниатюра графического логотипа или инициалов соответствующего веб-сайта. Этот значок добавлен, чтобы помочь пользователям быстро идентифицировать веб-адрес в закладках.

Stealth Settings Favicon
Stealth Settings Фавикон в Safari
Favicon в Opera
Favicon в Opera

До недавнего времени этот файл должен был иметь форму "favicon.ico", который будет идентифицироваться веб-браузером. Хром, Интернет Эксплорер, Опера, Safari, Файрфокс и т.д.
В течение нескольких лет, с продвижения новых веб-языков, HTML5 si CSS3, Favicons может быть .png файл или . Jpg, Условием является то, что заголовок сайта, перед, Будь эта строка:

Значок веб-сайта для iOS - iPhone, iPad и iPod Touch

In iOS мы можем добавить ярлыков веб-страниц на Главный экранКТК iPhone, IPad si Ipod Touch.

Как добавить ярлык на сайт на iPhone, Главный экран iPad и iPod

Мы делаем это, открывая веб-страницу на iPhone (Safari, Chrome и т. д. интернет-браузер), нажмите на квадрат со стрелкой (знак «поделиться» в iOS), затем выберите опцию «Add на главный экран».

Если веб-сайт установил фавиконки для вашего браузера, но не установлен Система IOS устройств сайты конкретных значок, Экран появится значок, состоящий из предварительный просмотр изображений веб-страницы.

Как добавить веб-иконки для iPhone, iPad и Android.

Первым шагом является создать иконку изображенияКоторые появляются на Главный экранКПК чтения компакт-дисков сообщества. Для веб-иконы совместимы на всех устройствах и ясно видеть, мы должны создать образ для всех разрешений iPhone и iPad.

Разрешения и стандартные размеры значков для iPhone, iPad, iPod и Android

  • Modeклассический леле из iPhone / iPod = 57 × 57
  • iPad = 76×76
  • iPhone / iPod Retina = 120 × 120
  • iPad Retina = 152×152
  • iPhone 6 / 6S плюс = 180 × 180

Apple регулярно обновляется Рекомендуемый размер значкаURL-адреса приложений si веб-страницы на На этой странице.

Для устройств Android, значки два аспекта:

  • Android classic = 128 × 128
  • Android с высоким разрешением (hi-res) = 192 × 192
иконки

После того, как мы создали изображения, они загружаются на веб-сервер и в исходный HTML-код веб-сайта перед закрытием. , добавляются следующие строки:

<ссылка href="/apple-touch-icon.png ”rel =”apple-touch-icon »/> <ссылка href="/apple-touch-icon-76 × 76.png ”rel =”apple-touch-icon ”sizes =” 76 × 76 ″ /> <ссылка href="/apple-touch-icon-120 × 120.png ”rel =”apple-touch-icon ”sizes =” 120 × 120 ″ /> <ссылка href="/apple-touch-icon-152 × 152.png ”rel =”apple-touch-icon ”sizes =” 152 × 152 ″ /> <ссылка href="/apple-touch-icon-180 × 180.png ”rel =”apple-touch-icon ”sizes =” 180 × 180 ″ />

Для устройств Apple, Имя изображения .PNG и "rel =" должны содержать префикс "apple- ". Для Android имена файлов будут "значок hires.png"А"значок normal.png«С rel =» icon ».

Не обязательно создавать изображения для каждого разрешения. Вы можете сделать изображение с самым высоким разрешением, и устройства с более низким разрешением идентифицируют его и устанавливают в виде значка.

iPhone-Веб-сайт-Иконка

Значок ярлыка на веб-сайт будет похож на любой приложения для прошивкой.

Поклонник технологий, с 2006 года с удовольствием пишу на StealthSettings.com. Обширный опыт работы с операционными системами: macOS, Windows и Linux, а также с языками программирования и платформами для блогов (WordPress) и онлайн-магазинов (WooCommerce, Magento, PrestaShop).

КАК » iHowTo » iHowTo - iOS » Как добавить иконки на сайт iPhone, iPad и iPod Touch
Оставьте комментарий