17+ najbardziej funkcjonalnych przykładów projektu strony głównej dla Twojej witryny w 2022 r.

Opublikowany: 2022-02-05

Zaktualizowano: 06 kwietnia 2022 Przez: Zespół projektowy

homepage design examples for your next website

Ujawnienie czytelnika: Kiedy kupujesz za pośrednictwem linków polecających na naszej stronie, możemy otrzymać prowizję (bez dodatkowych kosztów dla Ciebie)

Kiedy ktoś odwiedza Twoją witrynę i wchodzi na Twoją stronę główną z uszkodzonymi obrazami, trudnymi do odczytania czcionkami, ciemnymi kolorami i niewyraźnym komunikatem, są szanse, że opuści Twoją witrynę tak szybko, jak to możliwe. Dlatego potrzebujesz najbardziej funkcjonalnego projektu strony głównej, aby Twoi odwiedzający zostali i przekształcili się w klientów lub czytelników.

Głównym celem dobrze zaprojektowanej strony głównej jest przekształcenie odwiedzających w klientów lub fanów. Jeśli na Twojej stronie głównej nie ma żadnego wezwania do działania (CTA), w którym ktoś może kliknąć i albo zarejestrować się, albo dowiedzieć się więcej o Twoim produkcie, nie będzie wiedział, co zrobić i opuścić bez wykonywania żadnych działań. Dlatego naszym celem będzie upewnienie się, że projekt Twojej strony głównej zawiera co najmniej jedno lub dwa konkretne CTA.

Naszym celem jest przejrzenie wielu dobrze zaprojektowanych i funkcjonalnych stron głównych stworzonych przez zespoły projektantów, ekspertów UI/UX i programistów, którzy ciężko pracują, aby zrozumieć, czego potrzeba, aby stworzyć stronę główną, która wyróżnia się i jest atrakcyjna estetycznie dla odwiedzających po raz pierwszy. Omówimy użycie czcionek, kolorów, sloganów, haseł i wezwania do działania, ponieważ to główne i najważniejsze aspekty dobrze zorganizowanej strony głównej.

Cele i zalety strony domowej Well Design

Każda odwiedzana witryna ma inny przekaz i cel, co chcesz, aby Twoi odbiorcy zrobili i zrozumieli, gdy trafią na stronę główną Twojej witryny? Najważniejsze jest to, aby rozumieli, kim jesteś i co chcesz, aby zrobili. W krótkim sloganie czym się zajmujesz oraz opisie szybkich szczegółów o czym są Twoje strony internetowe.

Ponieważ większość odwiedzających najpierw ląduje na Twojej stronie głównej, musisz ich przekonwertować w mniej niż 2 sekundy, w tym zakresie, w jakim znajduje się Twoja firma lub witryna, zostanie to zrobione z pięknym układem graficznym, kolorami, typografią, przyciskami wezwania do działania, aby utrzymać je włączone swoją witrynę i pomóż im odkryć i dowiedzieć się więcej o produkcie lub usłudze, które chcesz zaoferować.

Popraw doświadczenie użytkownika (UX) i interfejs użytkownika (UI), aby uzyskać więcej konwersji

Create a website homepage ideas

Obrazy odgrywają bardzo ważną rolę w układzie strony głównej, obrazy ludzi, obiektów, zwierząt, technologii pozwolą odwiedzającym w kilka sekund lub mniej wiedzieć, o czym jest Twoja witryna. Musimy również zrozumieć Twoją grupę docelową, czego oczekują, gdy po raz pierwszy odwiedzają Twoją witrynę? czy Twoja strona główna jest w sklepie internetowym i sprzedajesz towary lub produkty cyfrowe, czy jest to bardziej ukierunkowana na informacje? Firma Nest spróbuje sprzedać mi produkt do mojego domu, ale United Healthcare przekaże mi informacje na temat konkretnego ubezpieczenia zdrowotnego, którego mogę potrzebować.

