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

Favicon.ico - Nettstedsikon i nettleseren

Før det lansert en nettside og legge til en grafikk-fil, favicon, vises i nettleseren på adresselinjen. I de fleste situasjoner er favicon et miniatyrbilde av den grafiske logoen eller initialene til det respektive nettstedet. Dette favorittikonet er lagt til for å hjelpe brukerne med å raskt identifisere en nettadresse i bokmerker.

Stealth Settings Favicon
Stealth Settings Favorittikon inn Safari
Favicon i Opera
Favicon i Opera

Inntil nylig måtte denne filen være i form "favicon.ico", for å identifiseres 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, Vær denne linjen:

Nettstedsikon for iOS - iPhone, iPad og iPod Touch

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

Hvordan legge til en snarvei til et nettsted på iPhone, iPad og iPod-startskjerm

Vi gjør dette ved å åpne en webside på iPhone (Safari, Chrome, etc nettleser), klikk på firkanten med pilen (tegnet for "del" i iOS), og deretter alternativet "Add til startskjermen".

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 webikoner 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 oppløsninger av iPhone og iPad.

Oppløsninger og standard ikonstørrelser for iPhone, iPad, iPod og Android

  • Modeklassiske lele av iPhone / iPod = 57 × 57
  • iPad = 76x76
  • iPhone / iPod Retina = 120 × 120
  • iPad Retina = 152×152
  • iPhone 6 / 6S Plus = 180 × 180

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

For enheter Android, ikonene er to dimensjoner:

  • Android classic = 128 × 128
  • Android med høy oppløsning (høyoppløselig) = 192 × 192
ikoner

Etter at vi har laget bildene, blir de lastet opp på webserveren, og i HTML-kilden til nettstedet, før de lukkes følgende linjer er lagt til:

<link href="/apple-touch-icon.png ”rel =”apple-touch-icon ”/> <link href="/apple-touch-icon-76 × 76.png ”rel =”apple-touch-icon ”størrelser =” 76 × 76 ″ /> <link href="/apple-touch-icon-120 × 120.png ”rel =”apple-touch-icon ”størrelser =” 120 × 120 ″ /> <link href="/apple-touch-icon-152 × 152.png ”rel =”apple-touch-icon ”størrelser =” 152 × 152 ″ /> <link href="/apple-touch-icon-180 × 180.png ”rel =”apple-touch-icon ”størrelser =” 180 × 180 ″ />

For enheter Apple.PNG-bildenavn og "rel =" må inneholde prefikset "apple- ". For Android vil filnavnene være "icon hires.png"Og"icon normal.png”Med rel =” ikon ”.

Det er ikke helt nødvendig å lage bilder for hver oppløsning. Du kan lage et bilde med den høyeste oppløsningen, og enhetene med lavere oppløsning vil identifisere det og sette det som et ikon.

iPhone-Nettsted-ikon

Snarveiikonet til nettstedet vil ligne på alle applikasjoner for iOS.

Teknologiinteressert, jeg skriver med glede på StealthSettings.com siden 2006. Jeg har bred erfaring med operativsystemer: macOS, Windows og Linux, samt programmeringsspråk og bloggplattformer (WordPress) og for nettbutikker (WooCommerce, Magento, PrestaShop).

Hvordan » iHowTo » iHowTo - iOS » Hvordan legge til ikoner på et nettsted for iPhone, iPad og iPod Touch
Legg igjen en kommentar