1. <!DOCTYPE html>
모든 html 파일은 <!DOCTYPE html>으로 시작한다.
<!DOCTYPE html>는 브라우저에게 현재 작성하는 파일이 text 파일이 아니라 html 파일임을 알려주는 것이다.
2. head와 body
웹사이트 구조는 head와 body 두개의 파트로 구성되어 있다.
head : 웹사이트의 환경을 설정 (외부적으로 보여지지 않는 부분)
- head 태그 안의 내용들은 내가 만들려는 웹사이트의
설정에 해당하는 부분이기 때문에 사용자 화면에서 보이지 않는다. head 부분을 통해 브라우저에게 내가 만들고자 하는 웹사이트에 대한 information을 명확하게 알려줄 수 있다.
예를 들어- 우리가 만드는 사이트가 어떤 언어(한국어인지 영어인지)를 사용하는지
- 구글에게 우리 웹사이트의 description이 무엇인지
- title은 무엇인지
body : 사용자에게 보여지는 부분
- 브라우저 화면 상에 보여질 내용들은 전부 body 태그 안에 있어야한다.
3. 넷플릭스 개발자 코드로 배워보기 - head 부분
<!DOCTYPE html>
<html>
<head lang="kr">
<link
rel="shortcut icon"
sizes="16x16 32x32 64x64"
href="https://assets.nflxext.com/ffe/siteui/common/icons/nficon2016.ico"
/>
<title>Home - My first website.</title>
<meta name="description" content="넷플릭스에서 어떤 콘텐츠를 시청할 수 있나요? 블라블라"/>
<meta charset="utf-8">
</head>
<body>
<h1>Ola! Hello! 안녕하세요!</h1>
<a href="https://www.google.co.kr/?hl=ko" target="_blank">Go to google</a>
<img src="https://t1.kakaocdn.net/kakaocorp/kakaocorp/admin/5f9c58c2017800001.png"/>
</body>
</html>1) link 태그 - 웹사이트 탭의 이미지
self-closing tag
<link
rel="shortcut icon" --고정
sizes="16x16 32x32 64x64"
href="https://assets.nflxext.com/ffe/siteui/common/icons/nficon2016.ico"
/>2) title 태그 - 웹사이트 이름
<title>Home - My first website.</title>
개발은 즐거워🪇