Omówimy wszystkie specyficzne aspekty dobrego zaprojektowania strony głównej, aby przyciągnąć odwiedzających za pomocą przycisków wezwania do działania dobrze umieszczonych na Twojej stronie lub subskrypcji biuletynu, w którym nowi odwiedzający mogą zapisać się na cotygodniowe wiadomości. Porozmawiamy o rozmieszczeniu logo, wielkości czcionek, ogólnych głównych kolorach Twojej konkretnej witryny i dlaczego niektóre kolory działają dobrze, a niektóre mogą nie być tak przyjemne. Chcemy mieć pewność, że wrażenia użytkownika będą płynne, a ludzie nie będą zdezorientowani ani nie zagubią się na Twojej stronie głównej, szukając konkretnych informacji lub produktów, ponieważ będą się denerwować i opuścić Twoją witrynę.

Jak rozplanować i zaprojektować najlepszą stronę główną?

Więc czego potrzebujesz, aby zaprojektować dobrze konwertującą stronę główną? Najpierw podamy świetne przykłady z objaśnieniami strony głównej niektórych najpopularniejszych firm, abyśmy mogli porównać i zobaczyć, co sprawia, że ​​są tak świetne. Jest to dobra praktyka dla każdego początkującego projektanta, aby uzyskać pewne pomysły na to, co robią eksperci. Jeśli chcesz stworzyć własną stronę internetową, mamy szczegółowy post, który pomoże Ci zacząć. Istnieje wiele bezpłatnych programów do projektowania graficznego, które pomogą Ci rozplanować stronę główną i przetestować różne projekty, zanim będziesz zadowolony z wyników.

Zachęcamy do korzystania z elementów wizualnych, takich jak ilustracje, ikony, grafiki wektorowe, aby Twoja strona główna zapadała w pamięć, a zdjęcia stockowe odgrywają ważną rolę podczas projektowania strony głównej, ponieważ sprawią, że odwiedzający poczują się bezpiecznie i przyjemnie.

Najlepsze przykłady projektowania strony głównej wraz z wyjaśnieniem i tym, co sprawia, że ​​najbardziej zapadają w pamięć

Teraz możemy wreszcie zobaczyć najlepsze przykłady dobrze zaprojektowanych stron głównych z wielu różnych kategorii, te firmy są dobrze znane z wieloma zasobami i latami testowania kolorów, czcionek, przycisków wezwania do działania, które wykonały wiele testów A/B aby zobaczyć, jakie kolory lub obrazy działają lepiej niż inne. Używają map ciepła, aby zobaczyć, gdzie ludzie klikają, a gdzie nie, dzięki czemu mogą umieścić w tym miejscu przycisk wezwania do działania. Szczegółowo wyjaśnimy, czym wyróżnia się każdy projekt strony głównej.

1. Adobe

Adobe najlepszy projekt strony głównej

Adobe jedna z najbardziej znanych firm tworzących oprogramowanie dla twórców. Używamy Adobe do wielu naszych projektów, od Photoshopa po After Effects. Chcą, abyś zarejestrował się na bezpłatną wersję próbną ich oprogramowania, więc jest to główne wezwanie do działania. Gdy zobaczysz słowo „za darmo”, prawdopodobnie spróbujesz, ponieważ nie masz nic do stracenia.

Bardzo przejrzysty i prosty układ z dużym suwakiem z animacją w tle, pokazującą, jak używać oprogramowania Adobe do tworzenia własnych interakcji. Drugie CTA to „dowiedz się więcej”, jeśli nie jesteś gotowy, aby zacząć, może chcesz dowiedzieć się więcej o innym oprogramowaniu lub produkcie, który oferuje.

Główne kolory: biały, czerwony, czarny, niebieski, pomarańczowy, zielony
Slogan: Tutaj zaczynają się kreatywne podróże.
Slogan: czerp inspirację z naszych aplikacji wideo, projektowania, zdjęć i UI/UX
Wezwanie do działania (CTA 1): Rozpocznij bezpłatny szlak
Wezwanie do działania (CTA 2): Dowiedz się więcej

2. Gniazdo

Projekt strony głównej Nest

Zagnieżdżone w jednej z największych witryn e-commerce z kamerami i termostatami, używają wielu zdjęć produktów, gdy odwiedzisz stronę główną, wiesz dokładnie, co sprzedają, pod głównymi dużymi obrazami znajdują się wszystkie produkty, które sprzedają, dzięki czemu możesz kliknąć i zbadać konkretny produkt do kupienia.

