본문 바로가기
Front/HTML

HTML

by 프로그래밍 공부 2023. 5. 2.

 HTML은 Hyper Text Markup Language의 약자다. 

Hyper Text 는 참조를 통해 한 문서에서 다른 문서로 즉시 접근할 수 있는 텍스트를 의미한다.

문서 작업할 때 문장에 링크를 다는 것을 하이퍼 텍스트 기능이라고 했던 것을 기억할 것이다.

Markup은 태그 등을 이용해서 문서나 데이터의 구조를 명기하는 언어이다. 

HTML은 이 두가지가 융합된 언어라는 것이다 

 

HTML은 웹페이지를 작성하기 위한 언어로,

그 확장자로 .html을 가진다.

또한 HTML내의 태그는 대소문자 구분이 없고,

엔터나 스페이스바, 탭 등이 적용되지 않는다. 

 

HTML은 태그와 내용 요소로 구성되어 있다. 

태그의 경우 시작태그와 종료태그로 쌍을 이루거나 하나의 태그만 존재하는 태그도 있다.

또한 시작태그에서는 속성과 속성값을 가질 수 있다.

 

HTML의 기본 구조는 다음과 같다.

비주얼 스튜디오 코드에서 HTML Sample을 사용했을 때 나타나는 구조이다. 

기본적으로 HTML 최상위 요소인 html 태그가 있고,

head와 body 요소로 구성되어 있다.

head는 문서의 제목, 문자 코드 등의 해당 문서에 대한 정보를 가지고 있고 화면에는 출력되지 않는다.

body는 브라우저 화면에서 나타나는 정보를 담는다.

body 내의 각 요소에서는 id, class 속성을 이용해서 tag를 식별하거나 특성을 부여할 수 있다.

 

HTML의 태그에는 의미를 가지는 태그들이 있다.

예를 들어

<header> <nav> <aside> <section> <article> <footer> <h1> 등이 있다.

이 태그 들은 헤더, 메뉴, 사이드 등 각 태그가 가지는 의미가 있다.

이 태그들을 사용할 경우 코드의 가독성을 높일 수 있고, 유지 보수를 좀 더 쉽게 진행할 수도 있다. 

 

이외에도 다양한 태그가 있어 html을 이용해 다양한 형식의 페이지를 만들 수 있다.