ΠŸΠ΅Ρ€Π΅ΠΉΡ‚ΠΈ ΠΊ содСрТимому
ΠœΠ°ΠΊΡΠΈΠΌΠ΅Ρ‚Π΅Ρ€

πŸ—οΈ Как ΡƒΠ±Ρ€Π°Ρ‚ΡŒ скачки ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° Π½Π° сайтС?

πŸ—οΈ Как ΡƒΠ±Ρ€Π°Ρ‚ΡŒ скачки ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° Π½Π° сайтС? ΠœΠ΅Ρ‚Ρ€ΠΈΠΊΠ° CLS (Cumulative Layout Shift) измСряСт Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΡƒΡŽ ΡΡ‚Π°Π±ΠΈΠ»ΡŒΠ½ΠΎΡΡ‚ΡŒ страницы. Норма β€” ≀0.1. Высокий CLS β†’ ΠΏΠ»ΠΎΡ…ΠΎΠΉ UX ΠΈ потСря ΠΏΠΎΠ·ΠΈΡ†ΠΈΠΉ Π² поискС. πŸ” ΠžΡΠ½ΠΎΠ²Π½Ρ‹Π΅ ΠΏΡ€ΠΈΡ‡ΠΈΠ½Ρ‹: β€’ Π˜Π·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΡ/Π²ΠΈΠ΄Π΅ΠΎ Π±Π΅Π· ΡƒΠΊΠ°Π·Π°Π½Π½Ρ‹Ρ… Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠ² β€’ Π’Π΅Π±-ΡˆΡ€ΠΈΡ„Ρ‚Ρ‹ с FOIT/FOUT (Flash of Invisible/Unstyled Text) β€’ ДинамичСскиС вставки Π±Π΅Π· Π·Π°Ρ€Π΅Π·Π΅Ρ€Π²ΠΈΡ€ΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ мСста πŸ’‘ РСшСния: β€’ Π―Π²Π½ΠΎ ΡƒΠΊΠ°Π·Ρ‹Π²Π°ΠΉ width/height для ΠΌΠ΅Π΄ΠΈΠ° β€’ Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉ aspect-ratio Π² CSS β€’ Π Π΅Π·Π΅Ρ€Π²ΠΈΡ€ΡƒΠΉ мСсто ΠΏΠΎΠ΄ динамичСский ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ β€’ Настрой font-display: swap для ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ² Π§Π΅ΠΌ ΡΡ‚Π°Π±ΠΈΠ»ΡŒΠ½Π΅Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚ β€” Ρ‚Π΅ΠΌ Π²Ρ‹ΡˆΠ΅ ΠΏΠΎΠ·ΠΈΡ†ΠΈΠΈ Π² Google. #CoreWebVitals #CLS #SEO #Π’Π΅Π±Π Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠ° #UX

30 просмотров

Канал Π² ΠΊΠ°Ρ‚Π°Π»ΠΎΠ³Π΅ ΠœΠ°ΠΊΡΠΈΠΌΠ΅Ρ‚Π΅Ρ€Π°

22 подписчиков Β· IT ΠΈ Ρ‚Π΅Ρ…Π½ΠΎΠ»ΠΎΠ³ΠΈΠΈ

Π”Ρ€ΡƒΠ³ΠΈΠ΅ ΠΏΡƒΠ±Π»ΠΈΠΊΠ°Ρ†ΠΈΠΈ ΠΊΠ°Π½Π°Π»Π°

ΠŸΠΎΠΏΡƒΠ»ΡΡ€Π½Ρ‹Π΅ ΠΏΡƒΠ±Π»ΠΈΠΊΠ°Ρ†ΠΈΠΈ ΠΊΠ°Π½Π°Π»Π°

Π•Ρ‰Ρ‘ ΠΏΠΎ Ρ‚Π΅ΠΌΠ΅ Β«IT ΠΈ Ρ‚Π΅Ρ…Π½ΠΎΠ»ΠΎΠ³ΠΈΠΈΒ»

Π§ΠΈΡ‚Π°Ρ‚ΡŒ дальшС

Π”Π²Π° Ρ€Π°Π·Π° Π² нСдСлю свСТиС посты этого ΠΊΠ°Π½Π°Π»Π° β€” Π½Π° ΠΏΠΎΡ‡Ρ‚Ρƒ ΠΈ Π² Π»ΠΈΡ‡Π½ΡƒΡŽ Π»Π΅Π½Ρ‚Ρƒ. Π‘Π΅Π· ΠΏΠΎΠ²Ρ‚ΠΎΡ€Π½ΠΎΠ³ΠΎ поиска ΠΊΠ°Π½Π°Π»Π° Π²Ρ€ΡƒΡ‡Π½ΡƒΡŽ.