Co to jest favicon? Jak zrobić favicon?

Favicon to niewielka ikona w postaci pliku graficznego o rozmiarach 16x16px, która pojawia się:
– w polu adresowym przeglądarki internetowej przed adresem
– na karcie w przeglądarce internetowej
– w zakładkach ulubionych

Dzięki faviconie odróżnimy naszą stronę wśród standardowych icon stron i zwrócimy uwagę internautów. Favicony nie są stosowane nagminnie więc zastosuj ją póki nie zrobiła tego twoja konkurencja. Zrobieniu favicona nie poświęcimy zbyt wiele, a możemy zyskać całkiem sporo.

Jak zrobić favicon?

Są na to dwa sposoby.

1. Favicon można wykonać w dowolnym programie graficznym. Plik graficzny z ikonką powinien mieć rozszerzenie *.ico. Photoshop ani Fireworks nie obsługuje tego formatu jednak można sobie z tym poradzić. Najpierw zapisujemy plik graficzny z ikoną do formatu jpg, png lub gif. Następnie, albo skorzystamy z Gimpa, IrfanView, które mają możliwość zapisu do formatu ico, albo co łatwiej skorzystamy na przykład ze strony favicon.pl gdzie zrobimy to on-line.

2. Druga możliwość jest dla osób nie posiadających programu graficznego. Na stronie http://www.favicon.cc/ dostępny jest generator gdzie możemy samodzielnie zrobić ikonę. Możliwości moim zdaniem są bardzo duże. Możemy rysować ikonę, możemy zaimportować obrazek z którego chcemy uzyskać ikonę, a to wszystko podglądamy w okienku poniżej na żywo i widzimy jak będzie wyglądać nasz favicon w przeglądarce. Po skończeniu favicona wystarczy ściągnąć go do siebie na dysk (jako alternatywa www.degraeve.com/favicon).

W sieci znalazłem jeszcze jeden adres http://www.genfavicon.com/ pod którym można zaimportować obrazek i zrobić z niego automatycznie favicona. Prosto szybko w 3 krokach, ale bez możliwości samodzielnego rysowania.

Mam favicona i co dalej?

Jak już mamy favicona to umieszczamy go w głównym katalogu z naszą stroną www i w kodzie strony (w górnej części sekcja head) umieszczamy do niej link w postaci:

<link rel=”shortcut icon” href=”favicon.ico” type=”image/x-icon” />

Jeśli chciałbyś zlecić jakieś prace graficzne, projektowe napisz do mnie poprzez formularz kontaktowy z tej strony >>

GD Star Rating
a WordPress rating system
Co to jest favicon? Jak zrobić favicon?, 4.6 out of 5 based on 49 ratings

o autorze

admin

Od 2008 prowadzi ów seo bloga i dzieli się swoją wiedzą z zakresu seo.

Autor publikacji/produktów z zakresu seo m.in.: znanych list katalogów i profili, ebooków, szkoleń, artykułów w miesięczniku SEMspecialist.
Gościnnie trener w Mieście Szkoleń oraz na Search Marketing Week.

35 komentarzy

