16 najlepszych przykładów projektowania strony głównej

nigdy nie masz drugiej szansy na pierwsze wrażenie — dlatego Twoja strona główna jest niewątpliwie jedną z najważniejszych stron internetowych na twojej stronie.

dla każdej firmy Strona główna to jej wirtualne drzwi wejściowe. Jeśli Nowy użytkownik nie lubi tego, co widzi, jego reakcją jest naciśnięcie przycisku „Wstecz”.

zgadza się-niestety wiele osób wciąż ocenia książkę po okładce.

co sprawia, że projekt strony głównej jest genialny zamiast blah?, Cóż, potrzeba więcej niż samego wyglądu — musi też działać dobrze. Dlatego najbardziej genialne strony na tej liście nie tylko zdobywają wysokie oceny urody, ale także mózgów.

ale zanim przejdziemy do przykładów 16, przeanalizujmy niektóre z najlepszych praktyk projektowania stron internetowych.

co sprawia, że Dobry Projekt strony głównej

wszystkie przedstawione tutaj projekty strony głównej wykorzystują kombinację następujących elementów., Nie każda strona jest idealna, ale najlepsze projekty strony głównej mają wiele z nich:

1) wyraźnie odpowiada „kim jestem”, „co robię” i/lub „co możesz (odwiedzający) zrobić tutaj.”

Jeśli jesteś dobrze znaną marką lub firmą (tj. Coca Cola), możesz być w stanie uciec od konieczności opisywania, kim jesteś i co robisz; ale rzeczywistość jest taka, większość firm nadal musi odpowiedzieć na te pytania, aby każdy odwiedzający wiedział, że są we właściwym miejscu.,”

Steven Krugg podsumowuje to najlepiej w swojej bestsellerowej książce, nie każ mi myśleć: jeśli odwiedzający nie będą mogli zidentyfikować, co robisz w ciągu kilku sekund, nie zostaną długo.

2) rezonuje z grupą docelową.

Strona domowa musi być wąsko skupiona — mówić do właściwych ludzi w ich języku. Najlepsze strony domowe unikaj „corporate gobbledygook” i wyeliminuj puch.

3) komunikuje przekonującą propozycję wartości.

gdy odwiedzający pojawi się na twojej stronie głównej, musi zmusić go do pozostania., Strona główna jest najlepszym miejscem do przybicia swojej propozycji wartości, aby potencjalni klienci zdecydowali się pozostać na swojej stronie internetowej, a nie nawigować do konkurencji.

4) jest zoptymalizowany dla wielu urządzeń.

wszystkie strony główne wymienione tutaj są bardzo użyteczne, co oznacza, że są łatwe w nawigacji i nie ma „krzykliwych” obiektów, które przeszkadzają w przeglądaniu, takich jak banery flash, animacje, wyskakujące okienka lub zbyt skomplikowane i niepotrzebne elementy. Wiele z nich jest również zoptymalizowanych pod kątem urządzeń mobilnych, co jest niezwykle ważnym must-have W dzisiejszym mobilnym świecie.,

5) zawiera wywołania do działania (CTA).

każda strona główna wymieniona tutaj skutecznie wykorzystuje podstawowe i wtórne wywołania do działania, aby skierować odwiedzających do następnego logicznego kroku. Przykłady obejmują „bezpłatną wersję próbną”, „Zaplanuj wersję demonstracyjną”, „Kup Teraz” lub ” dowiedz się więcej.”(Oto 30 przykładów wspaniałych CTA, aby uzyskać więcej inspiracji.)

pamiętaj, że celem strony głównej jest zmuszenie odwiedzających do głębszego zagłębienia się w Twoją stronę i przeniesienia ich dalej w dół lejka. CTA mówią im, co mają robić dalej, aby nie zostali przytłoczeni lub zagubieni., Co ważniejsze, Ctas zamienia swoją stronę główną w silnik sprzedaży lub generowania ołowiu, a nie tylko zużycie broszury.

6) zawsze się zmienia.

