Google 이미지 검색엔진 최적화 권장사항

Google 이미지를 사용하면 웹상의 정보를 시각적으로 찾을 수 있습니다. 사용자는 이미지 캡션과 눈에 잘 띄는 배지와 같은 새로운 기능을 이용하여 이미지에 관한 더 자세한 맥락과 함께 정보를 빠르게 살펴볼 수 있습니다.

이미지에 관한 맥락을 추가하면 검색결과가 더욱 유용해지므로 사이트로 양질의 트래픽을 유도할 수 있습니다. 예를 들어 이미지 또는 구조화된 데이터 마크업에 alt를 사용하는 등 이미지와 사이트를 Google 이미지에 최적화하면 사용자가 더 쉽게 발견할 수 있습니다. 가이드라인에 따라 Google 이미지 검색결과에 콘텐츠가 표시될 가능성을 높이세요.

사용자 환경 개선하기

Google 이미지에서 콘텐츠의 검색 가능성을 높이려면 사용자에게 중점을 두고 만족스러운 사용자 환경을 제공하세요. 이렇게 하려면 검색엔진이 아닌 사용자를 위한 페이지를 만들어야 합니다. 이때 다음 도움말을 참고하세요.

적절한 맥락 제공: 시각적 콘텐츠는 페이지 주제와 관련되어야 합니다. 페이지에 독창적인 가치를 더하는 곳에만 이미지를 표시하는 것이 좋습니다. 특히 이미지와 텍스트가 모두 원본 콘텐츠가 아닌 페이지는 권장하지 않습니다.
게재위치 최적화: 가능한 경우 이미지를 관련성 있는 텍스트 근처에 배치합니다. 적절하다고 생각되는 경우, 가장 중요한 이미지를 페이지 상단에 배치해 보세요.
이미지 내에 중요한 텍스트 삽입하지 않기: 특히 페이지 제목과 메뉴 항목과 같이 중요한 텍스트 요소는 이미지에 삽입하지 않습니다. 이미지에 삽입된 텍스트 요소는 일부 사용자가 액세스할 수 없으며, 이미지에는 페이지 번역 도구가 작동하지 않기 때문입니다. 콘텐츠의 접근성을 최대화하려면 텍스트를 HTML 형식으로 유지하고 이미지의 대체 텍스트를 제공하세요.
유익한 고품질 사이트 만들기: 웹페이지 콘텐츠의 품질은 Google 이미지의 시각 콘텐츠만큼 중요합니다. 고품질 콘텐츠는 맥락을 제공하고 결과를 더욱 실용적으로 만들어 주기 때문입니다. 페이지 콘텐츠를 사용하여 이미지의 텍스트 스니펫을 만들 수 있으며, Google에서는 페이지 콘텐츠의 품질을 고려하여 이미지 순위를 결정합니다.
기기 친화적 사이트 만들기: 데스크톱보다는 모바일에서 Google 이미지를 검색하는 사용자가 많습니다. 따라서 모든 기기 유형과 크기에 맞게 사이트를 디자인하는 것이 중요합니다. 모바일 친화성 테스트를 사용하면 페이지가 휴대기기에서 제대로 작동하는지 테스트하고 수정이 필요한 부분에 관해 피드백을 받을 수 있습니다.
이미지에 적합한 URL 구조 만들기: Google에서는 URL 경로 및 파일 이름을 사용하여 이미지를 파악합니다. 이미지 콘텐츠를 정리하여 URL을 논리적인 방식으로 구성해 보세요.

페이지 제목 및 설명 확인하기

Google 이미지는 각 검색결과를 가장 효과적으로 설명하고 사용자 검색어와 검색결과의 연관성을 보여 주는 제목 링크와 스니펫을 자동 생성합니다. 이렇게 하면 사용자가 검색결과를 클릭할지 결정하는 데 도움이 됩니다. 다음은 Google 검색결과 페이지에서 제목 링크와 스니펫이 어떻게 표시되는지 보여주는 예입니다.

