Hvordan legge til et nettsted ikoner for iPhone, iPad og iPod Touch

Favicon.ico - Nettstedet ikon i nettleseren

Før det lansert en nettside og legge til en grafikk-fil, faviconSom vises i nettleseren, adresselinjen. I de fleste situasjoner er favicon en miniatyr grafisk logo eller initialer respektive nettsider. Dette favicon er lagt for å hjelpe brukere med å identifisere en adresse raskere webbokmerker.

Stealth innstillinger favicon

Stealth innstillinger favicon i Safari

Favicon i Opera

Favicon i Opera

Inntil nylig, bør denne filen være på formen "favicon.ico"For å bli identifisert av nettleseren. Chrome, Internet Explorer, Opera, Safari, Firefox, etc.
For flere år, med fremme nye web språk, HTML5 si CSS3, Favicons kan være en .png fil eller . Jpg. Forutsetningen er at overskriften på nettstedet, før </ head>, Vær denne linjen:

<Link rel = "snarveisikonet" href = "/ images / favicon.ico" type = "image / x-icon" />

Nettstedet Ikon for iOS - iPhone, iPad og iPod Touch

In iOS vi kan legge Webside snarveier pe Hjem-skjermCPCiPhone, iPad si iPod Touch.

Hvordan legge til et nettsted snarvei på iPhone, iPad og iPod på Hjem-skjerm

Vi gjør dette ved å åpne en nettside på iPhone (Safari, Chrome, etc. nettleser), klikke på plassen med pilen (tegnet for "del" i iOS), og deretter "Legg til på Hjem-skjerm".

Hvis nettstedet har satt favicon for nettleseren din, men ikke satt iOS enhetsspesifikke icon sider, Vil skjermen vises et ikon som består av en forhåndsvisning nettside.

Hvordan legge til web ikoner for iPhone, iPad og Android.

Det første trinnet er åskape et bilde ikonDet vises på Hjem-skjermCPC iDevice samfunnet. For web-ikonet er kompatibelt på alle enheter og for å se klart, må vi skape image for alle iPhone- og iPad-vedtak.

Resolusjoner og standard størrelser av ikoner for iPhone, iPad, iPod og Android

  • Klassiske modeller av iPhone / iPod = 57 57 ×
  • iPad = 76 76 ×
  • iPhone / iPod Retina × = 120 120
  • iPad Retina × = 152 152
  • iPhone 6 / 6S Plus = 180 180 ×

eple oppdateres jevnlig Anbefalt ikonstørrelsenOmråder søknader si Websider pe denne siden.

For enheter Android, ikonene er to dimensjoner:

  • Android klassisk × = 128 128
  • Android høy oppløsning (Høyoppløselig) = 192 192 ×

ikoner

Etter at vi har gjort bildene, klatre opp på webserveren, HTML-kilden på nettsiden før den avsluttende </ head>, legge til følgende linjer:

<link href = "/ apple-touch-icon.png" rel = "apple-touch-icon" /> <link href = "/ apple-touch-icon-76x76.png" rel = "apple-touch-icon" size = "76x76" <link href = "/ apple-touch-icon-120x120.png" rel = "apple-touch-icon" size = "120x120" <link href = "/ apple-touch-icon-152x152.png" rel = "apple-touch-icon" size = "152x152" <link href = "/ apple-touch-icon-180x180.png" rel = "apple-touch-icon" size = "180x180" <link href = "/ icon-hires.png" rel = "ikon" size = "192x192" /> <link href = "/ ikon-normal.png" rel = "icon" sizes = "128x128" />

For enhetene Apple, og PNG bildenavn "rel =" må inneholde forstavelsen "eple-". For Android, vil filnavnet være "icon hires.png"Og"icon normal.png"Med rel =" icon ".

Det er helt nødvendig å skape bilder for hver oppløsning separat. Du kan lage et bilde for høy oppløsning og enhetene med lavere oppløsning, vil identifisere og vil sette ikonet.

iPhone Ikon Nettsted

Snarveien ikon vil se ut nettsiden til en hvilken som helst applikasjoner for iOS.

Hvordan legge til et nettsted ikoner for iPhone, iPad og iPod Touch

Om forfatteren

Stealth

Lidenskapelig opptatt av alt som gadget og IT skrive gjerne stealthsettings.com av 2006 og jeg liker å oppdage nye ting med deg om datamaskiner og MacOS, Linux, Windows, iOS og Android.

Legg igjen en kommentar

Dette nettstedet bruker Akismet for å redusere spam. Lær hvordan kommentaren din behandles.