Istotnym elementem strony internetowej jest, jak w przypadku każdej formy publikacji, jej projekt układu graficznego (ang. layout). W odniesieniu zaś do publikacji www ― jej graficzny interfejs użytkownika jako wszystko to, co odwiedzający widzi przed oczami. Warto od razu przy jej tworzeniu skupić się na odczuciach użytkowników serwisu i pracować nad użytecznością internetową.

Dla wielu właścicieli firm jest to najważniejsza część budowy serwisu. Pewnie i ty chcesz, żeby twoja strona była znakiem marki w sieci, z odpowiednim logo, grafiką, zdjęciami, może filmem. Chcesz, żeby twoi klienci docierając w Internecie do strony www nabierali zaufania do oferty, aby ich uwaga była odpowiednio zaangażowana i aby chcieli kupić produkty, skontaktować się z tobą. W przeciwnym razie opuszczą stronę bez zamiaru powrotu, a telefony pozostaną milczące.

Zasady tworzenia widoków stron www

Layout strony, czyli jej grafika, musi być spójna wobec wszystkich podstron. Na tę spójność składają się:

  • jednolita kolorystyka strony;
  • użyta czcionka, jej rozmiar;
  • formatowanie treści: relacja tytułów do śródtytułów, związane z nią pogrubienia;
  • wyróżnienia (np. linków) na stronie;
  • czytelność, prostota i realizacja najważniejszych funkcji (rejestracja, zakupy, obsługa);
  • ujednolicona forma nazewnictwa;
  • logo w odpowiednich miejscach;
  • unikalna cecha oferty (Unique Sell Proposition) ukazana w odpowiednich miejscach;
  • wyświetlana ścieżka konsumenta w sklepie, czyli tzw. okruszki chleba lub tzw. ślad z okruszków (ang. breadcrumbs).

Okruszki pomagają w zachowaniu orientacji w obszarze strony internetowej. Dzięki nim użytkownik lub robot internetowy sprawniej identyfikują kategorie, menu i podstrony. Łatwiej zdefiniować połączenia pomiędzy stronami i określić strukturę wewnętrzną.

Okruszki można podzielić wg sposobu, w jaki powstały:

  • wg atrybutów stron ― ponieważ powstają w przypadku użycia filtrów podczas wyszukiwania produktów na sklepie i tworzona jest wówczas dynamicznie ich ścieżka wg wyszukiwanych parametrów;
  • wg miejsca w serwisie ― ponieważ popularna i obecna w większości serwisów nawigacja w górnym pasku wyświetla ścieżkę odwiedzanych stron i pozwala na przejście do poprzednich podstron po kliknięciu;
  • wg aktywności użytkownika ― ponieważ nawigacja okruszkowa dynamicznie tworzy ścieżkę, którą przebywa użytkownik i wyświetla ją najczęściej w górnej części strony pod menu, a to pozwala nie tylko prześledzić drogę przebytą w obszarze serwisu, ale również łatwo wrócić w dowolne odwiedzane miejsce.

Nawigacja okruszkowa jest ważnym czynnikiem SEO. Google wyświetla ślady z okruszków w wynikach wyszukiwania, więc dobrze wdrożone generowanie okruszków poprawia linkowania wewnętrzne i strukturę strony.

Responsive Web Design i aplikacje mobilne.

Czy wiesz, że projektowanie każdej strony sklepu powinno się zacząć od szablonu na urządzenia mobilne?

Nawet Google wyróżnia dwa osobne indeksy dla wersji mobilnej (mobile), a preferuje strony użyteczne i sprawnie działające w tej wersji. Jak istotne są strony responsywne (możliwe do wyświetlenia na różnych urządzeniach), niech mówi fakt, że są kraje i branże, w których ilość transakcji na urządzeniach mobilnych przerasta te stacjonarne.

Strona mobilna nie może zawierać tylu informacji, co strona przeznaczona na urządzenia stacjonarne. Możesz spróbować takiego eksperymentu, ale wzbudzisz tylko irytację nadmiarem wyświetlanych informacji. Pamiętaj też, że w przypadku np. telefonów komórkowych częste przewijanie treści kciukiem i szybkie przeglądanie przekreśla  wartość  wszystkich technik marketingowych i USP, które działają na pulpicie.

