JavaScript로 로드된 이미지, 인덱싱 가능할까?
Google의 Martin Splitt은 JavaScript로 로드된 이미지가 적절히 설정된 경우 인덱싱될 수 있다고 밝혔습니다. 이는 JavaScript를 사용해 이미지를 로드하는 방식 자체가 인덱싱 문제의 원인이 아니라는 점을 강조한 것입니다.
JavaScript 이미지 인덱싱 문제의 주요 원인
만약 JavaScript로 로드된 이미지가 검색 결과에 나타나지 않는다면 아래와 같은 원인이 있을 수 있습니다.
- XML 사이트맵에 주요 이미지가 누락됨
- 이미지 파일의 HTTP 헤더 설정이 인덱싱을 방해함
- Google이 JavaScript 실행 후 확인하는 HTML에 이미지가 포함되지 않음
이러한 문제를 진단하려면 Google Search Console의 URL 검사 도구를 활용하는 것이 필요합니다. 해당 도구를 통해 렌더링된 HTML 내에 이미지를 확인할 수 있습니다. 만약 여기에 이미지가 포함되지 않았다면, 이는 문제가 발생했음을 보여줍니다.
다양한 JavaScript 이미지 로드 방식
이미지를 JavaScript로 로드하는 방법은 여러 가지가 존재하며, 올바르게 설정할 경우 Google의 인덱싱 시스템과 호환됩니다. 자주 사용되는 방법에는 다음이 포함됩니다.
- 지연 로딩(lazy loading)
- 점진적 로딩(progressive loading)
- 무한 스크롤 로딩(infinite scroll loading)
- 배경 이미지 삽입(background image insertion)
이와 같은 방식은 웹사이트 성능 최적화와 유저 경험 향상에서도 중요하게 사용됩니다.
JavaScript 이미지 SEO 최적화 팁
JavaScript로 로드된 이미지를 검색 엔진에 최적화하려면 아래의 전략을 따르는 것이 중요합니다.
- 렌더링된 HTML 확인
Search Console의 URL 검사 도구를 활용해 JavaScript 실행 후 결과물에 이미지가 포함되어 있는지 점검하세요. - XML 사이트맵 업데이트
사이트맵에 주요 이미지를 명확히 포함해야 합니다. - 명확한 alt 텍스트 제공
JavaScript로 로드되는 이미지에도 명확하고 적절한 alt 속성을 추가해야 합니다.
현대 웹사이트 개발에서의 시사점
SEO 전문가들이 JavaScript 환경에서 이미지 인덱싱 문제를 정확히 이해하고 대응한다면, 검색 엔진에서의 가시성을 향상시키는 데 유리합니다. 이를 통해 JavaScript를 사용하는 현대적인 웹사이트에서도 이미지 인덱싱에 대한 부담을 줄이고 성능 향상에 집중할 수 있을 것입니다.
출처 : 원문 보러가기
