
Liczba użytkowników mobilnych stale rośnie i Google nie pozwala ich lekceważyć.
Kiedy w Google Search Console pojawiły się funkcje umożliwiające sprawdzenie, czy i kiedy Google przełączyło witrynę na mobile-first index, temat dostosowania stron do smartfonów i tabletów powrócił. Specjaliści, których pytaliśmy wtedy o znaczenie wprowadzonej zmiany, wskazywali, że - choć nie jest ona nowa - dopiero teraz możemy być świadkami jej wpływu na popularność technologii PWA i AMP. Czym różnią się od znanego i lubianego standardu RWD?
Po wprowadzeniu mobile-first index Google będzie wykorzystywało mobilną wersję treści do indeksowania i rankingu. Dotychczas w indeksie podczas oceniania trafności strony pod względem danego zapytania, pod uwagę brana była wersja desktopowa.
Google zaleca więc projektowanie responsywnych stron internetowych dostępnych pod jednym URL-em. - Ze względu na problemy i nieporozumienia, które widzimy z różnych adresów URL telefonów komórkowych na przestrzeni lat, zarówno z wyszukiwarek, jak i użytkowników, zalecamy używanie pojedynczego adresu URL zarówno w przypadku witryn stacjonarnych, jak i mobilnych.
I z tego też względu coraz większą uwagę web developerów i UX designerów przyciągają technologie PWA i AMP (obie zapoczątkowane przez Google), których główną przewagą jest właśnie znaczące przyspieszenie czasu ładowania stron. Czym różnią się od znanego i lubianego standardu RWD i jakie biznesy powinny się nimi zainteresować? O to zapytaliśmy specjalistów.
Agnieszka Sosnowska
CEO
Biuro Podróży Reklamy
Na świecie ruch z telefonów to już 50,7% internetu. Tablety to kolejne 3,7% (dane z czerwca 2019). W Polsce ta tendencja jest jeszcze bardziej oczywista. Ruch ze smartfonów to już 62,9%. Co ciekawe ruch z tabletów w naszym kraju to obecnie tylko 0,7%. Daje nam to wynik 36,4% dla desktopowych wizyt w polskim internecie (dane z czerwca 2019). To warunki do rozwoju rozwiązań typu PWA, AMP czy RWD, zwłaszcza wobec wprowadzenia i wzrostu znaczenia Mobile-First Index w Google.
PWA: Progressive Web App
To połączenie aplikacji i strony web. To strona mobilna, która wygląda podobnie jak aplikacja. Jest szybka, użytkownik może dodać skrót na ekranie urządzenia mobilnego i korzystać z niej offline. Po wejściu na PWA jej zawartość zapisywana jest w pamięci urządzenia, co poprawia szybkość działania. User nie pobiera aplikacji ze sklepu, ani jej nie instaluje. PWA nie różni się zbytnio od strony internetowej. Najbardziej istotną zmianą jest brak paska przeglądarki. PWA to połączenie strony web i niektórych cech aplikacji mobilnych. Z racji tego, że PWA oparte są o JavaScript, trudniej je zoptymalizować pod kątem SEO. To rozwiązanie dobre dla większych marek, które mają lojalnych konsumentów - najdroższe spośród wymienionych.
AMP: Accelerated Mobile Pages
AMP to przyspieszona strona mobilna, jej celem jest umożliwienie szybkiego ładowania witryn na smartfonach i tabletach. To technologia rozwijana w środowisku open source, wspierana przez Google. W AMP ograniczone jest użycie kodu JavaScript, w celu uproszczenia i przyspieszenia procesu ładowania strony. Technologia AMP pierwotnie skierowana na strony mobilne, obecnie może być używana również do wersji desktopowych.
Zaangażowanie użytkowników na stronach AMP jest w wielu wypadkach wyższe niż na klasycznych witrynach, dlatego że użytkownicy są niecierpliwi, cenią sobie czas podczas przeglądania zasobów sieci. Istnieje przeglądarka Google AMP, która umożliwia szybsze przeglądanie wyników wyszukiwania. Ogólnie jest to rozwiązanie promowane przez Google. Co ciekawe na WordPress jest plugin, który umożliwia dostosowanie witryny do standardu AMP. Wadą AMP jest ograniczona funkcjonalność i to rozwiązanie sprawdzi się na prostych stronach z dużą ilością kontentu tekstowego - na przykład na blogach.
RWD: Responsive Web Design
W wolnym tłumaczeniu oznacza „design responsywny”, a więc taki sposób projektowania stron internetowych, by doświadczenie użytkownika pozostawało na najwyższym poziomie bez względu na to, z jakiego urządzenia korzysta. RWD poprawia użyteczność strony. Elastyczna strona ułatwia użytkownikom nawigację i poprawia czytelność. Responsywne strony są tak skonstruowane, aby miały jak najlepszy wpływ na SEO, ta technologia mocno sprzyja SEO.
Wadą RWD jest wolniejsze ładowanie obrazków ponieważ mają one wprawdzie dostosowany rozmiar ale nie rozdzielczość. Na świecie ruch z telefonów to już 50,7% internetu. Tablety to kolejne 3,7%. (Dane z czerwca 2019). W Polsce ta tendencja jest jeszcze bardziej oczywista. Ruch ze smartfonów to już 62,9%. Co ciekawe ruch z tabletów w naszym kraju to już tylko 0,7%. Daje nam to wynik 36,4% dla desktopowych wizyt w polskim internecie (dane z czerwca 2019). To warunki do rozwoju rozwiązań typu PWA, AMP czy RWD, zwłaszcza wobec wprowadzenia i wzrostu znaczenia Mobile-First Index w Google.
Maciej Palmowski
WordPress Developer
Osom Studio
RWD odpowiada za wygląd. Daje pewność, że strona wygląda poprawnie na każdej rozdzielczości - desktopie, tablecie i niewielkim smartfonie. RWD to również skrócenie procesu developmentu. Dla wszystkich urządzeń powstaje wspólny kod - jedna wersja strony. Oszczędność czasu to jednak wyrzeczenia. Ustępstwa względem innych rozdzielczości, w efekcie których strona może nie robić tak dobrego wrażenia na mobile, jak na desktopie. Co więcej, kod dla jednej rozdzielczości zawiera często nadmiarowy html/css/js dla pozostałych. Dla strony oznacza to wolniejsze ładowanie, dla właściciela - więcej odrzuconych sesji.
Kolejny krok to PWA. Implementujemy na stronie powiadomienia push, obsługę offline oraz możliwość instalacji na pulpicie telefonu. Strona działa jak prosta aplikacja natywna, ale nie posiada wszystkich jej możliwości. Warto wspomnieć też, że PWA na iOS nie posiada wszystkich funkcjonalności w porównaniu do Androida.
Mamy RWD, mamy PWA - czas na wprowadzenie wersji AMP dla stron, których celem jest konwertowanie. Czas to pieniądz, a strony pisane w tym frameworku ładują się po prostu szybko. Co więcej, wyszukiwarka Google często wczytuje je w tle - wrażenie szybkości jest więc naprawdę silne. Właściciel strony traci mniej sesji, a każda z nich to kolejna szansa na domknięcie sprzedaży. Jeśli chodzi o wady, to nie można zapomnieć o ograniczeniu w użyciu własnych JS i wielkości CSS. W praktyce może to oznaczać uboższe efekty wizualne, które to przecież pomagają w zwróceniu uwagi usera.
Biorąc to, co najlepsze z każdej technologii uzyskujemy błyskawicznie działającą stronę, która posiada wiele cech aplikacji mobilnej. A więc strony świetnie dopasowanej do każdego smartfona.
Łukasza Łubińskiego
performance marketing manager
Zjednoczenie.com
Użytkowników mobilnych w Polsce cały czas przybywa. Na niektórych witrynach to już ponad 70% wszystkich użytkowników. Nowe technologie urządzeń i szybki internet mobilny sprawiają, że chętniej korzystamy z przeglądania stron na smartphone’ach. Do tych realiów także musieli dostosować się webdeweloperzy.
Już w 2010 roku rozpoczęła się era RWD. Metoda tworzenia witryn jest stosunkowo szybka, relatywnie tania (jeden serwis, bez dodatkowych wdrożeń) i dobrze widziana przez Google w kontekście bezpłatnych wyników wyszukiwania.
AMP czyli Accelerated Mobile Pages to z kolei projekt opensource wspierany przez Google, stąd strony wykonane w tej metodzie mogą liczyć na lepsze pozycje w wynikach wyszukiwania. Jak sama nazwa wskazuje, dzięki AMP strony szybciej się ładują. Wadą tego rozwiązania mogę być koszty (zależnie od przyjętych rozwiązań technologicznych) oraz komplikacje przy implementacji funkcji dedykowanych typowo pod desktop - AMP nie wspiera niektórych rozwiązań, które nie mają racji bytu na urządzeniach mobilnych, a mogą być przydatne dla urządzeń desktopowych.
Technologie PWA (Progressive Web Apps) to połączenie strony www i aplikacji mobilnej. To rozwiązanie, które pozwala korzystać ze strony lub aplikacji WWW nawet bez dostępu do sieci. Spośród wymienionych rozwiązań to jest prawdopodobnie najbardziej kosztowne we wdrożeniu i raczej nie zalecane do "typowych" stron firmowych.
Oczywiście nie da się wskazać idealnego i uniwersalnego rozwiązania na dowolne potrzeby, ale podsumowując, RWD można by nazwać najbardziej uniwersalnym, "bezpiecznym" rozwiązaniem, AMP najlepiej dostosowanym do wyszukiwania w Google na mobile'u, a PWA raczej dla dużych np. katalogów produktowych niż "zwykłych" stron WWW.
Katarzyna Małecka
Head of Product & UX
iTaxi
W iTaxi stawiamy na PWA. Jest to dla nas najlepszy kierunek rozwoju, zwłaszcza w kontekście naszych klientów biznesowych. Obecnie oferujemy dostęp do usługi iTaxi trzema kanałami: w aplikacjach mobilnych (na iOS i Androida), przez aktualny panel biznesowy w formie standardowej strony www oraz przez infolinię. Już niebawem nasi klienci będą mogli wybierać pomiędzy natywną aplikacją do zamawiania taksówek, a nowoczesnym panelem biznesowym, przygotowanym właśnie w podejściu PWA. Dzięki temu zamówią przejazd taksówką na w pełni responsywnej stronie internetowej, a jeśli zechcą, będą mogli ją "przypiąć" do swojego ekranu w smartfonie - wszystko to bez pobierania dodatkowej apki.
Warto dodać, że podczas początkowych prac nad nowym panelem do zamawiania taksówek położyliśmy duży nacisk na fazę UX oraz rozpoznanie możliwości technologii PWA. Nowa strona została zaprojektowana tak, by spełnić wszystkie oczekiwania użytkowników przyzwyczajonych do możliwości, jakie daje aplikacja natywna. Dodaliśmy też sporo opcji, na które w apkach nie mieliśmy przestrzeni, chodzi głównie o rozbudowane raportowanie czy pogłębioną analizę kosztów przejazdów, nie tylko w ramach konta jednego pasażera, ale całej firmy. W kontekście biznesu, takie funkcjonalności - dostępne w prosty i czytelny sposób, z każdego urządzenia - są bardzo ważne. Wiemy o tym i działamy intensywnie! Prace nad nową wersją panelu biznesowego wrą, na jesień planujemy wielką premierę.
Pobierz ebook "Ecommerce w 2025 r. Ebook z poradami dla firm"
Zaloguj się, a jeśli nie masz jeszcze konta w Interaktywnie.com - możesz się zarejestrować albo zalogować przez Facebooka.
Pomagamy markom odnosić sukces w Internecie. Specjalizujemy się w pozycjonowaniu stron, performance marketingu, social …
Zobacz profil w katalogu firm
»
Projektujemy i wdrażamy strony internetowe - m.in. sklepy, landing page, firmowe. Świadczymy usługi związane …
Zobacz profil w katalogu firm
»
1stplace.pl to profesjonalna agencja SEO/SEM, specjalizująca się w szeroko pojętym marketingu internetowym. Firma oferuje …
Zobacz profil w katalogu firm
»
W 1999 roku stworzyliśmy jedną z pierwszych firm hostingowych w Polsce. Od tego czasu …
Zobacz profil w katalogu firm
»
Pozycjonujemy się jako alternatywa dla agencji sieciowych, oferując konkurencyjną jakość, niższe koszty i większą …
Zobacz profil w katalogu firm
»
Ja mam stronę-blog AMP html i i nie narzekam. Szybkość ładowania mojej strony <a href=\"http://dzialka.bazafirmy.pl/\" target=\"_blank\" rel=\"nofollow\"><a href=\"http://dzialka.bazafirmy.pl/\" target=\"_blank\" rel=\"nofollow\">http://dzialka.bazafirmy.pl/</a></a><br /> jest na pewno atutem i udało mi się osiągnąć 18 000 unikalnych użytkowników i 3 000 słów kluczowych w google. AMP html jest wrażliwa na błędy- jeżeli się pojawia niezgodność ze standardem google zaraz pisze, aby to poprawić. Dodając jakiś element do strony trzeba pamiętać, żeby dodać odpowiedni skrypt do części meta strony.
Tez o tym pisaliśmy. I to dużo:) <a href=\"http://https://www.ideoforce.pl/wiedza/pwa-amp-rwd-czy-mobile-co-wybrac,215.html\" target=\"_blank\" rel=\"nofollow\"><a href=\"http://https://www.ideoforce.pl/wiedza/pwa-amp-rwd-czy-mobile-co-wybrac,215.html\" target=\"_blank\" rel=\"nofollow\">http://https://www.ideoforce.pl/wiedza/pwa-amp-rwd-czy-mobile-co-wybrac,215.html</a></a>