Ikona Apple Touch i ikona ulubionych są ze sobą powiązane, ale nie są tym samym plikiem służącym temu samemu celowi. Favikona jest zwykle kojarzona z kartami przeglądarki, zakładkami i znanym chromem przeglądarki. Ikona Apple Touch jest przeznaczona dla ekranów skrótów urządzenia Apple, gdzie witryna może wyglądać bardziej jak ikona aplikacji.
Zamieszanie jest zrozumiałe, ponieważ w wielu projektach oba pliki zaczynają się od tego samego znaku marki. Grafika źródłowa może mieć postać jednego kwadratowego obrazu, ale opakowanie musi obsługiwać różne powierzchnie. Dlatego nowoczesny przepływ pracy z faviconami nie powinien kończyć się na pojedynczym pliku favicon.ico.
Do czego służy favikona
Favikona to mały znacznik wizualny, który użytkownicy widzą na kartach przeglądarki, zakładkach, historii i powiązanych interfejsach przeglądarki. Pomaga użytkownikom szybko rozpoznać witrynę, gdy otwartych jest kilka zakładek.
Klasyczny plik to favicon.ico, chociaż wiele nowoczesnych konfiguracji zawiera również pliki ikon PNG. W przypadku rutynowych uruchomień witryn trzymanie favicon.ico w pakiecie jest nadal praktyczne, ponieważ obejmuje znane oczekiwania i ścieżki zgodności.
Do czego służy ikona Apple Touch
Ikona Apple Touch jest używana, gdy witryna jest zapisywana na powierzchni urządzenia Apple, np. jako skrót na ekranie głównym. To nie tylko mały znacznik zakładek. Musi działać jako ikona w kontekście bardziej przypominającym aplikację.
To zmienia ciśnienie projektowe. Ikona karty przeglądarki może być bardzo mała. Ikona dotykowa może wydawać się większa, ale musi też sprawiać wrażenie czystej, wyśrodkowanej i rozpoznawalnej jako samodzielny znak. Ta sama grafika źródłowa może działać w obu przypadkach, jeśli jest prosta i kwadratowa, ale wyniki nadal muszą być poprawnie spakowane.
Dlaczego współczesne witryny często potrzebują obu tych elementów
Jeśli Twoja witryna ma tylko favikonę, przeglądarka na komputerze może wyglądać dobrze, a ekrany skrótów mobilnych mogą wydawać się niekompletne lub niespójne. Jeśli Twój pakiet koncentruje się wyłącznie na ikonach dotykowych, możesz nadal przegapić tradycyjną ścieżkę zakładek przeglądarki.
W przypadku uruchomienia SaaS, witryny z dokumentacją, mikrowitryny produktu lub małej aplikacji internetowej, praktyczną odpowiedzią jest zwykle jedno i drugie. Chcesz pakietu obejmującego karty przeglądarki i skróty podobne do aplikacji, bez proszenia kogoś o ręczne eksportowanie każdego wariantu ikony.
Tutaj pasuje Favicon / Generator ikon aplikacji. Generuje ikony favicon.ico, PNG, ikony Apple Touch, ikony gotowe na system Android i starter site.webmanifest z jednego kwadratowego obrazu źródłowego.
Grafika źródłowa jest wspólnym ograniczeniem
Najważniejszym czynnikiem jakości jest obraz źródłowy. Ten sam znak musi przetrwać wiele powierzchni i rozmiarów. Szczegółowe ilustracje, mały tekst i grafiki od krawędzi do krawędzi zwykle działają słabo. Prosty kształt z wystarczającą ilością wypełnienia z większym prawdopodobieństwem pozostanie rozpoznawalny.
Converty zawiera opcję okrągłą dla wyników przeglądarki i systemu Android, podczas gdy ikony Apple Touch pozostają kwadratowe. Ma to znaczenie, gdy znak Twojej marki lepiej prezentuje się w okrągłej ramce, ale nadal chcesz, aby powierzchnie Apple zachowały oczekiwany kwadratowy wygląd.
Praktyczna decyzja
Użyj favikony, jeśli potrzebujesz rozpoznawania przeglądarki. Jeśli zależy Ci na powierzchniach skrótów Apple, użyj ikony Apple Touch. Jeśli chcesz, aby witryna sprawiała wrażenie skończonej w obu przypadkach, użyj kompletnego pakietu.
Bardziej szczegółową listę kontrolną plików znajdziesz w artykule Jakich plików potrzebujesz w pakiecie Favicon?. Gdy wszystko będzie gotowe do wyeksportowania zasobów, otwórz Generator ikon Favicon / aplikacji, prześlij jeden kwadratowy obraz źródłowy, przejrzyj pakiet i pobierz plik ZIP.
