Π£ΡΠΊΠΎΡΠ΅Π½ΠΈΠ΅ ΡΠ°ΠΉΡΠ° Π΄Π»Ρ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ
Π‘ΠΊΠΎΡΠΎΡΡΡ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΠ°ΠΉΡΠ° Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ - ΠΊΡΠΈΡΠΈΡΠ΅ΡΠΊΠΈ Π²Π°ΠΆΠ½ΡΠΉ ΡΠ°ΠΊΡΠΎΡ, Π²Π»ΠΈΡΡΡΠΈΠΉ Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ Π½Π° ΡΠ΄ΠΎΠ²Π»Π΅ΡΠ²ΠΎΡΠ΅Π½Π½ΠΎΡΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ, Π½ΠΎ ΠΈ Π½Π° ΠΏΠΎΠ·ΠΈΡΠΈΠΈ ΡΠ°ΠΉΡΠ° Π² ΠΏΠΎΠΈΡΠΊΠΎΠ²ΠΎΠΉ Π²ΡΠ΄Π°ΡΠ΅. Π ΡΡΠΎΠΌ ΡΡΠΊΠΎΠ²ΠΎΠ΄ΡΡΠ²Π΅ ΠΌΡ ΡΠ°ΡΡΠΊΠ°ΠΆΠ΅ΠΌ, ΠΊΠ°ΠΊ ΡΠ²Π΅Π»ΠΈΡΠΈΡΡ ΡΠΊΠΎΡΠΎΡΡΡ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΠ°ΠΉΡΠ° Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ , ΡΡΠΎΠ±Ρ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²ΠΈΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΠΌ Π»ΡΡΡΠΈΠΉ ΠΎΠΏΡΡ ΠΈ ΡΠ»ΡΡΡΠΈΡΡ SEO-ΠΏΠΎΠΊΠ°Π·Π°ΡΠ΅Π»ΠΈ.
Π ΡΠΏΠΎΡ Ρ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΠ½Π΅ΡΠ°, ΠΊΠΎΠ³Π΄Π° Π±ΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²ΠΎ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ ΠΏΡΠ΅Π΄ΠΏΠΎΡΠΈΡΠ°ΡΡ ΡΠΌΠ°ΡΡΡΠΎΠ½Ρ ΠΈ ΠΏΠ»Π°Π½ΡΠ΅ΡΡ ΡΡΠ°Π΄ΠΈΡΠΈΠΎΠ½Π½ΡΠΌ Π½Π°ΡΡΠΎΠ»ΡΠ½ΡΠΌ ΠΊΠΎΠΌΠΏΡΡΡΠ΅ΡΠ°ΠΌ, ΠΎΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΡ ΡΠ°ΠΉΡΠΎΠ² ΠΏΠΎΠ΄ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΠ΅ ΡΡΡΡΠΎΠΉΡΡΠ²Π° ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ Π½Π΅ ΠΏΡΠΎΡΡΠΎ ΡΡΠ΅Π½Π΄ΠΎΠΌ, Π° Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΡΡΡΡ. Π‘ΠΊΠΎΡΠΎΡΡΡ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΠ°ΠΉΡΠ° Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ ΡΠ°ΡΡΠΎ ΠΎΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ Π½ΠΈΠΆΠ΅, ΡΠ΅ΠΌ Π½Π° Π΄Π΅ΡΠΊΡΠΎΠΏΠ°Ρ , ΠΈΠ·-Π·Π° ΡΡΠ΄Π° ΡΠ°ΠΊΡΠΎΡΠΎΠ², Π²ΠΊΠ»ΡΡΠ°Ρ ΠΌΠ΅Π½ΡΡΡΡ Π²ΡΡΠΈΡΠ»ΠΈΡΠ΅Π»ΡΠ½ΡΡ ΠΌΠΎΡΠ½ΠΎΡΡΡ ΡΡΡΡΠΎΠΉΡΡΠ² ΠΈ Π±ΠΎΠ»Π΅Π΅ ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎΠ΅ ΡΠΎΠ΅Π΄ΠΈΠ½Π΅Π½ΠΈΠ΅ Ρ ΠΈΠ½ΡΠ΅ΡΠ½Π΅ΡΠΎΠΌ. ΠΠΎΠΌΠΈΠΌΠΎ ΡΠ΅Ρ Π½ΠΈΡΠ΅ΡΠΊΠΈΡ ΠΎΠ³ΡΠ°Π½ΠΈΡΠ΅Π½ΠΈΠΉ, ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΠ΅ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΠΈ ΠΎΠΆΠΈΠ΄Π°ΡΡ Π±ΡΡΡΡΠΎΠΉ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΡΡΠ°Π½ΠΈΡ, ΡΠ°ΡΡΠΎ Π½Π°Ρ ΠΎΠ΄ΡΡΡ Π² Π΄Π²ΠΈΠΆΠ΅Π½ΠΈΠΈ ΠΈΠ»ΠΈ ΠΌΡΠ»ΡΡΠΈΠ·Π°Π΄Π°ΡΠ½ΠΎΡΡΠΈ, ΡΡΠΎ Π΄Π΅Π»Π°Π΅Ρ Π²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠΉ ΡΠ°ΠΊΡΠΎΡ ΠΊΡΠΈΡΠΈΡΠ΅ΡΠΊΠΈ Π²Π°ΠΆΠ½ΡΠΌ Π΄Π»Ρ ΡΠ΄Π΅ΡΠΆΠ°Π½ΠΈΡ Π²Π½ΠΈΠΌΠ°Π½ΠΈΡ Π°ΡΠ΄ΠΈΡΠΎΡΠΈΠΈ.
ΠΠ΅Π΄Π»Π΅Π½Π½Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ° ΡΠ°ΠΉΡΠ° Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ ΠΌΠΎΠΆΠ΅Ρ ΠΏΡΠΈΠ²Π΅ΡΡΠΈ ΠΊ ΠΏΠΎΠ²ΡΡΠ΅Π½Π½ΠΎΠΉ ΠΎΡΠΊΠ°Π·Π½ΠΎΡΡΠΈ, ΡΠ½ΠΈΠΆΠ΅Π½ΠΈΡ ΠΊΠΎΠ½Π²Π΅ΡΡΠΈΠΈ ΠΈ ΡΡ ΡΠ΄ΡΠ΅Π½ΠΈΡ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΡ Ρ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠΎΠΌ. Π ΠΊΠΎΠ½ΡΠ΅ΠΊΡΡΠ΅ SEO Google ΠΈ Π―Π½Π΄Π΅ΠΊΡ ΡΠ°ΠΊΠΆΠ΅ Π΄Π°Π²Π½ΠΎ Π½Π°ΡΠ°Π»ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠΊΠΎΡΠΎΡΡΡ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΠ°Π½ΠΈΡ ΠΊΠ°ΠΊ ΠΎΠ΄ΠΈΠ½ ΠΈΠ· ΡΠ°ΠΊΡΠΎΡΠΎΠ² ΡΠ°Π½ΠΆΠΈΡΠΎΠ²Π°Π½ΠΈΡ, ΠΏΠΎΠ΄ΡΠ²Π΅ΡΠΆΠ΄Π°Ρ Π²Π°ΠΆΠ½ΠΎΡΡΡ Π±ΡΡΡΡΡΡ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΠ°ΠΉΡΠΎΠ² Π΄Π»Ρ ΡΡΠΏΠ΅ΡΠ½ΠΎΠ³ΠΎ ΠΎΠ½Π»Π°ΠΉΠ½-ΠΏΡΠΈΡΡΡΡΡΠ²ΠΈΡ. ΠΠΎΡΡΠΎΠΌΡ ΠΎΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΡ ΡΠΊΠΎΡΠΎΡΡΠΈ Π·Π°Π³ΡΡΠ·ΠΊΠΈ Π΄Π»Ρ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ² ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΊΠ»ΡΡΠ΅Π²ΡΠΌ Π°ΡΠΏΠ΅ΠΊΡΠΎΠΌ Π² ΡΠΎΠ·Π΄Π°Π½ΠΈΠΈ ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅Π½Π½ΠΎΠ³ΠΎ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΎΠΏΡΡΠ° ΠΈ ΡΠ»ΡΡΡΠ΅Π½ΠΈΠΈ Π²ΠΈΠ΄ΠΈΠΌΠΎΡΡΠΈ ΡΠ°ΠΉΡΠ° Π² ΠΏΠΎΠΈΡΠΊΠΎΠ²ΠΎΠΉ Π²ΡΠ΄Π°ΡΠ΅.
ΠΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π΄Π»Ρ ΠΏΠΎΠ²ΡΡΠ΅Π½ΠΈΡ ΡΠΊΠΎΡΠΎΡΡΠΈ Π·Π°Π³ΡΡΠ·ΠΊΠΈ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ
ΠΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΡΠ²Π»ΡΠ΅ΡΡΡ ΡΠ°ΠΌΡΠΌ Π²Π°ΠΆΠ½ΡΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ ΡΡΠΊΠΎΡΠ΅Π½ΠΈΡ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΠ°ΠΉΡΠ° Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ . ΠΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΡΠ°ΡΡΠΎ Π·Π°Π½ΠΈΠΌΠ°ΡΡ Π·Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΡΡ ΡΠ°ΡΡΡ Π΄Π°Π½Π½ΡΡ , Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΡΡ Π΄Π»Ρ Π·Π°Π³ΡΡΠ·ΠΊΠΈ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ, ΠΈ ΠΌΠΎΠ³ΡΡ Π·Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎ Π·Π°ΠΌΠ΅Π΄Π»ΠΈΡΡ ΡΡΠΎΡ ΠΏΡΠΎΡΠ΅ΡΡ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ Ρ ΠΎΠ³ΡΠ°Π½ΠΈΡΠ΅Π½Π½ΠΎΠΉ ΠΏΡΠΎΠΏΡΡΠΊΠ½ΠΎΠΉ ΡΠΏΠΎΡΠΎΠ±Π½ΠΎΡΡΡΡ ΠΈ ΠΌΠΎΡΠ½ΠΎΡΡΡΡ. ΠΠΎΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΡΡΠ°ΡΠ΅Π³ΠΈΠΉ ΠΎΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ:
ΠΡΠ±ΠΎΡ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΠ³ΠΎ ΡΠΎΡΠΌΠ°ΡΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ ΡΠΎΡΠΌΠ°ΡΠΎΠ² ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΠΌΠΎΠΆΠ΅Ρ Π·Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠΌΠ΅Π½ΡΡΠΈΡΡ ΡΠ°Π·ΠΌΠ΅Ρ ΡΠ°ΠΉΠ»ΠΎΠ² ΠΏΡΠΈ ΡΠΎΡ ΡΠ°Π½Π΅Π½ΠΈΠΈ ΠΊΠ°ΡΠ΅ΡΡΠ²Π°:
- WebP: ΠΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ ΡΡΡΠ΅ΡΡΠ²Π΅Π½Π½ΠΎ Π»ΡΡΡΡΡ ΡΠΆΠ°ΡΠΎΡΡΡ ΠΏΠΎ ΡΡΠ°Π²Π½Π΅Π½ΠΈΡ Ρ JPEG ΠΈ PNG, ΡΡΠΎ Π΄Π΅Π»Π°Π΅Ρ Π΅Π³ΠΎ ΠΈΠ΄Π΅Π°Π»ΡΠ½ΡΠΌ Π΄Π»Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Π² Π²Π΅Π±Π΅. WebP ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΠΊΠ°ΠΊ ΠΏΠΎΡΠ΅ΡΡ ΠΊΠ°ΡΠ΅ΡΡΠ²Π°, ΡΠ°ΠΊ ΠΈ Π±Π΅Π· ΠΏΠΎΡΠ΅ΡΡ ΡΠΆΠ°ΡΠΈΠ΅, Π° ΡΠ°ΠΊΠΆΠ΅ Π°Π»ΡΡΠ°-ΠΊΠ°Π½Π°Π» (ΠΏΡΠΎΠ·ΡΠ°ΡΠ½ΠΎΡΡΡ).
- AVIF: ΠΠΎΠ²ΡΠΉ ΡΠΎΡΠΌΠ°Ρ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΠ²Π°Π΅Ρ Π΅ΡΡ Π±ΠΎΠ»Π΅Π΅ Π²ΡΡΠΎΠΊΡΡ ΡΡΠ΅ΠΏΠ΅Π½Ρ ΡΠΆΠ°ΡΠΈΡ, ΡΠ΅ΠΌ WebP, Π±Π΅Π· Π·Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠΉ ΠΏΠΎΡΠ΅ΡΠΈ ΠΊΠ°ΡΠ΅ΡΡΠ²Π°. ΠΡΠΎ Π΄ΠΎΡΡΠΈΠ³Π°Π΅ΡΡΡ Π·Π° ΡΡΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ ΠΌΠ΅ΡΠΎΠ΄ΠΎΠ² ΠΊΠΎΠ΄ΠΈΡΠΎΠ²Π°Π½ΠΈΡ.
- JPEG 2000: ΠΠΏΡΠΈΠΌΠΈΠ·ΠΈΡΠΎΠ²Π°Π½ Π΄Π»Ρ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΉ, ΠΏΡΠ΅Π΄Π»Π°Π³Π°Π΅Ρ Π»ΡΡΡΠ΅Π΅ ΠΊΠ°ΡΠ΅ΡΡΠ²ΠΎ ΠΏΡΠΈ ΡΡΠ°Π²Π½ΠΈΠΌΡΡ ΡΠ°Π·ΠΌΠ΅ΡΠ°Ρ ΡΠ°ΠΉΠ»Π° ΠΏΠΎ ΡΡΠ°Π²Π½Π΅Π½ΠΈΡ Ρ ΡΡΠ°Π΄ΠΈΡΠΈΠΎΠ½Π½ΡΠΌ JPEG.
ΠΠ΄Π°ΠΏΡΠΈΠ²Π½ΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ: ΠΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΡ Π΄Π»Ρ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ
ΠΠ΄Π°ΠΏΡΠΈΠ²Π½ΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ ΡΠ²ΠΎΠΉ ΡΠ°Π·ΠΌΠ΅Ρ Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΡΠ°Π·ΠΌΠ΅ΡΠ° ΡΠΊΡΠ°Π½Π° ΡΡΡΡΠΎΠΉΡΡΠ²Π°, Π½Π° ΠΊΠΎΡΠΎΡΠΎΠΌ ΠΎΠ½ΠΈ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ. ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° <picture> ΠΈΠ»ΠΈ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² srcset ΠΈ sizes Π² <img> ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π±ΡΠ°ΡΠ·Π΅ΡΡ Π²ΡΠ±ΠΈΡΠ°ΡΡ Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠ΄Ρ
ΠΎΠ΄ΡΡΠ΅Π΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΈΠ· ΠΏΡΠ΅Π΄Π»ΠΎΠΆΠ΅Π½Π½ΡΡ
, ΠΎΠΏΡΠΈΠΌΠΈΠ·ΠΈΡΡΡ Π·Π°Π³ΡΡΠ·ΠΊΡ Π΄Π»Ρ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ
ΡΡΡΡΠΎΠΉΡΡΠ² ΠΈ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ² ΡΠΊΡΠ°Π½Π°.
ΠΠ΅Π½ΠΈΠ²Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ: ΠΠΎΠ²ΡΡΠ΅Π½ΠΈΠ΅ ΡΠΊΠΎΡΠΎΡΡΠΈ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ
ΠΠ΅Π½ΠΈΠ²Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ° ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΎΡΠΊΠ»Π°Π΄ΡΠ²Π°ΡΡ Π·Π°Π³ΡΡΠ·ΠΊΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ, ΠΊΠΎΡΠΎΡΡΠ΅ Π½Π°Ρ ΠΎΠ΄ΡΡΡΡ Π²Π½Π΅ Π²ΠΈΠ΄ΠΈΠΌΠΎΠΉ ΠΎΠ±Π»Π°ΡΡΠΈ ΡΠΊΡΠ°Π½Π°, Π΄ΠΎ ΡΠ΅Ρ ΠΏΠΎΡ, ΠΏΠΎΠΊΠ° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ Π½Π΅ ΠΏΡΠΎΠΊΡΡΡΠΈΡ ΡΡΡΠ°Π½ΠΈΡΡ Π΄ΠΎ Π½ΠΈΡ . ΠΡΠΎ ΡΠ½ΠΈΠΆΠ°Π΅Ρ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ Π΄Π°Π½Π½ΡΡ , ΡΡΠ΅Π±ΡΠ΅ΠΌΡΡ Π΄Π»Ρ ΠΏΠ΅ΡΠ²ΠΎΠ½Π°ΡΠ°Π»ΡΠ½ΠΎΠΉ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΡΡΠ°Π½ΠΈΡΡ, ΡΡΠΊΠΎΡΡΡ Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅.
Π‘ΠΆΠ°ΡΠΈΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ: ΠΡΡΠ΅ΠΊΡΠΈΠ²Π½Π°Ρ ΠΎΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΡ ΠΏΠΎΠ΄ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΠ΅
ΠΡΠ΅ΠΆΠ΄Π΅ ΡΠ΅ΠΌ Π·Π°Π³ΡΡΠΆΠ°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π½Π° ΡΠ°ΠΉΡ, ΠΈΡ ΡΠ»Π΅Π΄ΡΠ΅Ρ ΠΎΠΏΡΠΈΠΌΠΈΠ·ΠΈΡΠΎΠ²Π°ΡΡ, ΡΠΌΠ΅Π½ΡΡΠΈΠ² ΡΠ°Π·ΠΌΠ΅Ρ ΡΠ°ΠΉΠ»Π° Π±Π΅Π· Π·Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠΉ ΠΏΠΎΡΠ΅ΡΠΈ ΠΊΠ°ΡΠ΅ΡΡΠ²Π°. ΠΠ½ΡΡΡΡΠΌΠ΅Π½ΡΡ, ΡΠ°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ TinyPNG ΠΈΠ»ΠΈ ImageOptim, ΠΌΠΎΠ³ΡΡ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΡΠΆΠΈΠΌΠ°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, ΡΠΌΠ΅Π½ΡΡΠ°Ρ ΠΈΡ ΡΠ°Π·ΠΌΠ΅Ρ.
ΠΡΠΈΠΌΠ΅ΡΡ
- ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ WebP Π΄Π»Ρ Π³Π°Π»Π΅ΡΠ΅ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ: ΠΡΠ»ΠΈ Ρ ΡΠ΅Π±Ρ Π΅ΡΡΡ Π³Π°Π»Π΅ΡΠ΅Ρ Ρ Π²ΡΡΠΎΠΊΠΎΠΊΠ°ΡΠ΅ΡΡΠ²Π΅Π½Π½ΡΠΌΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌΠΈ, ΠΊΠΎΠ½Π²Π΅ΡΡΠ°ΡΠΈΡ ΠΈΡ Π² WebP ΠΌΠΎΠΆΠ΅Ρ Π·Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠΌΠ΅Π½ΡΡΠΈΡΡ Π²ΡΠ΅ΠΌΡ Π·Π°Π³ΡΡΠ·ΠΊΠΈ, ΡΠ»ΡΡΡΠ°Ρ ΠΎΠΏΡΡ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ.
- ΠΠ΄Π°ΠΏΡΠΈΠ²Π½ΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π΄Π»Ρ Π±Π»ΠΎΠ³Π°: ΠΠ»Ρ Π±Π»ΠΎΠ³Π° Ρ ΡΠ°Π·Π½ΠΎΠΎΠ±ΡΠ°Π·Π½ΡΠΌ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠΎΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° `<picture>` Ρ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠΌΠΈ Π²Π΅ΡΡΠΈΡΠΌΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π΄Π»Ρ ΡΠ°Π·Π½ΡΡ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ² ΡΠΊΡΠ°Π½Π° ΠΌΠΎΠΆΠ΅Ρ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΡΡ, ΡΡΠΎ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΠ΅ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΠΈ Π·Π°Π³ΡΡΠΆΠ°ΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΠΏΡΠΈΠΌΠ°Π»ΡΠ½ΠΎ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ΡΡ Π΄Π»Ρ ΠΈΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°.
- ΠΠ΅Π½ΠΈΠ²Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ° Π² ΠΏΠΎΡΡΡΠΎΠ»ΠΈΠΎ: Π ΠΏΠΎΡΡΡΠΎΠ»ΠΈΠΎ, Π³Π΄Π΅ Π²Π°ΠΆΠ½ΠΎ Π²ΠΏΠ΅ΡΠ°ΡΠ»Π΅Π½ΠΈΠ΅ ΠΎΡ Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°, Π»Π΅Π½ΠΈΠ²Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ° ΠΌΠΎΠΆΠ΅Ρ ΡΡΠΊΠΎΡΠΈΡΡ ΠΏΠ΅ΡΠ²ΠΎΠ½Π°ΡΠ°Π»ΡΠ½ΡΡ Π·Π°Π³ΡΡΠ·ΠΊΡ ΡΡΡΠ°Π½ΠΈΡΡ, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡ Π΄Π΅ΡΠ°Π»ΡΠ½ΠΎΠΌΡ ΠΏΡΠΎΡΠΌΠΎΡΡΡ ΡΠ°Π±ΠΎΡ Π±Π΅Π· Π΄Π»ΠΈΡΠ΅Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠΆΠΈΠ΄Π°Π½ΠΈΡ.
Π Π΅Π°Π»ΠΈΠ·Π°ΡΠΈΡ ΡΡΠΈΡ ΠΌΠ΅ΡΠΎΠ΄ΠΎΠ² ΠΎΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ ΡΠ»ΡΡΡΠΈΡ ΡΠΊΠΎΡΠΎΡΡΡ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΠ²ΠΎΠ΅Π³ΠΎ ΡΠ°ΠΉΡΠ° Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ , Π½ΠΎ ΠΈ ΠΏΠΎΠ²ΡΡΠΈΡ ΠΎΠ±ΡΠ΅Π΅ ΡΠ΄ΠΎΠ²Π»Π΅ΡΠ²ΠΎΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ, ΡΠΌΠ΅Π½ΡΡΠΈΠ² ΠΎΡΠΊΠ°Π·Ρ ΠΈ ΡΠ»ΡΡΡΠΈΠ² Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΠ΅ Ρ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠΎΠΌ.
ΠΠΈΠ½ΠΈΠΌΠΈΠ·Π°ΡΠΈΡ CSS, JavaScript ΠΈ HTML Π΄Π»Ρ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ
ΠΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΡ JavaScript ΠΈ CSS ΠΊΡΠΈΡΠΈΡΠ΅ΡΠΊΠΈ Π²Π°ΠΆΠ½Π° Π΄Π»Ρ ΡΡΠΊΠΎΡΠ΅Π½ΠΈΡ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΠ°ΠΉΡΠ°, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ Π½Π΅ΠΎΠΏΡΠΈΠΌΠΈΠ·ΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ ΠΊΠΎΠ΄ ΠΌΠΎΠΆΠ΅Ρ Π·Π°ΠΌΠ΅Π΄Π»ΡΡΡ ΡΠ΅Π½Π΄Π΅ΡΠΈΠ½Π³ ΡΡΡΠ°Π½ΠΈΡ. ΠΠΎΡ ΠΊΠ°ΠΊ ΡΡ ΠΌΠΎΠΆΠ΅ΡΡ ΠΎΠΏΡΠΈΠΌΠΈΠ·ΠΈΡΠΎΠ²Π°ΡΡ ΡΠ²ΠΎΠΈ JavaScript ΠΈ CSS ΡΠ°ΠΉΠ»Ρ:
- ΠΠΈΠ½ΠΈΠΌΠΈΠ·Π°ΡΠΈΡ Π·Π°ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ Π² ΡΠ΄Π°Π»Π΅Π½ΠΈΠΈ Π²ΡΠ΅Ρ Π½Π΅Π½ΡΠΆΠ½ΡΡ ΡΠΈΠΌΠ²ΠΎΠ»ΠΎΠ² ΠΈΠ· ΠΊΠΎΠ΄Π° JavaScript ΠΈ CSS, Π²ΠΊΠ»ΡΡΠ°Ρ ΠΏΡΠΎΠ±Π΅Π»Ρ, ΠΏΠ΅ΡΠ΅Π½ΠΎΡΡ ΡΡΡΠΎΠΊ ΠΈ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ, Π½Π΅ Π²Π»ΠΈΡΡ Π½Π° Π΅Π³ΠΎ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΡ. ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΡ ΠΊΠ°ΠΊ UglifyJS Π΄Π»Ρ JavaScript ΠΈ CSSNano Π΄Π»Ρ CSS.
- ΠΠ±ΡΠ΅Π΄ΠΈΠ½Π΅Π½ΠΈΠ΅ ΡΠ°ΠΉΠ»ΠΎΠ² ΠΌΠΎΠΆΠ΅Ρ ΡΠΎΠΊΡΠ°ΡΠΈΡΡ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ HTTP-Π·Π°ΠΏΡΠΎΡΠΎΠ², Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΡΡ Π΄Π»Ρ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΡΡΠ°Π½ΠΈΡΡ. ΠΠ±ΡΠ΅Π΄ΠΈΠ½ΡΠΉ ΡΠ°ΠΉΠ»Ρ CSS ΠΈ JavaScript Π² ΠΎΠ΄ΠΈΠ½ ΠΈΠ»ΠΈ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΏΠ°ΠΊΠ΅ΡΠΎΠ², Π½ΠΎ Π΄Π΅Π»Π°ΠΉ ΡΡΠΎ Ρ ΡΠΌΠΎΠΌ, ΡΡΠΎΠ±Ρ Π½Π΅ ΡΠΎΠ·Π΄Π°ΡΡ ΡΠ»ΠΈΡΠΊΠΎΠΌ Π±ΠΎΠ»ΡΡΠΎΠΉ ΡΠ°ΠΉΠ», ΠΊΠΎΡΠΎΡΡΠΉ ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ Π·Π°ΠΌΠ΅Π΄Π»ΠΈΡΡ Π·Π°Π³ΡΡΠ·ΠΊΡ.
ΠΡΠ»ΠΎΠΆΠ΅Π½Π½Π°Ρ ΠΈ Π°ΡΠΈΠ½Ρ ΡΠΎΠ½Π½Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ° ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ²
- ΠΡΠΈΠ½Ρ ΡΠΎΠ½Π½Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ° JavaScript ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π±ΡΠ°ΡΠ·Π΅ΡΡ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ°ΡΡ ΠΎΠ±ΡΠ°Π±Π°ΡΡΠ²Π°ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ Π² ΡΠΎ Π²ΡΠ΅ΠΌΡ, ΠΊΠ°ΠΊ ΡΠΊΡΠΈΠΏΡ Π·Π°Π³ΡΡΠΆΠ°Π΅ΡΡΡ Π² ΡΠΎΠ½Π΅. ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉ Π°ΡΡΠΈΠ±ΡΡ `async`.
- ΠΡΠ»ΠΎΠΆΠ΅Π½Π½Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ° (defer) ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΎΡΠ»ΠΎΠΆΠΈΡΡ Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΡΠΊΡΠΈΠΏΡΠΎΠ² Π΄ΠΎ ΡΠΎΠ³ΠΎ ΠΌΠΎΠΌΠ΅Π½ΡΠ°, ΠΊΠ°ΠΊ Π²Π΅ΡΡ HTML Π±ΡΠ΄Π΅Ρ ΡΠ°Π·ΠΎΠ±ΡΠ°Π½. ΠΡΠΎ Π΄Π΅Π»Π°Π΅ΡΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°ΡΡΠΈΠ±ΡΡΠ° `defer` Π² ΡΠ΅Π³Π΅ `<script>`.
ΠΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΡ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΡΠΈΡΡΠΎΠ²: ΠΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈΠ΅ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°ΡΠΈΠΈ
Π¨ΡΠΈΡΡΡ ΠΌΠΎΠ³ΡΡ Π±Π»ΠΎΠΊΠΈΡΠΎΠ²Π°ΡΡ ΠΎΡΡΠΈΡΠΎΠ²ΠΊΡ ΡΡΡΠ°Π½ΠΈΡΡ, ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎ Π΅ΡΠ»ΠΈ ΠΎΠ½ΠΈ Π·Π°Π³ΡΡΠΆΠ°ΡΡΡΡ Ρ Π²Π½Π΅ΡΠ½ΠΈΡ ΠΈΡΡΠΎΡΠ½ΠΈΠΊΠΎΠ².
ΠΡΠ±ΠΎΡ ΡΠΎΡΠΌΠ°ΡΠΎΠ² ΡΡΠΈΡΡΠΎΠ² ΠΈ ΠΏΡΠ΅Π΄Π·Π°Π³ΡΡΠ·ΠΊΠ°
- ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΠ΅ ΡΠΎΡΠΌΠ°ΡΡ ΡΡΠΈΡΡΠΎΠ², ΡΠ°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ WOFF2, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΡΠ΅Π΄Π»Π°Π³Π°ΡΡ Π»ΡΡΡΡΡ ΡΠΆΠ°ΡΠΎΡΡΡ ΠΈ Π±ΡΡΡΡΠ΅Π΅ Π·Π°Π³ΡΡΠΆΠ°ΡΡΡΡ.
- ΠΡΠΈΠΌΠ΅Π½ΡΠΉ ΠΏΡΠ΅Π΄Π·Π°Π³ΡΡΠ·ΠΊΡ ΡΡΠΈΡΡΠΎΠ² Ρ ΠΏΠΎΠΌΠΎΡΡΡ <link rel="preload" href="font.woff2" as="font" type="font/woff2" crossorigin>, ΡΡΠΎΠ±Ρ ΡΠΊΠ°Π·Π°ΡΡ Π±ΡΠ°ΡΠ·Π΅ΡΡ ΠΎ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΡΡΠΈ Π·Π°Π³ΡΡΠ·ΠΈΡΡ ΡΡΠΈΡΡ ΠΊΠ°ΠΊ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΊΠΎΡΠ΅Π΅.
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ font-display: Π£Π»ΡΡΡΠ΅Π½ΠΈΠ΅ ΡΠΊΠΎΡΠΎΡΡΠΈ Π·Π°Π³ΡΡΠ·ΠΊΠΈ
CSS ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ font-display ΠΊΠΎΠ½ΡΡΠΎΠ»ΠΈΡΡΠ΅Ρ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΡΠΈΡΡΠΎΠ². Π£ΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Ρ Π΅Π³ΠΎ Π² swap, ΡΡ ΠΌΠΎΠΆΠ΅ΡΡ ΡΠΊΠ°Π·Π°ΡΡ Π±ΡΠ°ΡΠ·Π΅ΡΡ Π½Π΅ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡ ΡΠ΅ΠΊΡΡ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΡΠΈΡΡΠ΅ΠΌΠ½ΠΎΠ³ΠΎ ΡΡΠΈΡΡΠ°, ΠΏΠΎΠΊΠ° Π½Π΅ Π·Π°Π³ΡΡΠ·ΠΈΡΡΡ Π²Π΅Π±-ΡΡΠΈΡΡ, ΡΡΠΎ ΠΏΡΠ΅Π΄ΠΎΡΠ²ΡΠ°ΡΠ°Π΅Ρ Π±Π»ΠΎΠΊΠΈΡΠΎΠ²ΠΊΡ ΠΎΡΡΠΈΡΠΎΠ²ΠΊΠΈ ΡΠ΅ΠΊΡΡΠ°.
ΠΡΠΈΠΌΠ΅ΡΡ
ΠΠΈΠ½ΠΈΠΌΠΈΠ·Π°ΡΠΈΡ ΠΈ ΠΎΠ±ΡΠ΅Π΄ΠΈΠ½Π΅Π½ΠΈΠ΅
ΠΡΠ΅Π΄ΡΡΠ°Π²Ρ, ΡΡΠΎ Ρ ΡΠ΅Π±Ρ Π΅ΡΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠ°ΠΉΠ»ΠΎΠ² JavaScript ΠΈ CSS. ΠΡΠΏΠΎΠ»ΡΠ·ΡΡ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΡ ΡΠ±ΠΎΡΠΊΠΈ, ΡΠ°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ Webpack ΠΈΠ»ΠΈ Gulp, ΡΡ ΠΌΠΎΠΆΠ΅ΡΡ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΠ·ΠΈΡΠΎΠ²Π°ΡΡ ΠΏΡΠΎΡΠ΅ΡΡ ΠΌΠΈΠ½ΠΈΠΌΠΈΠ·Π°ΡΠΈΠΈ ΠΈ ΠΎΠ±ΡΠ΅Π΄ΠΈΠ½Π΅Π½ΠΈΡ, ΡΠΎΠ·Π΄Π°Π²Π°Ρ ΠΎΠ΄ΠΈΠ½ ΠΈΠ»ΠΈ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΎΠΏΡΠΈΠΌΠΈΠ·ΠΈΡΠΎΠ²Π°Π½Π½ΡΡ ΠΏΠ°ΠΊΠ΅ΡΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ Π·Π°Π³ΡΡΠΆΠ°ΡΡΡΡ Π±ΡΡΡΡΠ΅Π΅.
ΠΡΠΈΠ½Ρ ΡΠΎΠ½Π½Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ° ΡΠΊΡΠΈΠΏΡΠΎΠ²
ΠΡΠ»ΠΈ Ρ ΡΠ΅Π±Ρ Π½Π° ΡΠ°ΠΉΡΠ΅ Π΅ΡΡΡ ΡΠΊΡΠΈΠΏΡ Π΄Π»Ρ Π°Π½Π°Π»ΠΈΡΠΈΠΊΠΈ ΠΈΠ»ΠΈ ΠΊΠ°ΠΊΠΎΠΉ-Π»ΠΈΠ±ΠΎ Π²ΠΈΠ΄ΠΆΠ΅Ρ ΡΠΎΡΡΠ΅ΡΠ΅ΠΉ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉ async ΠΈΠ»ΠΈ defer, ΡΡΠΎΠ±Ρ ΠΎΠ½ΠΈ Π½Π΅ Π±Π»ΠΎΠΊΠΈΡΠΎΠ²Π°Π»ΠΈ Π·Π°Π³ΡΡΠ·ΠΊΡ ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ° ΡΡΡΠ°Π½ΠΈΡΡ. ΠΡΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ΄Π΅Π»Π°ΡΡ, Π΄ΠΎΠ±Π°Π²ΠΈΠ² Π°ΡΡΠΈΠ±ΡΡ async Π² ΡΠ΅Π³ <script>:
<script async src="analytics.js"></script>
ΠΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΡ ΡΡΠΈΡΡΠΎΠ²
ΠΠΎΠΏΡΡΡΠΈΠΌ, ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡ ΠΊΠ°ΡΡΠΎΠΌΠ½ΡΠ΅ ΡΡΠΈΡΡΡ Π½Π° ΡΠ²ΠΎΡΠΌ ΡΠ°ΠΉΡΠ΅. Π§ΡΠΎΠ±Ρ ΠΌΠΈΠ½ΠΈΠΌΠΈΠ·ΠΈΡΠΎΠ²Π°ΡΡ Π·Π°Π΄Π΅ΡΠΆΠΊΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΡΠ΅ΠΊΡΡΠ°, ΡΡ ΠΌΠΎΠΆΠ΅ΡΡ ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎ Π·Π°Π³ΡΡΠ·ΠΈΡΡ ΡΡΠΈΡΡΡ ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ font-display: swap;, ΡΡΠΎΠ±Ρ ΡΠ΅ΠΊΡΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π»ΡΡ ΡΡΠ°Π·Ρ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ ΡΠΈΡΡΠ΅ΠΌΠ½ΡΠΉ ΡΡΠΈΡΡ, ΠΏΠΎΠΊΠ° Π½Π΅ Π·Π°Π³ΡΡΠ·ΠΈΡΡΡ ΠΊΠ°ΡΡΠΎΠΌΠ½ΡΠΉ.
@font-face {
font-family: 'MyCustomFont';
src: url('mycustomfont.woff2') format('woff2');
font-display: swap;
}
ΠΡΠΈ ΠΏΠΎΠ΄Ρ ΠΎΠ΄Ρ ΠΏΠΎΠΌΠΎΠ³ΡΡ ΡΡΠΊΠΎΡΠΈΡΡ Π·Π°Π³ΡΡΠ·ΠΊΡ ΡΠ²ΠΎΠ΅Π³ΠΎ ΡΠ°ΠΉΡΠ°, ΡΠ»ΡΡΡΠ°Ρ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΠ΅ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ Ρ Π½ΠΈΠΌ ΠΈ ΠΏΠΎΠ²ΡΡΠ°Ρ ΡΠ²ΠΎΠΈ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ Π² ΠΏΠΎΠΈΡΠΊΠΎΠ²ΠΎΠΉ Π²ΡΠ΄Π°ΡΠ΅.