블로그 전체 글에 OGP 아티클 메타 태그 추가해 SEO 신선도 신호 확보

Post.astro 레이아웃에 article:* 메타 태그 풀세트를 밀어 넣었다.

왜 이걸 지금 했냐

블로그 글을 SNS에 공유하면 og:title, og:description 정도는 붙어서 카드가 그럭저럭 나왔는데, 정작 검색 엔진이나 구조화 데이터 크롤러 입장에서는 "이 글이 언제 쓰였는지", "마지막으로 수정된 게 언제인지", "누가 썼는지", "어떤 태그가 달렸는지"를 전혀 몰랐다. article:published_time 없이 그냥 긁어가면 크롤러 입장에서는 날짜 없는 콘텐츠 취급이다. 신선도 신호가 없으니 SEO 점수에서 불필요하게 손해 보는 구조였음.

og:type을 article로 선언해 놓고 실제 article:* 프로퍼티를 안 넣는 건 반쪽짜리 선언이나 마찬가지다. Facebook Open Graph 스펙이나 여러 크롤러들이 og:type = article이면 하위 프로퍼티까지 기대하는데, 그걸 비워놓으면 "선언은 했지만 정보는 없음" 상태가 된다.

뭘 박았는지

Post.astro에 추가한 메타 태그 구성은 아래와 같다.

코드로 보면 이런 패턴이다.

---
const { published, modified, author, tags } = Astro.props;
---

<meta property="article:published_time" content={published} />
<meta property="article:modified_time" content={modified ?? published} />
<meta property="article:author" content={author} />
{tags?.map(tag => (
  <meta property="article:tag" content={tag} />
))}

article:tag는 스펙상 여러 개 허용이라서 map으로 풀어서 반복 출력하는 게 맞다. 하나로 합쳐서 콤마 구분으로 넣는 실수를 종종 보는데, 그렇게 하면 크롤러가 통째로 하나의 태그로 읽어간다.

modified가 없는 경우 published로 폴백하는 것도 챙겼다. 글을 한 번 쓰고 수정한 적 없으면 modified_time을 아예 안 넣거나 빈 값으로 두는 경우가 있는데, 그것보단 published와 동일 값으로 채워두는 편이 크롤러 친화적이다.

이 작업 하면서 챙긴 것들

• Post.astro만 수정 — 레이아웃 레벨에서 한 번에 처리하니 개별 글 파일은 손댈 필요 없었다. 프론트매터에 published, modified, tags 필드가 이미 있던 구조라서 연결이 깔끔했음
• 날짜 포맷 통일 — Date 객체를 그대로 넣으면 크롤러마다 파싱 결과가 달라질 수 있어서 .toISOString() 으로 고정
• author 값 형식 — 이름 문자열 vs URL 두 가지 모두 스펙상 허용이지만, 프로필 URL을 넣는 쪽이 구조화 데이터 연결 측면에서 낫다. 지금은 일단 이름 문자열로 처리, 나중에 schema.org Person 타입이랑 연결할 여지 남겨둠

변경 파일이 Post.astro 하나뿐인 핀포인트 작업이었지만, 영향 범위는 블로그 전체 글이다. 레이아웃 수정 하나가 전체 페이지에 동시 반영되는 구조여서 오히려 이런 메타 태그 작업은 레이아웃 레벨에서 처리하는 게 맞다. 글마다 직접 박으면 나중에 수정할 때 고통이 배가 된다.

SEO 관련 작업은 "지금 당장 드라마틱한 변화"가 없어서 우선순위가 계속 밀리는 경향이 있다. 근데 검색 엔진 신뢰도나 리치 결과 노출 같은 건 지금 심어놔야 몇 달 뒤에 효과가 나오는 장기 투자라서, 미루면 미룰수록 손해다. 이번에 작업하면서 다시 그걸 체감했음.

다음은 schema.org JSON-LD 블록이 타겟.

🛒 이 글과 어울리는 추천 상품

• 기계식키보드 쿠팡에서 보기 →
• 외장SSD 쿠팡에서 보기 →
• 모니터암 쿠팡에서 보기 →

*위 링크는 쿠팡파트너스 활동의 일환이며, 일정액의 수수료를 제공받을 수 있습니다.