najlepsze strony nie zawsze są statyczne. Niektóre z nich, jak Whitehouse.gov, stale się zmieniają, aby odzwierciedlić potrzeby, problemy i pytania swoich gości. Niektóre strony domowe również zmieniają się z testowania A / B lub dynamicznej zawartości.

7) wykorzystuje świetny ogólny design.

dobrze zaprojektowana strona jest ważna dla budowania zaufania, komunikowania wartości i przechodzenia odwiedzających do następnego kroku., W związku z tym strony te efektywnie wykorzystują układ, rozmieszczenie CTA, białe znaki, kolory, czcionki i inne elementy wspierające.

teraz przygotuj się, aby dowiedzieć się o doskonałym projektowaniu strony głównej za pomocą następujących przykładów 16 rzeczywistych.

inspiracja do projektowania stron internetowych: 16 najlepszych projektów stron internetowych

1) FreshBooks

Zobacz całą stronę główną

dlaczego jest genialny

• jest łatwy w użyciu. Istnieje wiele dyskusji na temat tego, czy krótkie lub długie Strony domowe działają lepiej., Jeśli zdecydujesz się zrobić to drugie, musisz ułatwić przewijanie i czytanie — i dokładnie to robi ta strona. To prawie jak historia.
• jest świetne wykorzystanie kontrastu i pozycjonowania z głównymi wezwaniami do działania — jest jasne, na co firma chce, abyś się przekonwertował po przyjeździe.
• Kopia użyta w Call-to-action „Try it Free for 30 Days” jest bardzo przekonująca.
• podpowiedź jest również świetna: „Dołącz do 5 milionów osób korzystających z FreshBooks, aby bezboleśnie wysyłać faktury, śledzić czas i rejestrować wydatki.,”To zeruje na wspólny punkt bólu dla freelancerów i małych firm — Grupa docelowa FreshBooks) – zazwyczaj oprogramowanie księgowe jest często” boleśnie złożone.,”

2) Airbnb

Wyświetl całą stronę główną

dlaczego jest genialny

• strona główna jest wspaniała na własny: wita cię pełnoekranowym filmem z pięknymi nagraniami w wysokiej rozdzielczości, na których podróżnicy wykonują czynności, jakby byli mieszkańcami, od gotowania w kuchni, przez kupowanie lokalnych serów, po jazdę motorowerem po ulicach. To bardzo ludzkie i autentyczne.,
• zawiera on formularz wyszukiwania miejsca docelowego i daty, którego większość odwiedzających szuka, bezpośrednio z przodu, prowadząc odwiedzających do logicznego następnego kroku.
• formularz wyszukiwania jest „inteligentny”, co oznacza, że automatycznie wypełni ostatnie wyszukiwanie użytkownika, jeśli jest zalogowany.
• podstawowe wezwanie do działania („Szukaj”) kontrastuje z tłem i wyróżnia się; ale drugorzędne wezwanie do działania dla hostów jest również widoczne powyżej fałdy.,

3) Mint

Wyświetl całą stronę główną

dlaczego jest genialny

• jest to super prosta konstrukcja z mocnym, bez żargonu nagłówkiem i pod nagłówkiem.
• strona główna daje bezpieczną, ale łatwą atmosferę, co jest ważne dla produktu, który obsługuje informacje finansowe.
• zawiera również prostą, bezpośrednią i przekonującą kopię wezwania do działania: „Zarejestruj się za darmo.”Konstrukcja CTA jest również genialna — ikona zabezpieczonej kłódki po raz kolejny trafia do domu komunikat bezpieczeństwa.,

4) Dropbox (konsument)

dlaczego jest genialny

• Strona główna i strona internetowa Dropbox to najlepszy przykład prostoty. Ogranicza korzystanie z kopii i wizualizacji oraz obejmuje białe spacje.
• trudno powiedzieć na podstawie powyższego statycznego zrzutu ekranu, ale ta strona przyciąga twoją uwagę subtelnym wykorzystaniem kapryśnej animacji w tej grafice.
• ich pod-nagłówek jest prosty, ale potężny: „Uzyskaj wszystkie pliki z dowolnego miejsca, na dowolnym urządzeniu i udostępniaj je każdemu.,”Nie trzeba dekodować żargonu, aby dowiedzieć się, co naprawdę robi Dropbox.
• skupia się na jednym głównym wezwaniu do działania, „Zarejestruj się za darmo.”Ale funkcja rejestracji z obsługą Google zmniejsza tarcie dla odwiedzających, którzy nienawidzą wypełniania długich formularzy rejestracyjnych.

