Przewodnik projektowania wszystkiego dla sklepów Shopify

Czcionki, kolory, akcja! Dla osób o skłonnościach artystycznych zaprojektowanie sklepu Shopify może być ekscytującym wyzwaniem. Ale dla marketerów i przedsiębiorców, którzy czują się trochę ociężali, gdy muszą wybierać między czcionkami szeryfowymi i nieszeryfowymi, ten proces może być bardzo zniechęcający.

Chociaż Shopify ma wiele zasobów, które ułatwiają rozpoczęcie pracy — mówimy o gotowych szablonach motywów, doświadczonych projektantach do wynajęcia oraz platformach handlowych pełnych aplikacji i widżetów — paraliż decyzyjny jest bardzo poważnym problemem. Przykład: każdy chce sklepu Shopify, który jest atrakcyjny wizualnie, przyciągający uwagę i zoptymalizowany pod kątem konwersji — ale łatwiej to powiedzieć niż zrobić.

Ponieważ niebo jest praktycznie granicą, jeśli chodzi o opcje projektowania Twojego sklepu Shopify, od czego zacząć? Odłóż próbki kolorów — oto kompletny przewodnik projektowy dla Shopify, którego zawsze potrzebowałeś, ale o jego istnieniu nie wiedziałeś, wraz ze wszystkimi wskazówkami i sztuczkami, których potrzebujesz, aby dostosować, uruchomić i rozpocząć sprzedaż.

W tym artykule:
Motywy Shopify
Zdjęcia produktów
Dostosowywanie motywu
Struktura menu
Nagłówek strony głównej
3 wskazówki na wynos
Potrzebuję pomocy?

Motywy Shopify

Pierwszym krokiem do zbudowania sklepu Shopify jest wybór odpowiedniego motywu. Pomyśl o tym jako o kręgosłupie Twojej witryny, który określa wrażenia użytkownika, estetykę wizualną i funkcjonalności Twojego sklepu.

Sklep z motywami Shopify, który oferuje setki opcji, ułatwia znalezienie idealnego dopasowania. Ponadto większość z nich zapewnia wiele odmian stylu, co oznacza, że ​​możesz je dostosować, aby pasowały do ​​wyglądu i stylu Twojej marki pod względem kolorów, czcionek i aplikacji.

Czuć się zaszczyconym? Użyj filtrów Shopify, aby zawęzić wybór poprzez:

• Rozmiar Twojego katalogu produktów. Jeśli masz wiele produktów, możesz potrzebować funkcji, takich jak nieskończone przewijanie lub układ siatki.

• Twoja branża. Firmy modowe mogą wymagać motywów, które pozwalają kupującym wybierać spośród wielu rozmiarów i kolorów, podczas gdy marki artystyczne i fotograficzne mogą potrzebować większych miejsc na zdjęcia produktów.
• Cena £. Chociaż Shopify oferuje różne bezpłatne motywy, bardziej złożone mogą kosztować nawet 180 USD.

Chociaż możesz później dostosować typografię i schematy kolorów, proces dostosowywania jest prostszy, jeśli wybierzesz motyw, który pasuje do Twojej wizji witryny pod względem ogólnej estetyki i układu.

Zdjęcia produktów

Chociaż jesteśmy wielkimi fanami solidnego rynku motywów Shopify, istnieje jedno ryzyko: posiadanie sklepu, który wygląda tak, jak wszyscy inni, nawet jeśli uwzględnisz dostosowanie. Jedno szybkie rozwiązanie? Wyjątkowe zdjęcia produktów.

Aby odróżnić swoją markę od konkurencji, ważne jest, aby robić zdjęcia produktów, które odzwierciedlają tożsamość i postawę Twojej firmy. Fotografia odgrywa ogromną rolę w ustalaniu stylu i tonu Twojej marki.

Nie bój się zabawić i bądź odważniejszy ze swoimi zdjęciami produktów:

