Apple-touch-icon a Apple-touch-icon-precomposed, jak na ně (Tipy a triky pro iPad)

Pokud provozujete webové stránky, možná víte co je favicon.ico – co ale možná nevíte je, že Apple zařízení (iPhone, iPod a iPad) budou váš web bombardovat požadavky na apple-touch-icon.png a apple-touch-icon-precomposed.png – tyto dva obrázky iPad používá pro ikony na ploše a potřebná velikost vytvářeného loga (ikony) je 72×72 bodů (pro iPhone jde o 114×114 bodů nebo 57×57 bodů pokud  jde o modely do 3GS).

Apple-touch-icon.png na JustIT.cz

Vytvořená ikona musí být umístěna do vašeho webu – buď přímo do hlavního (kořenové) složky nebo můžete využít META značku ve svých stránkách, která určí kde se ikona nachází.

<link rel=”apple-touch-icon” href=”…určení..kde..je…k..nalezení”/>

Existují i varianty určení pro různé rozměry ikon (použitých v iPhone a iPod zařízeních)

<link rel=”apple-touch-icon” sizes=”72×72″ href=”apple-touch-icon-ipad.png” />
<link rel=”apple-touch-icon” sizes=”114×114″ href=”apple-touch-icon-iphone4.png” />

Cesta určením pomocí META značky není nutná – v principu stačí použít 114×114 bodů velký obrázek,  umístit ho do kořenové složky a nechat vše na příslušném zařízení – pokud bude potřeba menší rozměr, dojde ke zmenšení. Pokud chcete vědět více, zde je dokumentace od Apple.

Apple-touch-icon z JustIT.cz a chybějící ikona na BookZ.cz

Stačí i použít pouze apple-touch-icon.png – druhá varianta (apple-touch-icon-precomposed.png) znamená, že nedojde k žádnému doplnění efektů a ikona bude použita přesně tak, jak jste zamýšleli. Apple je navíc tak důkladné, že může váš web prohledávat na existenci čtyř rozdílných souborů:

  1. apple-touch-icon-57×57-precomposed.png
  2. apple-touch-icon-57×57.png
  3. apple-touch-icon-precomposed.png
  4. apple-touch-icon.png

Některé zdroje doporučují apple-touch-icon.png vytvářet ve velikosti 129×129 bodů – pravděpodobně z důvodu zahrnut vlivu efektu, který Apple na ikonu aplikuje. Hlavní co Apple s ikonou udělá je vytvořený kulatých rohů.

Pokud ikona není přítomna, dojde k použití screenshotu webu – ve většina případů je tedy lepší, pokud pro svůj web potřebné ikony vyrobíte. Dostatečně dobrý důvod jejich vytvoření může být i to, že log soubor chyb 404 (nenalezené stránky) může obsahovat tisíce požadavků za den.