Teknike

Ikona apple-touch-icon

Ikona që përdor iOS kur faqja shtohet në ekranin kryesor; mjeti kontrollon vetëm etiketën.

Çfarë është

<link rel="apple-touch-icon"> deklaron ikonën që iOS përdor kur një faqe shtohet në ekranin kryesor.

Ajo është e ndarë nga favicon-i dhe nga ikonat e manifestit, sepse iOS-i historikisht nuk e ka lexuar manifestin për këtë qëllim.

Përmasa e rekomanduar është 180×180 pikselë, PNG, pa transparencë dhe pa cepa të rrumbullakosur — sistemi i shton vetë.

Pse ka rëndësi

Ndikimi te renditja është zero. Vlera është vetëm te pamja, dhe vetëm për një sistem operativ.

Nëse askush nuk e shton sajtin tënd në ekranin kryesor, kjo etiketë nuk bën asnjë punë. Për shumicën e faqeve informative, kjo është situata.

Aty ku ka rëndësi është te mjetet dhe shërbimet që hapen rregullisht nga telefoni. Pa këtë etiketë, iOS-i krijon një ikonë duke bërë një pamje të vogël të faqes — një drejtkëndësh i turbullt ku nuk dallohet asgjë. Rezultati duket i papërfunduar.

Pra kjo është një ndërhyrje dhjetëminutëshe që ka kuptim vetëm nëse pyetja "a do ta shtojë dikush këtë në ekranin kryesor" ka përgjigje po.

Ka edhe një pasojë të vogël teknike: pa etiketë, iOS-i provon disa emra skedarësh te rrënja e domainit (/apple-touch-icon.png, /apple-touch-icon-precomposed.png dhe variantet me përmasa). Nëse asnjëri nuk ekziston, ato kërkesa kthejnë 404 dhe mbushin regjistrat me zhurmë që fsheh gabimet e vërteta. Deklarimi i qartë e ndal atë kërkim.

Si rregullohet

<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<!-- opsionale: përmasa të veçanta -->
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180.png">

Hapat:

180×180 PNG është e mjaftueshme si e vetme.
Pa transparencë. Zonat transparente dalin të zeza.
Pa cepa të rrumbullakosur dhe pa hije — sistemi i zbaton vetë.
Mbaje edhe te rrënja si /apple-touch-icon.png; iOS-i e kërkon aty edhe pa deklarim.
Dizajn i thjeshtë. Ikona shfaqet e vogël pranë aplikacioneve të tjera; një logo me tekst nuk lexohet.

Si e mat ky mjet

PWAAnalyzer::analyze() (services/PWAAnalyzer.php:54) kërkon //link[@rel="apple-touch-icon"]. Nëse gjendet, shton 10 pikë nga 100 dhe e vendos flamurin checks.apple_touch_icon (:55–58).

Asnjë konstatim nuk prodhohet në asnjë rast.

Çfarë NUK e mat

Si te ngjyra e temës, ky kontroll ndikon te nota pa e shpjeguar (services/PWAAnalyzer.php:54). Dhjetë pikë humbin ose fitohen pa asnjë rresht në raport.

Skedari i ikonës nuk merret. Nuk kontrollohet nëse URL-ja kthen 200, çfarë përmasash ka imazhi, apo nëse është PNG. Një etiketë që tregon te një skedar i fshirë merr të njëjtat pikë.

Kërkohet vetëm rel="apple-touch-icon" i saktë. Varianti apple-touch-icon-precomposed, që disa sajte e kanë ende, nuk njihet.

Nuk kontrollohet as rasti i zakonshëm ku ikona ekziston te rrënja pa u deklaruar — sjellje krejt e vlefshme, sepse iOS-i e gjen gjithsesi.

Kodi që e kryen matjen

services/PWAAnalyzer.php:54 — touchIcon
services/PWAAnalyzer.php:55 — apple_touch_icon