Википедија

Favikon

Favikon, poznat i kao ikonica prečice, ikonica web sajta, ikonica kartice ili ikonica obeleživača je datoteka, povezana sa određenim web sajtom ili web stranicom koja sadrži jednu ili više ikonica koje su najčešće veličine 16x16 piksela. Web dizajner može da kreira takvu ikonicu i da je instalira na web sajt (ili na web stranicu) na nekoliko načina i onda je grafički internet pregledači mogu koristiti. Pregledači koji podržavaju prikazivanje favikona ga obično prikazuju u adresnom polju ( ponekad i u istoriji i pored imena stranice u listi obelezivača). Pregledači koji podržavaju interfejs sa karticama obično prikazuju favikon stranice pored naslova stranice na kartici.

Istorija

уреди

U martu 1999. Majkrosoft je objavio Internet Explorer 5 koji je bio prvi pregledač koji podržava favikon. Prvobitno, favikon je bio datoteka poznata pod nazivom favicon.ico koja je bila smeštena u korenskom direktorijumu (npr., http://en.wikipedia.org/favicon.ico) web sajta. Korišćeni su u obeleživačima Internet Explorera pored URL adrese stranice ako je obeležena. Sporedni efekat bio je taj da je broj posetioca koji su obeležili stranicu bio procenjivan zahtevima za favikonom, tj. svaki put kad bi neko obeležio stranicu, podneo bi zahtev za favikonom. Ovaj sporedni efekat više ne radi, a svi moderni pretraživači podržavaju favikon bez obeležavanja.

 
Wikipedijin favikon, prikazan u starijoj verziji Firefox pretraživača (iz 2008).

Standardizacija

уреди

Favikon je standardizovao World Wide Web Consortium (W3C) u HTML 4.01 preporuci, objavljenoj u decembru 1999. a kasnije u XHTML 1.0 preporuci, objavljenoj 2000. 2003. IANA je registrovala .ico format pod MIMA tipom/image/vnd.microsoft.icon.[1] Ironično, Internet Explorer ne moze da otvori slike koje su u .ico formatu. Zaobilazenje ovog problema {Internet Explorera} je pridruzivanje .ico sa nestandardnim image/x-icon MIME tipom na web serverima.[2]

Popularni <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" /> teoretski identifikuje dva odnosa, "shortcut" i "icon", ali "shortcut" nije registrovan i suvišan je. 2011. HTML living standard je precizirao da iz istorijskih razloga "shortcut" bude neposredno ispred "icon"; ipak, "shortcut" nema znacenje u ovom kontekstu. Internet Explorer 5-10 podržavaju samo ICO file format. Netscape 7 i verzije 5 i 6 pregledača Internet Explorer prikazuju favikon samo kada je stranica označena a ne samo kada je posećena, kao u kasnijim verzijama pregledača.

Implementacija pretraživača

уреди

Sledeća tabela ilustruje najbolje web pretraživače koji podržavaju različite funkcije.Brojevi verzija ukazuju na početnu verziju podržavanih funkcija.

Podrška za formate datoteka

уреди

Sledeća tabela ilustruje format datoteka podršku za favikone.

Browser ICO PNG GIF animated GIFs JPEG APNG SVG
Firefox 1.0[3] 1.0[3] 1.0[3] Да[4] Да 3.0[4] Не[5]
Google Chrome Да Да 4.0 4.0 4.0 Не ?
Internet Explorer 5.0[6] 11.0[7] 11.0[7] Не[6] Не[6] Не[6] Не[6]
Opera 7.0[8] 7.0[8] 7.0[8] 7.0[8] 7.0[8] 9.5 ?
Safari Да 4.0 4.0 Не 4.0 Не Не

Dodatno, takve ikonice fajlova mogu biti veličine ×16, 32×32, 48×48, or 64×64 piksela I 8-bitni, 24-bitni 32-bitni dubina boje. Članak o ICO file format objašnjava detalje ikonice sa više 256 boja zasnovanih na Microsoft Windows platformama.

Upotreba favikona

уреди

Ova tabela ilustruje različite mogućnosti upotrebe favikona.

Browser Address bar Address bar drop down list Links bar Bookmarks Tabs Drag to desktop
Firefox 1.0–12.0: Yes[9]
> v13: No[10] 		Да Да Да[9] Да[9] Да[9]
Google Chrome Не[9] Не Да[9] Да[9] 1.0[9] 1.0[11]
Internet Explorer 7.0[9] Не 5.0[9] 5.0[9] 7.0[9] 5.0[9]
Opera 7.0[9] Не 7.0[9] 7.0[9] 7.0[9] 7.0[9]
Safari Да[9] Не Не[9] Да[9] Не[9] Не[9]

Opera Software je dodela mogućnost promene favikona u Speed Dial u Opera 10.[12]

Kako se koristi

уреди

Tabela ilustruje gde favikoni mogu biti prepoznati od strane pretraživača.

Google Chrome Internet Explorer Firefox Opera Safari 
<link rel="shortcut icon"
 href="http://example.com/myicon.ico" />
Да Да[6] Да Да Да 
<link rel="icon"
 href="http://example.com/image.ico" />
Да Да (from IE 11)[7] Да Да Да 
<link rel="icon"
 type="image/vnd.microsoft.icon"
 href="http://example.com/image.ico" />
Да Да (from IE 9)[7] Да Да Да 
<link rel="icon" type="image/png"
 href="http://example.com/image.png" />
Да Да (from IE 11)[7] Да Да Да 
<link rel="icon" type="image/gif"
 href="http://example.com/image.gif" />
Да Да (from IE 11)[7] Да Да Да 
<link rel="icon" type="image/x-icon"
href="http://example.com/image.ico"/>
Да Да (from IE 9)[13] Да Да Да
favicon.ico located in the website's root Да Да Optional[14] Optional[15] Да
precedence: prefer root or (X)HTML linked version linked[9] linked[9] linked[9] ? ?

Ukoliko su linkovi PNG i ICO favikoni prisutni, PNG-favikoni su kompatibilni pretraživači uzimaju format i veličinu. Firefox i Safari će koristiti favikon koji dolazi poslednji.Chrome za Mac će koristiti svaki koji je ICO formatiran, ili 32x32 favikon. Chrome za Windows će koristiti favikon koji dolazi prvi ukoliko je 16×16, ili ICO. Ukoliko ni jedna od spomenutih opcija nije dostupna, Chromes će koristiti svaki favikon koji dolazi prvi, suprotno od Firefoxa i Safarija.Zaista, Chrome za Mac će ignorisati 16×16 favikone i koristiće 32×32 verziju. Opera će birati bilo koju od dostupnih ikonica nasumično..[16]

Samo SeaMonkey ne prepoznaje favicon.ico u web sajtovima po difoltu.[17]

Podrška za uređaj

уреди

Apple-ovi uređaji koji koriste iOS operativni sistem od verzije 1.1.3 i novije, kao što su iPod,iPhone i iPad, kao i Android[18] uredjaji mogu napraviti prilagođenu ikonu, koja se može prikazati na početnoj strani uređaja. To se može ostvariti korištenjem Web Clip aplikacije[19][20]. Ovo je omogućeno koristeći <link rel="apple-touch-icon" ...> u <head> sekciji dokumenata koji se nalaze na web sajtu. Ako takva ikona nije unapred određena,umesto nje će se pojaviti početna strana tog web sajta.[21]

Preporučena veličina ikone je 60×60 piksela sa oštrim ivicama. Za najbolje prikazivanje na displeju iPhone 4, preporučuje se veličina od 120×120 piksela[20][22][23]

Za iPad i iPad 2 , uobičajena veličina je 76×76 piksela. Za iPad uređaje treće generacije, koristi se veća rezolucija od 152×152 piksela.[24]

Ikona datoteke apple-touch-ikona je modifikovana da dodaje zaobljene ivice, senke i reflektujući sjaj. Alternativno, može se obezbediti da se ne primenjuje reflektujući sjaj na slike.[20][21]

Sa zaobljenim ivicama i reflektujućim sjajem
 <link rel="apple-touch-icon" href="somepath/image.png" />
Bez reflektujućeg sjaja
<link rel="apple-touch-icon-precomposed" href="somepath/image.png" />

Kao u slučaju favicon.ico fajla, pretraživači i mobilni uređaji ne zahtevaju nikakav HTML kod za preuzimanje ovih ikona[21]. Uobičajeno mesto za datoteke su apple-touch-icon-precomposed.png/code> i apple-touch-icon.png(po redosledu prioriteta) koje se nalaze u korenu web sajta.

HTML5 preporuke za ikone različitih veličina

уреди

Sadašnja specifikacija HTML5 preporučuje da se navode ikone različitih veličina koristeći atribut rel="icon" sizes="space-separated list of icon dimensions" u okviru <link> etikete.[25] Više formata uključujući Microsoft .ico i Macintosh .icns formate, mogu obezbediti tip sadržaja koristeći atribut type="file content-type u okviru <link> etikete.

Apple-ovi mobilni uređaji koji koriste iOS 5 i novije, ignorišu preporuku HTML5 i koriste svoje, već objašnjene preporučene dimenzije ikona. Internet pregledač Google Chrome će odabrati veličinu koja najbliže odgovara onima koje su predviđene u zaglavlju HTML5 dokumenta.

Ograničenja i kritike

уреди

Zbog potrebe da se favikona može uvek fiksirati, to može dovesti do sporog učitavanja stranica i poruke 404-stranica nije pronađena. W3C organizacija nije standardizovala druge ključne reči kao prečice, koje su takođe prihvaćene od korisnika.[6]

Favikonom se često manipuliše “prisluškivanje ” I napadi na HTML5 veb stranice. Mnogi pregledači veba prikazuju favicon blizu pregledačevog UI-a, kao što su mesta gde se unose URL adrese. Promenom sigurnosti favikona, napadač može da pokuša da prevari korisnika, koji će misliti da je na sigurnom sajtu(HTTPS).[26] Da se ovo ne bi dešavalo, neki veb pregledači prikazuju favikonu u okviru kartice, gde pored URL adrese piše i koji se protokol koristi.[27]

Reference

уреди

  1. ^ Butcher, Simon (3. 9. 2003). „Published specification”. Internet Assigned Numbers Authority. Приступљено 25. 2. 2011. 
  2. ^ Irish, Paul (15. 12. 2010). „commit 37b5fec090d00f38de64 to paulirish's html5-boilerplate”. GitHub. Приступљено 25. 2. 2011. 
  3. ^ а б в David (19. 7. 2003). „Mozilla 0.9.6 Release Notes”. Mozilla. Приступљено 23. 2. 2011. 
  4. ^ а б „Bug 111373: don't allow animated site icons (favicons)”. Архивирано из оригинала 09. 10. 2019. г. Приступљено 1. 6. 2014. 
  5. ^ Works only on first load of the page.
    Holbert, Daniel (14. 4. 2011). „Bug 366324 – SVG site icons (favicons, shortcut icons) support – comment 22”. Bugzilla@Mozilla. Mozilla. Приступљено 23. 2. 2011. 
  6. ^ а б в г д ђ е Davis, Jeff (27. 12. 2007). „why doesn't the favicon for my site appear in IE7?”. jeffdav on code. Microsoft. Приступљено 11. 3. 2013. 
  7. ^ а б в г д ђ „Fun with Favicons”. Microsoft. 7. 9. 2013. Приступљено 3. 11. 2013. 
  8. ^ а б в г д „Opera 7 for Windows Changelog”. Opera Software. 28. 1. 2003. Архивирано из оригинала 18. 08. 2007. г. Приступљено 28. 2. 2011. 
  9. ^ а б в г д ђ е ж з и ј к л љ м н њ о п р с т ћ у ф х Francis, Lewis (11. 12. 2007). „Chart of modern browser support for favicon”. informationgift.com. Архивирано из оригинала 10. 10. 2019. г. Приступљено 23. 2. 2011. 
  10. ^ „Firefox deems favicons risky, banishes them from address bar”. Engadget. Приступљено 10. 9. 2012. 
  11. ^ „Create Application Shortcuts”. Google. 22. 3. 2013. 
  12. ^ „Opera 10.0 beta 2 for Windows changelog”. Opera Software. 16. 7. 2009. Архивирано из оригинала 27. 07. 2017. г. Приступљено 27. 2. 2011. 
  13. ^ „IE9 RC Minor Changes List”. Microsoft. 11. 2. 2011. Приступљено 16. 11. 2013. 
  14. ^ Firefox only accepts favicon.ico in the web site's root without a <link> tag if the setting browser.chrome.favicons is set to true in about:config. The default value is true. If set to false, these favicons are ignored.
  15. ^ Opera loads /favicon.ico only if Multimedia/Always load favicon option in opera:config is set to 1. See Opera Support page for more details.
  16. ^ Neal, Jonathan T. (16. 1. 2013). „Understand the Favicon”. Архивирано из оригинала 23. 05. 2013. г. Приступљено 30. 5. 2013. 
  17. ^ Bynens, Mathias (14. 4. 2010). „rel="shortcut icon" considered harmful”. Приступљено 15. 11. 2011. 
  18. ^ Bynens, Mathias (2. 3. 2011). „Everything you always wanted to know about touch icons”. Приступљено 15. 11. 2011. 
  19. ^ „iPhone Human Interface Guidelines for Web Applications: Metrics, Layout Guidelines, and Tips”. Apple Inc. Архивирано из оригинала 04. 06. 2010. г. Приступљено 27. 5. 2010. 
  20. ^ а б в „Safari Web Content Guide: Specifying a Webpage Icon for Web Clip”. Apple Inc. 15. 11. 2010. Приступљено 25. 2. 2011. 
  21. ^ а б в McLellan, Drew (17. 1. 2008). „How To Set an Apple Touch Icon for Any Site”. Allinthe head.com. Приступљено 11. 3. 2011. 
  22. ^ „iOS Human Interface Guidelines: Custom Icon and Image Creation Guidelines, Table 8-1”. Apple Inc. Приступљено 16. 7. 2011. 
  23. ^ „Apple-touch-icon”. Apple Inc. Приступљено 25. 2. 2011. 
  24. ^ „iPad Apple Touch Icon”. Приступљено 12. 2. 2012. 
  25. ^ „W3C HTML5 Editor's Draft 26 June 2012, Section 4.12.4.5 'Link type "icon"'”. World Wide Web Consortium. Приступљено 15. 7. 2012. 
  26. ^ Marlinspike, Moxie (21. 2. 2011). „Defeating Ssl Using Sslstrip (Marlinspike Blackhat)”. (see description of video). SecurityTube. Архивирано из оригинала 13. 07. 2011. г. Приступљено 9. 7. 2011. 
  27. ^ „Firefox version 14 features”. Приступљено 18. 7. 2012. 

Спољашње везе

уреди

 
Favikon на Викимедијиној остави.
Преузето из „https://sr.wikipedia.org/w/index.php?title=Favikon&oldid=27752870”