Good Mood

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, a nie mdły?, Potrzeba więcej niż samego spojrzenia . musi też działać dobrze. Dlatego najbardziej genialne strony na tej liście nie tylko zdobywają wysokie oceny pod względem piękna, ale także mózgu i kreatywności.

ale zanim zagłębimy się w przykłady, przeanalizujmy niektóre z najlepszych praktyk projektowania stron internetowych.

wszystkie przedstawione tu projekty strony głównej wykorzystują kombinację następujących elementów.

nie każda strona jest idealna, ale najlepsze projekty stron mają wiele z nich.,

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

Jeśli jesteś znaną marką lub firmą (tj.,, Coca-Cola) może być w stanie uciec z konieczności opisywania, kim jesteś i co robisz; ale rzeczywistość jest, większość firm nadal muszą odpowiedzieć na te pytania, tak, że każdy odwiedzający wie, że są w ” 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.

projekt 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.

projekt komunikuje atrakcyjną 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.

projekt 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.

projekt 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.”

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.

projekt zawsze się zmienia.

najlepsze strony nie zawsze są statyczne. Niektóre z nich 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.

projekt jest skuteczny.

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ę na poznanie doskonałego projektu strony głównej za pomocą następujących przykładów 23 Z życia wziętych.,

Dropbox (Business)

4 Rivers Smokehouse

Cobb

Melyssa Griffin

Jill Konrath

Evernote

Telerik by Progress

eWedding

Basecamp

charity: water

TechValidate

chipotle

medium

Digiday

kind snacks

Ahrefs

A24 films

ellevest

HubSpot

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 podstawowymi połączeniami do działania-to jasne, na co firma chce, abyś się przekonwertował po przyjeździe.
• Kopia użyta w wywołaniach do działania „zacznij za darmo” jest bardzo przekonująca.
• FreshBooks wykorzystuje referencje klientów na stronie głównej, aby opowiedzieć prawdziwe historie o tym, dlaczego warto korzystać z produktu.,
• pod-nagłówek jest również świetny: „Dołącz do ponad 10 milionów właścicieli małych firm korzystających z FreshBooks.”FreshBooks fachowo wykorzystuje social proof – 10 milionów to duża liczba – aby zmusić swoich docelowych odbiorców do dołączenia do swoich rówieśników i wypróbowania tego narzędzia.

Airbnb

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

dlaczego jest genialny

• zawiera formularz wyszukiwania miejsca docelowego i Daty że większość odwiedzających przyjść 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.
• oferuje propozycje wycieczek i wyjazdów użytkownicy Airbnb mogą rezerwować na tej samej stronie, co ich noclegi, aby goście byli bardziej podekscytowani rezerwacją podróży na stronie. Pokazuje również, która z tych ofert jest najbardziej popularna wśród innych użytkowników.,

Pixelgrade

dlaczego jest genialny

• – od razu wiesz, o co chodzi: motywy WordPress. Duży tytuł, a następnie opisowy podtytuł, pozwala odwiedzającym wiedzieć, czego się spodziewać.
• projekt jest prosty, a kombinacja kolorów świetnie sprawdza się w wyróżnianiu wezwania do działania.
• prawa strona pomaga zobaczyć, jak wyglądają ich motywy WordPress, bez konieczności przewijania lub kopania głębiej.,

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 ponownie trafia do domu komunikat bezpieczeństwa.,

Dropbox (Business)

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

dlaczego jest genialny

• Dropbox przenosi swoją prostą konstrukcję i branding. Zawiera tylko to, co ważne: duży, odpowiedni obraz z obsługą kopii i przycisk „Wypróbuj bezpłatnie przez 30 dni”
• Strona główna i strona internetowa Dropbox są najlepszym przykładem prostoty. Ogranicza korzystanie z kopii i wizualizacji i obejmuje białe spacje.,
• jego podtytuł jest prosty, ale potężny: „bezpieczne rozwiązanie do udostępniania plików i przechowywania, któremu ufają pracownicy i administratorzy IT.”Nie trzeba dekodować żargonu, aby dowiedzieć się, co naprawdę robi Dropbox.

4 rzeki wędzarnia

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 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.

Cobb Pediatric Therapy Services

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

dlaczego jest to genialne