• Połącz zdjęcia produktów z kilkoma zdjęciami stylu życia , na których Twoje produkty są kręcone w plenerze, przy użyciu rekwizytów i modeli wspierających.
• Eksperymentuj z różnymi układami . Na przykład, zamiast zawsze fotografować ubrania przez umieszczenie ich na białym tle, rozważ wykonanie flat-lay lub zatrudnienie modelek.
• Przycinaj i fotografuj pod interesującymi kątami , a nie na wprost. To świetny sposób na dodanie stylu i charakteru Twoim zdjęciom.

Aby uzyskać więcej wskazówek dotyczących robienia niesamowitych zdjęć produktów i stylu życia, zapoznaj się z tym przewodnikiem dla majsterkowiczów.

Dostosowywanie motywu

Teraz, gdy już wybrałeś motyw i masz do wyboru całą rolkę zdjęć produktów z aparatu, nadchodzi zabawna część: przekształcenie witryny w coś, co jest dla Ciebie wyjątkowe.

Dzięki wygodzie, jaką oferuje Shopify, personalizacja nie wymaga żadnego kodowania z Twojej strony. Zamiast tego po prostu kliknij Ustawienia motywu, a znajdziesz wiele sposobów na dostosowanie stylu wizualnego swojego sklepu.

Zabarwienie

W menu Kolory możesz przełączać kolory wielu elementów w Twoim sklepie, w tym tekstu, przycisków i pól formularzy.

Wskazówka dla profesjonalistów: aby wyróżnić wezwanie do działania (CTA), zastanów się nad tym, aby było ono odważniejsze i jaśniejsze, kontrastujące z resztą strony.

Typografia

Ta sekcja kontroluje wygląd całego tekstu w Twoim sklepie. Możesz dostosować czcionkę, grubość i skalę dla nagłówków i tekstu podstawowego.

Favicon

Favicony to małe ikony — zazwyczaj logo lub prosty obraz skojarzony z firmą — które pojawiają się na karcie przeglądarki.

• Masz odpowiedni obraz? Po przesłaniu Shopify automatycznie zmieni rozmiar do 32 x 32px.
• Nie masz? Shopify ma mnóstwo darmowych obrazów, których możesz użyć.

Elementy kasy

Proces realizacji transakcji jest najważniejszą częścią Twojej witryny e-commerce. Bez fantastycznego doświadczenia w kasie ryzykujesz, że kupujący porzucą swoje koszyki w połowie zakupu.

Aby proces realizacji transakcji był jak najbardziej płynny, możesz dostosować:

• Kolory akcentów, przycisków i błędów
• Typografia specyficzna dla kasy
• Wzór tła, kolor lub obraz na stronach podsumowania transakcji i zamówień

Struktura menu

Chociaż większość gotowych motywów Shopify będzie zawierać te kluczowe elementy, przed uruchomieniem sklepu warto pamiętać o tych wskazówkach:

Pasek nawigacyjny

Pasek nawigacyjny znajduje się u góry każdej strony, umożliwiając kupującym szybkie przechodzenie między stronami.

Wskazówka dla profesjonalistów: ułatw kupującym znalezienie tego, czego potrzebują, bez przytłaczania ich. Aby główny pasek nawigacyjny był stosunkowo czysty i prosty, możesz dodać kategorie i podkategorie jako opcje rozwijane, które są ukryte, chyba że najedziesz na nie kursorem.

Pasek ogłoszeń

Wyprzedaż ograniczona czasowo? Opóźnienia w dostawie? Nowe godziny otwarcia sklepu? Gdy musisz promować istotne informacje, które powinni znać wszyscy kupujący, odpowiedzią jest pasek ogłoszeń (znany również jako globalny nagłówek).

Większość motywów Shopify zawiera paski ogłoszeń — wystarczy je dostosować i włączyć za pomocą edytora motywów Shopify.

Porada dla profesjonalistów: upewnij się, że paski ogłoszeń są stylizowane w taki sam sposób jak Twoja witryna (pomyśl o kolorach marki, czcionkach i wezwaniach do działania).