RWD (Responsive Web Design) to taka forma projektowania strony mobilnej, żeby automatycznie dopasowywała się ona do urządzenia użytkownika, który ją przegląda. W efekcie twojego dostosowania się do wymogów RWD twój sklep musi mieć kilka swych wersji graficznych. Zazwyczaj to wersja na komputery stacjonarne, telefony komórkowe oraz laptopy. Każde z tych urządzeń ma inną powierzchnię widoku i rozdzielczość, i w inny sposób jest obsługiwane przez użytkownika. Na przykład laptop to zazwyczaj myszka lub touchpad, tablet obsługujemy rękoma, a telefon kciukiem lub palcem wskazującym. Idealnym rozwiązaniem jest wynajęcie doświadczonego eksperta UX/ UI, który zaprojektuje osobno każdą ze stron dla konkretnych urządzeń. Podobnie strony produktów, kategorii i podstrony statyczne. A jeśli korzystasz z gotowych szablonów graficznych, to zazwyczaj rozwiązania RWD mają one już wdrożone, więc musisz jedynie skupić się na udoskonaleniu i optymalizacji tych szablonów z punktu widzenia swoich potrzeb.

Jak każde rozwiązanie, tak i RWD posiada zarówno wady, jak i zalety.

Zalety RWD:

  • Oszczędność czasu,
  • Większa wydajność,
  • Komunikacja w obrębie jednej domeny,
  • Niższe koszty utrzymania jednej wersji witryny,
  • Lepsza indeksacja witryny,
  • Kompleksowe śledzenie ruchu na witrynie,
  • Analogiczna nawigacja i architektura informacji na każdym urządzeniu.

Wady RWD:

  • Dodatkowe koszty na początku projektu (dostosowanie jednego projektu do różnych wersji),
  • Zbędny transfer po stronie użytkownika,

Aplikacje mobilne.

Aplikacja mobilna to program, który instaluje się na urządzeniu mobilnym (np. telefon komórkowy czy też tablet) i który realizuje określone funkcje. Przykładem mogą być gry, czy też banki, które tworzą dedykowane aplikacje instalowane bezpośrednio na naszych telefonach. Domyślnie na każdym telefonie zainstalowanych jest kilka aplikacji mobilnych. Np. przeglądarka czy też poczta.

W zasadzie większość funkcji realizowanych przez aplikacje mobilne możemy wykonać za pośrednictwem przeglądarki, ale dzięki dopasowaniu aplikacji do konkretnych wymagań (np. banku, portalu aukcyjnego, mediów społecznościowych).

Aplikacje tego typu dzielą się na:

  • Działające bez dostępu do Internetu
  • Internetowe, czyli wymagające dostęp do sieci online
  • Wykonane na potrzeby klienta, np. portali aukcyjnych, banków
  • Gry internetowe – działające zarówno online jak i bez dostępu do sieci,

Aplikacja mobilna powinna być użyteczna, łatwa w obsłudze i angażować użytkownika. Aplikacja powinna być dostępna na najbardziej popularne systemy operacyjne – iOS dla Apple oraz Android dla Samsunga i innych marek.

Rodzaje aplikacji mobilnych:

  • Związane z obsługą klienta np. banki
  • Do komunikacji np. WhatsApp, Messenger.
  • Serwisy społecznościowe – Facebook, Instagram, Twitter.
  • Nawigacja np. Google Maps.
  • Mobilne narzędzia zakupowe np. Allegro, Zalando.
  • Aplikacje pogodowe np. Accuweather.
  • Wyszukiwarki produktów np. Rossmann.
  • Aplikacje sportowe np. Endomondo.
  • Aplikacje muzyczne np. Spotify.
  • Skanery kodów np. SeeMore.
  • Aplikacje lojalnościowe np. Rossmann, Starbucks.
  • Aplikacje do robienia i obróbki zdjęć np. Retrica.
  • Gry np. Bubble Shooter.

Co lepsze? Serwis mobilny czy aplikacja?

Nie ma jednoznacznej odpowiedzi na to pytanie. To zależy. Aby dokonać stosownego wyboru (albo zdecydować się na dwa rozwiązania), należy dokładnie przeanalizować podobieństwa i różnice, oraz wady i zalety każdego z rozwiązań.

