링크 미리보기에 대표이미지가 안 뜰 때 | og:image부터 확인해봤습니다

워드프레스 대표이미지가 링크 미리보기에 나타나지 않아 og:image와 Google Search Console 색인 상태를 확인하는 모습을 표현한 이미지

작성자

카테고리:

블로그 글을 발행한 뒤 링크를 공유했는데 대표이미지가 보이지 않을 때가 있습니다.

워드프레스 안에서는 분명히 대표이미지가 정상적으로 등록돼 있습니다.

본문에서도 잘 보입니다.

그런데 링크를 공유하면 제목과 설명만 나오고 이미지가 빠져 있었습니다.

처음에는 이런 생각이 들었습니다.

“대표이미지를 잘못 등록했나?”

그런데 직접 확인해보니 블로그 안에서 보이는 대표이미지와 다른 사이트에서 링크를 공유할 때 사용하는 이미지는 확인해야 할 부분이 조금 달랐습니다.

이번에는 제가 직접 겪은 링크 미리보기 이미지 문제를 확인하면서 알게 된 내용을 기록해보려고 합니다.

그리고 이 문제를 확인하다 보니 자연스럽게 Google Search Console에서 글이 정상적으로 색인될 수 있는지도 함께 살펴보게 됐습니다.

대표이미지는 있는데 공유 화면에는 안 보였습니다

이번에도 워드프레스 글을 하나 발행했습니다.

제목도 정상이고,

대표이미지도 등록했고,

실제 블로그 화면에서도 아무 문제가 없었습니다.

그런데 링크 미리보기를 확인해보니 이미지가 나타나지 않았습니다.

처음에는 이미지 파일 자체가 문제라고 생각했습니다.

하지만 페이지를 확인해보니 문제는 대표이미지가 없는 것이 아니라 외부 서비스에서 그 이미지를 어떻게 읽어가느냐와 관련돼 있었습니다.

여기서 처음 제대로 보게 된 것이

og:image

였습니다.

og:image가 무엇인지부터 알아봤습니다

처음에는 영어와 코드가 나오니 어렵게 느껴졌습니다.

하지만 의미는 생각보다 단순했습니다.

블로그 주소를 Threads나 다른 서비스에 공유하면 상대 서비스가 그 페이지를 읽으면서

제목은 무엇인지,

설명은 무엇인지,

대표로 보여줄 이미지는 무엇인지

확인합니다.

이때 공유용 이미지 정보를 전달하는 데 사용되는 것이 og:image입니다.

저처럼 처음 블로그를 운영하는 사람 입장에서는

“이 링크를 공유할 때 이 이미지를 보여주세요.”

라고 알려주는 표시 정도로 이해하면 충분했습니다.

공유 디버거에서 직접 확인해봤습니다

이번에는 링크를 공유하는 데서 끝내지 않고 디버거를 이용해 직접 확인해봤습니다.

페이지 자체는 정상적으로 열리고 있었고 응답 코드도 정상으로 표시됐습니다.

제목과 설명도 읽어가고 있었습니다.

그런데 이미지 쪽에는 경고가 나타났습니다.

og:image는 있었지만 새로운 이미지가 비동기 방식으로 처리되기 때문에 이미지 크기 정보가 함께 있으면 좋다는 내용이었습니다.

이런 화면을 직접 보고 나니 막연하게

“왜 이미지가 안 나오지?”

라고 생각하는 것과는 달랐습니다.

어디까지는 정상이고 어느 부분에서 문제가 생겼는지 조금씩 구분할 수 있었습니다.

여기서 중요한 것을 하나 알게 됐습니다

처음에는 대표이미지가 공유 화면에 안 나오면 Google 색인에도 문제가 생기는 것 아닐까 걱정했습니다.

그런데 두 문제는 구분해서 볼 필요가 있었습니다.

og:image는 주로 링크를 공유할 때 어떤 이미지를 보여줄지 알려주는 정보입니다.

반면 Google Search Console의 색인 생성은 Google이 해당 페이지를 크롤링할 수 있는지, 색인을 막는 설정이 없는지, 어떤 URL을 표준 페이지로 판단하는지 등을 확인합니다.

즉,

공유 이미지가 안 나온다고 해서 곧바로 Google 색인이 안 된다는 뜻은 아니었습니다.

이것을 구분하니 문제를 훨씬 편하게 볼 수 있었습니다.

Google Search Console에서는 이것부터 확인합니다

새 글을 발행한 뒤에는 Search Console의 URL 검사에서 해당 글 주소를 확인할 수 있습니다.

Google 공식 안내에 따르면 URL 검사에서는

Google이 페이지에 접근할 수 있는지,

색인 생성을 막는 설정이 있는지,

어떤 표준 URL을 선택했는지,

현재 Google 색인에 등록돼 있는지

등을 확인할 수 있습니다.

제가 가장 먼저 확인하는 것은 복잡한 SEO 점수가 아닙니다.

페이지가 실제로 열리는지

Google이 크롤링할 수 있는지

색인을 막는 noindex가 없는지

부터 봅니다.

이 기본적인 부분에 문제가 있다면 아무리 글을 잘 써도 검색에 나타나기 어렵기 때문입니다.

‘URL을 Google에 등록할 수 있음’이 먼저입니다

새 글을 검사하면 아직 Google에 등록되지 않은 경우가 있습니다.

이럴 때 중요한 것은 먼저 실시간 URL 테스트에서 색인 생성이 가능한 상태인지 확인하는 것입니다.

Google에서는 페이지가 차단돼 있지 않고 즉각적인 색인 생성 오류가 없다면 색인 생성을 요청할 수 있다고 안내하고 있습니다.

