Kā mēs pievienojam ikoniskai vietnei iPhone, iPad un iPod Touch

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.

Stealth Settings Favicon
Stealth Settings Favicon Safari
Favicon operā
Favicon operā

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 touchApvidū

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“Apvidū

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āmApvidū

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

Ābols regulāri atjaunināt ieteicamie ikonu izmēriURL lietojumprogrammas un tīmekļa lapas pe šo lapuApvidū

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

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

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”Apvidū

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.

iPhone vietnes ikona

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

Kaislīgi par tehnoloģiju es ar prieku rakstu vietnē Stealthsetts.com, sākot ar 2006. gadu. Man ir bagātīga pieredze operētājsistēmās: macOS, Windows un Linux, kā arī programmēšanas valodās un emuāru veidošanas platformās (WordPress) un tiešsaistes veikaliem (Woocommerce, Magento, Presashop).

Mājas Jūsu IT apmācības avots, noderīgi padomi un jaunumi. Kā mēs pievienojam ikoniskai vietnei iPhone, iPad un iPod Touch
Atstājiet komentāru