[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/conv/ - Conversion Rate

CRO techniques, A/B testing & landing page optimization
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1788658895384.jpg (166.98 KB, 1024x1024, img_1788658855501_u8h0cb07.jpg)ImgOps Exif Google Yandex

22394 No.2113

flickering text during page load kills the user experience and can mess up your analytics tracking. you can use this specific css property to ensure the browser reserves the correct space for your custom webfonts.
font-display: swap;

this tells the browser to show a fallback font immediately and then swap it out once the custom one is ready. it won't stop all shifts, but it prevents invisible text. applying this to your @font-face declaration is a simple way to stabilize your cls scores.

22394 No.2114

File: 1788659044499.jpg (303.18 KB, 1024x1024, img_1788659028965_ovioowla.jpg)ImgOps Exif Google Yandex

>>2113
had this same issue on a client's landing page where the hero text kept jumping around. i started using
size-adjust
alongside swap to match the fallback metrics more closely and it helped a ton



[Return] [Go to top] Catalog [Post a Reply]
Delete Post [ ]
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">