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

VN:F [1.9.22_1171]
Rating: 4.6/5 (49 votes cast)
Co to jest favicon? Jak zrobić favicon?, 4.6 out of 5 based on 49 ratings

o autorze

admin

Od 2009 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 email 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.

Czy chcesz poznać skuteczne metody

pozyskiwania najbardziej wartościowych linków?

To twój dobry wybór!

Nie obchodzi mnie to

BEZPŁATNE SZKOLENIE

Termin spotkania: 23 maj, godz. 20:00

Wpisz poniżej adres e-mail, aby zarezerwować swoje miejsce