Readme

What is SEO?

검색엔진 최적화(Search Engine Optimization, SEO)는 웹사이트의 방문자 수를 늘리기 위해 검색엔진의 검색 결과 페이지(SERP)에서 웹사이트의 순위를 높이는 프로세스입니다.

slug를 사용하여 사용자가 이해하기 쉽게 작성한다.

예를들면 다음과 같다.

'https://www.thisisgame.com/webzine/news/nboard/263/?category=1&n=189072' (no good)
'https://www.thisisgame.com/플레이엑스포에 가야 할 이유/' (good)

각 페이지에서 정확하고 완성된 meta data를 작성한다.

페이스북이나 트위터에서 링크를 공유할때 보여지는 정보를 설정할 수 있다.

og:title - The title of your object as it should appear within the graph, e.g., "The Rock".
og:type - The type of your object, e.g., "video.movie". Depending on the type you specify, other properties may also be required.
og:image - An image URL which should represent your object within the graph.
og:url - The canonical URL of your object that will be used as its permanent ID in the graph, e.g., "https://www.imdb.com/title/tt0117500/".
opengraph debugger : https://en.rakko.tools/tools/9/
twitter card validator : https://cards-dev.twitter.com/validator
facebook debugger : https://developers.facebook.com/tools/debug/
linkedin post inspector : https://www.linkedin.com/post-inspector/
pininterest validator : https://developers.pinterest.com/tools/url-debugger/
socialsharepreview : https://socialsharepreview.com/

opengraph를 쓰면되지 왜 또 twitter는 또 따로 만들엇는가..

https://developer.x.com/en/docs/twitter-for-websites/cards/overview/markup

같은것이 많으므로 같은건 og를 쓰고 나머지만 트위터 카드를 쓰자.

페이지가 없으면 not found를 보여주자. 빈 페이지를 보여주는것보다 좋다.

metadata작성시 디비 읽어오는 fetch를 사용한다. 본문에 fetch가 있어도 상관없다. nextjs가 두번 호출되면 한번만 호출하고 데이터를 공유한다.
client component는 검색이 되지 않으므로 가능한한 적게 만든다.

Last updated 10 months ago

Was this helpful?