[Cum să] Creați un Favicon și Apple Pictogramă pentru site-ul dvs. web

Apple iPhone / iPad

Încă de câțiva ani în urmă, favicon-urile care și-au pierdut o mare parte din relevanță au revenit, deoarece tot mai multe browsere le acceptă și, de fapt, le fac o parte foarte vizuală a experienței utilizatorului lor. De asemenea, tabletele și browserele pentru smartphone-uri folosesc aceste pictograme. Acest lucru a dus la o importanță crescută a având un favicon bun. Cu toate acestea, modurile în care sunt prezentate aceste pictograme variază în funcție de clientul care navighează pe site. Desktopurile necesită o anumită pictogramă, Apple dispozitivele necesită ceva diferit, dimensiunile diferite complică și lucrurile. 

 

Cuprins[Spectacol]

O soluție simplă - Generator de icoane online gratuit pentru Apple și pictograme Favicon

 Iconifier.net este o soluție simplă care, având în vedere un pătrat JPG, GIF sau PNG va genera un set de pictograme de diferite dimensiuni, astfel încât să le puteți folosi și alege pe cele pe care doriți să le susțineți pe site-ul dvs. Atunci trebuie să descărcați pictogramele generate și să le încorporați în codul site-ului dvs. Puteți integra acești pași în procesul dvs. de design web.

Încorporați pictogramele favicons în site-ul dvs. web

După ce ați creat pictograma favicon.ico folosind Iconifier.net de mai sus și ați plasat-o în rădăcina site-ului dvs., adăugați următorul cod între și a site-ului dvs

Apple Icoane

După ce ați creat diferitele pictograme folosind site-ul de mai sus, va trebui să includeți și un cod ușor diferit pentru Apple dispozitive iPhone/iPad (și posibil Android). Încărcați din nou fișierele pictograme generate în rădăcina site-ului dvs. și plasați următorul cod între etichetele HEAD.

<link rel="apple-touch-icon” sizes="114×114″ href="/ro/touch-icon-114×114.png” />

<link rel="apple-touch-icon” sizes="72×72″ href="/ro/touch-icon-72×72.png” />

<link rel="apple-touch-icon” href="/ro/touch-icon-iphone.png” />

Dispozitivele iOS vor gestiona automat acest lucru în browser și vor redimensiona și vor adăuga unele efecte în consecință pentru ca acesta să se potrivească cu stilul dispozitivului pe care sunt văzute.

De altfel, dezvoltatorii mari iOS și Android nu sunt ușor de angajat - dacă doriți să angajați un dezvoltator de aplicații bun și știți cum să găsiți un candidat bun te avem acoperit CollectiveRay. - vă vom arăta toate locurile grozave pentru a găsi candidați buni.

Roșu Mai mult: Cum se resetează Apple ID și parola dacă ați uitat-o

Pictograme pentru dispozitive Android

Android a construit pe baza Apple atingeți pictogramele, dar așteptați ca pictogramele să fie deja în versiunea finală. Această versiune finală este „PRECOMPUSĂ”, iar dispozitivele Android se așteaptă ca această etichetă să fie pe loc. Așadar, încărcați versiuni noi, cu nume ușor diferite (cum ar fi adăugarea de pre-compuse în nume) și apoi adăugați următorul marcaj. Cea mai importantă parte este rel=apple-atingere-icoană-precompusă. Puneți fișierele în rădăcina site-ului dvs. și adăugați acest cod între și etichetele html-ului dvs

<link rel="apple-touch-icon-precomposed” dimensiuni=”114×114″ href="/ro/apple-touch-icon-114×114-precomposed.png”>

<link rel="apple-touch-icon-precomposed” dimensiuni=”72×72″ href="/ro/apple-touch-icon-72×72-precomposed.png”>

<link rel="apple-touch-icon-precomposed” href="/ro/touch-icon-iphone-precomposed.png”>

Mai multe detalii despre Favicons pot fi găsite pe Wikepedia: https://en.wikipedia.org/wiki/Favicon

Despre autor
David Attard
David a lucrat în sau în jurul industriei online și digitale în ultimii 21 de ani. Are o vastă experiență în industriile software și web design folosind WordPress, Joomla și nișele din jurul lor. A lucrat cu agenții de dezvoltare software, companii internaționale de software, agenții de marketing locale și acum este șeful operațiunilor de marketing la Aphex Media - o agenție SEO. În calitate de consultant digital, se concentrează pe a ajuta companiile să obțină un avantaj competitiv folosind o combinație a site-ului lor web și a platformelor digitale disponibile astăzi. Combinația sa de experiență tehnologică, combinată cu o puternică perspicacitate în afaceri, aduce un avantaj competitiv scrierilor sale.

Inca un lucru... Știați că și persoanele care împărtășesc lucruri utile precum această postare arată MĂRĂTOARE? ;-)
Te rugăm să ne contactezi lasa un util comentează cu gândurile tale, apoi împărtășește acest lucru grupurilor tale de Facebook care ar găsi acest lucru util și să profităm împreună de beneficii. Vă mulțumim că ați împărtășit și ați fost drăguți!

Dezvaluirea: Această pagină poate conține linkuri către site-uri externe pentru produse pe care le iubim și le recomandăm din toată inima. Dacă cumpărați produse pe care vi le sugerăm, este posibil să câștigăm o taxă de recomandare. Astfel de taxe nu influențează recomandările noastre și nu acceptăm plăți pentru recenzii pozitive.

 

Cine suntem noi?

CollectiveRay este condus de David Attard - lucrând în și în jurul nișei de design web de mai bine de 12 ani, oferim sfaturi practice pentru persoanele care lucrează cu și pe site-uri web. De asemenea, rulăm DronesBuy.net - un site pentru amatorii de drone.

David Attard

 

 

Autor (i) prezentat (e) pe:  Logo-ul revistei Inc   Sigla Sitepoint   Logo CSS Tricks    sigla webdesignerdepot   Sigla WPMU DEV   si multe altele ...