--- ---

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

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

Frazy wpisywane przez użytkowników wyszukiwarek internetowych:

  • favicon co to
  • Co tofavikona
  • favicon
  • favicon jak wykonać ?
  • favicon jak zrobic
  • format pliku favicon ico
  • jak zrobic favicon
  • jak zrobić favikone
  • jak zrobić favikonkę

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.

36 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 (widoczny przez http://ipoba.pl/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

  • 我々 は本当にこの季節のバケット バッグを愛しています。このクールなシルエット ボヘミアン スタイルに会釈を与えます、ヒッピー 70 年代 vibe を放ちます。これらのバッグはそのクールな置かれたバック スタイルを与えるための素晴らしい-今落下に夏を取るし、一年中このバッグを使用することができます !ファンキーなパターンまたは神経質な固体黒バケット ・ バッグは、かどうか彼らその汎用性だし、外観に、余分な火花を追加します。我々 は本当にこの週末の外観を好き- それは週の間に良いバケットに頼ることはできません意味しない

    腕時計 BREITLING

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

Możesz użyć następujących tagów oraz atrybutów HTML-a: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

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