Google에서는 각 페이지의 제목과 meta 태그에 포함된 설명 정보 등의 다양한 소스를 사용하여 이러한 정보를 생성합니다.

Google의 제목 및 스니펫 가이드라인을 따르면 페이지를 설명하는 제목 링크 및 스니펫의 품질을 향상시킬 수 있습니다.

구조화된 데이터 추가

구조화된 데이터를 추가하면 Google 이미지에서 이미지를 눈에 잘 띄는 배지와 같은 리치 결과로 표시할 수 있습니다. 이렇게 하면 사용자에게 페이지에 관해 유용한 정보를 제공하고, 더욱 효과적으로 타겟팅된 트래픽을 사이트로 유도할 수 있습니다. Google 이미지에서는 다음 유형의 정보와 관련된 구조화된 데이터를 지원합니다.

구조화된 데이터에 관한 일반적인 가이드라인 및 사용 중인 구조화된 데이터에 해당하는 가이드라인을 준수하세요. 그러지 않으면 구조화된 데이터가 Google 이미지에 리치 결과로 표시되지 못할 수도 있습니다. Google 이미지에서 배지 및 리치 결과를 표시하려면 각 구조화된 데이터 유형에 이미지 속성이 있어야 합니다. 다음은 Google 이미지에서 리치 결과가 표시되는 방식을 보여주는 두 가지 예입니다.

속도 최적화하기

이미지는 전체 페이지 크기를 결정하는 가장 큰 요인으로, 이미지로 인해 페이지가 느려지고 로드 비용이 높아질 수 있습니다. 속도가 빠른 양질의 사용자 환경을 제공하려면 최신 이미지 최적화 및 반응형 이미지 기술을 사용하세요.

PageSpeed Insights로 사이트 속도를 분석하고 속도가 중요한 이유를 방문하여 웹사이트 성능을 향상하기 위한 권장사항과 기술을 알아보세요.

고화질 사진 추가하기

고화질 사진은 흐리고 선명하지 않은 이미지보다 사용자에게 매력적으로 다가갑니다. 또한 선명한 이미지는 검색결과 썸네일 이미지에서 사용자에게 더 매력적으로 보이므로 사용자의 트래픽을 유도할 가능성이 높습니다.

이미지에 구체적인 제목, 설명, 파일 이름, 텍스트 추가하기

Google에서는 캡션 및 이미지 제목을 비롯한 페이지 콘텐츠에서 이미지 주제에 관한 정보를 추출합니다. 가능한 경우 이미지를 관련 텍스트 근처와 이미지 주제와 관련 있는 페이지에 배치하세요.

파일 이름도 마찬가지로 Google에서 이미지 주제를 파악하는 데 도움이 됩니다. 가능한 경우 짧지만 충분한 설명이 담긴 파일 이름을 사용하세요. 예를 들어 my-new-black-kitten.jpg이 IMG00023.JPG보다 더 좋습니다. 가능한 경우 image1.jpg, pic.gif, 1.jpg와 같은 일반적인 파일 이름은 사용하지 마세요. 사이트에 수천 개의 이미지가 있으면 이미지의 이름을 자동 지정하는 것이 좋습니다.

이미지를 현지화하는 경우 파일 이름도 번역해야 합니다. 라틴어 이외의 문자 또는 특수문자를 사용하는 경우 URL 인코딩 가이드라인을 준수하세요.

`alt` 속성에 구체적인 대체 텍스트 사용하기

이미지를 설명하는 대체 텍스트는 스크린 리더를 사용하는 사용자나 저대역폭 연결을 사용하는 사용자 등 웹페이지의 이미지를 볼 수 없는 사용자의 접근성을 개선합니다.

Google은 대체 텍스트와 함께 컴퓨터 비전 알고리즘과 페이지 콘텐츠를 사용하여 이미지의 주제를 파악합니다. 또한 이미지의 대체 텍스트는 이미지를 링크로 사용할 때 앵커 텍스트로 활용할 수 있습니다.

