Ikona strßnky

Mo╛nß jste si n∞kdy v╣imli, ╛e mßte v prohlφ╛eΦi p°ed adresou strßnky n∞jak² obrßzek.

P°φklad ikony oblφbenΘ adresy

ikonka Oskarmobilu

ikonka slu╛by freesms

vyhledßvacφ slu╛ba Atomz

Jak za°φdit, aby se ta ikona zobrazovala i Φtenß°∙m va╣φ strßnky?

OblφbenΘ

Nap°ed musφte p°esv∞dΦit Φtenß°e, aby si va╣i strßnku p°idal do oblφben²ch. Bez toho to nejde. (Nejlep╣φ metodou takovΘho p°esv∞dΦovßnφ je kvalita strßnek.)

Jakmile si Φtenß° p°idß strßnku k oblφben²m, podφvß se jeho prohlφ╛eΦ (Internet Explorer) je╣t∞ jednou na server a hledß tam pat°iΦnou ikonu. Pokud ji nalezne, bude tuto ikonu nap°φ╣t∞ zobrazovat p°ed adresou a ve v²pisu oblφben²ch strßnek.

favicon.ico

Ikona mß p°esnΘ jmΘno -- favicon.ico . Jak pravd∞podobn∞ vφte, ico je p°φpona formßtu ikony. Rad∞ji ji v╛dy pφ╣u mal²mi pφsmeny.

Slovo "favicon" je z°ejm∞ zkratkou anglickΘho "favorite icon".

Umφst∞nφ ikony

