Bezpłatna konsultacja
Najpopularniejsze trendy, nowoczesne, funkcjonalne i dopasowane do potrzeb. Ranking sklepów ecommerce. Inspiracje ecoomerce w najlepszym wydaniu.
W tym wpisie chcemy pokazać najlepsze sklepy internetowe (nasz ranking na 2022) na które natknęliśmy się przeglądając różnego typu branżowe portale i strony internetowe, galerie prac agencji interaktywnych z całego świata. Istnieje cała gama sklepów internetowych oderwanych od rzeczywistości, starających się podążać za trendami, przeładowanych animacjami i grafiką. W niektórych przypadkach jest to uzasadnione podejście, czasem można odnieść wrażenie przerostu formy nad treścią.
Poniżej prezentujemy kryteria jakie przyjęliśmy dla wyłonionych inspiracji sklepów internetowych. Czyli naszym zdaniem co powinien zawierać dobry sklep by sprzedawał :
Zobacz jak wygląda proces tworzenia sklepu i jak poprawić współczynnik odrzuceń sklepu internetowego
Sklep internetowy https://bouguessa.com cechuje płynność animacji elementów podczas przewijania, co czyni przebywanie na sklepie przyjemnym.
Dodatkowo sam layout jest czysty i przejrzysty, mimo długiej drugiej sekcji w której mamy tylko dwa zdjęcia, następnie kolejną wysoką sekcję z wideo w tle i dopiero kolejno produkty sklep budzi bardzo pozytywne wrażenia. W tej części warto również dać wyrazy uznania za użycie wideo – jest to bardzo dobra forma zachęcenia i prezentacji produktu, a tak rzadko spotykana.
Podstrona : lista produktów gdzie w oryginalny sposób zaprezentowana została opcja filtrowania produktów w formie zdania z opcją wyboru dwóch pól / pola rozwijalnej listy select /
Podstrona : kolekcja – ciekawe rozwiązanie przewijania produktu / umieszczenie nawigacji na środku, które wbrew pozorom nie przeszkadza w odbiorze zdjęć /
Zróbmy razem skuteczny sklep internetowy, który sprzedaje. Zbudujemy widoczność i dopasujemy rozwiązania do Twojej grupy docelowej. Utworzymy listy remarketingowe i wdrożymy rozwiązania wspomagające sprzedaż.
Zobacz ofertę i jak projektujemy i tworzymy sklepy internetowe Kraków
Kolejnym przykładem sklepu internetowego który zajął drugie miejsce na naszej liście to Porst1961 – https://ports1961.com. Sklep bardzo czytelny z układem dwukolumnowym – w którym interesujące jest zestawienie sekcji strony głównej. Zamiast klasycznej listy produktów i baneru sklep Porst1961 prezentuje nam na start wideo (dostępne po kliknięciu w sekcję), następnie jedynie 4-cztery kafelki z kategoriami produktów i sekcje kolekcji zachęcające do poznania produktów.
Podstrona kolekcji wyposażona została w typowe slidery przewijane lewo-prawo, które do ogólnej koncepcji pasują. Choć brak wg. nas możliwości powiększenia oraz przewijania poprzez przeciągnięcie stanowi minus tej podstrony.
Karta produktu – tutaj ciekawym i bardzo użytecznym rozwiązaniem jest zatrzymanie kolumny tekstowej przy przewijaniu strony, czyli tak naprawdę scrollując kartę produktu przewijamy sekcję ze zdjęciami. Dodatkowo po najechaniu na miniaturę otrzymujemy zoom zdjęcia bez dodatkowego okna typu lightbox, brawo! – użytkownik zostaje na tym samym poziomie sklepu internetowego.
Stan po najechaniu na miniaturę – lekki zoom.
Bardzo dobrym pomysłem jest również zastosowany wysuwany panel po dodaniu produktu do koszyka z informacjami o jego statusie, szkoda jednak że zabrakło takiego rozwiązania po kliknięciu w guzik koszyku znajdujący się na górze strony.
Przygotowana przez agencję Sorthvid strona Pandora Garden https://us.pandora.net/en/campaigns/pandora-garden (prezentująca produkty Pandora) będąca jednocześnie stroną wizerunkową jest ciekawym pomysłem na pokazanie kolekcji i produktów w formie animowanej strony z opcją wejścia do sklepu z odpowiednio przygotowanych sekcji – slajdów strony. To forma opowieści podczas której poznajemy produkty i kolekcje firmy (przewijając stronę ukazują nam się kolejne zdjęcia przesuwające się w różnym tempie, sekcje graficzne i sprytnie wplecione w nie produkty budujące klimat kolekcji Pandora Garden).
Po kliknięciu na produkt otrzymujemy w oknie lightbox jego prezentację / odzwierciedlenie karty produktu / ze zdjęciem na modelce, ceną i guzikiem ‘kup ‘kierującym do sklepu.
Dobrym pomysłem jest umieszczenie guzika ‘shop the collection’ na samej górze strony na ramce, który po kliknięciu skraca drogę poznania produktów do jednej sekcji prezentującej wszystkie produkty w jednym miejscu.
Kolejna sekcja prezentacji produktów podczas przewijania strony kolekcji Pandora Garden.
Zobacz również dedykowane rozwiązania ecommerce dla biznesu
ETQ – https://www.etq-amsterdam.com to sklep typu budjący klimat prezentowaniem kolekcji już od strony głównej. ETQ posiada bardzo dobrą funkcjonalność oraz łatwą możliwość dotarcia do produktu. Pomimo że na stronie głównej nie posiadamy typowej listy kategorii produktów zaraz pod banerem gdzie zwykle ma to miejsce sklep broni się i nadaje nowego ciekawego spojrzenia – zainteresowanie produktem poprzez prezentację kolekcji już od pierwszych sekcji strony głównej.
Podstrona kolekcja.
Po wejściu w wybraną kolekcję otrzymujemy konkretne produkty poprzedzone wysoką sekcją baneru ze zdjęciem z danej kolekcji by pokazać jak prezentuje się produkt. Choć i tutaj jest równie ciekawie gdyż zdjęcia produktów przeplatane są ze zdjęciami ‘live’ produktu. Jak nie trudno zauważyć produkty nie posiadają ani podpisów, ani cen w stanie przed najechaniem / stan jak prezentujemy poniżej /. Cały panel informacyjny dotyczący produktu jak cena, rozmiar, guzik kup schowany na pierwszym widoku – przy przewijaniu podstrony, pokazuje się on dopiero po najechaniu na konkretnych produkt.
ETQ wykonał również bardzo funkcjonalną opcję jaką jest możliwość przeglądania zdjęć produktu z tego właśnie poziomu listy produktów. Całość pokazywania informacji, przewijania jest bardzo płynna i miękka co czyni sklep atrakcyjnym również pod względem użytkowania.
Karta produktu.
Elegancka, prosta i przystępna jeżeli chodzi o czytelne rozłożenie i podział informacji. Po lewej duże zdjęcie produktu, po prawej dane techniczne, cena, guzik kup. Po przewinięciu prosto ale ciekawie rozwiązane przedstawienie produktów – kolejnych zdjęć. Cała podstrona zakończona informacjami których klient może potrzebować będąc w tym miejscu / na karcie produktu / oraz powiązanie produktu z produktami podobnymi.
Powiększenie produktu również pracuje dobrze na sklepie internetowym. Po kliknięciu z karty produktu na zdjęcie otrzymujemy dokładnie to po co kliknęliśmy – duże zdjęcie niczym nie przysłonięte, nie w formie lightboxa, nie na małym ekranie na środku, tylko tak jak potrzeba – duże zdjęcie które dodatkowo możemy za pomocą touchbara suwając góra dół po zdjęciu przybliżać i oddalać. W ‘tle’ po lewej stronie dostajemy opcje zmiany widoku zdjęcia.
Technicznie sklep stoi na bardzo wysokim poziomie wykonania począwszy od czytelności po animacje (zwiń-rozwiń, przesuwanie, przewijanie), które aż chce się oglądać. Układ niby prosty ale w konstrukcji i wykonaniu nie sztampowy, wręcz budący chęc poznania / wspomniane zdjęcia na karcie produktu, czy pomysł na zdjęcia produktu przeplatane zdjęciami ‘live’.
Sklep internetowy Olivia Des Cressonnieres w podobny sposób jak wykonał to na co postawiła Pandora, prezentację kolekcji. W odniesieniu do Pandory jest zdecydowanie mniej efektów, mniej wodotrysków, za to jest prościej i czytelniej głównie dlatego że http://olivia-des-cressonnieres.com/ jest sklepem internetowym samym w sobie, a nie produktem / stroną wspomagającą sprzedaż / na potrzeby kolekcji co nie zmienia faktu odważnego postawienia w sklepie na budowanie już na start pozytywnych doświadczeń użytkownika.
Samo rozwiązanie zastosowane na stronie głównej wymaga jeszcze dodatkowego komentarza. Rozwiązanie menu to podróż po sklepie wg. klucza kolekcji nie kategorii produktu. Wchodząc do kolekcji w dalszym ciągu jesteśmy w strefie budowania wrażenia zdjęciami, grafikami, animacjami by dopiero z tego miejsca dostać się do docelowego miejsca – produktu. Całość elementów jest dobrze podana, nic nie zaburza odbioru przekazu, wiemy gdzie jesteśmy, wiemy jak zmienić kolekcję. Jedyny minus to zbyt mało widoczne i przystępne guziki wejścia do produktu – sam napis shop the collection to za mało, idealnie gdyby sklep postawił również na aktywne kafle kierujące do tego samego miejsca. Na urządzeniach mobilnych guzik jest niestety słabo widoczny.
Po wejściu w konkretną kolekcję ( listę produktów ) otrzymujemy zbyt inwazyjne aczkolwiek na pierwszy raz przyjemnie budujące podstronę animacje oraz dobrze widoczne filtrowanie produktów po tagach : kolczyki, branselotki, nowości etc.. Samą listę produktu dobrze się przegląda, produkty są w formie kafelków na jednolitym tle z efektem po najechaniu – pokazaniem nazwy i ceny produktu. Co ważne całe kafelki są aktywne dla użytkownika, a to jeszcze niestety żadkość, często to nagłówek lub guzik ‘dodaj’ stanowią jedyne przejście do produktu co jest dużym minusem głównie w przypadku użytkownika mobilnego.
Karta produktu sklepu internetowego wymagać mogła by lekkiej poprawy o prezentację większego zdjęcia, brak również jak w przypadku wcześniejszych sklepów postawienia i w tym miejscu na dobre pokazanie produktu – animacje, powiększenia, miniatury kolejnych odsłon produktu.
Zobacz
Istnieje wiele platform i rozwiązań pozwalających na stworzenie sklepu internetowego dopasowanego do naszych potrzeb. Kwestie wyboru platformy budowy sklepu w rozwiązaniach: dedykowanych, w chmurze, OpenSource, czy gotowych sklepach zostawimy na kolejny wpis.
Projektując sklep internetowy który miałby spełniać wszystkie wymagania jakościowe, techniczne i te od strony administracyjnej z pewnością musielibyśmy zamówić dedykowany sklep pisany od podstaw pod nasze oczekiwania, a to z kolei wiąże się z wysokimi kosztami oraz autorskim kodem, który wiąże nas z firmą developerską na lata.
Zobacz również jaką platformę sklepu internetowego wybrać ?
Responsywność sklepu internetowego
Jeżeli jednak jak w tym rankingu sklepów internetowych stawiamy na design, nowoczesność, wysokiej jakości dopracowanie detali ze szczególnym zwróceniem uwagi na wersję responsywną sklepu (dla mniejszych ekranów urządzeń mobilnych) to zdecydowanie powinniśmy zainteresować się wdrożeniem sklepu na systemie cms wordpress z modułem sklepowym woocommerce, który posiada nieograniczone możliwości projektowe – grafika nie jest ograniczona z góry narzuconym układem autora czy silniku sklepu – posiadamy pełną dowolność wdrożenia, rozbudowy o dodatkowe modułów wspierające sprzedaż on-line (np. newsletter, faktura online, płatności online, ustalenie kosztów przesyłki w przedziałach wagowych, obliczanie kosztów transportu względem odległości od magazynu, implementacja z programiami księgowymi np. Optima ). Dodatkowo jeżeli już znajdziemy płatne moduły Woocommerce są one w relatywnie niskich kosztach w stosunku do autorskich rozwiązań.
Techniczne zaniedbania SEO: Niestety sklepy z naszego rankingu wypadają bardzo słabo pod względem optymalizacji SEO. Głównie nie posiadają one zoptymalizowanych meta tytułów, opisów, zdjęcia nie posiadają znaczników alt nie wspominając o nagłówkach H1-H3. Na pewno nie jest to wina samego sklepu, jego silniku, bardziej prawdopodobne jest to że autorzy nie postawili na SEO w tym przypadku.
Treść i widoczność sklepu : Drugi ważnym aspektem wpływającym na gorsze SEO w przypadku podanych sklepów jest bardzo mała ilość treści ze względu na podejście graficzne i minimalistyczne. Tego typu sklepy (minimalistyczne) trudniej zdobywają wysokie pozycje gdyż to merytoryczna treść i frazy kluczowe w niej zawarte (w sposób naturalny) budują zasięg i widoczność w wyszukiwarce, której w podanych przykładach nie ma.
Istnieją sposoby na obejście i połączenie procesu tworzenia sklepu w stylistyce minimal wraz z bardzo dobrą widocznością ale jest to dłuższy i bardziej czasochłonny proces włączający działania pozycjonerskie na stałe do naszego miesięcznego budżetu. Dochodzi do tego obowiązkowa budowa podstron typu ‘Landing page’ oraz bloga zorientowanego na zdobywanie ruchu z wyszukiwarki. Ruch pozyskiwany jest z wpisów na frazy złożone ( kilku wrazowe tzw. longtailowe ).
Agencja digital Hauerpower sp z o.o.
31-408 Kraków, Al. 29 Listopada 85
NIP 945-225-31-35
Copyrights 2010-2024