대체 텍스트를 작성할 때는 키워드를 적절히 사용하고 페이지 콘텐츠의 맥락에 맞는 유용하고 정보가 풍부한 콘텐츠를 만드는 데 중점을 두세요. alt 속성을 키워드로 채우는 것(유인 키워드 반복)은 좋지 않습니다. 사용자 환경에 악영향을 미치고 스팸 사이트로 간주될 수 있기 때문입니다.

나쁜 예(대체 텍스트 누락됨):

<img src="puppy.jpg"/>

나쁜 예(유인 키워드 반복):

<img src="puppy.jpg" alt="강아지 개 아기 강아지 멍멍이 애완견 새끼 강아지 리트리버 래브라도 울프하운드 세터 포인터 강아지 잭 러셀 테리어 강아지 개 사료 저렴한 개 사료 강아지 먹이"/>

좋은 예:

<img src="puppy.jpg" alt="강아지"/>

가장 좋은 예:

<img src="puppy.jpg" alt="가져오기 놀이를 하는 새끼 달마시안"/>

또한 W3 가이드라인에 따라 대체 텍스트의 접근성을 고려합니다. <img> 요소의 경우 요소의 alt 속성을 추가할 수 있고 인라인 <svg> 요소에는 <title> 요소를 사용할 수 있습니다. 예를 들어 다음과 같습니다.

<svg aria-labelledby="svgtitle1">
  <title id="svgtitle1">Googlebot wearing an apron and chef hat, struggling to make pancakes on the stovetop</title>
</svg>

접근성을 검사하고 느린 네트워크 연결 에뮬레이터를 사용하여 콘텐츠를 테스트하는 것이 좋습니다.

Google에서 이미지를 찾을 수 있도록 돕기

HTML 이미지 요소를 사용하여 이미지 삽입하기

시맨틱 HTML 마크업을 사용하면 크롤러가 이미지를 찾고 처리할 수 있습니다. Google에서는 HTML <img> 요소(<picture> 요소와 같은 다른 요소에 포함된 경우에도)를 파싱하여 이미지의 색인을 생성하지만 CSS 이미지의 색인을 생성하지는 않습니다.

좋은 예:

<img src="puppy.jpg" alt="골든 리트리버 강아지" />

나쁜 예:

<div style="background-image:url(puppy.jpg)">골든 리트리버 강아지</div>

이미지 사이트맵 사용하기

이미지 사이트맵을 제출하여 Google이 다른 방법으로는 발견하지 못할 수도 있는 이미지의 URL을 제공하세요.

이미지 사이트맵에는 도메인 간 제한이 적용되는 일반 사이트맵과는 달리 다른 도메인의 URL을 포함할 수 있습니다. 따라서 콘텐츠 전송 네트워크(CDN)를 사용하여 이미지를 호스팅할 수 있습니다. CDN을 사용하는 경우 Google에서 알려 드릴 수 있도록 Search Console에서 CDN 도메인 이름의 소유자를 확인하세요.

지원되는 이미지 형식 사용

Google 이미지는 BMP, GIF, JPEG, PNG, WebP, SVG 형식의 이미지를 지원합니다. 파일 이름 확장자를 파일 형식과 일치시키는 것도 좋습니다.

이미지를 데이터 URI의 형식으로 인라인으로 삽입할 수도 있습니다. 데이터 URI를 사용하면 이미지와 같은 파일을 인라인으로 삽입할 수 있습니다. 다음 형식을 사용해 img 요소의 src 속성을 Base64로 인코딩된 문자열로 설정하세요.

<img src="data:image/svg+xml;base64,[data]">

이미지를 인라인으로 삽입하면 HTTP 요청이 줄어들 수 있지만 페이지의 크기가 상당히 늘어날 수 있으므로 이를 신중하게 판단하여 사용합니다. 자세한 정보는 web.dev 페이지에서 인라인 이미지의 장점과 단점을 확인하세요.

반응형 이미지

