Computer >> 컴퓨터 >  >> 프로그래밍 >> HTML

HTML 문서에 메타 데이터 포함하기: meta 태그 완벽 가이드

HTML의 <meta> 태그는 HTML 문서에 대한 메타데이터(metadata)를 선언하는 데 사용됩니다. 메타데이터는 페이지 콘텐츠에는 직접 표시되지 않지만, 검색 엔진 최적화(SEO), 브라우저 동작 제어, 문서 정보 전달 등 웹 문서 운영에 중요한 역할을 합니다.

meta 태그의 주요 속성

다음은 <meta> 태그에서 사용할 수 있는 주요 속성입니다.

속성설명
nameauthor
description
keywords
generator
revised
others
속성(property)의 이름을 지정합니다. 작성자, 문서 설명, 키워드 등 다양한 메타 정보를 정의할 수 있습니다.
content텍스트http-equiv 또는 name 속성과 연관된 메타 정보를 정의합니다.
http-equivcontent-type
expires
refresh
set-cookie
content 속성을 HTTP 헤더와 연결합니다. 예를 들어 refresh를 사용하면 일정 시간 후 페이지를 자동으로 새로고침할 수 있습니다.
scheme텍스트content 속성값을 해석하는 데 사용할 형식(format)을 정의합니다.

사용 예제

아래 코드를 실행하면 HTML 문서에 메타데이터를 포함시키는 방법을 확인할 수 있습니다.

<html>
   <head>
      <title>HTML meta tag</title>
      <meta name = "keywords" content = "HTML, meta tag, metadata" />
      <meta name = "description" content = "Description of the document" />
      <meta http-equiv = "refresh" content = "10" />
   </head>
   <body style = "background-color:gray">
      Document content goes here
   </body>
</html>

예제 설명

위 예제에서 각 meta 태그가 하는 역할은 다음과 같습니다.

  • keywords: 검색 엔진에 문서와 관련된 키워드를 알려줍니다.
  • description: 문서에 대한 간단한 설명을 제공하며, 검색 결과에 표시될 수 있습니다.
  • http-equiv = "refresh": 10초 후 페이지를 자동으로 새로 고칩니다.

이처럼 <meta> 태그는 반드시 <head> 영역 안에 위치해야 하며, 문서의 성격과 목적에 맞는 메타데이터를 적절히 설정하는 것이 좋습니다.