HTML의 기본 구조
보통 <!DOCTYPE html>로 시작해 <html>, <head>, <body>라는 3개의 영역으로 구성
<!DOCTYPE html>: 현재 문서가 HTML5 언어로 작성한 웹 문서라는 뜻
<html>~</html>: 웹 문서의 시작과 끝을 나타내는 태그
<head>~</head>: 웹 브라우저가 웹 문서를 해석하는데 피용한 정보를 입력하는 부분
<body>~</body>: 실제로 웹 브라우저 화면에 나타나는 내용
<html lang="ko">
lang 속성으로 문서에서 사용할 언어를 한국어로 지정한다. 검색 사이트에서 특정 언어로 제한해 검색할 때 결과 제공한다.
<head> 태그
1. <meta> 태그
<meta> 태그: 웹 브라우저에는 보이지 않지만 웹 문서와 관련된 정보를 지정할 때 사용
<meta charset="UTF-8">웹 서버는 영어가 기본이므로 화면에 한글로 된 내용을 표시할 때에는 UTF-8이라는 문자 세트를 사용한다고 웹 브라우저에 알려 줘야한다.
그 밖에 <meta>태그는 웹 사이트의 키워드나 간단한 설명, 제작자 등의 정보를 다음과 같이 지정할 수 있다. 이 정보는 검색 엔진에서 사이트를 검색할 때 참고하는데, 검색 엔진에 따라 참고하는 정보는 달라질 수 있다.
<meta name="keywords" content="html의 구조"> <!-- 웹 문서의 키워드 -->
<meta name="description" content="html의 구조를 알아봅시다."> <!-- 웹 문서의 설명 -->
<meta name="author" content="chocochip"> <!-- 웹 문서의 소유자나 제작자 -->
2. <title> 태그
<title> 태그: 웹 문서의 제목을 표시합니다.
<title> HTML 기본 문서 </title>해당 페이지의 방문자나 검색 엔진은 제목 표시줄의 제목을 보고 페이지의 전체 내용을 추측할 수 있습니다.
<body> 태그
<body> 태그: 실제 웹 브라우저에 표시할 내용을 입력합니다.
<body>
<h1>웹 개발 공부</h1>
<hr>
<p>HTML</p>
<p>CSS</p>
<p>JavaScript</p>
</body>
반응형
'Develop > Web' 카테고리의 다른 글
| [Web] CSS - 미디어 쿼리(Media Queries)를 활용한 반응형 웹 디자인 (0) | 2022.02.12 |
|---|---|
| [Web] CSS - 기본 선택자 (0) | 2021.12.03 |
| [Web] HTML - 주요 시멘틱 태그 (0) | 2021.11.29 |
댓글