5) Dropbox (Business)

Wyświetl całą stronę główną

dlaczego jest to proste

• jest to świetny przykład zapewnienia innej strony internetowej dla różnych odbiorców., W przeciwieństwie do ich głównej strony głównej, która została pierwotnie zbudowana dla konsumentów (powyżej), ich użytkownicy biznesowi wymagają więcej informacji i dodatkowych dowodów na to, że Dropbox dla firm jest bezpiecznym i skalowalnym rozwiązaniem dla firm (problem postrzegania, który Dropbox rozwiązuje bezpośrednio na ich stronie głównej).
• Dropbox nadal przenosi swój prosty design i markę. Zawiera tylko to, co ważne: duży, odpowiedni obraz z obsługą kopii i przycisk” Wypróbuj bezpłatnie przez 30 dni ”

6) Whitehouse.,gov

dlaczego jest genialny

• Budowa strony internetowej, która obsługuje cały naród, nie jest łatwym zadaniem. Whitehouse.gov stale się zmienia, aby odzwierciedlić najważniejsze obawy i priorytety — sama strona główna przeszła setki zmian. Testowanie i optymalizacja jest kluczowym elementem genialnego projektu strony głównej.
• co jest szczególnie dobre w Whitehouse.gov jest to, że jest całkowicie w przeciwieństwie do większości stron związanych z rządem. Ma czysty design i sprzyja społeczności.,
• dość łatwo jest znaleźć to, czego szukasz, gdy wylądujesz tutaj. A jeśli nie możesz go od razu znaleźć, jest nawet przydatne pole wyszukiwania.

7) wędzarnia 4 rzek

dlaczego jest genialna

• ślini się. Tak właśnie myślę, gdy przychodzę na stronę 4 Rivers Smokehouse. W połączeniu ze świetną fotografią nagłówek ” mostek. 18 lat do opanowania. Możesz się delektować.”brzmi jak doświadczenie warte spróbowania.,
• przewijanie paralaksy poprowadzi Cię na wycieczkę po ich usługach, menu i ludziach świetnie się bawiących — wielkie wykorzystanie tego popularnego trendu projektowego.
• jedyny minus? Nie mieszkam wystarczająco blisko tego miejsca. Boo.

8) Cobb Pediatric Therapy Services

Zobacz całą stronę główną

dlaczego jest genialny

• nagłówek i subheadline odwołuje się do emocjonalnej strony odwiedzających: „pracuj z firmą, która to rozumie”; „zaufaj nam., My też tam byliśmy! Znajdziemy pracę, w której będziesz mógł się rozwijać.”Ta propozycja wartości jest wyjątkowa i przekonująca.
• trudno powiedzieć na powyższym zrzucie ekranu, ale nagłówek znajduje się na obrotowej karuzeli, która obsługuje określone osoby, od kandydatów do pracy po osoby szukające terapeuty do swoich szkół.
• istnieje kilka ścieżek, które odwiedzający mogą przejść po przybyciu na stronę, ale wywołania do działania są dobrze ustawione, sformułowane prosto i kontrastują z resztą strony.,

9) Jill Konrath

Zobacz całą stronę główną

dlaczego jest genialny

• jest prosty i punkt. Z nagłówka i pod nagłówka jasno wynika, co dokładnie robi Jill Konrath (i jak może pomóc Twojej firmie).
• daje również łatwy dostęp do materiałów przywództwa myśli Jill, co jest ważne dla ustalenia jej wiarygodności jako głównego mówcy.,
• łatwo zapisać się do Newslettera i skontaktować się — dwa z jej głównych wezwań do działania.
• zawiera logo Outlet News i referencje jako dowód społeczny.

