๐Ÿ“ŠCore Web Vitals ์ ์ˆ˜ ๊ณ„์‚ฐ๊ธฐ

LCP, FID, CLS ๊ฐ’์„ ์ž…๋ ฅํ•˜๋ฉด Core Web Vitals ์ข…ํ•ฉ ์ ์ˆ˜์™€ ๋“ฑ๊ธ‰์„ ๊ณ„์‚ฐํ•ฉ๋‹ˆ๋‹ค.

์ง€ํ‘œ๊ฐ’ํ‰๊ฐ€
LCP2.5์ดˆ-
FID100ms-
CLS0.1-

Core Web Vitals, ์™œ ์‹ ๊ฒฝ ์จ์•ผ ํ• ๊นŒ?

๊ตฌ๊ธ€์€ 2021๋…„๋ถ€ํ„ฐ LCP(๋กœ๋”ฉ), FID(์ƒํ˜ธ์ž‘์šฉ), CLS(๋ ˆ์ด์•„์›ƒ ์•ˆ์ •์„ฑ)๋กœ ๊ตฌ์„ฑ๋œ Core Web Vitals๋ฅผ ๊ฒ€์ƒ‰ ์ˆœ์œ„ ํ‰๊ฐ€ ์š”์†Œ๋กœ ๊ณต์‹ ๋ฐ˜์˜ํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. ์•„๋ฌด๋ฆฌ ์ฝ˜ํ…์ธ ๊ฐ€ ์ข‹์•„๋„ ํŽ˜์ด์ง€๊ฐ€ ๋А๋ฆฌ๊ฒŒ ๋œจ๊ฑฐ๋‚˜ ํด๋ฆญ ๋ฐ˜์‘์ด ๋Šฆ๊ณ  ํ™”๋ฉด์ด ๋œ์ปฅ๊ฑฐ๋ฆฐ๋‹ค๋ฉด ์‚ฌ์šฉ์ž๋Š” ๋ฌผ๋ก  ๊ฒ€์ƒ‰์—”์ง„๋„ ์‚ฌ์ดํŠธ๋ฅผ ๋‚ฎ๊ฒŒ ํ‰๊ฐ€ํ•ฉ๋‹ˆ๋‹ค.

์ด ๊ณ„์‚ฐ๊ธฐ๋Š” ์„ธ ๊ฐ€์ง€ ์ง€ํ‘œ๋ฅผ ์ž…๋ ฅํ•˜๋ฉด ๊ตฌ๊ธ€์˜ ์–‘ํ˜ธยท๊ฐœ์„  ํ•„์š”ยท๋‚˜์จ ๊ธฐ์ค€๊ฐ’๊ณผ ๋น„๊ตํ•ด 0~100์ ์˜ ์ข…ํ•ฉ ์ ์ˆ˜๋กœ ํ™˜์‚ฐํ•ด์ค๋‹ˆ๋‹ค. LCP๋Š” 2.5์ดˆ ์ดํ•˜, FID๋Š” 100ms ์ดํ•˜, CLS๋Š” 0.1 ์ดํ•˜์ผ ๋•Œ ๋งŒ์ ์— ๊ฐ€๊นŒ์šด ์ ์ˆ˜๋ฅผ ๋ฐ›์œผ๋ฉฐ, ๊ฐ ๊ธฐ์ค€์„ ์ดˆ๊ณผํ• ์ˆ˜๋ก ์ ์ˆ˜๊ฐ€ ์„ ํ˜•์ ์œผ๋กœ ๋‚ฎ์•„์ง‘๋‹ˆ๋‹ค.

์ ์ˆ˜๊ฐ€ ๋‚ฎ๊ฒŒ ๋‚˜์™”๋‹ค๋ฉด ์ด๋ฏธ์ง€ ์ตœ์ ํ™”, ๋ถˆํ•„์š”ํ•œ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์ œ๊ฑฐ, ํฐํŠธ ๋กœ๋”ฉ ์ „๋žต ๊ฐœ์„  ๋“ฑ์„ ์šฐ์„ ์ˆœ์œ„๋กœ ๊ฒ€ํ† ํ•ด๋ณด์„ธ์š”. ์‹ค์ œ ์‚ฌ์šฉ์ž ๋ฐ์ดํ„ฐ๋Š” ๊ตฌ๊ธ€ ์„œ์น˜ ์ฝ˜์†”์—์„œ๋„ ํ™•์ธํ•  ์ˆ˜ ์žˆ์œผ๋‹ˆ, ์ด ๋„๊ตฌ๋กœ ๋ชฉํ‘œ ์ˆ˜์น˜๋ฅผ ๊ฐ€๋Š ํ•œ ๋’ค ์‹ค์ธก๊ฐ’๊ณผ ๋น„๊ตํ•˜๋ฉฐ ๊ฐœ์„ ํ•ด๋‚˜๊ฐ€๋Š” ๊ฒƒ์„ ์ถ”์ฒœํ•ฉ๋‹ˆ๋‹ค.

์ž์ฃผ ๋ฌป๋Š” ์งˆ๋ฌธ

Core Web Vitals ์ ์ˆ˜๋Š” ์–ด๋–ป๊ฒŒ ๊ณ„์‚ฐ๋˜๋‚˜์š”?

LCP, FID, CLS ๊ฐ๊ฐ์„ ๊ตฌ๊ธ€์ด ์ •ํ•œ ์–‘ํ˜ธยท๋ถˆ๋Ÿ‰ ๊ธฐ์ค€๊ฐ’๊ณผ ๋น„๊ตํ•ด 0~100์ ์œผ๋กœ ํ™˜์‚ฐํ•œ ๋’ค ํ‰๊ท ์„ ๋‚ด์–ด ์ข…ํ•ฉ ์ ์ˆ˜๋ฅผ ์‚ฐ์ถœํ•ฉ๋‹ˆ๋‹ค.

๋ช‡ ์  ์ด์ƒ์ด๋ฉด ์•ˆ์ „ํ•œ๊ฐ€์š”?

90์  ์ด์ƒ์ด๋ฉด ์ข‹์Œ, 50~89์ ์€ ๊ฐœ์„  ํ•„์š”, 50์  ๋ฏธ๋งŒ์€ ๋‚˜์จ์œผ๋กœ ๋ถ„๋ฅ˜๋ฉ๋‹ˆ๋‹ค. 90์  ์ด์ƒ์„ ๋ชฉํ‘œ๋กœ ์ตœ์ ํ™”ํ•˜๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค.

์‹ค์ œ ์ธก์ •๊ฐ’์€ ์–ด๋””์„œ ํ™•์ธํ•˜๋‚˜์š”?

๊ตฌ๊ธ€ ์„œ์น˜ ์ฝ˜์†”์˜ Core Web Vitals ๋ฆฌํฌํŠธ๋‚˜ PageSpeed Insights, Chrome DevTools์˜ Lighthouse ํƒญ์—์„œ ์‹ค์ œ ์ธก์ •๊ฐ’์„ ํ™•์ธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.