Wprowadzenie
Od maja 2021 niewydajne - pod względem front-endu - strony WWW, będą najprawdopodobniej niżej pozycjonowane w wynikach wyszukiwania Google. Podczas tego warsztatu pokażę Ci przykład procesu optymalizacji niewydajnej strony od A do Z, kierując się metrykami Web Vitals (startując z noty 15/100 wg Lighthouse, osiągając wynik 90+ na mobile i desktop). Omówię krok po kroku techniki optymalizacyjne, pokazując w kodzie konkretne, praktyczne, wydajne rozwiązania.
- Czym są metryki Web Vitals?
- Czym są metryki Core Web Vitals?
- Czym są Other Web Vitals?
- Jak liczone są wyniki w PageSpeed Insights / Lighthouse
- Optymalizacja strony krok po kroku
- Najważniejsze czynniki wpływające na wydajność
- Optymalizacja obrazków
- Optymalizacja fontów
- Wczytywanie CSS
- Lazy Loading
- Skrypty zewnętrzne
- Zaawansowane techniki optymalizacji
Czym są Metryki Web Core Vitals?
Web Core Vitals to przygotowany przez Google, zbiór wskaźników mierzących doświadczenia użytkowników. Zawierają się w nich m.in. LCP - Largest Contentful Paint, FID - First Input Delay oraz CLS - Cumulative Layout Shift. Już teraz zapowiedziano, że wskaźniki te będą zmieniać się na przestrzeni czasu a obecne skupiają się na doświadczeniach związanych z wczytywaniem, interaktywnością oraz stabilnością elementów wizualnych.
Dlaczego Web Core Vitals są ważne?
Powodów jest przynajmniej kilka. Najważniejsze z nich to fakt, że Google od maja 2021 uwzględni je w czynnikach wpływających na pozycję stron w wyszukiwarce (SEO). Zatem każdy serwis który opiera swój model biznesowy o ruch organiczny, zdecydowanie powinien przygotować wsparcie dla WCV. Dodatkowo Web Core Vitals mają realne przełożenie na doświadczenia użytkowników, co zawsze powinno być naszym priorytetem.
Dobry UX a przewaga konkurencyjna
Doświadczenia użytkownika to przewaga konkurencyjna, szczególnie w czasach ogromnej konkurencji na rynku oprogramowania. Stworzenie aplikacji, która rozwiązuje konkretne problemy nie jest zwykle dużym problemem. Za to przygotowanie jej tak, aby doświadczenia płynące z jej wykorzystania zachęcały użytkowników do polecania jej innym - już tak. Na dobry UX składa się wiele różnych czynników i zaangażowania każdego działu w firmie. Ostatecznie wysiłek całej firmy może być zmarnowany w chwili gdy nasza strona www / aplikacja nie są odpowiednio wydajne.
Zasada 20 / 80
Optymalizacja nie jest prostym zadaniem a ilość pracy różni się w zależności od skali naszej aplikacji. Dobra wiadomość jest taka, że istnieje 20% działań które możemy podjąć aby uzyskać 80% efektu, co jest często w zupełności wystarczające do dostarczenia odpowiednich doświadczeń użytkownika. W tym warsztacie dowiesz się nie tylko o tych technikach ale również sposobach, które pozwolą Ci dostarczyć możliwie najlepsze efekty.
Teoria i praktyka
W tym warsztacie znajdziesz mnóstwo teoretycznych zagadnień wyjaśniających fundamenty stojące za dobrą optymalizacją aplikacji. Jednocześnie teoria ta nie jest w żaden sposób oderwana od praktyki. Na konkretnych przykładach dowiesz się jak zoptymalizować aplikację krok po kroku oraz jak monitorować bieżący postęp zmian.
Dla kogo jest ten kurs?
Warsztat ten został przygotowany z myślą o front-end developerach, którzy chcą poszerzyć swoją wiedzę i umiejętności w zakresie optymalizacji stron www i aplikacji a w szczególności metryk Web Vitals. Jest to niezbędna wiedza, która w 2021 roku będzie mieć znaczne przełożenie na wartość biznesową.
Dlaczego wybrać właśnie ten kurs?
- Kurs wideo to najbardziej efektywna a zarazem najprzyjemniejsza forma nauki. Jest on tak prowadzony, byś cały czas mógł go śledzić z zainteresowaniem i zaangażowaniem, a także czerpać satysfakcję ze zdobytej wiedzy!
- Wiedza, którą otrzymujesz w tym kursie, to nie tylko sucha teoria, ale również wskazówki od praktyka z wieloletnim doświadczeniem, dzięki którym dużo łatwiej będzie Ci opanować materiał i pracować efektywniej.
-
Uczysz się na praktycznych przykładach. Kurs, który masz przed sobą to esencja praktycznej wiedzy i doświadczenia a także wzorów, które oszczędzą Ci godziny pracy i poszukiwań.