INDEX
- HTML의 정의
- 표현방식
- 기본구조
HTML의 정의
HTML은 Hyper Text Markup Language의 약자로 우리가 보는 웹페이지에서 가장 중요한 뼈대 역할을 해주는 마크업 언어이며, 문서의 구조를 표현하고 웹페이지를 다른 페이지로 이동시킬 수 있는 기능을 가진 언어이다.
Hyper는 뛰어넘다, Text는 문서나 글을 의미한다 따라서 HyperText는 어떤 한 문서(페이지)에서 다른 문서로 넘어갈 수 있는 Text를 의미한다.
-> 문서를 뛰어넘는다, 하이퍼링크(Hyperlink) 기능
Markup Language는 문서의 구조를 표현하는 언어라는 의미의다.
결론적으로 웹페이지에서의 HTML은 사람으로 비유하면 사람 그 자체라 할 수 있을 것 같다. (옷, 액세서리, 몸짓, 발짓 등을 제외한 사람 그 자체)
표현방식
HTML은 태그를 이용해 표시 문서의 구조 정보를 나타낸다.(구조를 정의한다.)
정해진 태그 이름을 <>으로 감싸서 표현하며 태그 사이에 화면에 보일 정보를 넣는다.
-> ex) <html>, <h1>, <span>
-> <h1> Text를 입력하세요. </h1>
대부분의 태그는 시작 태그와 종료 태그로 이루어져 있으며 단독 태그도 존재한다.
시작 태그는 <>, 종료 태그는 </>로 표현
-> ex) <h1></h1>, <p></p>......
-> ex) <img src = "", alt = "" />, <br/>, <hr/> (단독 태그는 / 표시 생략 가능)
기본구조
-> <!DOCTYPE html> - 문서 타입은 HTML 형식을 사용하며, 현재 문서가 HTML5로 작성된 웹 문서라는 의미
-> <html> ~ </html> - HTML 문서의 시작 선언, 문서의 요소를 정의한다.
-> <head> ~ </head> - 브라우저에 필요한 정보를 주는 태그, HTML 문서의 메타데이터를 정의
head안의 메타데이터는 <title></title>, <style></style>, 외부 웹폰트 관련 소스 등이 해당된다.
* 메타데이터(metadata) : 다른 데이터의 정보를 설명해주는 데이터, 직접적으로 보이지는 않는 정보
-> <title> ~ </title> - 웹 브라우저에서 탭에 보이는 부분, HTML 문서의 제목을 표시
-> <body> ~ </body> - 브라우저에 보일 모든 본문 내용을 표시하는 공간
** <html lang="ko">
-> 웹문서의 콘텐츠가 어떤 언어로 되어있는지를 나타내줌
-> lang - 휴먼랭귀지, language의 약자
-> ko - 우리나라는 korean의 약자 ko, 웹문서 콘텐츠는 한국어로 구성되어있음을 의미
: 한국(korean) - ko
: 영어(english) - en
: 일본(japan) - ja
: 중국어(china) - zh
참고 : TCPSCHOOL, 코리아 교육그룹 멘토 시리즈 교재
'프론트엔드 > HTML' 카테고리의 다른 글
[HTML] HTML 텍스트 태그 1 <h1>~<h6>, <p> (0) | 2022.05.29 |
---|