저는 이 상태를 확인한 뒤 문제가 없다면 색인 생성 요청을 합니다.

하지만 여기서도 한 가지는 기억하려고 합니다.

색인 생성 요청 버튼을 눌렀다고 바로 Google 검색에 나오는 것은 아닙니다.

Google도 색인 생성에는 일반적으로 시간이 걸릴 수 있고, 요청한다고 해서 반드시 색인된다고 보장하지 않는다고 설명합니다.

그래서 요청한 뒤에는 조금 기다립니다.

녹색이 됐다고 검색 상위에 뜨는 것은 아니었습니다

Search Console에서 가장 반가운 화면은 역시

“URL이 Google에 등록되어 있음”

이라는 상태입니다.

저도 처음에는 이 녹색 표시가 나오면 곧바로 Google 검색에서 잘 노출되는 줄 알았습니다.

하지만 의미는 조금 달랐습니다.

Google 공식 설명을 보면 이 상태는 해당 URL이 색인되어 검색결과에 표시될 수 있다는 뜻이지 실제 검색 결과 노출이나 높은 순위를 보장한다는 뜻은 아닙니다.

즉,

색인 생성은 출발선이고 검색 노출은 그다음 문제였습니다.

이 차이를 알고 나니 Search Console의 녹색 표시만 쫓는 것도 조금 달리 보이기 시작했습니다.

그래서 글 자체도 다시 보게 됐습니다

Google에 색인되기 위한 기술적인 조건도 중요하지만, 결국 검색에서 오래 살아남으려면 글 자체가 필요합니다.

요즘 저는 이미 인터넷에 많이 있는 내용을 다시 정리하는 것보다 제가 직접 겪은 일을 먼저 쓰려고 합니다.

이번 글도 마찬가지입니다.

og:image가 무엇인지 설명하는 것만으로 끝내면 인터넷에 비슷한 글이 많습니다.

하지만

대표이미지를 넣었는데 미리보기에 나오지 않았던 실제 상황

디버거에서 경고를 직접 확인한 과정

공유 이미지 문제와 Google 색인 문제를 처음에는 같은 것으로 생각했던 경험

이 들어가면 제 기록이 됩니다.

이런 부분이 제가 앞으로 올리버 AI노트에서 계속 가져가고 싶은 방향입니다.

새 글을 발행하면 저는 이렇게 확인합니다

이번 일을 겪고 나서 새 글을 발행한 뒤 확인할 순서도 조금 더 분명해졌습니다.

먼저 실제 블로그 글이 정상적으로 열리는지 봅니다.

대표이미지가 제대로 보이는지 확인합니다.

공유 링크에서 이미지가 잘 나타나는지도 확인합니다.

그다음 Search Console에서 URL을 검사합니다.

실시간 테스트에서 Google이 페이지에 접근할 수 있는지 확인하고,

문제가 없다면 필요할 때 색인 생성을 요청합니다.

그리고 기다립니다.

검색 결과에 바로 보이지 않는다고 제목과 본문을 계속 바꾸지는 않으려고 합니다.

내부 링크도 하나씩 연결해보려고 합니다

최근 글이 늘어나면서 이전 글과 새로운 글이 서로 연결되는 경우도 많아졌습니다.

예를 들어 이번 글을 읽는 사람이라면

‘내 글이 구글 검색에 등록됐을까? | 초보자가 확인하는 방법’

같은 이전 글도 궁금할 수 있습니다.

그래서 관련 있는 글끼리는 자연스럽게 내부 링크로 연결해보려고 합니다.

이렇게 하면 독자 입장에서도 필요한 다음 글을 찾기 쉽고, 저 역시 각각 떨어져 있던 글을 하나의 흐름으로 만들 수 있습니다.

단순히 글 수를 늘리는 것보다 관련 글끼리 연결하는 작업도 앞으로 조금 더 신경 써보려고 합니다.

이미지에는 대체 텍스트도 빠뜨리지 않으려고 합니다

대표이미지를 등록할 때 대체 텍스트도 작성합니다.

이미지가 무엇을 표현하는지 짧고 구체적으로 적습니다.

이번 글이라면

“워드프레스 대표이미지가 링크 미리보기에 나타나지 않아 og:image와 Search Console 상태를 확인하는 모습”

처럼 글 내용과 이미지가 어떤 관계인지 알 수 있도록 적을 수 있습니다.

검색 노출을 위해 키워드를 억지로 반복하기보다 이미지를 실제로 설명하는 문장으로 쓰려고 합니다.

결국 두 가지 문제를 따로 봐야 했습니다

이번 경험을 통해 가장 크게 알게 된 것은 이것입니다.

링크 미리보기 문제와 Google 색인 문제는 같은 문제가 아니었습니다.

대표이미지가 공유 화면에 나오지 않으면 og:image와 소셜미디어 설정을 확인합니다.

Google 검색에 글이 등록되지 않는다면 Search Console에서 크롤링과 색인 상태를 확인합니다.

처음에는 모두

“내 블로그가 잘못됐나?”

라고 생각했지만, 하나씩 나눠보니 확인할 곳이 달랐습니다.

블로그를 운영하다 보면 모르는 영어와 낯선 설정이 계속 나옵니다.

예전 같으면 어렵다고 넘어갔을 수도 있습니다.

지금은 화면을 캡처하고,

하나씩 뜻을 알아보고,

실제로 바꿔보면서 기록합니다.

이번 og:image 문제도 그렇게 하나의 글이 됐습니다.

그리고 앞으로 이 글이 Search Console에서 언제 색인 생성됨으로 바뀌는지도 직접 확인해보려고 합니다.

코멘트

답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다