Nie mają specjalnego przycisku wezwania do działania na hołdzie, ponieważ mają tak wiele różnych produktów. Strona główna jest bardzo przejrzysta i profesjonalnie wygląda, używają dużych czcionek na górze „Witamy w Google Nest”. Zbuduj swój pomocny dom, ładne hasło chce, abyś tu został i odkrywał więcej.

Główne kolory: biały, czarny, zielony, szary
Slogan: Witamy w Google Next.
Slogan: Zbuduj swój pomocny dom.
Wezwanie do działania (CTA 1): Brak
Wezwanie do działania (CTA 2): Brak

3. WordPress

Projekt strony głównej WordPress

WordPress, którego używamy w naszej firmie i kochamy go, jest najczęściej używanym narzędziem do tworzenia witryn, które obsługuje ponad 43% całej witryny w Internecie. Strona główna jest bardzo przejrzysta z dużym sloganem zachęcającym do korzystania z oprogramowania do tworzenia następnej witryny. Pokazują Ci zdjęcia innych osób, które tworzą ich witryny, dzięki czemu możesz zacząć już dziś.

WordPress jest oparty na motywach, których możesz użyć i zainstalować, aby rozpocząć tworzenie swojej witryny. Istnieje wiele darmowych motywów portfolio, z których możesz wybrać, aby pomóc Ci zwizualizować swoją stronę główną i dostosować ją do swoich potrzeb, jak omówiliśmy powyżej.

Główne kolory: biały, czarny, niebieski
Slogan: Witamy w najpopularniejszym na świecie kreatorze stron internetowych.
Slogan: 43% sieci opiera się na WordPressie.
Wezwanie do działania (CTA 1): Uruchom swoją witrynę
Wezwanie do działania (CTA 2): Brak

4. Przestrzeń kwadratowa

Squarespace homepage slick design

Squarespace to jeden z najpopularniejszych kreatorów stron internetowych dla twórców. Tak samo, jak używać i uruchamiać własną witrynę osobistą lub eCommerce, możesz wypróbować ją za darmo, a następnie, jeśli Ci się spodoba, miesięczna subskrypcja. Squarespace ma wiele nowoczesnych i prostych w użyciu szablonów przed sprzątaniem, aby rozpocząć.

Squarespace używa dużego obrazu i bardzo dużych czcionek, aby przekazać wiadomość. Wszystko, co można sprzedać, jest głównym sloganem. Dodają również „Bez karty kredytowej”, aby rozpocząć bezpłatny okres próbny, który jest bezproblemowy dla każdego, kto chce przetestować swojego kreatora witryn.

Główne kolory: czarny, różowy, biały
Slogan: Wszystko, żeby cokolwiek sprzedać
Slogan: Rozpocznij bezpłatną wersję próbną witryny już dziś
Wezwanie do działania (CTA 1): Rozpocznij
Wezwanie do działania (CTA 2): Rozpocznij

5. DropBox

Projekt strony głównej Dropbox

Dropbox używa ładnych zdjęć dwóch osób po prawej stronie, pokazujących, jak patrzą na ekran komputera i prawdopodobnie dzielą się plikami, co jest pierwszym wrażeniem, jakie chcą, abyś miał. Fajne wykorzystanie obrazów, jak omówiliśmy wcześniej, i kilka ładnych ilustracji ikon na środku strony głównej.

Duży slogan w lewym górnym rogu „Utrzymuj porządek w życiu”, a pod nim tylko jedno wezwanie do działania „Znajdź plan dla siebie” sprawia, że ​​klikasz na niego i widzisz, co oferują i ile kosztuje każdy plan.

Główne kolory: czarny, niebieski, pomarańczowy
Slogan: Utrzymuj porządek w życiu i pracuj w ruchu — wszystko w jednym miejscu
Slogan: Dropbox zapewnia bezpieczny dostęp do wszystkich Twoich plików.
Wezwanie do działania (CTA 1): Znajdź plan dla siebie
Wezwanie do działania (CTA 2): Brak

6. Uber

Projekt strony głównej Uber

Uber używa dużego, prawie pełnoekranowego obrazu osoby, w tym przypadku kobiety otwierającej drzwi do samochodu, ponieważ jest to firma samochodowa/taksówkarska, która wykorzystuje ludzi i samochody jako obrazy, które pozwalają nam wiedzieć, co robią, nawet bez czytania sloganu, który jako wspominamy przed użyciem obrazów jest bardzo potężny.