10) Evernote

dlaczego jest genialny

• z biegiem lat Evernote przekształcił się z prostej aplikacji do zapisywania notatek w zestaw produktów biznesowych. Nie zawsze jest to łatwe do przekazania na stronie głównej, ale Evernote wykonuje dobrą robotę, pakując wiele potencjalnych wiadomości w kilka kluczowych korzyści.,
• ta strona domowa wykorzystuje kombinację bogatych, wyciszonych kolorów w filmie i ich jasnozielonych i białych podświetleń, aby wyróżnić ścieżki konwersji.
• po prostym nagłówku („pamiętaj o wszystkim”), ścieżka oczu prowadzi cię do wezwania do działania, „Zarejestruj się za darmo.”

11) Telerik by Progress

dlaczego jest genialny

• „duszne przedsiębiorstwo” nie jest uczuciem, które można uzyskać po przybyciu na stronę Telerik., Dla firmy, która oferuje wiele produktów technologicznych, ich odważne kolory, zabawne wzory i videografia dają klimat podobny do Google. Tylko jeden ważny aspekt sprawiania, że odwiedzający czują się mile widziani i dają im znać, że mają do czynienia z prawdziwymi ludźmi.
• uwielbiam prosty, wysoki poziom przeglądu ich sześciu ofert produktów. Jest to bardzo jasny sposób komunikowania tego, co firma robi i jak ludzie mogą dowiedzieć się więcej.
• kopia jest lekka i łatwa do odczytania. Mówią językiem swoich klientów.,

12) Boxbee

Wyświetl całą stronę główną

dlaczego jest genialny

• nagłówek jest wywołaniem-to-action skierowane prosto do ich grupy docelowej: przedsiębiorców z branży magazynowej.
• ma bardzo czystą i prostą konstrukcję. Projekt podkreśla nagłówek, a następnie natychmiast pokazuje główne wezwanie do działania-niewiele więcej.
• to podstawowe wezwanie do działania jest w bardzo kontrastowym kolorze, dzięki czemu wyróżnia się.,

13) eWedding

dlaczego jest genialny

• dla tych ptaków miłości planuje swój wielki dzień, eWedding jest doskonałym miejscem do budowy niestandardowej strony ślubnej. Strona główna nie jest zaśmiecona i zawiera tylko niezbędne elementy, aby zachęcić ludzi do rozpoczęcia budowy swoich stron internetowych.
• pod-nagłówek ” ponad 750 000 stron ślubnych zbudowanych!”jest świetnym dowodem społecznym.,
• zawierają doskonałe wizualizacje produktów, świetny nagłówek i wezwanie do działania, które zmniejsza tarcie z kopią”, strona startowa.”

14) Basecamp

dlaczego jest genialny

• przez długi czas Basecamp miał genialne strony główne i tutaj możesz zobaczyć dlaczego. Często zawierają niesamowite nagłówki i mądre Kreskówki.
• wezwanie do działania jest pogrubione i powyżej fałdy.,
• w tym przykładzie firma wybrała bardziej blogową stronę główną( lub podejście do pojedynczej strony), która dostarcza znacznie więcej informacji na temat produktu.

15) organizacja charytatywna: woda

dlaczego jest genialna

• to nie jest typowa strona non-profit. Wiele wizualizacji, kreatywna kopia i wykorzystanie interaktywnego projektowania stron internetowych sprawiają, że wyróżnia się.
• animowany nagłówek to świetny sposób na przechwytywanie wielu wiadomości w jednej linii.,
• świetne wykorzystanie wideo i fotografii, szczególnie w uchwyceniu emocji, które powodują działanie.

16) TechValidate

dlaczego jest genialny

• ta strona główna jest pięknie zaprojektowana. Szczególnie podoba mi się wykorzystanie białej przestrzeni, kontrastujących kolorów i zorientowanego na klienta wzornictwa.
• nagłówek jest jasny i przekonujący, podobnie jak wezwania do działania.,
• istnieje również świetna hierarchia informacji, która ułatwia skanowanie i szybkie zrozumienie strony.