[wise-pick 개발] Next.js SEO 최적화로 Lighthouse 100점 달성기

제가 왔습니다.

wise-pick 개발을 완료 했는데요, 치명적인 문제가 생겼습니다. SEO 점수가 58점 밖에 안된다는 겁니다. 쌰갈!

 

하지만 친절하게 어떠한 항목이 잘못됐는지 알려주었기에 해결을 해보도록 하겠습니다.

 

영어를 잘 하진 못하지만 해석을 해보자면 인덱스 코드의 헤드 > 메타 태그에 크롤링을 하지 못하도록 막아놓는 설정이 있는데 이를 막아놨다고 합니다.

 

구글 검색 엔진 최적화(SEO)의 원리 중 첫 번째 단계는 검색 봇이 내 사이트를 크롤링(수집)하고 인덱싱(색인)하게 됩니다.

robots.txt는 봇의 접근 권한을 제어하는 파일인데, 여기서 크롤링을 막아버리면 구글이 제 사이트에 어떤 콘텐츠가 있는지조차 읽을 수 없습니다ㅠㅠ

 

즉, 검색 결과 노출의 1단계부터 문을 막아버리므로 SEO에 가장 치명적입니다

export const metadata: Metadata = {
  title: 'wise.pick',
  description: '한국소비자원 제품 시험결과 상품 큐레이션',
}

요랬는데

export const metadata: Metadata = {
  title: 'wise.pick',
  description: '한국소비자원 제품 시험결과 상품 큐레이션',

  robots: {
    index: true,
    follow: true,
  },
};

요래 됐습니다~!

우리 public/robots.txt 도 수정해줍니다.(안하면 섭섭하니까)

User-agent: *
Allow: /
Sitemap: https://wise-pick.co.kr/sitemap.xml

요래 바꿨는데 어떻게 될지 궁금하네요 둑흔둑흔♥

끼얏호우~!!!! 100점 완성되었습니다.

참 쉽죠? 봐주셔서 감사합니다