Serwis mobilny zawsze wymaga przeglądarki i połączenia z internetem. Jeśli łącze jest zbyt wolne, strona może się długo ładować, co z kolei może zniechęcić użytkowników i porzucą daną stronę. Z drugiej strony, serwis mobilny ma ograniczoną funkcjonalność i nie ma znaczenia, z jakiej przeglądarki, czy z jakiego smartfonu użytkownik korzysta. Ponadto koszty zaprojektowania wersji mobilnej serwisu są stosunkowo niskie.

Aplikację mobilną użytkownik musi najpierw zainstalować na swoim urządzeniu, aby mieć do niej dostęp. Korzystanie z niej nie wymaga stałego dostępu do internetu, aczkolwiek wiele funkcji i dostęp do bieżących informacji wymaga połączenia z siecią. Koszty stworzenia aplikacji są znacznie większe, niż mobilnej wersji witryny.

Na koniec podsumujmy najważniejsze informacje na temat serwisów oraz aplikacji mobilnych pod kątem różnic między nimi:

Serwisy mobilne:

  • Niższe wymagania sprzętowe,
  • Niższy koszt projektu,
  • Większe bezpieczeństwo danych,
  • Brak dodatkowych opłat i prowizji od operatorów i platform,
  • Możliwość stworzenia jednego projektu dla wszystkich urządzeń mobilnych i przeglądarek,
  • Łatwość aktualizacji,
  • Pozycjonowanie – łatwość odnalezienia przez wyszukiwarki mobilne.

Aplikacje mobilne:

  • Szybki dostęp,
  • Powiadomienia aplikacji o nowościach,
  • Trzeba stworzyć oddzielne projekty dla poszczególnych systemów,
  • Możliwość zarabiania na aplikacjach,
  • Łatwość instalacji i późniejszego dostępu.
  • Reklama w urządzeniach mobilnych
