Záložka webu jako ikona aplikace

Pokud provozujete internetovou prezentaci na níž jste zaregistrovali přístupy z mobilních zařízení, nebo dokonce provozujete internetové stránky optimalizované pro mobilní telefony, možná vám přijde vhod tenhle tip. Jednoduchým způsobem lze docílit toho, aby se uživatelům minimálně na iPhone, iPodu, iPadu a i v Android zařízeních, zobrazovala na HomeScreen záložka vašeho webu stejně jako aplikace.

Stačí k tomu jednoduchý zápis v hlavičce (head) webové stránky, pomocí kterého určíte cestu k ikoně pod kterou záložku webu v mobilu/tabletu chcete zobrazovat, na Fonky.cz je to takovýto krátký zápis:

<link rel="apple-touch-icon" href="http://www.fonky.cz/logo/fm.png" />

Cesta k ikoně (jak jsem se dočetl), by měla být uvedena formou absolutní URL – tedy obsahovat plnou web adresu a to kvůli zobrazování na Android zařízeních (ovšem mi fungovala i URL relativní). Na samotném umístění ikony pravděpodobně nezáleží, ale přece jen pro zajímavost – Apple ji má v ROOTu webu (www.apple.com/apple-touch-icon.png), myslím že dále k tomu zápisu není potřeba nic dodávat (každý webmaster pochopí).

Pro tyto účely jsem na Fonky.cz použil ikonu o rozměrech 72 x 72 pixelů, ovšem na velikosti asi příliš nezáleží, sice jsem se dočetl že správné rozměr jsou 56 x 56 pixelů, ale samotný web apple.com používá ikonu o velikosti 129 x 129 px. Jiný formát obrázku než PNG jsem netestoval.

Rád bych ujistil, že i přes název apple-touch-icon, se ikona zobrazuje minimálně i v Androidech.

Zobrazení ikony záložky v telefonu

Postup (Android): Požadovanou stránku si uložte do záložek (ve web prohlížeči který byl v telefonu již přítomen při zakoupení) a přejděte na tu obrazovku kde chcete vytvořit záložku. Podržte prst na tom místě obrazovky kde chcete vytvořit záložku → pak klik na Zástupce → klik na Přidat do záložek (mělo by být spíše přidat ze záložek) → (zobrazí se seznam vašich záložek) klik na Požadovanou záložku.

Výsledek, kliknete na ikonu a dostanete se na Fonky.cz (vidíte jak je TV program seznamu.cz malý 🙂

Doplním, že ten malý obrázek (v čemsi jako červená vlaječka) je klasická favicon.ico webu tv.seznam.cz.

Za tip na jiný způsob jak výše popisovaného dosáhnout vám budu minimálně já velmi velmi vděčný. Budu rád i za případné info, zda se ikona zobrazuje v Symbianech, BB, WP či jiných zařízeních.