<!DOCTYPE HTML>
<head>
어쩌구
</head>
<body>
저쩌구
</body>HTML 구성에 꼭 head 태그와 body 태그는 필수적으로 존재해야 한다. head 태그는 사이트 내에서 눈에 보이지 않는 정보들을 담고 있다.
1. 각종 CSS 파일들
<head>
<link href="css/main.css" rel="stylesheet">
</head>CSS 파일들을 첨부할 때 link 태그를 집어 넣을 수 있다.
2. style 태그
<head>
<style>
.button {
color : red;
}
</style>
</head>CSS 파일 없이도 HTML에서 style을 적용할 수 있다. CSS 파일과 유사하게 작동한다. body 태그 안에 넣을 수도 있지만 코드는 위에서 아래로 읽기 때문에 로딩 시에 스타일이 깨질 수도 있다.
3. 사이트 제목
<head>
<title>네이버입니다</title>
</head>사이트 제목도 넣을 수 있다. (브라우저 탭에 뜨는 이름)
4. 여러가지 meta 태그
<head>
<meta charset="UTF-8">
<meta name="description" content="html 잘하는 코딩애플입니다.">
<meta name="keywords" content="HTML,CSS,JavaScript,자바스크립트,코딩">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>5. open graph
<head>
<meta property="og:image" content="/이미지경로.jpg">
<meta property="og:description" content="사이트설명">
<meta property="og:title" content="사이트제목">
</head>facebook에서 만든 메타태그가 있다.
6. Favicon
<head>
<link rel="icon" href="아이콘경로.ico" type="image/x-icon">
</head> 웹 사이트 제목 옆에 뜨는 아이콘을 변경할 수 있다.
오늘도 한 발자국 더 나아가.