Do you like Westom's articles? Follow on social!
Comments to: Widok i UX sklepu internetowego

    Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *

    KURS SEO od PODSTAW z RABATEM

    kurs seo

    E-commerce

    Zarządzanie projektami (z języka angielskiego project management) to inaczej wszystkie czynności, które prowadzą do osiągniecia wyznaczonych celów w określonych ramach czasowych. W przypadku projektów SEO będzie to np. poprawienie widoczności w Google, osiągnięcie wysokich pozycji na najważniejsze frazy (np. top 1-3, czy tez 1-10), poprawa współczynnika konwersji, wdrożenie optymalizacji na sklep internetowy, skuteczne linkowanie do […]
    Prędzej czy później każdy z nas staje przed dylematem wyboru firmy, oprogramowania czy też narzędzi  w działaniach e-commerce. Poniżej przedstawiam subiektywny ranking, w którym oprócz jakości usług brałem pod uwagę cenę oraz pomoc. W zestawieniu znajdą Państwo: Lista firm, gdzie można zarejestrować domenę (krajowi i globalni) w rozsądnej cenie i bez dodatkowych kosztów przy przedłużeniu […]

    Worlwide

    KSIĄŻKA E-COMMERCE W PIGUŁCE 2021 ebook o ecommerce Wyselekcjonowanie I Najważniejsze | Praktyczne | Skuteczne | Ciekawie napisane WSZYSTKO CO ISTOTNE W JEDNEJ KSIĄŻCE O E-COMMERCE Hosting – Domena – Strona internetowa – CMS – WordPress – Joomla – Drupal – SSL – Let`s Encrypt – Platformy sklepowe – PrestaShop – Oscommerce – Shopware – […]
    Potrzebujesz pomocy przy kampaniach Google Ads? Poproś o bezpłatną wycenę – biuro@westom.pl lub zadzwoń 530825825 Czym jest Google Ads? Google Ads (poprzednio Google Adwords) to system reklamowy, dzięki każdy posiadający wystarczające fundusze może  błyskawicznie wyświetlić swoją reklamę tekstową, graficzną lub wideo w wyszukiwarce Google, w poczcie Gmail, YouTube oraz u partnerów firmy Google. Zasada działania […]
    Potrzebujesz profesjonalnego pozycjonowania stron www? Poproś o bezpłatną wycenę – biuro@westom.pl lub zadzwoń 530825825 Co to jest pozycjonowanie stron internetowych? Praktyczny poradnik jak wypozycjonować i zoptymalizować stronę www i osiągnąć wysokie pozycje w wynikach wyszukiwania. Pozycjonowanie stron to inaczej wpływanie na wyszukiwarki internetowe np. Google, Bing, Yandex tak, żeby wyświetlić daną stronę w organicznych (bezpłatnych) […]
    Potrzebujesz profesjonalnego wsparcia sprzedaży online? Google Ads, Facebook, YouTube, SEO? Poproś o bezpłatną wycenę – biuro@westom.pl lub zadzwoń 530825825 Co to jest reklama internetowa i jakie są formy? Z artykułu dowiesz się co to jest reklama internetowa, jakie są najważniejsze formy reklamy online oraz przedstawię skuteczność różnych form reklam w podziale na: reklamę płatną reklamę […]
    Zarządzanie projektami (z języka angielskiego project management) to inaczej wszystkie czynności, które prowadzą do osiągniecia wyznaczonych celów w określonych ramach czasowych. W przypadku projektów SEO będzie to np. poprawienie widoczności w Google, osiągnięcie wysokich pozycji na najważniejsze frazy (np. top 1-3, czy tez 1-10), poprawa współczynnika konwersji, wdrożenie optymalizacji na sklep internetowy, skuteczne linkowanie do […]
    Prędzej czy później każdy z nas staje przed dylematem wyboru firmy, oprogramowania czy też narzędzi  w działaniach e-commerce. Poniżej przedstawiam subiektywny ranking, w którym oprócz jakości usług brałem pod uwagę cenę oraz pomoc. W zestawieniu znajdą Państwo: Lista firm, gdzie można zarejestrować domenę (krajowi i globalni) w rozsądnej cenie i bez dodatkowych kosztów przy przedłużeniu […]
    Internet jest niestety miejscem, w którym jesteś narażony na oszustwo lub nieuczciwą konkurencję. Niestety, ale powszechny i prawie niczym nieograniczony dostęp do sieci gromadzi ludzi o różnych intencjach. Oprócz tego, niektóre niedobre i groźne praktyki mogą być wynikiem braku znajomości prawa. W Polsce normy związane z marketingiem internetowym reguluje ustawa o zwalczaniu nieuczciwej konkurencji z […]

    Ostatnio chętnie czytane

    Czym jest dobry audyt sklepów internetowych? Potrzebujesz profesjonalnego audytu swojego sklepu? Poproś o bezpłatną wycenę – biuro@westom.pl lub zadzwoń 530825825 Audyt sklepów internetowych to sprawdzenie wszystkich wewnętrznych i zewnętrznych czynników mających realny wpływ na Twój biznes w Internecie. W trakcie audytu weryfikuje się  wszystkie elementy mające powiązanie z e-commerce, w tym SEO, SEA, UX, UI, […]
    Czy warto odbyć szkolenie z SEO (search engine optimization)?  Nauka  pozycjonowania i optymalizacji stron internetowych to zajęcie dla osób o szerokiej wiedzy, potrafiącej łączyć wiele dziedzin (np. IT, content marketing, UX), cierpliwej i potrafiącej współpracować z klientami. Po kursie z zakresu SEO każdy powinien znać techniki zdobywania widoczności w Internecie, po przez działania optymalizacyjne na […]
    Potrzebujesz profesjonalnego pozycjonowania stron www? Poproś o bezpłatną wycenę – biuro@westom.pl lub zadzwoń 530825825 Co to jest pozycjonowanie stron internetowych? Praktyczny poradnik jak wypozycjonować i zoptymalizować stronę www i osiągnąć wysokie pozycje w wynikach wyszukiwania. Pozycjonowanie stron to inaczej wpływanie na wyszukiwarki internetowe np. Google, Bing, Yandex tak, żeby wyświetlić daną stronę w organicznych (bezpłatnych) […]
    Potrzebujesz profesjonalnego wsparcia sprzedaży online? Google Ads, Facebook, YouTube, SEO? Poproś o bezpłatną wycenę – biuro@westom.pl lub zadzwoń 530825825 Co to jest reklama internetowa i jakie są formy? Z artykułu dowiesz się co to jest reklama internetowa, jakie są najważniejsze formy reklamy online oraz przedstawię skuteczność różnych form reklam w podziale na: reklamę płatną reklamę […]

    Kategorie

    Login

    marketing treści
    Welcome to Typer

    Brief and amiable onboarding is the first thing a new user sees in the theme.
    Join Typer
    Registration is closed.