상세 컨텐츠

본문 제목

[Restart 프론트엔드 스터디] #1. HTML의 정의와 역사, 기본구조

Studying (Review)/HTML

by 잼(JAM) 2022. 8. 3. 18:47

본문

반응형

HTML(Hyper Text Markup Language) 이란?

웹 문서를 작성하는 데에 사용하는 언어로서,

프로그래밍 언어(JavaScript, Java, C 등)들과는 다른 것이다

 

H가 내포한 Hyper Text라는 말에서 알 수 있듯이

다양한 자료들을 참조하고 연결할 수 있는 문서를 작성하는 언어이다.

 

언어이기는 하나

태그 등을 이용하여 문서와 데이터의 구조 정도만을 명기하고 있기에

일반적인 프로그래밍 언어들과는 구별된다.

 

오죽하면 이런 농담까지 나왔을까..


HTML의 역사 (첫 개발부터 HTML4 까지)

1980년, 유럽 입자 물리 연구소(CERN)의 계약자였었던

물리학자 팀 버너스리가 HTML의 원형인 인콰이어를 제안하였다.

 

인콰이어는 CERN의 연구원들이 문서를 이용하고 공유하기 위한 체계였다.

(HTML이 개발되기 시작한 이유이다 - 참조링크)

1989년에 팀 버너스리는 인터넷 기반 하이퍼텍스트 체계를 제안하는 메모를 작성했다.

버너스 리는 1990년 말에 HTML을 명시하고, 브라우저와 서버 소프트웨어를 작성했다.

 

그 해에 버너스리와 CERN 데이터 시스템 엔지니어 로버트 카일리아우와 함께

CERN측에 자금 지원을 요청하였지만, 이 프로젝트는 CERN으로부터 정식으로 채택 받지 못했다.

 

버너스리의 개인적인 기록에 1990년부터

"하이퍼텍스트가 사용되는 여러 분야의 일부"를 열거했다

 

HTML 최초의 일반 공개 설명은 1991년 말에 버너스리가

처음으로 인터넷에서 문서를 "HTML 태그"(HTML tag)로 부르면서 시작되었다.

그것은 머릿글자로 이루어진 20개의 요소를 기술하였고,

상대적으로 HTML의 단순한 디자인이었다.

 

HTML은 동적인 웹 페이지의 웹 브라우저를 통한 문자와 이미지 양식이다.

 

*팀 버너스리는 WWW(World Wide Web) 개념의 창시자로서 W3C의 의장직을 지내고 있다.

 

CERN에서 만든 최초의 웹 사이트 (클릭시 이동)


 

HTML의 기본구조에 대하여

<!DOCTYPE html>
<html lang="ko">
  <head>
    <meta charset="UTF-8">
    <title>HTML 기본 문서</title>
  </head>
  <body>
    <h1>프론트엔드 웹 개발자 되기</h1>
    <hr>
    <p>HTML</p>
    <p>CSS</p>
    <p>JavaScript</p>
  </body>
</html>

 

<!DOCTYPE html> : 문서구조정의

  • 현재 문서가 HTML5로 작성되었음을 알려주는 문서구조정의

(HTML4 이전 스펙에서는 구조정의 코드를 더 길게 작성해야 했으나, HTML5로 넘어오면서 간결해졌다)

 

<html> ~ </html> : 웹 문서의 시작과 끝

  • 현재 문서의 시작과 끝을 나타내는 태그로, 웹 문서 단위의 시작과 끝에 사용한다

 

<head> ~ </head> : 웹 문서의 정보

  • 각종 태그 들을 이용하여 브라우저가 웹 문서를 해석할 때 필요한 정보들을 입력하는 부분
  • 웹 브라우저 상에 보이지는 않지만, 주요한 정보들이 담겨있다

(Ex. <meta> 는 문자세트, 문서 키워드, 문서 설명 등 다양한 정보를 입력할 수 있는 태그이다)

 

<body> ~ </body> : 웹 문서의 내용

  • 각종 태그들을 이용하여 웹 문서의 내용을 정의하고 작성한다
  • 웹 브라우저 상에서 확인가능한 내용들은 다 여기서 작성한다

(Ex. <h1>은 Heading1으로 제목 등을 작성할 때 주로 사용하는 태그이다)

반응형

관련글 더보기

댓글 영역