napisz komentarz
  • Jak już mamy favicona to umieszczamy go w głównym katalogu z naszą stroną www i w kodzie strony (w górnej części sekcja head) umieszczamy do niej link w postaci:

    z tego co zrozumiałem to tylko, ze trzeba wrzucić swoje logo na jakaś stronę i (chyba) skopiować ten adres i wkleić go do :
    Adres ikonki forum (favicon)
    Ikonka powinna mieć rozmiary 16×16 pikseli i być w formacie .ico, .gif lub .png. Link poprzedź frazą „http://”.

    a później już nie wiem nie mogę zrozumieć tego co tu napisałeś :/
    rozumiem ze się z tym namęczyłeś ale gdybyś dodał do tego zdjęcia bylo by to łatwiejsze :)

  • 1. Umieszczasz plik z faviconem na serwerze w katalogu głównym
    2. W sekcji head umieszczasz link <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />

    i to tyle nie ma nic później :)

  • Zrobilem wszystko co trzeba, ale to i tak nie dziala. Prosze o pomoc!

    Piszcie na adres: "adriancinal@onet.eu".

  • hej, próbowałam zrobić favicona dla myforum.pl ale nie mogę. tu jest link, pomóż [url=http://49forum.myforum.pl]49FU[/url]

  • Pozwolę sobie skorzystać z uprzejmości admina i prosić o pomoc w identycznej sprawie. Miałem w poprzednim hostingu działający favicon.ico (działał też, nieco zmieniony przez https). Po przeniesieniu zasobów do innego hostingu przestał działać. Mam w głównym katalogu plik favicon.ico i kod: <link rel="shortcut icon" type="image/x-icon" href="request->baseUrl; ?>favicon.ico” />. Co jest nie tak?
    Pozdrawiam

  • Też kiedyś z tym pluginem się spotkałem aczkolwiek sam to najczęściej robiłem plik png i wrzucałem do IrfanView, a on „wypluwał” mi ico.

  • @Sławek, ta metoda z png i Irfanview działa, jest szybka i skuteczna, choć ludzie mało uwagi zwracają na favicony, ale dla mnie są bardzo ważne;) Są użyteczne.

    • Ja az tak nie zwracam na nie uwagi, ale warto bo duzo roboty z tym nie ma, choc zrobienie ladnego favicona to tez nie lada sztuka :)

  • witam, proszę o pomoc. Korzystam z przeglądarki Mozilla. Wczoraj na stronie startowej http://www.wp.pl pojawiły mi się pocięte obrazki, jakby się strona posypała. Dziś bez zmian toteż zadzwoniłem do helpdesku wp, a tam zalecono mi wyczyszczenie wszystkich ciasteczek i historii przeglądania z zakładki "narzędzia", co uczyniłem. Ku mojemu zdumieniu zamiast ikony wp pojawił się obrazek http://www.wp.pl/favicon.ico, którego nie potrafię zamienić na ikonkę wp. Dziękuję za pomoc Kiprinski

    • Strona WP wygląda poprawnie wraz z faviconem więc także podejrzewam, że kwestia cookies. Sprawdz też w innej przeglądarce.

    • Kamil odśwież stronę, usuń pliki tymczasowe sprawdziłem działa Ci w ie, ff, operze, chrome więc wszystko jest ok.

  • Wpis w headzie powoduje błąd po sprawdzeniu przez W3C.org – sprawa kodowania UTF-8.
    Jednak działa w chromie i IE bez dodawania wpisu,jedynie umieszczenie favicona w katalogu głównym jest wystarczające.Należy pamiętać o kilkakrotnym odświeżeniu strony,ponieważ za piewszym razem pobiera cookie z pamięci przeglądarki.Na innych przeglądarkach nie sprawdzałem.

  • Witajcie,
    bardzo Was proszę a przede wszystkim Pana administratora o pomoc.
    Problem tkwi oczywiście w faviconie. Mam już odpowiednią grafikę, kod i gdzie mam to teraz wrzucić? Robię stronę na serwisie bnx.pl
    17961081

  • wszyscy to wszyscy

    głupia jestem i zabieram sie za rzeczy z ktorymi sobie nie radze. pomożesz?

    próbowałam wielu sposobów, i w png i w ico i nic ;/

  • Ja tam odpalam Paint , wklejam coś albo rysuję i zapisuję.
    Zapisuję obraz jako mapa bitowa 24-bitowa BMP i zapisuję nazwę pliku ale na końcu dopisuję .ico

  • Witam :)
    Chciałem przy okazji dodać też stronkę gdzie online można tworzyć favicony http://www.xiconeditor.com/
    Po wygenerowaniu icony, wrzuceniu jej do głównego katalogu witryny i dodaniu takiego wpisu <link rel="shortcut icon" href="favicon.ico"/> w sekcji head strony – favicon zadziała na wszystkich rodzajach przeglądarek :)
    Pozdrawiam :)

  • Metoda z "shortcut link" oraz plikiem favicon jest niepoprawna z punktu widzenia W3C. Konkretnie niezalecana. Sam tag w HEAD z "shortcut link" jest wykorzystywany tylko przez MSIE, a przez resztę "z rozpędu". Co ciekawe producenci przeglądarek i OS też niechętnie stosują się do zaleceń W3C, więc jest z tym mały miszmasz. Zebrałem to i opisałem wszystko na stronie http://www.creamsoft.com/blog/jak-poprawnie-dodac… gdzie zapraszam :)

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Wszelkie prawa zastrzeżone. Zabrania się wykorzystywania jakichkolwiek treści bez zgody autora.