본문 바로가기

UX 개발/SEO

[SEO] 웹페이지 프리뷰이미지(썸네일) 디자인가이드 메타데이터를 통해 웹페이지에 대한 정보로 등록되는 항목 중 이미지는 각종 소셜미디어나 인스턴트메신저 등을 통해서 웹페이지에 대해서 표시되는 주요 정보 중 하나입니다. 보통 open graph에서 제공되는 하나의 항목 중 하나로 취급됩니다. 다만 서비스 또는 클라이언트 별로 이 프리뷰 이미지를 표기하는 방식이 다르기 때문에 최대한 적응성이 높은 웹페이지 메타데이터 이미지를 디자인하는 방법에 대해서 알아 보고자 합니다. 메타데이터 상에서는 'image'라고 불리우지만 실질적으로 '프리뷰이미지', '썸네일이미지' 등의 이름으로 더욱 자주 불리기에 이하 글에서는 프리뷰이미지라고 부르도록 하겠습니다. 정사각형 또는 직사각형 선택 웹페이지 메타데이터는 표준화되어 있다고 보기가 애매하고, 서비스와 클라이언트 별로 표..
[SEO] 페이스북의 프리뷰 이미지/정보 강제 갱신하기 웹페에지와 관련된 정보를 나타내 주는 메타데이터는 특정 클라이언트나 서비스 종속적인 코드가 존재합니다. 이 중 가장 표준적인 형태의 메타데이터는 title, description, favicon과 같은 기본적인 요소들 외에 og라고 불리우는 open graph를 들 수 있습니다. 페이스북 프리뷰 이미지/정보에 사용되는 메타데이터는 open graph 정보를 토대로 작성이 됩니다. 페이스북은 자체 캐싱 서버를 가지고 있어서 프리뷰 정보를 캐싱처리합니다. 그래서 이전에 이미 공유한 적이 있는 경우 캐싱 데이터를 토대로 프리뷰를 표시합니다. 이같은 페이스북에서 긁어가는 메타데이터 정보를 강제로 갱신하는 방법은 다음 페이스북 쉐어링 디버거를 사용하는 것입니다. 페이스북 쉐어링 디버거 해당 디버거를 통해서 URL..
XML사이트맵의 용도와 만드는 법 파악하기 본 포스트는 Envato Tuts+의 All you need to know about XML sitemaps라는 아티클을 기반으로 작성된 포스트입니다. XML사이트맵 용도 사이트맵이라는 용어 자체는 기본적으로 우리가 흔히 떠올리는 여러 링크들로 이루어진 사이트 전체의 구조를 나타내는 일종의 사이트 구조도라고 볼 수 있습니다. 이것은 HTML사이트맵이라고 볼 수 있으며 여기서 이야기하려는 XML사이트맵과는 다른 성질의 것입니다. XML사이트맵은 검색 크롤러가 사이트를 이해할 수 있게 도움을 주는 지도 역할을 합니다. 특히 여러 페이지로 구성된 볼륨이 큰 사이트이거나, 새롭게 오픈된 사이트같은 경우에 이러한 사이트맵이 유용하게 작용될 수 있습니다. 크롤러가 더 쉽게 정보를 취득할 수 있도록 도와주기 떄문입니..
외주/과외 문의

티스토리툴바