• nagłówek i pod nagłówek przemawiają do emocjonalnej strony odwiedzających: „Pracuj z firmą, która je otrzymuje”; ” zaufaj my. 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 konkretne osoby, od kandydatów do pracy po osoby szukające terapeuty do swoich szkół.
• istnieje kilka ścieżek, które odwiedzający mogą podjąć, gdy pojawią się na stronie, ale wezwania do działania są dobrze pozycjonowane, sformułowane prosto i kontrastują z resztą strony.,

Melyssa Griffin

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

dlaczego jest genialny

• Melyssa natychmiast demonstruje dowód społeczny „Dołącz do ponad 200 000 innych…”
• kwalifikuje powód odwiedzającego do odwiedzenia swojej strony internetowej za pomocą szybkiej ankiety, a każda opcja łączy się z inną ofertą treści.
• dodaje twarzy do swojej marki. Ona nie jest tylko przypadkową stroną internetową; wyjaśnia, że jest człowiekiem, z którym ludzie mogą się łączyć.,
• strona używa jasnych kolorów bez przytłaczających i ułatwia zrozumienie, czym jest główna Oferta firmy Melyssa.

Jill Konrath

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

dlaczego jest genialny

• to proste i przechodzi prosto do sedna. 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 Jill thought leadership, co jest ważne dla ustalenia jej wiarygodności jako głównego mówcy.,
• łatwo zapisać się do Newslettera i skontaktować się z nim.
• the pop-up subscription CTA uses social proof to get you to join her thousands of other fans.
• zawiera logo Newsów i referencje jako dowód społeczny.

Evernote

dlaczego jest genialny

• przez lata 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 główna wykorzystuje połączenie bogatych, wyciszonych kolorów w filmie i jego charakterystycznych jasnozielonych i białych pasemek, aby wyróżnić ścieżki konwersji.
• po prostym nagłówku („pamiętaj o wszystkim”) ścieżka oczu prowadzi do wezwania do działania, „Zarejestruj się za darmo.”
• Evernote oferuje również proces rejestracji jednym kliknięciem za pośrednictwem Google, aby pomóc odwiedzającym zaoszczędzić jeszcze więcej czasu.,

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, jej 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 przegląd 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.

eWedding

dlaczego jest genialny

• dla tych zakochanych ptaków planujących 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.
• podtytuł ” ponad 800 000 stron ślubnych zbudowanych!,”jest świetnym dowodem społecznym.
• zawiera doskonałą grafikę produktu, świetny nagłówek i wezwanie do działania, które zmniejsza tarcie z kopią”, strona startowa.”

Basecamp

dlaczego jest genialny

• od dawna Basecamp ma genialne strony główne i tutaj możesz zobaczyć dlaczego. Często zawiera 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.
• wycena klienta jest odważnym i dobitnym świadectwem mówiącym o korzyściach i rezultatach korzystania z produktu.

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 obraz nagłówka to świetny sposób na przyciągnięcie uwagi.,
• wykorzystuje świetne wykorzystanie wideo i fotografii, szczególnie w uchwyceniu emocji powodujących działanie.

TechValidate

dlaczego jest genialny

• ta strona główna jest pięknie zaprojektowana. Szczególnie podoba mi się użycie białych spacji, 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.,

Chipotle

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

dlaczego jest genialny

• strona główna jest świetnym przykładem zwinności i ciągłych zmian. Aktualna strona główna Chipotle jest o zbliżających się wakacjach, które wykorzystuje jako wyjątkową propozycję wartości, aby zachęcić Cię do rozpoczęcia klikania na swojej stronie. Kiedy myślę o Chipotle, niekoniecznie myślę o cateringu, ale strona jest świetnym przypomnieniem, aby rozważyć różne zastosowania burrito, które już znasz i kochasz.,
• fotografia żywności jest szczegółowa i piękna, i sprawia, że jestem głodny, patrząc na nią. Teraz jest to efektywne wykorzystanie wizualizacji.

Medium

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

dlaczego jest genialny

• jest to prawdopodobnie jeden z najlepszych zastosowań białych znaków, jakie widziałem. Pozwala to na umieszczenie w centrum uwagi i zdjęcia aplikacji Medium, jednocześnie przyciągając wzrok do ciemniejszych tytułów sekcji na stronie.
• Medium ułatwia rejestrację – na stronie lub za pomocą prostej wiadomości tekstowej na telefon komórkowy., Jestem znacznie bardziej responsywny na tekst niż e-mail, więc jest to świetna strategia, aby utrzymać ludzi zaangażowanych w proces rejestracji.
• strona główna wykorzystuje social proof, aby zachęcić odwiedzających do rozpoczęcia klikania: sekcje „popularne na nośniku” i „typy pracowników” dają mi znać, gdzie znaleźć wysokiej jakości treści.,