Uber ma dwa przyciski wezwania do działania, jeden to „Zarejestruj się, aby prowadzić”, drugi to „Zarezerwuj przejazd”, więc albo chcesz być kierowcą Ubera, albo chcesz przejechać się Uberem w określone miejsce. Jest to bardzo prosta i nowoczesna strona internetowa wykorzystująca głównie obrazy i dwa kolory biały i czarny.

Główne kolory: czarny, biały
Slogan: Usiądź za kierownicą i zarabiaj
Slogan: Jedź po platformie z największą siecią aktywnych motocyklistów.
Wezwanie do działania (CTA 1): Zarejestruj się, aby jeździć
Wezwanie do działania (CTA 2): Zarezerwuj przejazd

7. WooCommerce

Projekt strony głównej WooCommerce

WooCommerce jedna z największych platform eCommerce do budowy własnego sklepu internetowego. Bardzo prosty układ strony głównej, prawie podzielony na dwie części. Po lewej stronie masz ładny, duży slogan „Zbuduj witrynę eCommerce, którą chcesz” z dwoma wezwaniami do działania – jedno to „Załóż nowy sklep”, który dokładnie mówi Ci, co robić.

Po prawej stronie znajduje się przykład strony internetowej lub motywów, których możesz użyć do zbudowania własnego sklepu internetowego, istnieje wiele darmowych motywów WooCommerce, dobrze zaprojektowanych i zakodowanych, które pomogą Ci zbudować własny sklep.

Główne kolory: czarny, biały, fioletowy
Slogan: Zbuduj dokładnie taką witrynę eCommerce, jaką chcesz
Slogan: WooCommerce to konfigurowalna, open-source platforma eCommerce zbudowana na WordPressie
Wezwanie do działania (CTA 1): załóż nowy sklep
Wezwanie do działania (CTA 2): dostosuj i rozszerz

8. Gorący słoik

projekt strony głównej hotjar

Gorący słoik firmy stojącej za mapą cieplną Po zakończeniu projektowania strony głównej zdecydowanie zalecamy zarejestrowanie się u nich, aby zobaczyć, gdzie klikają użytkownicy i czy przyciski wezwania do działania są umieszczone prawidłowo.

Strona główna HotJar jest bardzo prosta i nowoczesna, z dużym sloganem u góry i kreatywnym filmem ilustracyjnym po lewej stronie oraz przyciskiem wezwania do działania po prawej stronie. Jest to bardzo ładny i przejrzysty układ UI/UX, bardzo dobrze wykonany, jak można by oczekiwać od firmy, która robi to codziennie. Świetny przykład dobrze przygotowanej strony głównej, daje też ładne statystyki 26.657 firm zarejestrowanych w zeszłym miesiącu.. daje pewność, ile nowych osób zarejestrowało się u nich w ciągu ostatniego miesiąca.

Główne kolory: czarny, biały, pomarańczowy
Slogan: Dowiedz się, jak użytkownicy zachowują się w Twojej witrynie, czego potrzebują i jak się czują, szybko.
Slogan: Wolne , ręczne dni zestawiania danych i informacji zwrotnych dobiegły końca.
Wezwanie do działania (CTA 1): wypróbuj za darmo
Wezwanie do działania (CTA 2): zarejestruj się w Google

9. eWesele

Projekt strony głównej eWedding

eWedding jedno z największych narzędzi do planowania ślubów w sieci, przejrzysty i prosty układ, duży slogan na górze ze statystykami „921470+ par może się mylić”, dając Ci pewność, że są zaufaną firmą. Ładna, duża ilustracja pokazująca, jak wyglądają narzędzia podczas rejestracji.

CTA jest „darmowe w użyciu”, jak wiemy wcześniej. Darmowy jest bardzo potężnym przyciskiem wezwania do działania, ponieważ wiele osób wypróbuje Twój produkt, ponieważ nie ma nic do stracenia. Tye używa również ładnych ikon ilustracyjnych w połączeniu z tekstem dla estetyki wizualnej.

Główne kolory: fioletowy, biały, zielony
Slogan: Nowy standard w narzędziach do planowania i zarządzania ślubami
Slogan: Zwolnij swojego planistę, pracujemy dla Ciebie 24/7
Wezwanie do działania (CTA 1): bezpłatne
Wezwanie do działania (CTA 2): Zacznij teraz

