Facebook PWA: co musisz wiedzieć

Najszybciej rozwijająca się platforma mediów społecznościowych na świecie oficjalnie dołączyła do transformacji PWA. Nasz najnowszy artykuł przedstawia bardzo pożądane studium przypadku Facebook PWA.

Przeanalizujemy, dlaczego Facebook musiał przejść na PWA i jakie wyniki przyniosło tej gigantycznej firmie technologicznej PWA. Wejdźmy od razu.

Przegląd Facebooka

W 2004 roku Mark Zuckerberg, który opuścił Harvard, założył Facebooka z misją budowania społeczności, w której ludzie z całego świata mogą łączyć się, dzielić opiniami i komunikować się ze sobą pod postami. A reszta to historia.

Do dziś Facebook pomaga ludziom pozostawać w kontakcie, otrzymywać codzienne aktualizacje życia od znajomych i rodziny oraz odkrywać, co dzieje się na świecie.

Jest to obecnie największa platforma mediów społecznościowych na tej planecie, z około 2,93 miliarda aktywnych użytkowników miesięcznie, dane zaczerpnięte z pierwszego kwartału 2022 roku.

W przeciwieństwie do LinkedIn czy Twittera z określonym segmentem docelowym, Facebook rozrósł się, ponieważ nie ogranicza się do żadnej grupy, ale dociera do różnych osób, zaspokajając wiele rodzajów potrzeb i treści, obejmując wiele różnych aspektów medialnych.

Rola PWA w przyszłości

Co powinniśmy wiedzieć o PWA, gdy słyszymy historię o uruchomieniu przez Facebooka wersji PWA? Po pierwsze chodzi o obecność PWA w przyszłości.

To nie jest kwestia tego, czy, ale kwestia tego, kiedy właściciele witryn zaczną integrować lub budować PWA. Ponieważ po prostu, jeśli Facebook, Twitter, Uber, Tinder, Starbuck, AliExpress i Alibaba stosują PWA do swojej strategii cyfrowej, to musi być coś.

Po drugie, wiemy, że PWA jest wciąż stosunkowo świeże, więc jego wydajność może być opóźniona w porównaniu z aplikacjami natywnymi. Jednak 95% natywnych funkcji Facebooka można odtworzyć dla PWA, a programiści są optymistycznie nastawieni do tej transformacji.

Przewiduje się, że będzie to jutro. Prawie każdą aplikację można już wbudować w PWA. Lista funkcji PWA rozszerza się o te natywne aplikacje i nie tylko.

Aby odciąć Cię od całego nieefektywnego hałasu wokół PWA, za pomocą modnych słów i dziwacznych twierdzeń, oto wartość, jaką przynosi światu.

PWA zrodziło się z koncepcją uczynienia sieci lepszym miejscem do spędzania czasu, aby miała znaczenie dla grup ludzi, którzy mają znaczenie.

W codziennej aplikacji istnieje ogromna tendencja do wykorzystywania nawyków użytkowników końcowych. Większość ludzi korzysta z maksymalnie 6 aplikacji i poważnie wchodzi w interakcję z 2-3 aplikacjami każdego dnia.

Tak więc użytkownicy nie potrzebują więcej aplikacji, ponieważ dane pokazują, że ich największą frustracją związaną z aplikacjami jest zbyt duże zużycie pamięci. Właśnie dlatego użytkownicy spędzają czas na jednej, lekkiej platformie i nadal wywierają na nich trwały wpływ, co sprawia, że ​​aplikacje natywne nie spełniają swoich zadań.

Gdy użytkownicy wolą PWA, oszczędza to firmom i programistom wysiłek i zasoby, aby zapewnić dochodową obecność w Internecie.

Bardziej sensowne jest korzystanie z jednego, płynnego środowiska na różnych urządzeniach niż obsługa 2 oddzielnych aplikacji natywnych i witryny internetowej.

Poza tym budowanie PWA nadal działa, nawet jeśli marki mają już natywną aplikację, tylko że jest ona odpowiednia dla wielkich nazwisk. Pomogłoby im to przyciągnąć każdą możliwą perspektywę debiutu PWA.

Wyzwania Facebooka przed integracją z PWA

Ku zaskoczeniu i uciesze wielu ludzi, Facebook zrezygnował z rozwijania swojej mobilnej aplikacji internetowej w 2020 roku. Oryginalna aplikacja miała nie być wystarczająco przyjazna dla użytkownika, a Facebook szukał szansy na przejście na PWA.

