Kuinka lisätä kuvakkeita verkkosivustoon iPhone, iPad ja iPod Touch

Favicon.ico - verkkosivustokuvake selaimessa

Ennen se avasi verkkosivuston ja lisää kuvatiedosto, favicon, näkyviin selaimessa osoiteriville. Useimmissa tilanteissa favicon on pikkukuva graafisesta logosta tai vastaavan verkkosivuston nimikirjaimista. Tämä favicon lisätään auttamaan käyttäjiä tunnistamaan verkko-osoite nopeasti kirjanmerkeissä.

Stealth Settings Favicon
Stealth Settings Favicon sisään Safari
Favicon Opera
Favicon Opera

Viime aikoihin asti tämän tiedoston oli oltava kunnossa. "Favicon.ico", jonka selain tunnistaa. Chrome, Internet Explorer, Opera, Safari, Firefox jne.
Useiden vuosien ajan, ja etenee uuden web kieliä, HTML5 si CSS3, Favicons voi olla .png tai .jpg. Ehtona on, että otsikko sivuston, ennenOlkaa tämä rivi:

IOS-sivuston kuvake - iPhone, iPad ja iPod Touch

In iOS voimme lisätä Web-sivun pikavalinnat pe Koti-valikkoCPC iPhone, iPad si iPod Touch.

Kuinka lisätä pikakuvake verkkosivustoon iPhone, iPadin ja iPodin aloitusnäyttö

Teemme tämän avaamalla verkkosivun iPhone (Safari, Chrome jne. Internet-selain), napsauta nuolella varustettua neliötä (iOS:n "jaa"-merkki) ja sitten vaihtoehto "Add aloitusnäyttöön".

Jos sivusto on asettanut favicon selaimen, mutta ei aseta iOS laitekohtainen kuvake sivustoja, Näyttö ilmestyy kuvake, joka koostuu esikatselukuva Web-sivu.

Kuinka lisätä verkkokuvakkeita verkkotunnukselle iPhone, iPad ja Android.

Ensimmäinen vaihe on luoda kuvan kuvakeJotka näkyvät Koti-valikkoCPC idevice yhteisö. Web ikoni on yhteensopiva kaikkien laitteiden ja nähdä selvästi, meidän on luotava kuva kaikille päätöslauselmille iPhone ja iPad.

Kuvakkeiden vakiotarkkuudet ja kuvakoot iPhone, iPad, iPod ja Android

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

Apple päivitetään säännöllisesti Suositeltava kuvakkeen kokoaURL-osoitteita sovellukset si verkkosivut pe tämä sivu.

Laitteille Android, kuvakkeet ovat kaksi ulottuvuutta:

  • Android classic = 128 × 128
  • Korkean resoluution Android (hi-res) = 192 × 192
kuvakkeet

Kun olemme tehneet kuvat, se ladataan web-palvelimelle ja verkkosivuston HTML-lähteeseen ennen sulkemista , lisätään seuraavat rivit:

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

Laitteille Apple, .PNG-kuvan nimen ja "rel =" täytyy sisältää etuliite "apple- ". Android-laitteessa tiedostonimet ovat "ikoni hires.png"Ja"ikoni normal.png”Rel =” -kuvakkeella.

Ei ole välttämätöntä luoda kuvia kullekin tarkkuudelle. Voit tehdä kuvan suurimmalla tarkkuudella, ja pienemmän tarkkuuden laitteet tunnistavat sen ja asettavat sen kuvakkeeksi.

iPhone-Sivusto-Kuvake

Sivuston pikakuvake näyttää samanlaiselta kuin mikä tahansa sovellukset iOS.

Teknologiasta kiinnostunut, kirjoitan mielelläni StealthSettings.com-sivustolla vuodesta 2006. Minulla on laaja kokemus käyttöjärjestelmistä: macOS, Windows ja Linux, sekä ohjelmointikielistä ja blogialustoista (WordPress) ja verkkokaupoista (WooCommerce, Magento, PrestaShop).

Miten » iHowTo » iHowTo - iOS » Kuinka lisätä kuvakkeita verkkosivustoon iPhone, iPad ja iPod Touch
Jätä kommentti