티스토리 뷰

Web 개발/01. 마크업(html, css)

HTML meta Tag

Nicole Eunhee Jo 2022. 12. 11. 17:07

HTML <head> 내 위치하는 tag로 HTML 문서의 메타 정보를 정의한다.

<html>
<head>
    <meta ... >
</head>
</html>

Attributes

Attribute Value Desc
charset character set (UTF-8 사용 권장) HTML5에서 추가된 spec
HTML의 문자 인코딩 방식을 명시함
과거 국내 사이트에서 EUC-KR을 쓰기도 하였으나 현재는 거의 UTF-8로 변환
name application-name

author

description

generator : 페이지 제작 정보

keywords

viewport : 브라우저 렌더링 시 화면 너비 및 배율 지정에 사용 (모바일, 반응형 웹 페이지에 중요)		 정보성 data : SEO에 활용
viewport : 반응형 웹 페이지 제공
http-equip content-security-policy : 보안 관련 하단 참조 링크 참고 (default-src, img-src, child-src ...)

content-type : 문서의 charset

default-style : link element의 value와 매칭 되어야 함. default-style 적용할 경우 해당 css가 적용됨 (css 오버라이딩x)

refresh : 사용에 주의 필요, 지정된 시간에 지 지정된 페이지로 이동 or 새로고침

content-language : default language

X-UA-Compatible :  브라우저 호환 설정		 content 값과 함께 http header 정보를 제공
content text name, http-equip attribute의 value

실제 화면에 보여지지 않지만

브라우저에게 어떻게 content를 보여줄지 reload 할지 정보를 제공하거나

검색 엔진에게 어떤 페이지인지에 대한 정보를 제공한다.

 

과거 포럼(게시판) 관련 업무 진행 시에는 SEO 혹은 SNS 공유에 적극 사용되었던 spec으로 동적으로 meta 값을 세팅해주는 작업을 중요하게 진행했었다.

 

SEO, IE 환경, i18n등을 고려하는게 아니라면 대부분 초기 설정한 meta 값이 그대로 사용되는것 같다.

Reference

https://www.w3schools.com/tags/tag_meta.asp

 

HTML meta tag

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

www.w3schools.com

https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP

 

Content Security Policy (CSP) - HTTP | MDN

Content Security Policy (CSP) is an added layer of security that helps to detect and mitigate certain types of attacks, including Cross-Site Scripting (XSS) and data injection attacks. These attacks are used for everything from data theft, to site defaceme

developer.mozilla.org

https://www.w3schools.com/css/css_rwd_viewport.asp

 

Responsive Web Design Viewport

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

www.w3schools.com