brunch

You can make anything
by writing

C.S.Lewis

by 밤코딩 밤치 Jan 26. 2022

title과 og:title 태그는 일치해야 하는가?

검색엔진 최적화의 기초 title, og:title 설정하기


검색엔진 최적화(SEO)의 가장 기초작업은 페이지 제목(title)을 잘 정하는 것입니다.


Title 태그는 글의 주제를 한 줄로 간략하게 정의해야 하며, 사람들이 많이 검색할 단어와 문장으로 구성하는 것이 좋습니다.


검색엔진 최적화 작업에 대한 글을 읽던 중 title 태그와 og:title 태그가 동일해야 한다는 내용을 보았습니다.



해당 내용이 근거가 있는지 검증하기 위해 stackoverflow를 찾아보았습니다.

https://stackoverflow.com/questions/6830185/does-a-meta-tag-for-ogtitle-make-redundant-a-meta-tag-for-title


<meta name="title" content="My Title" />    
<meta property="og:title"  name="title" content="My Title" />

위 2개의 태그는 같은 내용("My Title")이므로 제거할 수 있냐는 글인데…


og는 페이스북에서 만든 것이기 때문에 의미 없다는 글도 있었지만, 다수의 개발자는 페이스북 og tag의 경우 이미 많은 곳에서 사용하고 있기 때문에 두 태그 모두 표시하는 게 좋다는 의견이며,  저도 이에 동의하는 바입니다.


https://stackoverflow.com/questions/10397510/do-services-other-than-facebook-use-open-graph


자세한 내용은 위 링크에서 확인하길 바랍니다.




최근에 개발한 트렌드패드(www.trendspad.net)는 잘 정의되었을까?라는 의문에 소스 코드를 확인해보니 다음과 같았습니다.


<title>대통령 후보 분석 | 트렌드패드</title>
<meta property="og:title" content="트렌드패드">

title과 og:title이 연관성이 없어 보입니다. 



<title>대선후보 분석 | 트렌드패드</title>
<meta property="og:site_name" content="트렌드패드">
<meta property="og:title" content="대선후보 분석">

title 에는 프로젝트명과 사이트 이름을 함께 조합하여 넣었고, 이를 og:title과  og:site_name에 각각 설정하여 문제를 해결하였습니다.


트렌드패드의 title, og 태그


다음화에서는 meta_gem을 사용하여 검색엔진 최적화(SEO) 작업을 하는 방법에 대해 알아보도록 하겠습니다.


브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari