Jeżeli nasz serwis internetowy jest popularny, warto pomyśleć nad użytkownikami korzystającymi z urządzeń mobilnych. Nie mówię tutaj już o wersjach dla małych ekranów, ale o np. dodawaniu adresu do ulubionych, bądź - w przypadku iPhone'a lub iPada - dodawaniu ikony do ekranu głównego. W tym poradniku pokażę Wam, jak ustalić własną ikonę strony dla urządzeń Apple.
Na początku należy stworzyć naszą ikonę. Najlepiej, jeśli będzie to logo naszego strony. W przykładzie posłużę się logo mojego własnego serwisu - Computer Quizzer, czyli w skrócie CQ. Musimy utworzyć z niego odpowiedni obrazek. Otóż musi być to kwadratowy obraz .png, a rozmiar - przyjmijmy, że co najmniej 50x50. Może być on większy, bo im większy - tym wyższa będzie jego jakość. Rozmiary mojej ikony wynoszą 316x316.
Teraz zajmiemy się wybraniem rodzaju naszej ikony. Domyślnie urządzenia Apple dodają do niej efekt "szkła". Wrzućmy ją do głównego katalogu strony pod nazwą apple-touch-icon.png. Tak to wygląda po dodaniu strony na ekran główny:
Jak widać, w przypadku mojej ikony domyślne efekty dodawane przez system nie wyglądają najlepiej. Możemy to zmienić, wystarczy zmienić nazwę na apple-touch-icon-precomposed.png. W tym momencie zapobiegniemy dodaniu efektu "szkła".
Znacznie lepiej. Oczywiście to, który rodzaj ikony wybierzecie zależy już od Was. Ja tylko pokazuję, jak można sobie radzić, gdy domyślnie nie wygląda to tak, jak tego chcemy.
Taka ikona na pewno spodoba się tym użytkownikom, którzy często korzystają ze swoich iPhone'ów lub iPadów i posiadają na swoim ekranie zakładki do ulubionych stron. Wygląda lepiej, i jednocześnie podnosi reputację naszej strony. Dziękuję za uwagę. :)