Přednáška a workshop pro "SEO jako Brno". jaký je význam rychlosti webu na které metriky se dívat a jak je chápat jaké nástroje pro posuzování rychlosti webů používat jaké jsou základní technické (obsahové) prostředky ke zvýšení rychlosti webů jaké jsou pokročilejší možnosti pro zrychlení

1. Rychlost
načítání webů
pro marketéry
6. listopadu 2018
Martin Michálek
@machal

2. vrdl.cz/martin
Martin Michálek: frontend designér, poradce

3. 1. Argumenty pro rychlost
2. Nástroje
3. Metriky
4. Jak mohou pomoci marketéři
5. AMP
6. Workshop
Martin Michálek
@machal vzhurudolu.cz
Rychlost
načítání webů
pro marketéry

4. 1. Argumenty pro rychlost
2. Nástroje
3. Metriky
4. Jak mohou pomoci marketéři
5. AMP
6. Workshop
Martin Michálek
@machal vzhurudolu.cz
Rychlost
načítání webů
pro marketéry

5. Online marketing

6. Martin Michálek: frontend designér, poradce
KPI ♥ Page Speed

7. https://wpostats.com/2015/11/04/walmart-revenue.html
Load Time -1s
→ 2 % v konverzích
Load Time -200ms
→ 1 % v příjmech

8. Před
Po
CR na mobilech +25%
https://www.vzhurudolu.cz/blog/58-rychlost-srovname-cz

9. Připojení Max. rychlost Mbit/s Latence ms
2G/EDGE 0,1 - 0,4 300 - 1000
3G 0,5 - 5 100 - 500
4G/LTE 1 - 50 < 100
WiFi 1 - 50 < 10
LTE to zcela neřeší
https://www.vzhurudolu.cz/prirucka/rychlost-nacitani-proc

10. Rychlost
načítání webů
pro marketéry
1. Argumenty pro rychlost
2. Nástroje
3. Metriky
4. Jak mohou pomoci marketéři
5. AMP
6. Workshop
Martin Michálek
@machal vzhurudolu.cz

11. PageSpeed Insights Lighthouse
WebpageTest SpeedCurve
Nástroje

12. Rychlost
načítání webů
pro marketéry
1. Argumenty pro rychlost
2. Nástroje
3. Metriky
4. Jak mohou pomoci marketéři
5. AMP
6. Workshop
Martin Michálek
@machal vzhurudolu.cz

13. https://developers.google.com/web/fundamentals/performance/critical-rendering-path/
1.5MB
1.5MB
načtenízobrazení
Časová osa načtení

14. Time To First
DOM Content Loaded
First Paint
Time To Interactive
Load
First Contentful Paint
Metriky rychlosti

15. SpeedIndex
Průměrný web 20–40 s
Cuketka (článek) 13 s
Lékarna.cz (produkt) 7 s
Vzhůru dolů (článek) 4,5 s
Optimum (by Google Lighthouse) < 2 s
SpeedIndex from WebpageTest.org on 3G Slow
SpeedIndex

16. 1. Argumenty pro rychlost
2. Nástroje
3. Metriky
4. Jak mohou pomoci marketéři
5. AMP
6. Workshop
Martin Michálek
@machal vzhurudolu.cz
Rychlost
načítání webů
pro marketéry

17. Jak můžete pomoci?
1. Konzultujte výběr a vkládaní skriptů (A/B, chaty…, viz vzhurudolu.cz)
2. Vypínejte, co nepoužíváte
3. GTM: Věšejte skripty na pozdější události (gtm.dom, gtm.load, viz pavelbrecik.cz)
4. Ošetřujte obsahové obrázky (kraken.io, JPEGmini, MozJpeg)

18. Rychlost
načítání webů
pro marketéry
1. Argumenty pro rychlost
2. Nástroje
3. Metriky
4. Jak mohou pomoci marketéři
5. AMP
6. Workshop
Martin Michálek
@machal vzhurudolu.cz

19. HTML, CSS
AMP
HTML
HTML
Objevení robotem
Optimalizace
Web
Distribuce Platformy

21. AMP Stories

22. Běžný web AMP na CDN AMP preload
Cuketka (článek) 13 s 12 s 0,16 s
Lékarna.cz (produkt) 7 s 8,4 s 0,21 s
Vzhůru dolů (článek) 4,4 s 8,2 s 0,24 s
Optimum (by Google Lighthouse) > 2 s
SpeedIndex from WebpageTest.org on 3G Slow
Speed Index s AMP

23. Martin Michálek: frontend designér, poradce
AMPNon-AMP
+10%
PAGE VIEWS

24. 1. Argumenty pro rychlost
2. Nástroje
3. Metriky
4. Jak mohou pomoci marketéři
5. AMP
6. Workshop
Martin Michálek
@machal vzhurudolu.cz
Rychlost
načítání webů
pro marketéry

25. → vrdl.in/seobrno

26. Děkuji!
Martin Michálek
@machal