Te dwie podzielone sytuacje zostały wkrótce zamknięte przez podobne do aplikacji środowisko PWA działające w różnych przeglądarkach. Rozwija się z rozmachem, stając się w ostatnich latach realną alternatywą dla aplikacji natywnych.

Facebook może również powiedzieć, że technologia jest na dobrej drodze do dominacji w cyfrowym krajobrazie, zwłaszcza w e-commerce. Jednak jako aplikacja webowa, PWA jest wciąż nowe i wymaga dalszych prac nad swoimi funkcjonalnościami.

Wyniki Facebooka PWA

O projekcie

Jest niewielka zmiana w projekcie logo Facebooka PWA i nie-PWA, gdy pojawia się na ekranie głównym. Na pulpicie zwykła wyświetlana jest z zakładką Chrome na dole, podczas gdy PWA wygląda jak ikona natywnej aplikacji.

W przypadku programu innego niż PWA otrzymujesz stary dobry widok nowej karty z paskiem menu i najczęstszymi adresami. Doświadczenie jest inne w przypadku PWA, gdy zobaczysz ekran powitalny, zanim pojawi się prawdziwa strona i zacznie się ładować, dokładnie tak jak aplikacja. To nadal przeglądarka Twojego urządzenia obsługuje pracę, ale wygląda na to, że bardziej przypomina aplikację bez górnego paska.

Facebook PWA działa niezależnie w przełączniku przeglądu, abyś mógł kontynuować poprzednią działalność. Poza tym niewiele różnic dotyczy treści lub układu.

O wrażeniach użytkownika

• Szybkość ładowania: szybka i płynna
• Przejście między stronami i elementami: responsywne z natychmiastowym pojawieniem się
• Ogólne wrażenia: łatwe, proste i szybkie

7 wskazówek, jak zbudować PWA jak Facebook

Zasada KISS (Keep It Simple, Stupid)

Ekran mobilny jest znacznie mniejszy i zużywa znacznie mniej danych i energii niż komputer stacjonarny. Oznacza to, że programiści mieliby mniej treści do pracy.

Więc po prostu zachowaj prostotę, zasadność i użyteczność. Zostaw miejsce na określone przestrzenie, zamiast doprowadzać je do przytłoczenia swoim projektem. Wykonaj test A/B, aby usunąć niepotrzebne elementy, co skutkuje niskimi punktami zaczepienia.

Korzystanie ze skomplikowanych czcionek może kosztować Twoją witrynę dużo energii do załadowania, a tym samym spowolnić proces. Ogólną zasadą jest nadawanie priorytetu czcionkom domyślnym, kiedy tylko jest to możliwe.

Facebook doprowadził do tego starą, dobrą czcionką Helvetica, aby zwrócić uwagę na posty użytkowników bez utraty elementów tożsamości marki.

Zapewnij płynną nawigację

Dobrym priorytetem jest uniknięcie jednocześnie wszystkich czynników interakcji internetowych, takich jak nagłówki lub stopki. Korzystając z Facebooka w aplikacji lub przeglądarce mobilnej, przekonasz się, że wszystko pozostaje takie samo tam, gdzie się tego spodziewasz.

Zamiast funkcji przeglądarki spraw, by była przepełniona trybem bez krawędzi i traktuj PWA tak samo, jak budowanie aplikacji natywnej.

Chociaż gesty dotykowe powinny być używane z częściami zapasowymi, niekoniecznie są pożądane, ponieważ są trudne do wykonania.

Funkcjonalność w wielu przeglądarkach

Warto rozważyć możliwości każdej przeglądarki z funkcjami PWA, aby ocenić ich kompatybilność na etapie projektowania.

Chrome i Firefox to dwie przeglądarki, które najbardziej obsługują funkcje PWA, podczas gdy Safari nadal odmawia całkowicie obsługi serwisantów w PWA.

Brak tej podstawowej technologii PWA doprowadził do braku podstawowych funkcji, takich jak powiadomienia push i przeglądanie offline. Nadal możesz zobaczyć Facebook PWA we wszystkich produktach Apple, ale nie jest on zoptymalizowany jak w innych przeglądarkach.

Zachowaj Snoop w trybie offline

Wszyscy pamiętamy niesławnego Dinozaura Google, który zapewnia nam zajęcie i rozrywkę, dlaczego połączenie internetowe jest wyłączone. Ta sama sztuczka może mieć zastosowanie tutaj, gdy zawartość potrzebuje trochę więcej czasu na załadowanie.

