HTML5 학습하기 ‘HTML과 XHTML에 대하여’

HTML과 XHTML에 대하여

 

1. HTML

 HTML 이란?

 Hyper Text Markup Language의 약어이다. 그리고 Hyper Text기능을 포함한 텍스트와 이미지 등을 웹 브라우저에 표시하는 역할을 한다.

 

 HTML의 특징으로는 웹 문서의 표준 포맷, Markup 언어, ASCII코드로 구성된 일반적인 텍스트파일. 컴퓨터 시스템이나 운영체제에 독립적인 특징을 가지고 있다.

 

1) HTML의 구성요소

 HTML은 태그, 속성, 변수 등의 요소로 구성되는데, 요소(Elements)란 HTML에서 시작 태그와 종료 태그로 이루어진 모든 명령어들을 말한다.

 

 (1) 태그(Tag)

 태그(Tag)란 요소의 하나로서 시작태그와 종료태그로 나뉜다. 태그를 작성 할 때에는

<태그> 내용 </태그>의 형식으로 작성하면 된다.

예시 :　<p> Welcome to Hello World </p>

위 예시에서 시작태그는 <p> 종료태그는 </p> 이다.

 

 (2) 속성(Attributes)

속성(Attributes)이란 조금 더 구체화된 명령어로서, 요소의 시작태그 안에서 사용한다.

예시 :　<p align=“center”> Welcome to Hello World </p>

위 예시에서 시작태그 안에 "중앙정렬＂속성을 사용하여 문장을 가운데로 정렬할 수 있다.

 

(3) 변수(Arguments)

변수(Arguments)란 속성과 관련된 값을 의미를 말한다.

예시 :　<p align=“center”> Welcome to Hello World </p>

위 예시에서 속성을 align으로 정의하였고, 속성에 대한 변수로 center를 사용하였다.

 

2. XHTML이란?

XHTM은 eXtendible HyperText Markup Language의 약어로 HTML을 대체하기 위한 목적으로 만들어진 언어이다.

 

1) XHTML의 주요 특징

XHTML의 주요 특징을 살펴보면 다음과 같다.

① 종료태그가 없는 빈(empty)태그는 스스로 종료한다.

② 빈 태그를 제외한 모든 태그는 반드시 종료태그를 사용해야 한다.

③ 코드를 작성할 때 소문자로 입력해야 한다.

④ 속성태그를 사용했다면 반드시 값을 입력해야 한다.

⑤ 속성값은 반드시 “ ” 안에 작성해 줘야 한다.

 

XHTML을 사용해야 하는 이유는 무엇일까?

경량화를 통한 로딩 속도 향상시킬 수 있고, 유지 비용의 감소 및 재생산성 확대가 가능하다. 또한 호환성 및 확장 가능성이 있기 때문이다.

 

3. HTML과 XHTML의 기본구조 및 차이점

기본적인 구조는 동일하나 문법에서 약간의 차이점이 있다.

 

1) 기본구조

 

문서의 구조 및 소스의 구조는 동일하다. 다만 문범에 차이점이 있다.

 

 

2) HTML/XHTML 차이점

차이점을 비교한 표를 보면 다음과 같다.

	HTML	XHTML
종료태그	종료태그가 없는 것을 허용	반드시 종료태그를 사용
잘못된 중첩	이상 없음	직접적인 영향을 미침
소문자 표기	대소문자 구분 안 함	대소문자 구분
속성값의 따옴표	사용하지 않아도 된다	반드시 따옴표를 사용해야 함
속성 값의 단축 표기	허용	허용하지 않음

 

 

3) XHTML 일반 문법 준수사항 보면 다음과 같다.

 

 (1) 정확한 문서 구조 준수

문서의 루트 요소는 HTML이 되어야 하며, 이 HTML요소는 XHTML 네임 스페이스를 지정해야 한다.

 

 (2) 모든 요소는 완벽하게 중첩

모든 요소들이 완벽하게 내포 되어야 하는 것은 필수적이나, 중첩이 부적합함에도 불구하고 기존 웹 브라우저들에게는 관대하게 사용되기도 한다.

 

 (3) 모든 속성 값은 인용 부호(“ ”)로 묶어야 한다.

코드를 생성하거나 XHTML을 정리할 때 코드에서 속성 값을 인용 부호(““)로 묶는다.

 

 (3) 모든 요소와 속성은 소문자만 사용해야 한다.

HTML 요소 및 속성의 이름을 소문자로 강제 설정

 

 (4) 모든 요소는 닫아야 한다.

모든 요소에는 종료 태그가 포함되어야 한다.

 

 (5) 모든 속성값은 속성이 함께 선언해야 한다.

모든 속성은 최소화되어 표기 되면 안 된다.

 

 (6) 모든 script 및 style 요소에는 type 속성이 포함되어야 한다.

HTML 4 이후로는 script 요소의 type 속성을 반드시 지정해야 한다.

 

 (7) 모든 img 및 area 요소에는 alt 속성이 포함되어야 한다.

코드를 생성하거나 XHTML을 정리할 때 코드에서 이들 속성을 설정해야 한다.

 

이렇게 HTML 과 XHTML에 대해서 알아보았습니다. 다음에는 HTML5에 정의 및 특징에 대해서 알아보도록 하겠습니다.