10. zapewnić

zapewnić projekt strony głównej

Upewnij się, że jedna z największych stron internetowych medicare ma kobiety wyglądające na kreskówki, ponieważ może pomóc ci znaleźć plan, jeśli nie chcesz rozmawiać z prawdziwą osobą, możesz wypróbować wirtualną asystentkę. Bardzo czysta, dobrze zaprojektowana strona internetowa, z dużą ilością białej przestrzeni, aby łatwo się poruszać.

Możesz kliknąć, aby zobaczyć plany lub porównać plany, lub zadzwonić do nich, umieszczając numer telefonu na środku strony. Miło widzieć wszystkie dostępne opcje, więc nie zgubiłeś się, nie wiedząc, co robić.

Główne kolory: czarny, biały, zielony
Slogan: Jestem Emma, ​​twoja wirtualna asystentka Medicare.
Slogan: Pomogę Ci znaleźć produkty, porównać stawki i samodzielnie zarejestrować się.
Wezwanie do działania (CTA 1): Zobacz plany
Wezwanie do działania (CTA 2): Wypróbuj Emmę

11. Niebieski host

Projekt strony głównej Bluehost

Bluehost, jeden z największych dostawców usług hostingowych, ma bardzo ładny i przejrzysty projekt strony głównej, z naciskiem na hosting i budowanie stron internetowych. Strona główna jest podzielona na dwie części, po lewej stronie oferują hosting witryny z miłym wezwaniem do działania, a po prawej możesz zacząć budować swoją witrynę za pomocą CTA „zacznij budować”.

Wyrazisty wizerunek osoby w środku zapraszającej do stworzenia i zbudowania witryny to łatwy i prosty, miły i przejrzysty przekaz. Mają też odznakę, ponieważ są wybranymi redaktorami na PC za najlepszy hosting w 2021 roku, dobre wykorzystanie bezpieczeństwa jako nagrody, którą dostali.

Główne kolory: czarny, biały, niebieski
Slogan: All-in-One Hosting.
Slogan: Nasz nowy kreator sprawia, że ​​tworzenie witryn WordPress jest łatwe i przyjemne.
Wezwanie do działania (CTA 1): Hostuj swoją witrynę
Wezwanie do działania (CTA 2): Zacznij budować

12. Znajdź prawo

Projekt strony głównej FindLaw

FindLaw to strona internetowa z bazą danych wszystkich prawników w Stanach Zjednoczonych, w której można wyszukiwać według zagadnień prawnych lub kodu pocztowego. Używają dużego wizerunku ludzi takich jak Ty, którzy się uśmiechają, że znalezienie prawnika było bardzo łatwe. FindLaw wykorzystuje obraz jako główny cel witryny, z różnorodnością ludzi w oparciu o rasę i płeć.

Mają duży pasek wyszukiwania pośrodku, w którym możesz po prostu wpisać swoje dane lub kod pocztowy i łatwo przeszukać bazę danych wszystkich prawników w Twojej okolicy. CTA „Find My Lawyer” jest jasnopomarańczowe, więc nie możesz go przegapić.

Główne kolory: czarny, biały, pomarańczowy, szary
Slogan: Uzyskaj pomoc we wszystkich swoich potrzebach prawnych
Slogan: FindLaw ułatwia znalezienie prawnika
Wezwanie do działania (CTA 1): Znajdź mojego prawnika
Wezwanie do działania (CTA 2): Brak

13. Sucuri

Projekt strony głównej Sucuri

Sucuri to jedna z dobrze znanych witryn do czyszczenia witryny, gdy zostanie zhakowana lub zainfekowana wirusami. Podoba nam się CTA „Napraw witrynę po włamaniu”, nie ma wątpliwości, co chcą, abyś zrobił po przejściu na stronę główną. Przychodzisz tutaj z problemem, prawdopodobnie Twoja własna witryna została zhakowana i mogą łatwo to naprawić.

Mają obraz po prawej stronie komputera, a czerwony ekran pokazuje zhakowaną witrynę, prawdopodobnie wyglądającą dokładnie tak, jak Twoja, więc możesz łatwo powiązać problem. W prawym dolnym rogu mają czat na żywo z numerem telefonu lub możesz po prostu porozmawiać z osobą na żywo, aby pomóc ci rozwiązać problemy. Czat na żywo jest zielony, abyś czuł się bezpiecznie i komfortowo rozmawiając z drugą osobą.

