HTML - HTML 기본 구조, 개발 공부하기

HTML 이란

HTML (Hyper Text Markup Langauge) 는 다양한 정보를 웹 브라우저에 보여주기 위한 웹 문서를 만드는 언어

제목, 단락, 목록 등과 같은 본문을 위한 구조적 의미와 링크, 인용 등 구조적 문서를 만들 수 있는 방법을 제공한다.

Markup langauge : 문서가 화면에 표시되는 형식 혹은 태그를 이용해서 데이터의 논리적 구조를 명시하기 위한 규칙들을 정의한 언어의 일종

웹 문서를 작성하는 태그 언어이며 웹 브라우저는 한 번에 하나의 HTML 페이지를 화면에 출력한다.

태그 (Tag) 정의

HTML을 구성하는 기본 단위이며 보편적으로 여는 태그와 닫는 태그가 한 쌍을 이룬다.

(보편적인 내용일 뿐, 모든 태그가 닫는 태그가 존재하는 것은 아니다)

페이지 출력은 목적에 적합한 태그로 작성되어지며 태그의 종류는 100여개 정도 존재한다고 한다.

<tag> </tag>

HTML 기본 구조

<!DOCTYPE html>
<html>
    <head> </head>
    <body> </body>
</html>

HTML문서 기본 구조를 보면 html태그 안에 head태그와 body태그를 작성하고 있다.

감싸고 있는 html은 부모요소, html안에 들어가 있는 head태그와 body태그는 html태그의 자식요소이며 부모요소와 자식요소의 구분은 앞에 탭(tab)키를 눌러 줄 간격을 띄워주는 것이다.

줄 간격 정리를 잘 하지 않을 경우 태그사이의 관계가 모호해 작업이 어렵고 협업은 더욱 어렵다.

추가적으로 head태그와 body태그는 같은 세대 요소로 형제관계요소라고 한다.

<!DOCTYPE html> <!-- document type html로 정의 (html5임을 정의) -->
<html>
    <head>
    	<!-- 문서의 제목, js, css, meta 데이터 -->
    </head>
    <body>
    	<!--  문서 본문, 이미지, 내용, 동영상 등 -->
    </body>
</html>

- head 태그 : 현재 보고 있는 html 문서의 정보가 들어간다. 문서의 제목, meta 데이터, 외부 문서 연결, js, css, favicon 즐겨찾기 아이콘 연결 등의 내용이 들어간다.

- body 태그 : 실제 도큐먼트에 보여지는 내용이 들어가며 문서의 본문, 이미지, 내용, 동영상 등이 들어간다.

html 태그

<html lang="언어코드"> </html>

html 태그에는 lang 속성으로 언어코드를 작성함으로써 문서가 읽힐 때 어떤 언어로 읽힐지를 설정해준다. (한국형 웹 콘텐츠 접근성 지침(KWCAG) 2.1에는 웹페이지의 head 요소 안에 페이지의 기본 언어 선언을 규정하고 있다.)

한국어	영어	일본어	중국어	독일어	프랑스어	스페인어	러시아어
ko	en	ja	zh	de	fe	es	ru

'개발 이야기 > HTML' 카테고리의 다른 글

HTML - 웹 개요 (0)	2023.06.29
HTML - 웹 표준 (0)	2023.06.29

0_0

HTML - HTML 기본 구조

HTML 이란

태그 (Tag) 정의

HTML 기본 구조

html 태그

'개발 이야기 > HTML' 카테고리의 다른 글

티스토리툴바

HTML - HTML 기본 구조

HTML 이란

태그 (Tag) 정의

HTML 기본 구조

html 태그

'개발 이야기 > HTML' 카테고리의 다른 글

관련글

티스토리툴바