Jak zaprojektować idealną stronę pojedynczej strony
Projekty pojedynczych stron mogą być doskonałą techniką radzenia sobie z mniejszymi witrynami internetowymi, nawet te, które mogą wydawać się niemożliwe bez wielu stron. Istnieje mnóstwo wspaniałych powodów, dla których warto korzystać z jednej strony, od łatwości konserwacji po ograniczone zapotrzebowanie na przepustowość.
Jeśli zajmujesz się krótszą stroną, która zwykle ma garść stron, rozważ użycie jednej strony i zobacz, czy ułatwi to projekt i sprawi, że będzie on bardziej przyjazny dla użytkownika. Czytaj dalej, aby uzyskać więcej informacji na temat korzyści, kiedy (i kiedy nie) z nich korzystać, a także kilka dobrych praktyk, których należy przestrzegać.
Zalety projektowania jednej strony
Oczywiście, projekty pojedynczych stron nie są idealne dla każdego projektu. Ale istnieje wiele powodów, aby z nich skorzystać, jeśli są możliwe.
Są intuicyjne w użyciu
Domyślnie wszyscy użytkownicy muszą wiedzieć, jak poruszać się po jednej stronie witryny, jak przewijać. Możesz dołączyć strzały lub inne wskazówki nawigacyjne, ale z rzadkim wyjątkiem, przewijanie przenosi użytkowników z jednej sekcji do drugiej.
Nigdy nie będziesz musiał się martwić, że Twoi goście utkną w wielu warstwach nawigacji, bez końca szukając tego, czego potrzebują. Korzystanie z nagłówka lub innych linków nawigacyjnych jest często pomocne, jeśli na stronie znajduje się wiele sekcji, ale nawet bez nich witryna może być użyta.
Może być szybszy i łatwiejszy w utrzymaniu
Podczas gdy ta nie jest podana, dobrze zakodowana strona pojedynczej strony prawdopodobnie będzie szybsza do kodowania niż strona wielostronicowa. Proces projektowania może czasami wymagać mniej czasu, ale zależy to od złożoności pojedynczej strony.
Jedna strona strony może również narzucać pewne ograniczenia projektowe, które przyspieszają proces, gdy masz na uwadze podstawowy układ strony. Moreso, niż strona wielostronicowa, strona z jedną stroną musi mieć sekcje, które działają bezproblemowo. Tego rodzaju ograniczenie może naprawdę przyspieszyć tworzenie stron, gdy jasno zdefiniujesz, co możesz i czego nie możesz zrobić.
Konserwacja może być łatwiejsza. Kiedy masz do czynienia tylko z jedną stroną, obsługa jest bardziej usprawniona, o ile kod jest dobrze napisany.
Jesteś zmuszony uprościć
Ten buduje poprzedni punkt. Kiedy masz tylko jedną stronę do pracy, musisz uprościć rzeczy do ich najważniejszych elementów. Nigdy więcej stron i stron bezużytecznej propagandy marketingowej. Musisz od razu przejść do sedna.
Lepszy potencjał SEO
Jakość linków zwrotnych jest dużą częścią tego, jak dobrze strona działa w wyszukiwarkach. Chociaż wyszukiwarki niekoniecznie są największym źródłem ruchu dla wielu witryn, wciąż są na ogół ważne.
Mając tylko jedną stronę, masz tylko jedną stronę, do której prowadzi się link. To może zwiększyć znaczenie witryny pod względem wyszukiwarek.
Opowiadanie historii może zwiększyć akcję
Witryny z pojedynczą stroną często wykorzystują kąt opowiadania, że witryny wielostronicowe nie są tak dobre. Może to zwiększyć liczbę konwersji i zainspirować użytkowników do podjęcia działań.
Ludzie są przyzwyczajeni do śledzenia historii, zarówno online, jak i offline, więc ma to oczywiste zalety dla użytkownika. Od dzieciństwa czytamy i słyszymy historie, więc jest to coś, co przychodzi nam naturalnie.
Łatwiejsze do zorganizowania
Nie ma już niekończącej się listy stron i podstron do uporządkowania. Nigdy więcej nie zastanawiam się, czy ta strona lub strona powinna być rodzicem czy dzieckiem. Koniec z dużymi menu nawigacyjnymi i podmenu. Wszystko to na jednej stronie. Niezależnie od tego, czy zdecydujesz się dołączyć linki nawigacyjne, czy po prostu pozwolisz użytkownikom przewijać, zależy to od Ciebie i od tego, czy uważasz, że zwiększy to wygodę użytkownika, czy też nie. To nie jest opcja, gdy witryna ma wiele stron.
Zredukowana przepustowość
Chociaż nie jest to już tak poważnym problemem po zakończeniu hostingu, zastanów się, ilu użytkowników uzyskuje dostęp do Twojej witryny za pomocą urządzeń przenośnych w tych dniach. Zmniejszenie przepustowości łącza w Twojej witrynie jest doceniane przez użytkowników z ograniczonymi planami transmisji danych.
Wyeliminuj witryny mobilne
Responsywny projekt nie ogranicza się oczywiście do witryn z jedną stroną. Ale im bardziej złożona jest strona, tym trudniej jest jej sprawić, by działała dobrze na mniejszym ekranie, nawet przy elastycznym projekcie. Jednokartkowa strona nie jest z konieczności skomplikowana. Ułatwienie projektowania jest ogólnie łatwiejsze. Uproszczona nawigacja i podobne zmiany również ułatwiają projektowanie, które działa dobrze na małych ekranach.
Do paralaksy, czy nie do paralaksy?
W zależności od punktu widzenia, przewijanie paralaksy to najlepsza rzecz, jaka może się kiedykolwiek przytrafić w Internecie lub nadużywana, efekciarska plaga na naszych przeglądarkach. Ale niezależnie od tego, gdzie stoisz, nie wygląda na to, że zniknie w najbliższym czasie.
Osobiście czuję, że jest czas i miejsce na przewijanie paralaksy. Niektóre strony z jedną stroną mogą naprawdę czerpać korzyści z efektu, podczas gdy inne mogą być efekciarskie lub gorsze: trudne w użyciu. Kluczem jest zdecydować, czy efekt przewijania paralaksy, którego chcesz użyć, faktycznie poprawi użyteczność witryny, czy też chcesz go tylko użyć, ponieważ będzie wyglądać świetnie.
Inną kwestią, którą należy rozważyć, jeśli zdecydujesz się na użycie przewijania paralaksy, jest użycie JavaScript lub zwykłej techniki CSS. Więcej informacji na temat obu opcji można znaleźć w sekcji zasobów.
Kiedy korzystać z witryny pojedynczej strony, a kiedy nie
Chociaż strony z pojedynczą stroną mają wiele zalet, nie są one idealnym rozwiązaniem dla wszystkich. Wiele razy nie powinno się używać jednego projektu strony, podczas gdy istnieje wiele innych sytuacji, w których strona jednej strony ma więcej sensu niż strona wielostronicowa.
Jeśli konfigurujesz witrynę, która i tak ma tylko garść stron, strona z jedną stroną może być idealna. Skondensowanie wszystkiego na jednej stronie może sprawić, że cała witryna będzie bardziej nowoczesna, a jeśli i tak będzie świecić w treści, to pojedyncza strona może sprawić, że będzie wyglądać, jakby miała więcej treści.
Innym częstym przykładem strony z jedną stroną jest strona przed uruchomieniem. Często są to pojedyncza strona, często z formularzem do rejestracji w biuletynie. W większości przypadków informacje podane do wiadomości publicznej podczas pre-launch można łatwo zorganizować na jednej stronie, więc warto rozważyć ten styl najpierw podczas projektowania tych stron.
Witryny e-commerce z jednym produktem to kolejne miejsce, w którym witryny z jedną stroną mogą być świetne. Jeśli sprzedajesz tylko jeden produkt, czy to produkt fizyczny, czy cyfrowy, po co zawracać sobie głowę wieloma stronami? Prosta, pojedyncza strona może być znacznie lepszym narzędziem sprzedaży.
Można pomyśleć, że bardziej złożona strona e-commerce nie jest odpowiednia dla pojedynczej strony, ale wciąż może być. Oczywiście unikałbym go w przypadku witryn, które mają więcej niż kilkanaście produktów, ale prosty sklep internetowy może być łatwo przechowywany na jednej stronie, z modalnymi oknami do ładowania szczegółów produktu i procesu realizacji transakcji.
Kiedy nie korzystać z jednej strony strony jest bardzo proste: witryny, które są duże, złożone lub domyślnie wymagają dużej ilości informacji nie są dostosowane do jednej strony strony. W takich przypadkach lepiej mieć bardziej tradycyjną strukturę witryny.
Hybrydowe strony
Chociaż istnieje mnóstwo wspaniałych stron z jedną stroną, istnieje również wiele witryn typu hybrydowego. Dają wrażenie pojedynczej strony, ale używając ajax, modalnych okien i tym podobnych, faktycznie zawierają wiele stron treści.
Witryna Dang & Blast to świetny tego przykład.
Może to być świetne rozwiązanie, jeśli po prostu nie można uzyskać wszystkiego, aby zmieścić się na jednej stronie.
Niektóre witryny "oszukują", jeśli chodzi o pojedynczą stronę. Mają jedną stronę dla swojej głównej strony, ale potem mają bloga w innej domenie (czasami jest to witryna obsługiwana przez Tumblr lub WordPress.com). Nie ma w tym nic złego i może to być sposób na utrzymanie wiadomości na głównej stronie, bez rezygnacji z korzyści płynących z posiadania bloga.
Sprawdzone metody dla witryn z jedną stroną
Większość zasad dobrego projektowania jest nadal stosowana w witrynach z jedną stroną, ponieważ są one dobrze zaprojektowane pod każdym względem. Ale są pewne dodatkowe rzeczy, o których trzeba pamiętać, z których niektóre zostały już poruszone powyżej.
Nie komplikuj
Próba stworzenia projektu, który jest zbyt skomplikowany dla treści, które próbujesz zaprezentować, nie czyni Ciebie ani Twoim użytkownikom żadnych przysług. Zamiast tego uprość projekt i treść w jak największym stopniu, jednocześnie prezentując to, czego potrzebujesz.
Linki nawigacyjne są nadal pomocne
To, że użytkownicy mogą przewijać w celu nawigacji po witrynie, nie oznacza, że jest to najbardziej przyjazny dla użytkownika sposób. Jest to szczególnie ważne, jeśli masz długą stronę z wieloma sekcjami. O ile nie ma powodu, aby ich nie uwzględniać, dodanie linków nawigacyjnych do poszczególnych sekcji sprawia, że witryna jest bardziej przyjazna dla użytkownika.
Podziel się treścią
Jedna strona nie oznacza, że wszystko musi być jedną długą sekcją. W rzeczywistości nie powinno tak być. Podziel swoje treści na logiczne części i sekcje, aby użytkownicy mogli lepiej znaleźć to, czego szukają.
Zrób coś z tym tłem
Strony pojedynczych stron mają zazwyczaj duże tło. Przyznane, czasami te tła są puste lub powtarzające się; ale inne strony jednej strony wykorzystują całą przestrzeń do zrobienia czegoś kreatywnego. Może to również pomóc w dzieleniu treści, jak już wspomniano. Twoje tło nie musi być jednym obrazem. Może to być seria obrazów, jeśli lepiej pasuje do twoich treści.
Zasoby dla stron z jedną stroną
Istnieją setki zasobów, w tym szablony, dla pojedynczych stron internetowych; ale tutaj skupimy się na tych, które się wyróżniają.
Czyste przewijanie paralaksy CSS : Ten artykuł Keitha Clarka wyjaśnia, jak stworzyć technikę przewijania paralaksy przy użyciu tylko CSS. Jest to doskonała opcja, jeśli nie chcesz używać JavaScript (lub nie wiesz jak).
Skrollr : "Przewijanie paralaksy dla reszty z nas". Jest to samodzielna biblioteka działająca na urządzeniach mobilnych i stacjonarnych. Nie wymaga jQuery, tylko zwykły stary JavaScript.
Stellar.js : Stellar.js to kolejna łatwa w użyciu biblioteka przewijania paralaksy. Oferuje wiele opcji konfiguracji i obsługę iOS.
Jedna strona internetowa Wireframes : Ten zestaw szkieletów dla projektów pojedynczych stron może być świetnym punktem wyjścia, jeśli nie masz pewności, jak zorganizować swoją witrynę. Można je pobrać za darmo. Istnieje drugi zestaw, który możesz pobrać tutaj .
Jedna strona miłości : One Page Love to pierwsza na jednej stronie galeria stron z ponad 5000 przykładowymi stronami i ciągle dodawana. Zawierają również mnóstwo szablonów i innych zasobów.
Uruchom Bootstrap : Start Bootstrap ma duży wybór darmowych, jednostronicowych motywów Bootstrap. Istnieją tematy dla agencji, freelancerów, portfeli, stron docelowych i innych.
Szablony o jednej stronie miłości : Oprócz obszernej galerii One Page Love oferuje również szablony bezpłatne i premium.
One Page Mania : Jedna strona Mania oferuje galerię unikalnych stron i szablonów, które możesz pobrać lub kupić.
Wniosek
Pojedyncze projekty stron mogą być doskonałą opcją dla wielu różnych rodzajów stron internetowych. Chociaż nie są one ostatecznym projektem małej architektury, warto wziąć pod uwagę wiele projektów. Rozważ przyczyny używania jednej strony, a następnie rozważ jej przyczyny, a następnie zdecyduj.