Główne kolory: czarny, biały, zielony, czerwony
Slogan: Czyścimy i chronimy strony internetowe
Slogan: Naprawiamy hacki i zapobiegamy przyszłym atakom. Platforma w chmurze dla każdej witryny.
Wezwanie do działania (CTA 1): napraw zaatakowaną witrynę
Wezwanie do działania (CTA 2): Dowiedz się więcej

14. Silnik WP

Projekt strony głównej WP Engine

WP Engine jest dobrze znaną firmą hostingową WordPress, która ma bardzo czystą i prostą stronę główną z bardzo dużym sloganem mówiącym, że jest numerem jeden wśród firm hostingowych dla WordPressa. Używają dwóch CTA, jedno jest niebieskie z komunikatem Plany i Ceny, a drugie to zobacz wszystkie nasze produkty. Używają bardzo ładnego obrazu ilustracyjnego po prawej stronie, pokazującego szybkość, analitykę i czat.

Mają logo innych popularnych firm, które używają swoich produktów, abyś czuł się bezpiecznie, że firmy takie jak Volvo, yelp, petco również używają WP Engine do hostowania swoich stron internetowych. Czysta i prosta strona główna zawiera również czat miłosny w prawym dolnym rogu, jeśli chcesz zadać jakiekolwiek pytania.

Główne kolory: czarny, biały, moment obrotowy, niebieski
Slogan: Wzmocnij swoją kreatywność na platformie nr 1 dla WordPress
Slogan: Wybierz najlepsze rozwiązanie hostingowe WordPress dla swojej firmy
Wezwanie do działania (CTA 1): plany i ceny
Wezwanie do działania (CTA 2): Zobacz wszystkie produkty

15. Wielka Opieka Zdrowotna

Projekt strony głównej United Healthcare

United Healthcare jedna z największych stron internetowych dotyczących opieki zdrowotnej i ubezpieczenia zdrowotnego. Bardzo przejrzyście wyglądająca strona internetowa, używają wizerunku rodziny uśmiechniętej i robiącej selfie, wyglądają na szczęśliwych i bezpiecznych. Strona używa ładnego hasła „Zdobądź plany zdrowotne dla siebie i swojej rodziny” od razu do sedna, pod nim masz CTA „Znajdź swój plan” po wylądowaniu na tej stronie sprawia, że ​​czujesz się bezpiecznie i chcesz tu zostać i poznaj więcej opcji.

Główne kolory: biały, moment obrotowy, niebieski
Slogan: Uzyskaj plany zdrowotne dla siebie i swojej rodziny, w każdym wieku i na każdym etapie
Slogan: wciąż jest czas, aby uzyskać zasięg w 2022 r.
Wezwanie do działania (CTA 1): Znajdź swój plan
Wezwanie do działania (CTA 2): Uzyskaj pomoc w znalezieniu planu

16. Eleganckie motywy

Elegancki projekt strony głównej motywów

Eleganckie motywy jeden z największych kreatorów stron WordPress, ma piękną stronę główną, bardzo elegancką i atrakcyjną, skupia się na technologii i oprogramowaniu. Z dużym sloganem i bardzo wyraźnym wezwaniem do działania w kolorze różowym. Używają bardzo ładnego obrazu po prawej stronie z ładnym hasłem „inwestuj w przyszłość” ładne wykorzystanie typografii i ilustracji.

Używają również ikony czatu na żywo w prawym dolnym rogu, jeśli masz jakieś konkretne pytania. Są bardzo konkretni w kierowaniu do swoich odbiorców z 10% zniżką.

Główne kolory: niebieski, różowy, biały
Slogan: WordPress uwolniony
Slogan: najpopularniejsze motywy WordPress na świecie i najlepszy wizualny kreator stron
Wezwanie do działania (CTA 1): Odblokuj moc Divi
Wezwanie do działania (CTA 2): ceny

17. Podnoszenie

Projekt strony głównej Lyft

