Tworzenie niestandardowego Favicon

Spisu treści:

Anonim

Przyznaję się do czegoś w rodzaju maniaka. Naprawdę lubię favicons. Są fajne. Są świetnym narzędziem do brandingu. Są one proste, co mogą zrobić właściciele małych firm, aby uatrakcyjnić swoje witryny, a nawet zwiększyć użyteczność dla użytkowników.

Jeśli nie wiesz, co to jest favikon, pozwól mi zaoferować pomoc:

$config[code] not found

Favicons to mini, 16 × 16 pikseli graficznych, które reprezentują twoją witrynę w pasku adresu, na liście zakładek użytkownika lub w zakładkach przeglądarki. Pozwalają odwiedzającym stworzyć wizualne połączenie z Twoją witryną.

Schludny! Jak go stworzysz?

Zaprojektuj swoje ulubione:

  • Ręcznie: Otwórz swój ulubiony program graficzny i przejdź do niego. Będziesz chciał utworzyć nowy plik o wymiarach 16 × 16 pikseli i powiększyć go, dopóki obszar ten nie będzie funkcjonował LUB otworzyć obszar większy, ale wciąż w pewnym sensie wielokrotność 16 × 16. Kiedy projektujesz swoją favikon ręcznie, użyj czegoś, co będzie dokładnie odzwierciedlało twoją markę - czy to zwykły schemat kolorów, inicjały Twojej firmy itp. Cokolwiek stworzysz, będzie musiało wytrzymać twarde ograniczenia 16 × 16 pikseli.
  • Z narzędziami: Jeśli projektujesz wyzwanie (nie martw się, ja też), jest kilka świetnych narzędzi, które ułatwiają nawet ludziom takim jak my tworzenie wspaniałych favikonów. Na przykład, Favicon.cc da ci pewną strukturę i pozwoli Ci zbudować swoją bezpośrednio z ich strony lub FavIcon z Pics pozwoli ci przesłać obraz i wygenerować favicon dla ciebie. Prosty!

Zapisz swoje ulubione: Podczas zapisywania pliku zmniejsz go do 16 bitów i zapisz jako "favicon.ico", jeśli używasz Photoshopa lub "favicon.gif" lub "favicon.png", jeśli używasz czegoś innego. Jeśli korzystasz z Photoshopa i chcesz dać faviconowi dodatkowe dodatkowe korzyści, zaleca się pobranie wtyczki formatu Windows Icon, aby zapisać ją w formacie ICO.

Prześlij swoją favicon: Połącz się z serwerem i prześlij favikona do folderu głównego swojej witryny. Następnie dodaj następujący kod HTML do sekcji głównej strony internetowej (między dwoma tagami Head) (wybierz typ pliku):

Odświeżać: Gdy skończysz, odśwież przeglądarkę i powinieneś zobaczyć swój favicon. Jeśli nie, daj mu kilka minut. Czasami wszystko wymaga trochę synchronizacji.

I to wszystko! Cztery kroki i masz świetną markową ikonę, która pomoże użytkownikom rozpoznać Twoją witrynę na liście zakładek lub w przeglądarce. Całkiem proste, prawda?

Dla zabawy, oto niektóre z moich ulubionych faviconów w sieci:

  • Fajerwerki Michigan
  • Jeffrey Zeldman
  • dźwięk odbijanej piłki
  • Encyclopedia.com
  • Fool.com
  • Blog SEO Michaela Greya

Jakieś inne ulubione rzeczy osobiste?

17 komentarzy ▼