[기초강좌] HTML 소개 - w3schools 번역 |
![[기초강좌] HTML 소개 - w3schools 번역](https://t1.daumcdn.net/cfile/tistory/27509B3C53002CD021)
w3school 의 강좌 내용을 번역한 글입니다.
원본 : http://www.w3schools.com/html/html_intro.asp
예제 설명
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
* DOCTYPE 은 문서의 type 을 정의한다.
* <html> 과 </html> 사이에 있는 내용들이 웹 페이지를 구성하는 내용이다. ( 보여지는 것도, 안 보여지는 것도 있다. )
* <body> 와 </body> 사에이 있는 내용들은 브라우저에 보여지는 내용이다.
* <h1> 와 </h1> 사이의 내용은 헤더( 역자주 : 일종의 제목 )로 표시된다.
* <p> 와 </p> 사이의 내용은 문단을 구성한다.
cf) <!DOCTYPE html> 은 HTML5 임을 정의하는
HTML 이란 무엇인가?
HTML 은 웹 페이지를 묘사하는 언어이다.
* HTML 은 Hyper Text Markup Language 의 약자이다.
* HTML 은 markup 언어이다. ( 역자주 : markup 이란 "정형화"로 표현할 수 있겠다. )
* markup 언어는 정형화된 tag 들의 집합이다.
* tag 는 문서의 내용을 묘사한다.
* HTML 문서는 tag 와 text 들로 구성되어 있다.
* HTML 문서는 web page 라고도 불린다.
HTML Tags
HTML markup tag 는 보통 HTML tag 라고 불린다.
* HTML tag 는 각진 괄호 (원문: angle brackets) 로 둘러싸여진 키워드 ( tag 이름 ) 으로 구성된다. <html> 과 같이 말이다.
* HTML tag 는 보통 <b> </b> 와 같이 쌍으로 존재한다.
* tag 쌍에서 먼저 오는 녀석이 시작 태그( 원문 : start tag ), 나중에 오는 녀석을 종료 태그 ( 원문 : end tag ) 라고 부른다.
* 종료 태그는 시작 태그와 거의 같지만, tag 이름 전에 / ( 슬래쉬 ) 를 붙여준다.
* 시작 태그와 종료태그는 각각 여는 태그 ( 원문 : opening tag ), 닫는 태그 ( 원문 : closing tag ) 라고도 부른다.
<tagname> context </tagname>
HTML Elements
"HTML tags" 와 "HTML elements" 는 보통 같은 것으로 묘사된다.
하지만 엄밀히 이야기하자면, HTML element 는 start tag 와 end tag 와 그 사이의 내용을 전부 이야기한다.
아래 전체는 HTML Element 이다.
<p>This is a paragraph </p>
Web Browser
웹 브라우저 ( Google Chrome, Internet Explorer, Firefox, Safari ) 의 목적은 HTML 문서를 읽어서 web page 로 표시하는 것이다.
브라우저는 HTML tag 들을 표시하는 않는다. 브라우저는 tag들을 이용하여 사용자에게 웹 페이지를 어떻게 표시할 것인지를 결정한다.
![[기초강좌] HTML 소개 - w3schools 번역](https://t1.daumcdn.net/cfile/tistory/25143C4652FF95D012)
HTML Page Structure
아래는 HTML page 구조를 시각화한 것이다.
![[기초강좌] HTML 소개 - w3schools 번역](https://t1.daumcdn.net/cfile/tistory/24013C3C52FF96000D)
HTML Versions
이전부터 HTML 은 여러 버전이 있어왔다.
HTML : 1991
HTML+ : 1993
HTML 2.0 : 1995
HTML 3.2 : 1997
HTML 4.01 : 1999
XHTML : 2000
HTML5 : 2012
The <!DOCTYPE> Declaration
<!DOCTYPE> 정의는 브라우저가 웬 페이지를 올바르게 표시하는 것을 도와준다.
웹에는 많은 종류의 문서 타입이 있고, 브라우저는 HTML type 과 version 을 제대로 알아야 100% 완벽한 웹 페이지 표시를 할 수 있다.
Common Declaration
HTML5
<!DOCTYPE html>
HTML 4.01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
XHTML 1.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
문서 타입 전체를 보고 싶다면 다음 링크를 클릭하자.
'프로그래밍 놀이터 > Web' 카테고리의 다른 글
| [기초강좌] HTML 기초 - 4개의 예제 - w3schools 번역 (0) | 2014.02.19 |
|---|---|
| [기초강좌] HTML Editors - W3Schools 번역 (0) | 2014.02.17 |
| [CSS] Bower 가 무엇인가? (0) | 2014.02.14 |
| [CSS] Less 란 무엇인가? (0) | 2014.02.10 |
| [CSS] Bootstrap Tutorial #1 - download & setup (0) | 2014.02.08 |
댓글