Stopki

Stopki to jeden z najbardziej niedocenianych obszarów w Twojej witrynie. Chociaż prawdą jest, że niewielu kupujących przewinie całą stronę główną i dotrze do stopki, jest to jedno z pierwszych miejsc, w których zajrzą, gdy potrzebują szybkiego dostępu do informacji.

Aby edytować stopkę, musisz przejść do strony Nawigacja w Sklepie internetowym.

Wskazówki dla profesjonalistów:

• Twoja stopka nie powinna być tylko powtórzeniem tych samych informacji na pasku nawigacyjnym. Zamiast tego dodaj ważne linki do stron dotyczących wysyłki, zwrotów i wymiany, prywatności witryny, ofert pracy i nie tylko.
• Używaj ikon mediów społecznościowych jako przycisków — zmniejszy to słownictwo w stopce.
• Zezwalaj kupującym na rejestrowanie się, aby otrzymywać aktualizacje e-mailem lub SMS-em.
• Zapewnij szybkie łącza do obsługi klienta, takie jak infolinie, „rozpocznij czat na żywo” lub pomoc e-mail.

Nagłówek strony głównej

Nagłówek Twojej strony głównej jest pierwszą rzeczą, jaką widzą kupujący, gdy trafiają do Twojej witryny. Zrób doskonałe pierwsze wrażenie, a będą przewijać po więcej. Jeśli ich nie przyciągniesz, zamkną kartę. Mając to na uwadze, nagłówek strony głównej powinien:

• Podaj szybki obraz tego, czym jest Twoja marka lub jakie produkty sprzedajesz
• Promuj wydarzenie sprzedażowe
• Zademonstruj postawę i tożsamość swojej marki
• Zaprezentuj swoje najlepsze produkty

Niezależnie od tego, czy nagłówek Twojej strony głównej jest filmem, karuzelą czy statycznym obrazem, powinieneś starać się regularnie go zmieniać — nigdy nie chcesz, aby Twoja witryna wydawała się przestarzała lub nieaktualna dla lojalnych klientów.

3 wskazówki na wynos

Projektowanie sklepu Shopify może być świetną zabawą, ale może też wymknąć się spod kontroli, gdy zaczniesz eksperymentować z czcionkami, kolorami i widżetami na czymś, co w zasadzie jest pustym płótnem. Aby proces projektowania Shopify był jak najłatwiejszy w zarządzaniu i bez bólu głowy, oto kilka wskazówek, o których należy pamiętać:

1. Zawsze funkcja nad formą

Możesz mieć piękną witrynę, ale jeśli nie działa intuicyjnie i nie oferuje fantastycznej podróży klienta, zobaczysz stagnację sprzedaży. Polecamy:

• Skupienie się na tym, co chcesz osiągnąć w swojej witrynie, zanim rozpoczniesz proces projektowania. Pomoże to zawęzić potrzebne narzędzia lub widżety i zapobiegnie paraliżowi wyboru, który prawdopodobnie wystąpi podczas pierwszej wizyty w sklepie Shopify App Store.
• Wdrażanie przydatnych funkcji, takich jak rekomendacje i niezawodne filtry , aby umożliwić kupującym szybkie zawężenie wyszukiwania produktów.
• Priorytetyzacja szybkości witryny. Chociaż kuszące jest dodanie mnóstwa niesamowitych animacji, fajnych aplikacji i obrazów w wysokiej rozdzielczości, im więcej elementów dodasz, tym dłuższy będzie czas ładowania Twojej witryny. Badania wykazały, że każda dodatkowa sekunda ładowania strony może zmniejszyć liczbę konwersji nawet o 7%, a odsłon strony o 11%. Z drugiej strony szybsze witryny są nagradzane wyższymi pozycjami w Google.
• Kompresowanie obrazów. Darmowe narzędzia, takie jak compressor.io, mogą pomóc w zachowaniu wysokiej jakości zdjęć produktów, które będą ostre, przy jednoczesnym zmniejszeniu rozmiaru pliku.
• Wybieranie motywów w Sklepie z motywami Shopify zamiast motywów ze stron internetowych osób trzecich. Ponieważ motywy innych firm nie przechodzą przez proces oceny Shopify, niektóre mogą mieć nieoczekiwane dodatki w zapleczu, które mogą wydłużyć czas ładowania.

