Ikonok hozzáadása egy webhelyhez iPhone, iPad és iPod Touch

Favicon.ico - Weboldal ikon a böngészőben

Mielőtt elindított egy honlapot, és adjunk hozzá egy grafikus file, favicon, hogy megjelenjen a böngészőben, a címsorban. A legtöbb helyzetben a favicon a grafikus embléma vagy az adott weboldal kezdőbetűinek miniatűrje. Ez a kedvenc ikon hozzáadásra kerül, hogy a felhasználók gyorsan azonosítsanak egy webcímet a könyvjelzőkben.

Stealth Settings Favicon
Stealth Settings Favicon be Safari
Favicon Opera
Favicon Opera

A közelmúltig ennek a fájlnak formának kellett lennie. "favicon.ico", amelyet a webböngésző azonosít. Chrome, Internet Explorer, Opera, Safari, Firefox stb.
Több éve, előrehaladtával új webes nyelvek, HTML5 si CSS3, Favicons lehet egy .png vagy . Jpg. A feltétel az, hogy a fejléc az oldalon, előttLégy ezt a sort:

Webhely ikon iOS-hez - iPhone, iPad és iPod Touch

In iOS hozzátehetjük Weblap hivatkozások pe Home ScreenCPC iPhone, iPad si iPod Touch.

Hogyan lehet parancsikont hozzáadni egy webhelyhez a iPhone, iPad és iPod kezdőképernyője

Ezt úgy tesszük meg, hogy megnyitunk egy weboldalt a iPhone (Safari, Chrome, stb. internetböngésző), kattintson a nyíllal ellátott négyzetre (iOS rendszerben a „megosztás” jele), majd a „Add a Kezdőképernyőre".

Ha a webhely állított favicon a böngésző, de nincs beállítva iOS eszköz speciális ikon oldalak, A képernyőn megjelenik egy ikon, amely egy előnézeti kép weboldalt.

Hogyan adjunk webes ikonokat a következőhöz: iPhone, iPad és Android.

Az első lépés az, hogy teremt egy kép ikonJelennek meg Home ScreenCPC iDevice közösség. Web ikon kompatibilis az összes eszközt és tisztán látni, akkor létre kell hozni kép minden határozatához iPhone és iPad.

Felbontások és szabványos ikonméretek a iPhone, iPad, iPod és Android

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

Apple rendszeresen frissített Ajánlott ikon méretOldalak alkalmazások si Web oldalak pe ezen az oldalon.

Az Android készülékek, ikonok két dimenzió:

  • Android klasszikus = 128 × 128
  • Android nagy felbontású (nagy felbontású) = 192 × 192
ikonok

Miután elkészítettük a képeket, bezárás előtt feltölti azokat a webszerverre és a weboldal HTML forrásába , a következő sorokkal egészül ki:

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

Eszközökhöz Apple, .PNG képnév és a "rel =" tartalmaznia kell az előtagot "apple- ". Android esetén a fájlnevek a következők lesznek:ikon hires.png"És"ikon normal.png”Rel =” ikonnal ”.

Nem feltétlenül szükséges képeket készíteni minden felbontáshoz. Készíthet képet a legnagyobb felbontással, és az alacsonyabb felbontású eszközök azonosítják és ikonként állítják be.

iPhone-Webhely-ikon

A webhely parancsikonja hasonlítani fog bármelyikhez alkalmazások iOS.

Technológiai rajongóként örömmel írok a StealthSettings.com-on 2006 óta. Széles körű tapasztalatom van operációs rendszerekkel: macOS, Windows és Linux, valamint programozási nyelvekkel és blogolási platformokkal (WordPress) és online áruház platformokkal (WooCommerce, Magento, PrestaShop).

Hogyan » iHowTo » iHowTo - iOS » Ikonok hozzáadása egy webhelyhez iPhone, iPad és iPod Touch
Írj hozzászólást