[TIL] MetaData란?

Dec 15, 2023 | Jun 25, 2024
|
Ryoon.With.Wisdomtrees
Ryoon.With.Wisdomtrees

메타데이터란 무엇입니까?

웹 개발에서 메타데이터는 웹페이지에 대한 추가 세부정보를 제공합니다. 페이지를 방문하는 사용자에게는 메타데이터가 표시되지 않습니다. 대신 페이지의 HTML, 일반적으로 <head> 요소 내에 삽입되어 백그라운드에서 작동합니다. 이 숨겨진 정보는 웹페이지 콘텐츠를 더 잘 이해해야 하는 검색 엔진 및 기타 시스템에 매우 중요합니다.

메타데이터가 왜 중요한가요?

메타데이터는 웹페이지의 SEO를 향상시키는 데 중요한 역할을 하여 검색 엔진과 소셜 미디어 플랫폼에서 더 쉽게 접근하고 이해할 수 있도록 해줍니다. 적절한 메타데이터는 검색 엔진이 웹 페이지를 효과적으로 색인화하여 검색 결과에서 순위를 높이는 데 도움이 됩니다. 또한 Open Graph와 같은 메타데이터는 소셜 미디어에서 공유 링크의 모양을 개선하여 사용자에게 콘텐츠를 더욱 매력적이고 유익하게 만듭니다.

메타데이터 유형

다양한 유형의 메타데이터가 있으며 각각 고유한 목적을 제공합니다. 몇 가지 일반적인 유형은 다음과 같습니다.
제목 메타데이터: 브라우저 탭에 표시되는 웹페이지의 제목을 담당합니다. 이는 검색 엔진이 웹페이지의 내용을 이해하는 데 도움이 되므로 SEO에 매우 중요합니다.
<title>Page Title</title>
설명 메타데이터: 이 메타데이터는 웹페이지 콘텐츠에 대한 간략한 개요를 제공하며 검색 엔진 결과에 자주 표시됩니다.
<meta name="description" content="A brief description of the page content." />
키워드 메타데이터: 이 메타데이터에는 웹페이지 콘텐츠와 관련된 키워드가 포함되어 있어 검색 엔진이 페이지를 색인화하는 데 도움이 됩니다.
<meta name="keywords" content="keyword1, keyword2, keyword3" />
오픈 그래프 메타데이터: 이 메타데이터는 제목, 설명, 미리보기 이미지와 같은 정보를 제공하여 소셜 미디어 플랫폼에서 공유할 때 웹페이지가 표시되는 방식을 향상시킵니다.
<meta property="og:title" content="Title Here" /><meta property="og:description" content="Description Here" /><meta property="og:image" content="image_url_here" />
파비콘 메타데이터: 이 메타데이터는 파비콘(작은 아이콘)을 브라우저의 주소 표시줄이나 탭에 표시되는 웹페이지에 연결합니다.
<link rel="icon" href="path/to/favicon.ico" />
 
[TIL] Next.js Adding metadata[TIL] Protecting your routes with Middleware
  뒤로  
기술 로그
사이드 프로젝트
능동적 나눔과 기쁨
생각 조각 모음
독서 노트
독후감
영감 기록