inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

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

2.19) SEO 설정하기

데이터 통신에 실패한 경우에 보여주는 페이지도 og를 설정해주는게 좋을까요?

122

wl990

작성한 질문수 5

0

안녕하세요!

2-19에서 og태그를 통한 SEO 설정에서 궁금한 점이 생겼습니다.

강의 마지막에 페이지가 fallback 되는 동안 보여줄 컴포넌트에서도 Head컴포넌트를 새로 만들어 og태그를 설정해주라고 설명해주셨는데,

데이터를 못 받아서 book에 null값을 받은 경우에 보여주는 페이지에선 og태그를 설정해줄 필요가 없을까요?

검색엔진에 노출되기 위해 og태그를 페이지마다 입력해줘야 한다면 이런 오류 페이지에도 og태그를 설정해줘야 할 거 같아서요!

react typescript next.js

답변 2

0

이정환 Winterlood

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

요 부분은 선택의 영역으로 남게 될 것 같아요..! 보통은 오류 페이지의 SEO 까지는 신경쓰지 않아서 fallback 상태일 때 설정해둔 일반적이고 범용적인 오픈그래프 태그가 설정되면 문제가 없을 것 같긴 합니다! 덧붙여 에러 페이지는 보통 클라이언트 사이드에서 렌더링 되는 경우가 많아서 SEO를 설정하는 경우는 거의 없는걸로 알고 있어요!

0

인프런 AI 인턴

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

SEO와 관련된 Open Graph(OG) 태그 설정에 대한 훌륭한 질문입니다. 데이터를 받아오지 못해서 책(book)이 null값을 가진 경우 발생하는 오류 페이지에 OG 태그를 설정해야 하는지 고민하고 계시군요.

오류 페이지와 OG 태그 설정의 중요성에 대해 다음과 같이 설명드리겠습니다:

  1. 사용자 경험: 데이터 통신 오류가 발생한 페이지를 방문하는 사용자의 경우에도 웹 페이지의 메타데이터가 설정되어 있으면, 사용자는 일정 수준 이상의 정보 제공을 받을 수 있습니다. 예를 들어, “데이터를 불러오지 못했습니다”와 같은 메시지가 포함된 OG 태그가 설정되면, 외부 링크를 통한 접근 시에도 상황을 즉시 알릴 수 있습니다.

  2. SEO 관점: 오류 페이지의 경우 일반적으로 SEO 최적화의 주요 대상이 되지는 않지만, 페이지가 제대로 표시되지 않을 경우에도 검색엔진 봇은 페이지를 크롤링합니다. 따라서, 기본적인 메타태그들이 설정되어 있는 것이 도움이 될 수 있습니다.

  3. 통일된 사용자 경험: 모든 페이지에 일관된 OG 태그를 제공하면, 사이트의 모든 페이지가 같은 수준의 사용자 경험을 제공하게 됩니다.

결론적으로:
- 오류 페이지라도 기본적인 OG 태그를 설정하는 것은 권장됩니다. 사용자가 해당 페이지를 링크로 공유하거나 외부에서 접근했을 때 상황을 명확하게 전달할 수 있기 때문입니다.
- 각 페이지마다 OG 태그를 다르게 설정하여 다양한 상황에 대처할 수 있습니다. 만약 기본 정보 외에도 오류가 발생한 이유 등을 상세히 전달하고자 한다면, 해당 내용도 OG 태그에 반영할 수 있습니다.

유사한 질문과 답변이 있으니 아래 링크를 확인해 보시면 더욱 도움이 될 것입니다.

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

Next.js 사전렌더링 이해하기 부분

0

22

2

모달 관련 질문

0

30

3

렌더링 관련 질문

0

76

2

중복으로 하나의 api를 요청할 때 캐싱 옵션 통일화

0

59

2

라우트 세그먼트 옵션 강좌 노트에 사소한 제보 남깁니다.

0

60

2

SSR시 context에 params말고 query를 사용하면 안되나요?

0

73

2

npx prisma db push 시 에러가 뜹니다.

0

91

3

vercel 배포를 실패하였습니다.

0

94

3

Image 컴포넌트 사용시 브라우저 콘솔에 경고는 왜 뜨는걸까요?

0

54

2

getServerSideProps 함수와 SSR의 관계

0

76

6

없는 페이지인데 풀라우트캐시로 저장이 되는 이유가 궁금합니다

0

58

2

실제 프로젝트에서 SSR 사용에 관해서 질문드립니다.

0

112

2

일반적인 nextjs project architecture에 대하여..

0

83

2

2.14 Search에서 작성한건 static이긴하지만 CSR이 아닌가요?

0

71

2

배포 시 오류 발생

0

83

2

백엔드 서버 오류납니다.

0

79

2

취약점 제거시 nestjs 버전 문제가 생길까요?

0

89

1

eslint.config.mjs 내 rules 어떻게 설정 하나요?

0

103

1

[book]/[id]/page.tsx 모달 띄울 때 성능 하락 현상은 ReviewList를 불러오면서 발생하는 문제 같습니다.

0

60

2

빨간줄 설정

0

74

2

익스텐션 질문

0

58

1

강의 들으면서 궁금한 부분 질문드립니다.

0

108

1

서버 배포 에러입니다.

1

97

2

[5.2) 풀라우트 캐시 2] fetch의 cache 옵션 기본값 질문: no-store/force-cache

1

102

2