Lift to kolejny duży dostawca samochodów/taksówek z minimalistycznym i wyrafinowanym projektem strony głównej. Logo, jak na prawie każdej dobrze zaprojektowanej stronie głównej, znajduje się w lewym górnym rogu, logo Lyft jest jasnoróżowe, dzięki czemu wyróżnia się bardzo dobrze. W środku masz wizerunek kobiety-kierowcy z pasażerem z tyłu. Gdy trafisz na tę stronę główną, wiesz dokładnie, co próbują ci powiedzieć.

Dzięki dużemu sloganowi „Let's ride” i wezwaniu do działania zastosuj jazdę lub zarejestruj się, aby jeździć, masz dwie możliwości, aby odkryć więcej. Bardzo czysty i minimalistyczny design z ładnym wykorzystaniem czcionek i zdjęć ludzi takich jak Ty.

Główne kolory: czarny, różowy, biały
Slogan: Jedźmy
Slogan: Ustaw własne godziny. Zarabiaj na własnych warunkach.
Wezwanie do działania (CTA 1): złóż wniosek o przejazd
Wezwanie do działania (CTA 2): Zarejestruj się, aby jeździć

18. Starbucks

Projekt strony głównej Starbuck

Starbucka chyba nie trzeba przedstawiać, bo to największy sklep z kawą na świecie. Osobiście uwielbiam kawę Starbuck z tak wieloma odmianami. Starbuck koncentruje się na kawie dla miłośników kawy. Ponieważ logo jest zielone, większość projektu strony głównej jest zielona i jasnozielona. Używają obrazu uśmiechniętego mężczyzny, który właśnie otrzymuje filiżankę kawy, a inny obraz pod nim przedstawia dwie kawy cappuccino, co sprawia, że ​​chcesz mieć własne.

Chcą, abyś teraz został członkiem Starbuck z dołączeniem do CTA i otrzymywał nagrody, ładne obrazy, kolory i slogan „Wybierz swój nastrój” na podstawie swojej kawy.

Główne kolory: czarny, zielony, brązowy
Slogan: Wybierz swój nastrój
Slogan: Dodaj wybuch emocji do swojego dnia
Wezwanie do działania (CTA 1): Dołącz teraz
Wezwanie do działania (CTA 2): poznaj zimowe menu

19. Powiększenie

Powiększ projekt strony głównej

Zoom największą platformę do spotkań online, która jest tak czysta jak strona główna, używają dużego suwaka z testem i wezwaniem do działania po lewej stronie oraz wideo po prawej z twarzami ludzi połączonymi ze sobą za pomocą wideokonferencji Zoom.

CTA jest w kolorze pomarańczowym z białym tekstem „Zarejestruj się za darmo” lub możesz wyszukać ceny i plany. Nie ma pytań o to, co robią i co chcą, abyś odkrył więcej, rejestrując się w ich produkcie.

Główne kolory: czarny, biały, niebieski
Slogan: Zoom Learning Center
Slogan: Zoom jest dla Ciebie
Wezwanie do działania (CTA 1): Zarejestruj się za darmo
Wezwanie do działania (CTA 2): plany i ceny

20. Mięta

Projekt strony głównej Mint

Mint to aplikacja numer 1 do osobistych finansów, która jest prosta dla Ciebie. Strona główna jest bardzo przejrzysta i bezpośrednia, z dużym hasłem „Zarządzanie pieniędzmi” i dużym obrazem osoby trzymającej telefon, pokazującym, jak łatwa i prosta jest aplikacja. Bardzo ładne wykorzystanie zielonych kolorów, które symbolizują pieniądze.

Główne kolory: czarny, zielony, jasnozielony
Slogan: Proste zarządzanie pieniędzmi
Slogan: Przywitaj się z aplikacją, która eliminuje pracę z finansów osobistych
Wezwanie do działania (CTA 1): zarejestruj się w Mint
Wezwanie do działania (CTA 2): App Store lub Google Play

21. AirBnB

Projekt strony głównej AirBnB

Jeśli kiedykolwiek byłeś na wakacjach, prawdopodobnie znasz airbnb jako alternatywę dla każdego hotelu. Możesz zarezerwować dowolne miejsce w dowolnym kraju lub stanie i zatrzymać się jako czyjś dom, mieszkanie lub pokój. Strona jest czarna z dominującym białym hasłem „nie wiem gdzie iść” i CTA „Jestem elastyczny” Jest duży wizerunek mężczyzny stojącego w kopule w górach, ładne wykorzystanie kreatywnego wizerunku.