Pamiętaj: uruchomienie sklepu Shopify nie jest procesem jednorazowym. Po uruchomieniu witryny i rozpoczęciu sprzedaży, chcesz stale optymalizować każdą stronę, od ulepszania obrazów nagłówka, przepisywania tekstu SEO lub aktualizowania obrazów. Zaufaj nam: choć jest to żmudne, pomoże zwiększyć konwersje, przyciągnąć nowych kupujących i poprawić wrażenia klientów.

Wskazówka dla profesjonalistów: nie masz pewności, jak radzi sobie Twoja witryna pod względem szybkości witryny? Wypróbuj narzędzie Google PageSpeed ​​Insights — po prostu wpisz swój adres URL, a dostarczy Ci ono informacji i zaleceń dotyczących poprawy szybkości witryny.

2. Zadbaj o prostotę witryny

Pokazywanie wszystkich produktów, obrazów i kopii w swoim arsenale jest kuszące, ale w większości przypadków to po prostu zablokuje wrażenia klientów. Nie chcesz przeciążać swojej witryny zbyt dużą ilością informacji — nikt nie chce przeszukiwać produktów w cyfrowej wersji niechlujnego sklepu z używanymi rzeczami. Zamiast tego zachowaj prostotę, skup się na swoich bestsellerach i przycinaj tłuszcz tam, gdzie to możliwe (bez względu na to, czy są to obrazy, kopie, widżety, strony, a nawet same produkty).

3. Przetestuj wszystko

A jeśli powiemy Ci, że możesz zwiększyć konwersje, po prostu zmieniając kolor tego jednego przycisku z niebieskiego na czerwony? Chociaż Twoja witryna została uruchomiona z określonymi kolorami, obrazami i grafiką, nie ma możliwości sprawdzenia, czy działają dobrze. (Chcielibyśmy dać Ci zwycięską formułę, ale prawda jest taka: najlepsze praktyki zależą od unikalnych klientów, produktów i niszy marki).

W tym miejscu wkraczają testy A/B — proces, który ma kluczowe znaczenie dla określenia tego, co działa najlepiej. (Dla nowych marketerów, oto przewodnik po wszystkich rzeczach związanych z testowaniem A/B). Zamiast działać wyłącznie instynktownie, warto przetestować A/B następujące elementy projektu sklepu:

• Kolory różnych przycisków
• Lokalizacje CTA, widżetów i obrazów
• Paski nawigacyjne
• Projektowanie ikon mediów społecznościowych
• Styl obrazu — np. obraz produktu a styl życia
• Obrazy lub tekstury tła

Potrzebuję pomocy?

Chociaż interfejs Shopify ułatwia marketerom i przedsiębiorcom samodzielne tworzenie projektów sklepów, może to stać się procesem czasochłonnym, jeśli jesteś perfekcjonistą z krystalicznie czystym pomysłem na to, jak chcesz, aby wyglądał Twój sklep.

Dobrze, że możesz poprosić o pomoc! Shopify oferuje bogactwo zasobów i setki ekspertów, którym możesz zaufać, że zajmą się Twoim sklepem. Czasami lepiej jest skorzystać z wiedzy profesjonalnego projektanta, niż samemu przedzierać się przez chwasty.

Jeśli chodzi o nas, AdRoll wspiera Cię w zapewnianiu marketingu na najwyższym poziomie dla Twojego sklepu Shopify. Jeśli chcesz zwiększyć sprzedaż, sprawdź integrację AdRoll dla Shopify.