Dzisiejszy temat będzie trochę nawiązaniem do komentarza jednej z czytelniczek przy artykule o landing page. Okazało się, że niektórzy mylą strony docelowe z tzw. stronami „one page”. I to o nich chciałbym napisać.
Czym są strony „one page”?
Witryny takie, jak sama nazwa zresztą wskazuje, opierają się o prezentację ich treści na jednej stronie. I tu oddaję głos Mariuszowi, naszemu webmasterowi, który temat zna od podszewki:
„Jakby spojrzeć na strony „one page” z perspektywy czasu, to można zobaczyć analogię do starych rozwiązań nawigacyjnych operujących na kotwicach. Pomysł sprowadza się do ulokowania na stronie głównej wszystkich podstron jedna pod drugą. Umieszczone są one w odrębnych blokach z czego każdy blok jest oznaczony węzłem kotwicy w postaci unikalnego ID. Po wywołaniu zakładki z menu nawigacyjnego, innymi słowy – kliknięciu w nią, strona jest przesuwana do ustalonego (piętra) poziomu strony. Z uwagi na dosyć duże rozmiary stron w osi Y, częstym i praktycznym rozwiązaniem jest przypinanie menu nawigacyjnego do górnej krawędzi serwisu (mamy wtedy efekt „pływającego” menu) lub umieszczenie buttonu nawigacji zwrotnej („page up”), który umożliwia powrót o poziom wyżej lub na początek strony. Co do języka kodowania to jest z tym właściwie jak z innymi stronami. Całość można zbudować już za pomocą HTML-a ale jak chcesz mieć fajne efekty czy animacje to musisz wesprzeć się odpowiednimi skryptami.”
Przykłady takich fajnych efektów pokazałem przy okazji wpisu o efekcie parallax który jest bardzo często wykorzystywany przy stronach „one page”.
Warto dodać że bardziej rozbudowane serwisy „one page” mogą mieć również tradycyjne podstrony. Inaczej miałyby one po dobre parę metrów długości i nikomu nie chciałoby się ich przeglądać. Taką strukturę będzie miała nowa odsłona naszej strony nad którą obecnie pracujemy. Ale o tym na razie cisza 😉
Generalnie gdy informacji nie jest zbyt wiele wystarczy sama strona główna z kilkoma blokami. Czasem, gdy mamy np. ciekawą ofertę, „one page” sprawdzi się idealnie jako taka „zajawka” usług czy portfolio. Odwiedzający od razu otrzymuje wtedy najważniejsze informacje i jeśli będzie chciał się dowiedzieć więcej będzie miał możliwość głębszej eksploracji. Wtedy dodatkowo podczepiamy podstrony ze szczegółami aby nie wydłużać niepotrzebnie całości.
Jeśli chodzi o samą realizację taki stron to poziom trudności nie odbiega od tworzenia tych zwykłych. Inaczej się wtedy podchodzi do zaplanowania całości a sam proces wygląda trochę inaczej. Mówię tu oczywiście o indywidualnych projektach bo na szablonach (są takie dostępne w WordPressie) pracuje się praktycznie tak samo.
Dla kogo „one page”?
Największą zaletą stron „one page” jest to że są one wygodne i łatwe w przeglądaniu. A do tego miłe dla oka. Nic więc dziwnego że jest na nie coraz więcej chętnych. Mogą być stosowane dla zwykłych stron wizytówek jak i dla bardziej rozbudowanych serwisów. Ograniczeń właściwie nie ma, choć przed podjęciem decyzji warto zastanowić się czy nie skończy się to przerostem formy nad treścią. Tym bardziej, że ze względu na specyfikę projektu są one często (choć nie zawsze) trochę droższe od stron tradycyjnych. Dlatego warto dobrze zastanowić się przed pójściem w tym kierunku.
Zresztą jak to zwykle bywa – na koniec i tak wszystko jest kwestią gustu.
Przykłady
W naszym dorobku póki co mamy właściwie jedną stronę typu „one page”, choć i ona ma również tradycyjne rozwiązania. Wydaje się, że polski Internet nie jest chyba jeszcze gotowy na takie realizacje. Oto nasz projekt:
Boutique B&B
A oto kilka zagranicznych projektów które uważam za ciekawe:
Sweez, Give 0.7, Rise and Shine
Co myślicie o takich stronach?
Mariusz Korzeniecki
Fajnie wyglądają te strony. Nawet nie wiedziałem, że mają swoją nazwę:) Dobry artykuł
Generalnie fajny pomysł, szczególnie ciekawie wyglądają strony z efektem parallax