HTML 문서(웹페이지)에 관한 정보(표시 방식, 제작자, 내용, 키워드 등)를 검색엔진이나 브라우저에 제공합니다.

charset : 문자인코딩 방식 (UTF-8, EUC-KR, ..)

name : 검색엔진 등에 제공하기 위한 정보의 종류 (author, description, keywords, viewport, ..)

content : name 이나 http-equiv 속성의 값을 제공

<meta charset="UTF-8" />

<meta name="author" content="김희태" />

→ 사이트 제작자

<meta name="description" content="김희태의 사이트 입니다." />

→ 사이트 설명

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, maximum-scale=1, minimum-scale=1">

→ 사이트 뷰포트 설정

1. width(너비) 는 디바이스 너비로 하겠다.
2. initial-scale(초기화면 비율)은 1로 하겠다.
3. user-scalable(손으로 확대 축소 설정) 은 no 로 하겠다.(허용하면 yes)
4. maximum-scale(최대로 확대 할 수 있는 크기) 는 1로 하겠다.
5. minimum-scale(최소로 축소 할 수 있는 크기) 는 1로 하겠다.

<meta http-equiv="X-UA-Compatible" content="IE=edge">

→ IE(인터넷 익스플로러) 랜더링 방식을 edge로 사용하겠다.

<meta property="og:url" content="공유시 이동 url"> <meta property="og:title" content="공유시 보여질 제목"> <meta property="og:type" content="website"> <meta property="og:image" content="공유시 보여질 이미지 경로"> <meta property="og:description" content="공유시 보여질 설명">

<aside> 💡 카카오로 링크 공유시, 변경된 meta 정보가 안 보일 때

*meta 정보를 반영하였음에도, 공유시 이미지나 기타 정보가 변경이 안되었다면, 이는 카카오 서버에 페이지의 정보가 아직 캐싱되지 못한 것입니다. (만약, 캐싱 삭제를 진행하고 싶으면, 카카오 개발자 사이트에서 캐싱 삭제가 가능합니다.)*

</aside>