Spletni razvijalci in lastniki spletnih mest bodite pozorni: nastaviti morate ikono zaznamka iOS, pripravljeno za retina. Ikone zaznamkov se imenujejo ikona Apple Touch in te slike po meri postanejo ikona, ki je prikazana na domačem zaslonu uporabnikov, ko dodajo spletno stran med zaznamke v iPadu, iPhone ali iPod touch v sistemu iOS ali plošča z zaznamki v brskalniku Safari za OS X.Brez nabora datotek z ikonami apple-touch po meri bodo uporabniki dobili dolgočasno in pogosto grdo sličico same spletne strani, brez uporabe ikone, pripravljene za mrežnico, pa bo ikona zaznamkov na zaslonu novega iPada videti slikovita in na splošno grozna.

Tukaj je tisto, kar morate storiti, da v nekaj preprostih korakih ustvarite popolno Apple Touch ikono mrežnice za katero koli spletno mesto.

1) Ustvarite ikono spletnega mesta iOS, pripravljenega za Retina

Uporabite predlogo ali oblikujte svojo. Uporabil sem preprost komplet ikon za mrežnico, ki ga naredi sam, omenjen v prejšnji objavi, to je datoteka PSD, ki omogoča enostavno oblikovanje lepih ikon iOS kot klik ali dva. Prilepite logotip spletnega mesta ali podjetja in že ste pripravljeni. Če nimate ničesar za urejanje datotek PSD, je Photoshop CS6 beta odličen in brezplačen za prenos ter uporabo, dokler končna različica ne izide kasneje v letu.

2) Shrani kot PNG in poimenuj ikono zaznamka spletnega mesta Retina

Ikona mora biti PNG in imeti mora ime eno od dveh stvari. Vsako ime datoteke ponuja nekoliko drugačen videz ikone, kot je prikazana na začetnem zaslonu uporabnika:

• »apple-touch-icon.png« bo ikoni dodal prekrivni oblaček za označevanje
• »apple-touch-icon-precomposed.png« bo prikazal ikono, kot je bila prvotno ustvarjena, brez osvetlitvenega prekrivanja

Uporabite slednjo vnaprej sestavljeno možnost, če ste ustvarili svoj poudarek ali če želite, da je ikona videti bolj ploska brez vseprisotnega mehurčka, ki se pojavi na večini Applovih privzetih ikon.

3) Prenesite ikono dotika zaznamka spletnega mesta v osnovni spletni imenik

Uporabite odjemalca SFTP (OS X vključuje FTP v Finderju, CyberDuck ali Filezilla pa sta brezplačna), da kopirate datoteko apple-touch-icon.png v korenski spletni imenik. To je običajno ista lokacija, kjer se nahaja glavna indeksna datoteka spletnega mesta. Ko je naložen, potrdite, da je na pravem mestu, tako da odprete spletni brskalnik in obiščete »http://SITEURL.com/apple-touch-icon.png« ter se prepričate, da se naloži.

Tukaj je primer ikone zaznamka velikosti 512 × 512, pripravljene za mrežnico, z OSXDaily.com:

Upoštevajte, da brez zastavice -precomposed zgornja ikona prikaže oblaček za označevanje. Razliko med obema lahko vidite tako, da primerjate dejansko ikono s tisto, prikazano na posnetkih zaslona kot zaznamek.

4) Uporabite napravo iOS in dodajte mesto med zaznamke

To je najlažji del, zgrabite napravo iOS (po možnosti iPad 3, da potrdite vidik mrežnice) in odprite Safari.Osvežite spletno stran, na katero ste naložili ikono, nato tapnite ikono puščice in izberite »Dodaj na začetni zaslon«, poimenujte zaznamek, nato se vrnite na začetni zaslon, da potrdite, da je tam.

Kljub temu, da ima 512 x 512 slikovnih pik, se bo ikona mrežnice dobro zmanjšala na starejših telefonih iPhone in napravah brez mrežnice. Če res želite, lahko uporabite CSS in HTML za prikaz različno velikih ikon v različnih napravah, vendar to res ni potrebno.

Če nekdo vaše spletno mesto doda med zaznamke na iPadu z zaslonom retina, bo na njegovem domačem zaslonu videti veliko bolje. To je pravzaprav vse. In ja, o ikoni na dotik Apple smo že pisali, vendar si zasluži še eno omembo zdaj, ko iPad 3 zahteva bistveno višjo ločljivost ikon in grafike.