Rozwój technologii w Internecie sprawia, że witryny muszą być dostosowywane do współcześnie panujących standardów. Wówczas mogą zapewnić użytkownikom wygodę oraz maksymalny poziom bezpieczeństwa podczas przeglądania zawartości. Doskonałym przykładem zmian na tym polu jest technologia Flash, która jeszcze kilka lat temu była powszechnie obecna w sieci, a dziś jest uznawana za wymarłą i przestarzałą. Mówiąc o rozwoju w kontekście stron internetowych warto wspomnieć o PWA, czyli Progressive Web App. To technologia zaprojektowana bezpośrednio z myślą o ergonomii użytkowników i jest coraz częściej wykorzystywana przez webmasterów. Czy strony internetowe opracowane w ten sposób mogą być pozycjonowane? A jeżeli tak, to w jaki sposób?

Czym jest Progressive Web App (PWA)

Skrót PWA oznacza Progressive Web App, czyli progresywną aplikację internetową. To witryny, które są projektowane w taki sposób, aby zagwarantować użytkownikom maksymalną wygodę w każdej sytuacji. Choć najczęściej tego rodzaju aplikacje są kojarzone z urządzeniami mobilnymi, mogą być także wykorzystywane na komputerach. Do wyświetlania aktualnych informacji oczywiście potrzebne jest połączenie z internetem, jednak PWA są w stanie otworzyć się także bez transferu danych, wyświetlając zawartość, która została załadowana wcześniej. To nowoczesna technologia, powszechnie stosowana przez organizacje pragnące odpowiednio zadbać o UX (user experience), czyli doświadczenia użytkowników.

W przypadku urządzeń mobilnych PWA ma sporą przewagę. Przede wszystkim pobrane strony zajmują mniej miejsca operacyjnego niż aplikacje dostępne w Sklepie Play (Android) lub App Store (iOS). Dla przykładu PWA opracowane przez Pinterest zajmuje około 200 kb. Natomiast aplikacja pobierana ze sklepu to ponad 25 MB.

Stworzenie witryny zgodnie z technologią PWA umożliwia pobranie na komputer lub telefon, co jest ogromnym udogodnieniem dla użytkowników. W ten sposób internauta może przeglądać ulubione serwisy bez konieczności uruchamiania przeglądarki. Aby witryna mogła poprawnie funkcjonować jako PWA, musi być odpowiednio zaprojektowana. Należy szczególną uwagę zwrócić na UX – jeżeli aplikacja nie będzie dostosowana do potrzeb użytkowników, czas trwania sesji ulegnie znacznemu skróceniu. Dodatkowo współczynnik konwersji zostanie obniżony, a internauci będą niechętnie korzystać z takiego rozwiązania. Właściwie zaprojektowany serwis typu PWA będzie wyróżniać się krótkim czasem ładowania. Jeżeli witryna obsługuje tę technologię, wówczas na urządzeniu mobilnym podczas jej przeglądania wyświetli się komunikat typu „Dodaj tę aplikację do ekranu głównego”. Możliwe jest także pobranie PWA przez przeglądarkę na dysk twardy komputera.

Jak tworzy się progresywne aplikacje internetowe?

Do tworzenia PWA wykorzystuje się specjalne oprogramowanie – doskonałym przykładem jest Gatsby, czyli platforma o charakterze open source opierająca się na React JS. Ten framework pomaga webmasterom w projektowaniu stron internetowych, które będą szybkie i wydajne, a jednocześnie dostosowane do technologii PWA. Podstawowym atutem oprogramowania Gatsby jest funkcjonalność – narzędzie daje praktycznie pełną kontrolę, co umożliwia kreatywne tworzenie nowoczesnych serwisów, zgodnych z zapotrzebowaniem odbiorców. Głównym celem tego oprogramowania jest zagwarantowanie maksymalnej wydajności oraz szybkości. Całość posiada wiele przydatnych funkcji, jednak do obsługi wymagana jest znajomość programowania w JavaScript.

