[HTML] HTML의 페이지 구조

Siyu·2024년 5월 27일

HTML

목록 보기
3/8
post-thumbnail

본격적인 HTML 페이지 작성 전에 페이지 구조에 대해 알아보자!

1 기본적인 HTML 페이지 구조 😁

1) <!DOCTYPE html> 선언

<!DOCTYPE html> 선언의 통해 웹 문서가 HTML문서 형식으로 작성되었음을 인식하게 해준다.
만약 <!DOCTYPE html> 선언을 하지 않는다면 브라우저 환경에 따라 결과물이 다르게 출력되는 경우가 발생 할 수 있으므로 각 브라우저가 동일한 HTML문서로 인식하여 같은 결과물이 나올 수 있게 호환성을 높이는 역할을 한다. 또한 반드시 페이지 가장 첫번째줄에 선언해주어야 한다.

2) <html> 태그

<html> 태그는 웹 페이지의 시작과 끝을 표시한다고 할 수 있다.
모든 HTML 태그는 <html> 태그에 안에 작성되어야 한다. <html> 태그에는 lang 속성을 입력 할 수 있다.
lang 속성은 웹 브라우저 동작 자체에 영향을 미치는 것은 아니나 해당 웹 페이지 텍스트의 기본 언어를 지정할 수 있다.
(기본언어로 지정한다는 것은 브라우저, 검색 엔진등에 사용해야 하는 언어 정보를 제공 하는 것을 의미)

<html> 태그 안에는 <head> 태그와 <body>가 들어간다.

3) <head> 태그

<head> 태그는 사용자에게 직접적으로 보여지는 부분은 아니고 메타데이터(metadata)를 모아놓은 태그라고 생각하면 된다.

  • 메타데이터(metadata) : 데이터에 관한 구조화된 데이터. 즉, 다른 데이터를 설명해주는 데이터를 말함

<head> 태그 내부에는 정해진 태그만 입력 할 수 있다.

3-1) title 태그는 브라우저에 표시하는 제목을 지정하는 태그이다.

4) <body> 태그

<body> 는 사용자에게 실제로 보여지는 부분으로 웹 페이지에 있는 모든 컨텐츠를 포함하고 있는 태그이다. html 내부에는 무조건 하나의 <body> 태그만 존재해야 한다.
<body> 태그의 종류는 굉장히 많으므로 차근차근 공부하면서 익혀가는 것이 좋다.

profile
개발자 꿈나무

0개의 댓글