인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

인프런 커뮤니티 질문&답변

어차피 마늘님의 프로필 이미지

작성한 질문수

한 입 크기로 잘라먹는 Next.js(v15)

2.19) SEO 설정하기

fallback상태일때 메타태그

해결된 질문

작성

·

50

0

안녕하세요 강사님 질문이 있습니다.

 

fallback 상태일때는 SEO가 적용이 되지 않는것은 이해가 됐는데 서버에서 요청한 페이지(book/4)를 내려주면 결국 해당 페이지에 대한 SEO가 다시 잘 적용이 되는데 굳이 fallback 상태일때도 SEO를 신경써줘야하는 이유가 있나요?

 

 

답변 2

0

이정환 Winterlood님의 프로필 이미지
이정환 Winterlood
지식공유자

안녕하세요 이정환입니다.

결론부터 말씀드리자면 타 사이트의 웹 크롤러나 오픈그래프 수집기가 fallback 상태일 때 페이지를 수집해 가는 경우를 대응하기 위해서 그렇습니다.

예를 들어 카카오톡 오픈그래프 수집기를 생각해볼게요, 누군가 카카오톡 채팅방에 book/12 같은 아직 생성되지 않은 페이지의 링크를 전달한다고 가정하겠습니다. 그럼 이때 카카오톡 서비스의 오픈그래프 수집기는 "book/12" 주소로 요청을 보내어 오픈그래프 태그를 분석해 링크 미리보기 및 썸네일을 제공하게 될 겁니다. 이때 요청을 받은 Next.js 웹 서버는 fallback 상태의 페이지를 요청자인 카카오톡에게 전달하는데 이때 페이지에 오픈그래프 및 SEO 설정이 되어 있지 않으면 아무런 오픈 그래프태그가 없는걸로 간주 될 수 있습니다. 이런 이유로 인해 fallback 상태의 페이지에서도 SEO 및 오픈그래프 설정을 수집할 수 있도록 별도의 작업을 해 주는 것 입니다.

0

인프런 AI 인턴님의 프로필 이미지

안녕하세요, 인프런 AI 인턴입니다. Hw Zz님.

Next.js에서 fallback 상태일 때 SEO에 대한 고민을 하시는 것은 자연스러운 질문입니다. fallback: trueblocking을 사용할 때, 서버가 요청받은 페이지를 내려줄 수 있으므로 최종적으로는 SEO가 적용됩니다. 그러나 초기 로딩 상태인 fallback 동안에는 서버에서 페이지를 완전히 내려주기 전까지는 정적 콘텐츠가 없습니다. 이를 이해하는 것이 SEO 최적화에 중요합니다.

왜 fallback 상태에서도 SEO를 고려해야 하는가?

  1. 첫 인상: 사용자와 검색 엔진 봇이 페이지에 처음 접근했을 때 로딩만 되어 있다면 페이지에 대한 부정적인 첫 인상을 줄 수 있습니다.

  2. 로딩 시간: 초기 로딩 시간이 길어지는 경우 SEO에 악영향을 줄 수 있습니다. 일부 검색 엔진은 페이지가 너무 오래 걸리면 크롤링을 포기할 수도 있습니다.

  3. 메타태그: fallback 상태에서도 기본적인 메타태그를 제공하면 브라우저나 소셜 미디어 공유 시에도 일정 수준 이상의 정보를 제공할 수 있어 긍정적입니다.

최적화 방법

  • fallback: 'blocking'을 사용하면 SEO를 조금 더 챙길 수 있습니다. 페이지가 완전히 준비될 때까지 크롤러와 사용자가 대기하므로, 최종적으로는 SEO용 콘텐츠가 제공됩니다.
  • 추가적인 SEO 플러그인을 사용하거나, 초기 로딩 상태에 대한 메시지를 제공하는 것도 도움이 될 수 있습니다.

추가로 다음 자료들을 참고하시면 좋을 것 같습니다:

이 정보를 통해 더 나은 SEO 전략을 수립하시길 바랍니다. 추가 질문이나 다른 궁금증이 있다면 언제든지 질문해 주세요.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.