Gatsby pozwala tworzyć strony statyczne, czyli takie, które znajdują się fizycznie na serwerze. Gdy przeglądarka otrzyma zapytanie, od razu przesyła odpowiedź w postaci pliku HTML. To alternatywa dla witryn dynamicznych, gdzie serwer po otrzymaniu zapytania generuje plik na podstawie danych, które otrzymał od przeglądarki, a następnie wysłać odpowiedź do przeglądarki. Łatwo wywnioskować, że zaletą serwisów statycznych jest szybkość oraz wydajność. Należy jednak pamiętać, że Gatsby nie jest CMSem podobnym do tych popularnych, takich jak na przykład WordPress. Nie znajdziesz panelu administracyjnego lub pluginów gotowych do zainstalowania. Oprogramowanie działa w środowisku JavaScript i jest przeznaczone do budowania szybkich stron, takich, które będą zgodne z wcześniej wspomnianym standardem PWA.

PWA i SEO – jak ugryźć ten temat?

Każdy właściciel strony internetowej chce, aby witryna notowała jak najwyższy ruch. W tym celu witrynę można pozycjonować w wyszukiwarce, takiej jak Google. Czy serwis zgodny z technologią PWA może być dopasowany do standardów SEO? Oczywiście, że tak – należy go jednak właściwie zaprojektować, zgodnie z wytycznymi dla webmasterów, jakie opublikowało Google. Należy pamiętać, że wyszukiwarki ciągle ulepszają swoje algorytmy, aby te promowały witryny nie tylko z wartościową treścią, ale także zapewniające jak najkrótszy czas ładowania. Strony projektowane w myśl PWA mogą więc wiele zyskać, ze względu na ponadprzeciętną wydajność.

Na co zwrócić szczególną uwagę podczas tworzenia progresywnej aplikacji internetowej? Przede wszystkim pamiętaj o tych kwestiach:

• Duplikacja treści – jeżeli witryna funkcjonuje w wersji standardowej i PWA, nie możesz powielać publikowanego contentu. Dlatego istotne jest wdrożenie linków kanonicznych, które będą informować wyszukiwarkę, który adres URL ma pierwszeństwo.
• Poprawna indeksacja – zaindeksowane strony to takie, które są wyświetlane w wyszukiwarce. Witryny opierające się na języku JS mogą nie być tak dobrze „rozumiane” przez roboty, jak serwisy wykorzystujące HTML. Projektując stronę, należy całość opracować w taki sposób, aby była jak najlepiej dostosowana wytycznych wyszukiwarek.
• Meta dane – sprawdź, czy strona internetowa posiada poprawnie zaimplementowane meta dane. To podstawowy element każdej witryny, znacznie pomagający zrozumieć zawartość adresu URL robotom wyszukiwarek.
• Cache-first networking – witryna powinna wykorzystywać cache-first networking, co znacznie przyspieszy czas ładowania.
• Schema.org – kluczową kwestią jest oznaczanie zawartości strony przy pomocy danych strukturalnych w tym formacie.
• Znak „#” – koniecznie usuń symbole „#” z adresów URL. Nie będą one indeksowane przez Google.
• Atrybut „scrset” – to element rozwiązujący problem błędnego skalowania obrazów. Dzięki niemu obrazy o różnej rozdzielczości są pobierane według możliwości wyświetlania na ekranie.

Jeżeli chcesz, aby Twój serwis był zgodny z PWA, wcale nie musisz rezygnować z wysokiej pozycji w organicznych wynikach wyszukiwania Google. Wystarczy mądrze zaprojektować witrynę, na przykład wykorzystując takie narzędzia, jak wcześniej wspomniany Gatsby. To rozwiązanie powszechnie stosowane przez webmasterów ze względu na funkcjonalność oraz brak ograniczeń.

Strona internetowa spełniająca standard PWA może być zgodna z SEO oraz UX. O tym, jakie korzyści przynosi synergia tych dwóch elementów wiemy w Semcore. Dlatego przygotowaliśmy strategię SXO, opierającą się nie tylko na pozycjonowaniu witryny, ale także dostosowaniu serwisu do potrzeb użytkowników. W efekcie witryna notuje większy ruch organiczny, a także wyższy poziom konwersji. To strategia efektywna zarówno w kontekście firmowych stron internetowych, jak i sklepów e-commerce prowadzących sprzedaż online.