Digiday

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

dlaczego jest genialny

• w przeciwieństwie do innych publikacji online, które zalewają strony główne z jak największą liczbą nagłówków i zdjęć, pierwsza sekcja Digiday prezentuje tylko jeden artykuł. Jego polecany obraz (w tym przypadku przerażający) przyciąga wzrok, a nagłówek prosi o kliknięcie teraz, gdy odwiedzający ma pomysł, co zamierza przeczytać.,
• na górze strony głównej, gdzie witryny Zwykle prezentują mnóstwo różnych sekcji i opcji do kliknięcia, można kliknąć tylko jedną ikonę – która prowadzi do strony subskrypcji.

rodzaj przekąski

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

dlaczego jest genialny

• pogrubione kolory wytwarzają kontrast, dzięki czemu słowa i obrazy wyróżniają się na stronie.
• CTA – „sklepowy rodzaj” – jest sprytny. To zachęca odwiedzającego do kliknięcia, aby dowiedzieć się więcej podczas gry na słowo „miły” – sugerując, że jest to dobry wybór, aby tam robić zakupy.,
• slogan KIND Snacks jest wprost genialny – kiedy go przeczytałem, wiadomość natychmiast rozbrzmiała i sprawiła, że chciałem przeczytać etykietę baru z przekąskami.

Ahrefs

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

dlaczego jest genialny

• kontrast kolorów między kolorami niebieskim, białym i pomarańczowym przyciąga wzrok i sprawia, że nagłówek i CTA są pop.
• pod nagłówek i CTA są atrakcyjną parą: możliwość rozpoczęcia śledzenia i wyprzedzania konkurentów za darmo to świetna oferta.,
• strona główna prezentuje wiele opcji dla odwiedzającego, ale nie jest zaśmiecona dzięki solidnemu tłu i prostej typografii.

A24 Filmy

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

dlaczego jest genialny

• strona główna firmy filmowej składa się tylko z zwiastunów nowych filmów. Wiemy, że treści wideo są formatami, których odbiorcy chcą zobaczyć więcej, i jest to świetna strategia, aby zaprezentować pracę A24 w bardzo angażujący sposób.,
• na górze strony głównej, A24 natychmiast oferuje mnóstwo sposobów skontaktowania się za pośrednictwem mediów społecznościowych i poczty e-mail – coś, co doceniam jako gość, gdy tak wiele innych witryn zakopuje informacje kontaktowe na dole strony.

Ellevest

Zobacz całą stronę główną

dlaczego jest genialny

• „inwestuj jak kobieta: bo pieniądze to potęga.”Te nagłówki są potężne i sprawiają, że chcę dowiedzieć się więcej o produkcie-zarówno jako kobieta, jak i jako ktoś zainteresowany dokonywaniem mądrych wyborów finansowych.,
• obrazy pokazują, a nie opowiadają, jedną z Wartościowych propozycji firmy: witrynę komputerową i aplikację mobilną, które poruszają się wraz z Tobą.
• „Get Started” jest świetnym CTA – w rzeczywistości sami go używamy tutaj w HubSpot. Po kliknięciu wystarczy kilka prostych kroków, aby skonfigurować profil i rozpocząć inwestowanie.,

HubSpot

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

dlaczego jest genialny (jeśli sami tak mówimy)

• postacie LEGO przyciągają twoją uwagę (ponieważ są słodkie), a następnie sprytnie ilustrują i wzmacniają wiadomości w nagłówku i pod nagłówku.
• jest to kolejny przyciągający wzrok CTA „Get Started” – z bonusową mikrokopią opisującą nasze bezpłatne wersje, które użytkownicy mogą wybrać do aktualizacji w przyszłości.,
• na całej stronie głównej nasze jasnoniebieskie i pomarańczowe motywy kolorystyczne powracają, aby przyciągnąć wzrok do linków i CTA.

szukasz więcej inspiracji? Sprawdź te niesamowite strony O nas.