PSI 점수 블로그 되살리기 파트 2 - CLS(Cumulative Layout Shift) 개선편

워플 호스팅에서는 관리를 맡은 블로그들의 PSI에 대한 지속적인 점수 관리를 하고 있습니다. 8mtree.com의 경우 당시 CLS 문제가 있었고, Search Console에서 색인 제외된 URL도 확인된 사례였습니다. 두 현상이 동시에 있었지만 색인 제외 원인을 CLS 하나로 단정할 수는 없습니다.

워플 호스팅으로 들어온 후 전반적인 홈페이지 디자인을 손봤고, 그 결과 당시 0개에 머물렀던 GOOD URL의 개수가 58개까지 늘었고, 구글 자연 검색 유입도 확인했습니다. :)

페이지 경험을 개선하는 것은 독자에게 중요합니다. 코어 웹 바이탈과 검색의 관계도 함께 참고해 주세요. 다만 이 사례만으로 점수 개선이 색인이나 유입 변화의 단독 원인이었다고 말할 수는 없습니다.

CLS를 확인할 때의 순서

CLS(Cumulative Layout Shift)는 페이지를 읽는 동안 화면 요소가 예상치 않게 움직이는 정도를 나타냅니다. Google의 ‘좋음’ 기준은 0.1 미만입니다. 먼저 PageSpeed Insights에서 문제가 보이는 페이지를 확인하고, Search Console의 코어 웹 바이탈 보고서에서 실제 사용자 데이터에 해당 문제가 쌓였는지 함께 보세요. 실험실 테스트 한 번의 점수와 실제 사용자 데이터는 다를 수 있습니다.

화면이 흔들린다면 크기가 지정되지 않은 이미지, 뒤늦게 나타나는 광고·동영상 삽입 영역, 웹 글꼴을 먼저 살펴보세요. 이미지에는 크기 또는 종횡비를 지정하고, 광고와 삽입 콘텐츠에는 표시될 자리를 미리 확보하는 방법이 있습니다. 수정 후 같은 URL을 다시 측정하고 모바일에서도 확인하세요.

CLS 개선은 방문자의 읽기 경험에 도움이 됩니다. 다만 CLS 수치만으로 색인 제외의 원인을 판단하거나 검색 유입 증가를 보장할 수는 없습니다. 색인 문제는 Search Console의 URL 검사에서 크롤링, 색인 허용 여부, 선택된 표준 URL을 따로 확인해야 합니다. 서버와 호스팅의 역할이 헷갈린다면 워드프레스 기본 용어 정리부터 읽어보세요.