Favicon.ico – Vietnes ikona pārlūkprogrammā

Pirms vietnes palaišanas tiek pievienots grafiskais fails, favicon, kas parādīsies pārlūkprogrammas adreses joslā. Vairumā gadījumu favicon ir grafiskā logotipa sīktēls vai attiecīgās vietnes iniciāļi. Šis favicon ir pievienots, lai palīdzētu lietotājiem ātrāk noteikt tīmekļa adresi grāmatzīmēs.

Vēl nesen šim failam bija jābūt formā “favicon.ico“, kas jāatpazīst tīmekļa pārlūkprogrammai. Chrome, Internet Explorer, Opera, Safari, Firefox utt.
Jau vairākus gadus, attīstoties jaunām tīmekļa valodām, Html9 un CSS3, favicon var būt arī viens fisier .png vai .jpg. Nosacījums ir tāds, ka vietnes galvenē pirms tam </galva>, rindai jābūt klāt:

<saite rel=”īsceļa ikona” href =”/images/favicon.ico” tips=”attēls/x-ikona” />

Vietnes ikona operētājsistēmai iOS – iPhone, iPad un iPod Touch

Iekšā iOS varam pievienot tīmekļa lapu saīsnes pe Sākuma ekrāns-uliPhoneVerdzība iPad un iPod touch.

Vietnes saīsnes pievienošana iPhone, iPad un iPod sākuma ekrānam

Mēs to darām, atverot tīmekļa lapu iPhone (Safari, Chrome u.c. interneta pārlūkprogrammā), nospiežot kvadrātu ar bultiņu (zīme “akcija” operētājsistēmā iOS), pēc tam opciju “Pievienot sākuma ekrānam“.

Ja vietnei pārlūkprogrammai ir iestatīts favicon, bet tas nav iestatīts īpašā ikona iOS ierīcēm, ekrānā parādīsies ikona, kas sastāv no iedomājieties priekšskatījumu no tīmekļa lapas.

Kā pievienot tīmekļa ikonas iPhone, iPad un Android ierīcēm.

Pirmais solis irmēs izveidojam attēlu ikonai, kas tiks parādīts Sākuma ekrānsideja. Lai tīmekļa ikona būtu saderīga ar visām ierīcēm un būtu skaidri redzama, mums ir jāizveido attēls visām iPhone un iPad izšķirtspējām.

Ikonu standarta izšķirtspēja un izmēri iPhone, iPad, iPod un Android ierīcēm

• Klasiskie iPhone/iPod modeļi = 57×57
• iPad = 76×76
• iPhone/iPod Retina = 120×120
• iPad Retina = 152×152
• iPhone 6/6S Plus = 180×180

Apple regulāri atjaunināt ieteicamie ikonu izmēriURL lietojumprogrammas un tīmekļa lapas pe šo lapu.

Android ierīcēm ikonām ir divi izmēri:

• Klasiskais Android = 128 × 128
• Android ar augstu izšķirtspēju (hi-res) = 192 × 192

Kad mēs esam izveidojuši attēlus, tie tiek augšupielādēti tīmekļa serverī un vietnes HTML avotā pirms aizvēršanas </galva>, pievieno šādas rindas:

<saite href=”/apple-touch-icon.png” rel =”apple-touch-ikona” /> <saite href=”/apple-touch-icon-76×76.png” rel =”apple-touch-ikona” izmēri =”76×76″ /> <saite href=”/apple-touch-icon-120×120.png” rel =”apple-touch-ikona” izmēri =”120×120″ /> <saite href=”/apple-touch-icon-152×152.png” rel =”apple-touch-ikona” izmēri =”152×152″ /> <saite href=”/apple-touch-icon-180×180.png” rel =”apple-touch-ikona” izmēri =”180×180″ /> <saite href=”/icon-hires.png” rel =”ikonu” izmēri =”192×192″ /> <saite href=”/icon-normal.png” rel =”ikonu” izmēri =”128×128″ />

Apple ierīcēm attēla nosaukums ir .PNG un “rel =” jāietver prefikss “ābols-“. Android ierīcēm failu nosaukumi būs “icon-hires.png” un “icon-normal.png” ar rel=”ikonu”.

Nav absolūti nepieciešams izveidot attēlus katrai izšķirtspējai atsevišķi. Varat izveidot attēlu ar augstāko izšķirtspēju, un ierīces ar zemāku izšķirtspēju to identificēs un iestatīs kā ikonu.

Vietnes saīsnes ikona izskatīsies līdzīgi jebkurai citai ikonai lietojumprogrammas operētājsistēmai iOS.