Ikona se musφ jmenovat favicon.ico, jinak ji prohlφ╛eΦe nenaleznou. R∙znΘ verze Internet Exploreru se ale li╣φ v tom, kde ji primßrn∞ hledajφ. N∞kterΘ ji na serveru hledajφ ve stejnΘm adresß°i, jako je oblφbenß strßnka, jinΘ v rootu webu (tedy na symbolickΘ adrese http://n∞co.n∞co.cz/favicon.ico).

Podle m²ch zku╣enostφ se dφvajφ spφ╣e do rootu webu. (Ocenφm va╣e poznatky, proto╛e nemßm Φas to moc testovat.) S tφm je ale spojen² problΘm v p°φpad∞, ╛e publikujete na ve°ejnΘm serveru bez t°etφ domΘny, nap°. www.mujweb.cz/www/vasejmeno, proto╛e prohlφ╛eΦ bude favicon.ico hledat na adrese www.mujweb.cz/favicon.ico. Tam ji nenajde, nebo p°inejlep╣φm najde n∞jakou ·pln∞ jinou. Neznßm °e╣enφ.

 Jak vytvo°it ikonu

Nejlep╣φ je netvo°it ji, ale n∞kde zkopφrovat. Pokud vßm toto minimalistickΘ °e╣enφ p°ijde nudnΘ, budete na tvorbu a ·pravu ikon pot°ebovat n∞jak² grafick² program (nap°φklad windowsovskΘ Malovßnφ). Pokud program nepodporuje p°φmo formßt *.ico, ulo╛te obrßzek do souboru *.bmp (16 x 16 bod∙) a pak ho prost∞ p°ejmenujte na favicon.ico. Nenφ to ·pln∞ ko╣er postup, ale pro tento ·Φel n∞kdy dostaΦuje (za nßvod d∞kuji Michalovi -- netu╣il jsem, ╛e je to tak prostΘ). N∞kdy to ale nefunguje, pak je pot°eba pou╛φt specializovan² konverznφ program, nap°. z http://www.qtam-computer.com/bmp2ico35.html (za odkaz d∞kuji Vovovi.)

Vlastnosti ikony

Ikona m∙╛e mφt rozm∞ry 32 x 32 nebo 16 x 16, ba i jinΘ. Pro p°φpad oblφbenΘ webovΘ ikony v°ele doporuΦuji rozm∞r 16 x 16, proto╛e se stejn∞ v∞t╣φ zobrazovat nebude. V∞t╣φ rozm∞r by vßs jenom pletl p°i prßci a v²sledn∞ by se zdeformoval. (Tuto chybu jsem samoz°ejm∞ takΘ ud∞lal.)

Podoba ikony

Pokud n∞komu p°ijde rozm∞r 16 x 16 jako v²born² tv∙rΦφ prostor, tak m∞ tedy ne. Opravdu nemß smysl tvo°it n∞jakΘ um∞leckΘ dφlo. Zvolte n∞co jednoduchΘho.ikonka Oskarmobilu

Zß°n²m p°φkladem m∙╛e b²t Φerveno-bφlß ikonka Oskara.

Stejn∞ jedin²m ·Φelem ikonky je zaujmout Φtenß°ovo oko mezi jin²mi oblφben²mi polo╛kami, kterΘ majφ v menu p°ed sebou jenom bφlou strßnku s modr²m ΘΦkem.

Jednoduchost je hlavnφ d∙vod, proΦ doporuΦuji ikonu n∞kde prost∞ zkopφrovat.

╪e╣enφ pro IE 6

Pro ╣estou verzi Internet Exploreru je pr² mo╛no definovat ikonu ke ka╛dΘ strßnce zvlß╣╗ (ne pouze jednu pro cel² adresß°). Navφc se ikona mß zobrazovat v ka╛dΘm p°φpad∞, ne pouze v p°φpad∞ p°idßnφ strßnky do oblφben²ch. Zßpis by m∞l vypadat takto: 

<link rel="shortcut icon" href="ikona.ico">

Tento tag se samoz°ejm∞ dßvß do hlaviΦky (je to podobnΘ linkovßnφ stylopisu). 

╪e╣enφ pro Mozillu

Na strßnkßch prohlφ╛eΦe Mozilla je uvedeno nßsledujφcφ pou╛φtφ:

<link href="favicon.png" rel="icon" type="image/png" />

FunkΦnost jsem netestoval. Kdyby to ale fungovalo, tak je zajφmavΘ, ╛e se dß pou╛φvat i obrßzek typu png a zßpis atributu rel je odli╣n².

N∞kterΘ verze Mozilly (pr² 1.1 a 1.2) pr² navφc naΦφtajφ soubor favicon.ico i bez toho, ani╛ by byla strßnka p°idßna do oblφben²ch. Upozornil m∞ na to zejmΘna dj Padßk. K tomu dodßvß:

Trochu jsem dumal nad t∞ma ikonama vedle adresy a sledoval, co d∞lajφ jednotlivΘ prohlφ╛eΦe. Mozilla 1.2.1cz naΦetla ikonu bez jakΘhokoliv zßpisu. Jen nevφm, jestli tu *.ico nebo *.png, Opera 7.02 reagovala na zßpis rel=icon a formßt PNG. Mysφl, ╛e ten prvnφ zßpis s rel="shortcut icon" a ICO je jen archaismus IE. 

Statistika

Pokud nßhodou mßte na serveru nastavenΘ logovßnφ, m∙╛ete si z poΦtu p°φstup∙ na strßnky ud∞lat statistiku o "oblib∞" va╣ich strßnek. To m∙╛ete i bez ikony, proto╛e v logu se "favicon.ico 404 nenalezeno" takΘ zobrazφ. Mimochodem, tφmto zp∙sobem jsem existenci n∞jakΘ "favicon" objevil.

Jsem si v∞dom toho, ╛e po zve°ejn∞nφ tohoto Φlßnku se mi moje statistika zkreslφ o v╣echny, kte°φ si tuto strßnku p°idajφ do oblφben²ch pouze "pokusn∞".

Podpora

Pouze Internet Explorer verze 4 a vy╣╣φ, Mozilla (nevφm, od kterΘ verze). Jin² problΘm je v tom, ╛e to obΦas zßhadn∞ nefunguje ani na t∞chto prohlφ╛eΦφch. Mo╛nß to zßvisφ na n∞jakΘm nastavenφ, kterΘ neznßm. Ne╛ zaΦnete propadat depresi a ╣φlet, ╛e to nefunguje, zkuste si to na vφce ne╛ jednom poΦφtaΦi. Jo a taky to z°ejm∞ nefunguje p°i testovßnφ z lokßlnφho disku.

V kv∞tnu 2001 jsem si na linuxovskΘm prohlφ╛eΦi Konqueror (tak n∞jak se to pφ╣e) v╣imnul, ╛e ikonu zobrazuje v adrese i p°ed ne-oblφben²mi strßnkami. 

U╛ivatelskß ikona

Ke sv²m oblφben²m polo╛kßm si p°es jejich vlastnosti m∙╛ete navolit vlastnφ ikonu z disku.

o tvorb∞, ·dr╛b∞ a zlep╣ovßnφ internetov²ch strßnek

Pφ╣e Yuh∙, dusan@pc-slany.cz

Hledßnφ:

Jak psßt web: www.jakpsatweb.cz

Pφ╣e Yuh∙: http://dusan.pc-slany.cz, mail: dusan@pc-slany.cz

Poslednφ aktualizace 10.12.2003