반응형 웹페이지를 설계하면 사용자가 다양한 기기 유형에서 웹페이지를 사용할 수 있으므로 더 나은 사용자 환경을 제공합니다. 웹사이트에서 이미지를 처리하기 위한 권장사항은 반응형 이미지 가이드에서 확인하세요.

웹페이지는 img 요소의 <picture> 요소 또는 srcset 속성을 사용하여 반응형 이미지를 지정합니다. 그러나 일부 브라우저와 크롤러는 이러한 속성을 인식하지 못합니다. 항상 src 속성을 사용해 대체 URL을 지정하는 것이 좋습니다.

srcset 속성을 사용하면 화면 크기별로 같은 이미지의 서로 다른 버전을 지정할 수 있습니다.

예: <img srcset>

<img
  srcset="maine-coon-nap-320w.jpg 320w, maine-coon-nap-480w.jpg 480w, maine-coon-nap-800w.jpg 800w"
  sizes="(max-width: 320px) 280px, (max-width: 480px) 440px, 800px"
  src="maine-coon-nap-800w.jpg"
  alt="A watercolor illustration of a maine coon napping leisurely in front of a fireplace">

<picture> 요소는 같은 이미지의 서로 다른 <source> 버전을 그룹화하는 데 사용되는 컨테이너입니다. 이 요소는 대체 접근방식을 지원하므로 브라우저에서 픽셀 밀도, 화면 크기 등 기기 기능에 따라 적절한 이미지를 선택할 수 있습니다. picture 요소는 아직 새 형식을 지원하지 않을 수 있는 클라이언트를 위한 단계적 성능 저하 기능이 내장된 새 이미지 형식을 사용할 때도 유용합니다.

HTML 표준의 섹션 4.8.1에 따라 다음 형식을 사용하여 picture 요소를 사용할 때 대체용으로 img 요소를 src 속성과 함께 제공해야 합니다.

예: <picture>

<picture>
 <source type="image/svg+xml" srcset="pyramid.svg">
 <source type="image/webp" srcset="pyramid.webp">
 <img src="pyramid.png" alt="An 1800s oil painting of The Great Pyramid">
</picture>

세이프서치에 맞게 최적화하기

세이프서치는 Google 검색결과에 선정적인 이미지, 동영상, 웹사이트를 표시할지 차단할지 지정하는 Google 사용자 계정 설정입니다. Google에서 사이트의 특성을 파악하여 적절한 경우 사이트에 세이프서치 필터를 적용할 수 있도록 합니다. 세이프서치 페이지 라벨 지정에 관해 자세히 알아보기

Google 이미지 인라인 연결 선택 해제

원하는 경우 Google 이미지 검색결과에서 인라인 연결을 선택 해제하여 검색결과 페이지에 원본 크기의 이미지가 표시되지 않게 할 수 있습니다.

인라인 연결을 선택 해제하려면 다음 단계를 따르세요.

이미지가 요청되면 요청의 HTTP 리퍼러 헤더를 검사합니다.
Google 도메인에서 받은 요청이 있으면 내용 없이 200 HTTP 상태 코드 또는 204 HTTP 상태 코드를 포함하여 응답합니다.

Google에서는 여전히 페이지를 크롤링하고 이미지를 확인할 수 있지만 크롤링 시 검색결과에 생성된 미리보기 이미지를 표시합니다. 이 설정은 언제든지 선택 해제할 수 있으며 웹사이트 이미지를 다시 처리하지 않아도 됩니다. 이 동작은 이미지 클로킹으로 간주되지 않으며 직접 조치로 이어지지 않습니다.

이미지가 검색결과에 완전히 표시되지 않도록 차단할 수도 있습니다.

마지막으로...

검색결과 순위를 높이는 데 유용한 정보를 확인할 수 있는 SEO 기본 가이드를 읽어 보세요. 더 궁금한 점이 있다면 Google 검색 센터 도움말 커뮤니티에 게시해 주시기 바랍니다.