Strona jest prawie 90% czarna, a biel jest dominującym i centralnym punktem. Bardzo nowoczesny i elegancki wygląd.

Główne kolory: czarny, biały
Slogan: Nie wiesz, gdzie się udać? Idealny.
Slogan: Inspiracja na następną podróż
Wezwanie do działania (CTA 1): Jestem elastyczny
Wezwanie do działania (CTA 2): Brak

22. Mama

projekt strony głównej moma

MoMa jedno z najpopularniejszych muzeów na świecie, jeśli jesteś projektantem lub osobą kreatywną, jest to jedno z muzeów, które musisz odwiedzić. Strona główna jest bardzo kreatywna, jak można by oczekiwać od nowoczesnego muzeum. Używają bardzo jasnych kolorów z naciskiem na aktualną wystawę.

CTA ma na celu zarezerwowanie biletów lub dowiedzenie się więcej o tym, co jest na wystawie w bieżącym dniu i godzinie. Duże obrazy dają wgląd w to, co zobaczysz podczas wizyty w tym miejscu. Hołd MoMa jest bardzo kreatywny i wyjątkowy w taki sposób, że możesz mieć wyjątkową witrynę internetową i nadal mieć CTA, aby odwiedzający wiedzieli, co dalej i jak jeszcze bardziej poznać Twoją witrynę. Dlaczego ten układ działa, ponieważ wiedzą, że ich odbiorcy to kreatywni profesjonaliści z wizją abstrakcji i sztuki.

Główne kolory: czarny, biały, zielony, fioletowy
Slogan: Czekamy na Ciebie
Slogan: Zaplanuj swoją wizytę
Wezwanie do działania (CTA 1): Zarezerwuj bilety czasowe
Wezwanie do działania (CTA 2): Dowiedz się więcej

Projekt strony głównej letniej

Zbadamy wiele najlepszych stron głównych ze szczegółowym wyjaśnieniem, co działa i dlaczego, są one doskonałymi przykładami tego, jak powinna wyglądać Twoja strona główna i na czym należy się skupić podczas projektowania witryny.

Najlepszym sposobem na rozpoczęcie nowej witryny jest zbadanie, jakiego rodzaju odwiedzających będziesz starać się przyciągnąć, czy są to profesjonaliści, zorientowani na rodzinę czy kreatywni, którzy lubią zabawną i wyjątkową witrynę? Przeprowadzenie obszernych badań UI/UX pomoże Ci określić, jak powinna wyglądać Twoja strona główna i nie zdezorientować odbiorców. Twoje wezwania do działania powinny znajdować się w widocznych miejscach, informując ich, dlaczego powinni kliknąć i wykonać jakiekolwiek działania w Twojej witrynie.

Korzystanie ze zdjęć, ilustracji lub szybkich filmów zapewni Ci przewagę celów wizualnych, ponieważ Twoi odwiedzający, jeszcze zanim przeczytają Twój slogan, będą wiedzieć, o czym jest Twoja witryna. Upewnij się, że używasz dużych czcionek i czysty komunikat, aby nie zmylić użytkowników . Nie dodawaj zbyt wielu CTA jedno lub dwa powinno wystarczyć, aby odwiedzający po raz pierwszy kliknęli, jeśli dasz im zbyt wiele opcji, nie będą wiedzieć, co zrobić, więc musisz uniknąć błędnego wyobrażenia.

Przechowuj najważniejsze informacje w części strony widocznej na ekranie, ponieważ większość osób nie będzie przewijać witryny, większość działań będzie wykonywana w części strony widocznej na ekranie, więc na tym się koncentrujesz

Dlaczego potrzebujesz funkcjonalnego projektu strony głównej?

Głównym celem dobrze zaprojektowanej i funkcjonalnej strony głównej jest przekształcenie odwiedzających w klientów lub fanów.

Czym jest dobry projekt strony głównej?

Dobra witryna projektu strony głównej ma jasną wizję i przekształca odwiedzających w potencjalnych klientów. Ma mocny przekaz, dobrze umieszczone przyciski wezwania do działania, czytelne czcionki i przyjemne kolory z pięknymi obrazami.