Zastąpienie pokrętła ładowania czymś mniej frustrującym, czymś, co sprawia, że ​​zapominają o obciążeniu, sprawią, że pomyślą, że witryna jest szybsza niż jest.

Innym świetnym sposobem, aby ładowanie wydawało się znacznie krótsze, są ekrany Skeleton, które rzucają użytkownikom podgląd na to, czego i czego nie mogą się spodziewać, jednocześnie prowadząc ich do każdego interesującego miejsca na stronie. Nie pomijaj jednak Service Workerów, które umożliwiają Twojej witrynie przechowywanie danych generowanych przez użytkowników i prawidłowe ich buforowanie bez połączenia z Internetem.

Optymalizuj pod kątem SEO

Kiedy Google aktualizuje algorytmy, pojawia się nowy zestaw reguł, których należy przestrzegać, aby ranking wyszukiwał. Zaprojektuj więc swoją stronę zarówno z myślą o przeszukiwaniu maszyn, jak i prawdziwych odwiedzających za ekranem. Każdy powinien być dostępny za pośrednictwem adresu URL.

Bez pomocy PWA posty na Facebooku nie mogą pojawiać się we wszystkich wyszukiwarkach dla odpowiednich słów kluczowych. Zwykle są wysoko prezentowani na najwyższych pozycjach.

Oto kilka punktów, na które należy zwrócić uwagę, jeśli chodzi o witrynę przyjazną SEO:

• Treść renderowana po stronie serwera jest wymagana do początkowej fali indeksowania i używaj jej, gdy tylko jest to możliwe. Jeśli tak nie jest, możesz polegać na usługach dynamicznego renderowania dostarczanych przez strony trzecie.
• Określ kanoniczny adres URL za pomocą tagów kanonicznych na każdej stronie.
• Unikaj maskowania się przez boty wyszukiwania lub udostępniania tej samej treści.
• Upewnij się, że Twoja witryna ładuje się szybko w ciągu 5 sekund, wydłużając czas wyświetlania strony i zapewniając wysokie bezpieczeństwo.

Działa z różnymi typami wejść

Jeśli zamierzasz zaprojektować wyzwalacz do interakcji z efektem najechania, upewnij się, że użytkownicy klikają lub dotykają, aby go aktywować. Nie zapomnij użyć dokładnych elementów semantycznych i niesemantycznego kodu HTML, a otrzymasz to.

Inną rzeczą jest trzymanie obszaru klawiatury z dala od pokoju na wiadomości, co jest powszechne, gdy PWA jest w widoku poziomym. Facebook PWA wykonał fantastyczną robotę, zapewniając swoim użytkownikom dokładne interakcje na różnych urządzeniach.

Zweryfikuj swoje PWA za pomocą narzędzia Google Lighthouse Tool

Kiedy musisz ocenić wydajność swojego PWA podczas procesu tworzenia lub po uruchomieniu, możesz polegać na Lighthouse, witrynie internetowej firmy Google do audytu o otwartym kodzie źródłowym. Lighthouse ocenia strony internetowe na podstawie 5 parametrów w skali od 1 do 100.

Wielkie nazwiska zawsze testują w miarę ich rozwoju, aby upewnić się, że wszystko jest objęte. PWA to również czynnik używany do klasyfikacji, czy strona internetowa jest PWA.

A kiedy jest to pewne, PWA będzie mierzone w różnych kategoriach szybkości, bezpieczeństwa, responsywnego projektu, pamięci podręcznej, wydajności offline, indeksowania, powiadomień push i doświadczenia użytkownika.

Kluczowe dania na wynos

Aby wydobyć to, co najlepsze z obu światów, zaadaptować najlepsze aplikacje natywne do stron internetowych, co zapewni PWA ogromną przewagę w najbliższej przyszłości. Przyszłość środowiska online ogranicza wpływ PWA.

Pionierska rola Facebooka PWA z pewnością przyspieszyła rewolucję PWA, przywracając im lekkie środowisko i solidną platformę dla użytkowników z całego świata, którzy dołączają do rozmowy pomimo różnicy w przepustowości połączenia internetowego.

Jeśli szukasz nazwy eksperta, która da Ci pełne poczucie niezawodności, która pomoże Ci zająć się transformacją PWA, Tigren jest tym, czego potrzebujesz.

Porozmawiaj z nami już dziś, aby uzyskać wysokiej jakości usługi e-commerce PWA premium za rozsądną cenę. Zacznij zarabiać wcześniej i zwiększ swój zwrot z inwestycji już dziś.