Jakie panują obecnie trendy w projektowaniu stron mobilnych? Jakie są najpopularniejsze rozdzielczości, wymiary ekranów? Potrzebne informacje dostarcza nam blog sender11, na którym autor zestawił dane dotyczące wymiarów ekranów komórek wprowadzanych na przełomie kilku lat. Jak widzimy na poniższym wykresie ekrany 240 x 320 (określane jako QVGA) dominują:
Twórcę stron internetowych najbardziej interesuje tutaj długość. Wysokość ma mniejsze znaczenie (za wyjątkiem wypełniania formularzy). Obecnie można już obserwować powszechne stosowanie 240 x 320 na "zwykłych" komórkach. Na smartphonach pojawiają się już większe ekrany jak 320 x 480 dla iPhone. Niestety nie ma wyraźnego trendu pośród producentów co do wymiarów dla tych większych urządzeń.
smashingmagazine.com w artykule "Mobile Web Trends For 2009" zbiera wszystkie najnowsze trendy i rozwiązania. Oto zawarte w tym artykule punkty:
Proste opcje: Jako przykład podawana jest mobilna strona digg.com zawierająca tylko 10 linków i ograniczoną ilość opcji, jak i prostą nawigację.
Brak grafik: Należy uwzględnić że nie zawsze użytkownik używa szybkiego i taniego dostępu do internetu. Ładowanie grafik może być więc wolne. Także duże grafiki nie będą dobrze wyglądały na małych ekranach
Priorytety treści: mobilna strona powinna być pozbawiona zbędnych elementów. Użytkownik wchodząc na stronę z komórki raczej nie zajmuje się swobodnym sufrowaniem po internecie, a szuka konkretnej usługi lub informacji. Zazwyczaj na mobilnych wersjach stron www nie ma reklam ani zbędnych reklam produktów.
Pośród różnych mobilnych stron powtarzają się dwa pomysły zaczerpnięte z iPhona:
Imitacja interfejsu iPhona: często stronę stylizuje się na aplikację iPhona stosując np. identyczne tła i gradienty, czy też podobny układe we własnej kolorystyce:
Deviantart stosuje własną zieloną kolorystykę, lecz układ i zastosowane gradienty imitują aplikację iPhona.
Strona główna w postaci zbioru ikon-przycisków kierujących w różne sekcje serwisu (odpowiednik listy aplikacji na iPhonie):
Strona główna Lawrence.com w łatwy sposób (dla dotykowego ekranu) pozwala wybrać sekcję serwisu, do której chcemy się udać. Podobne rozwiązanie stosuje dailyhoroscope. Oprócz zbioru "przycisków" poszczególne horoskopy są umieszczone w rozsuwalnym sliderze - ogranicza to konieczność przewijania strony aby dotrzeć do interesującej nas treści:
Linki przedstawione jako przyciski są odpowiednio duże i ładnie wyglądają. Strona volkswagena jest jedną z często wymienianych jako bardzo dobry przykład mobilnego serwisu.
Linki ukryte pod przyciskami to powszechnie stosowany i sprawdzony sposób nawigacji po stronie. Łatwo w nie klikać po prostu dotykając ekranu, jak i nie ma problemu z wycelowaniem w odpowiedni link.
Comment article