코드일기장

[HTML] <meta> (meta태그) 본문

HTML,CSS

[HTML] <meta> (meta태그)

codeStudy123 2022. 1. 28. 23:09

 

 

HTML에서 <meta> 태그는 문서에 대한 정보를 정의할 때 사용한다.

 

<meta> 태그로 정의된 정보들은 브라우저나 검색 엔진, 다른 웹 서비스에서 사용된다.

 

<head>

<meta>는 반드시 <head> 태그 내부에 위치해야 한다.

</head>

 

 

<meta> 탱크로 사용할 수 있는 속성들에 대해 알아보자.

 

속성명 속성값 설명
charset 문자셋 해당 문서의 문자 인코딩 방식을 명시
content 텍스트 name 속성이나 http-equiv 속성과 같은 값을 명시한다.
http-equiv content-type
default-style
refresh		 http의 속성의 값을 제공한다.
name application-name
author
description
generator
keywords
viewport		 웹 애플리케이션 이름 설정
제작자 정보 설정
사이트에 대한 설명 설정
사이트에 대한 프로그램 정보 설정
사이트의 키워드를 설정
사이트 뷰포트에 대한 정보 설정
(속성값 차례대로 설명)

 

 

 

예시 코드

 

<meta charset="UTF-8">

 

 

<meta name="keyword" content="code,teg,java">

키워드를 정의하는 코드

 

<meta name="description" content="HTML test site">

웹 페이지 대한 설명 코드

 

<meta name="author" content="Kim">

문서의 저자를 정의하는 코드

 

<meta name="viewport" content="width=device-width, initial-scale=1.0">

모든 장치에서 웹 사이트가 잘 보이도록 설정하는 코드

 

<meta http-equiv="refresh" content="10">

10초 뒤에 다른 페이지로 리다이렉트 하는 코드 (10: url=리다이렉트 하고 싶은 코드 사이트 주소)

 

 

 

 

결론적으로 meta태그는 제작한 사이트가 검색엔진에서 빠르게 노출되기 위한, 나의 사이트에 대한 정보 노출 등에 사용되는 태그이다.

 

 

 

 

 

 

 

커버사진

<a href="https://www.flaticon.com/kr/free-icons/html-5" title="html 5 아이콘">Html 5 아이콘  제작자: Freepik - Flaticon</a>

https://www.flaticon.com/kr/free-icon/html-5_919827

'HTML,CSS' 카테고리의 다른 글

[HTML] 기본2  (0) 2022.07.05
[HTML] 기본1  (0) 2022.06.29
'HTML,CSS' Related Articles more
Comments