XHTML
위키백과 ― 우리 모두의 백과사전.
HTML |
---|
XHTML(Extensible Hypertext Markup Language)은 HTML과 동등한 표현 능력을 지닌 마크업 언어로, HTML보다 엄격한 문법을 가진다. HTML이 SGML의 응용인데 반해, 매우 유연한 마크업 언어인 XHTML은 SGML의 제한된 부분집합인 XML의 응용이다. XHTML 문서는 하나의 XML 문서로서 문법적으로 정확해야 하기 때문에, HTML과 달리 표준 XML 라이브러리를 이용한 자동화된 처리가 가능하다. XHTML 1.0은 2000년 1월 26일, W3C의 권고안이 되었다.
목차 |
[편집] 개관
XHTML은 HTML의 후속으로 많은 사람들이 XHTML을 HTML의 "최신 버전"으로 보고 있다. 하지만 HTML과 XHTML은 별개의 분리된 표준이다. W3C는 지속적으로 웹 출판에서 XHTML 1.1, XHTML 1.0, HTML 4.01 등을 이용하길 권장하고 있다. 그리고 HTML 4.01의 후속 버전으로 HTML 5가 개발 중에 있다.
좀 더 엄격한 버전의 HTML의 필요를 느끼게 된 가장 큰 이유는 웹 콘텐츠가 기존의 전통 컴퓨터에서 벗어나 여러 가지 장치(이동기기 등)에서 이용되기 시작하면서, 부정확한 HTML을 지원하는데 필요한 자원이 부족한 환경이 생겨났기 때문이다. 문서가 검사될 수 있도록 문서형 정의(DTD)를 사용해 XHTML 문서를 규정한다.
최신의 웹 브라우저들은 XHTML을 정확하게 표현해 주며, XHTML이 거의 HTML에 포함되기 때문에 구형의 브라우저에서도 별 문제가 없다. 마찬가지로 XHTML을 지원하는 거의 모든 브라우저들은 HTML 역시 정확하게 표현한다. 혹자는 바로 이점이 HTML에서 XHTML으로의 전환을 더디게 하는 이유라고 말한다.
XHTML의 특별히 유용한 기능은 MathML, SVG와 같은 다른 XML 이름 공간의 구성요소들과 섞어 쓸 수 있다는 점이다.
HTML에서 transitional XHTML으로의 변화는 미미하지만 완전한 XML 문서라는 주된 목적이 이루어진다. 가장 중요한 변화는 문서가 정형화(well formed)되고, 모든 HTML 요소(구성요소)들이 닫혀 있어야 한다는 점이다. 덧붙여, XHTML에서는 모든 태그들이 소문자로 작성되어야 한다. 이것은 HTML 2.0이 나오던 때에 대부분이 대문자를 사용하던 관습과는 완전히 대조적이다. XHTML에서는 수치를 포함한 모든 속성은 따옴표로 묶여야 한다. (이것은 SGML에서 강제 사항이 아니었기 때문에 HTML에서도 임의적이었다.) img
와 br
과 같은 빈 태그를 포함한 모든 요소들은 닫혀 있어야 한다. 빈 태그를 닫는 것은 시작 태그에 '/'를 추가함으로써 이루어진다(예: <img … />
, <br />
). 간소화된 속성의 사용 역시 금지된다(예: <option selected>
대신에 <option selected="selected">
). 더 자세한 차이는 W3C의 XHTML 기술 규격을 참고하라 [1].
[편집] XHTML의 버전
[편집] XHTML 1.0
W3C의 XHTML 첫 권고안인 XHTML 1.0은 단순히 HTML 4.01을 XML로 다시 규정한 것이다. XHTML 1.0은 세 가지 문서형이 있는데, 이것은 각각 HTML 4.01 버전들의 범위와 동일하다.
- XHTML 1.0 Strict에서는 문서가 반드시 체계화(well formed)되어야 한다. 이것은 HTML 4.01 Strict의 XML 형식이다.
- XHTML 1.0 Transitional는 XHTML 1.0 Strict에서는 사용되지 않는
<center>
,<u>
,<strike>
,<applet>
요소들의 사용을 허용한다. - XHTML 1.0 Frameset: HTML 프레임셋의 사용을 허용한다.
[편집] XHTML 1.1
가장 최근의 XHTML W3C 권고안은 XHTML 1.1: 모듈 기반의 XHTML이다. 작성자는 자신의 마크업에 프레임셋과 같은 새로운 기능을 도입할 수 있다. 이 버전은 또한 동아시아(특별히 CJK) 언어의 기술을 위해 필요한 ruby 마크업 지원을 포함한다.
이것은 W3C에서 모든 새로운 웹 페이지에 적용하도록 권고하는 기술 규격이다.
[편집] XHTML 2.0 작업 초안 규격
XHTML 2.0에 대한 작업은 2006년 현재, 여전히 진행 중이다. 사실 DTD조차 아직 작성되지 않았다. XHTML 작업 초안은 하위 호환성에 대한 문제 때문에 논쟁이 많아서, 단순히 새 버전을 만들기보다 (X)HTML의 제약을 벗어나는 사실상 새로운 마크업 언어를 제작하게 되었다.
XHTML2.0이 HTML 계열의 마크업 언어에 가져오게 될 새로운 기능들은 다음과 같다:
- HTML 폼(form)은 XForms로 교체된다.
- HTML 프레임은 XFrames로 교체된다.
- DOM 이벤트는 XML DOM을 사용하는 XML 이벤트로 교체된다.
- 네비게이션 목록을 위해 특별히 설계된 새로운 목록 요소인
<nl>
요소가 추가된다. 이것은 현재 다양한 방법을 통해 제작되는 내포된(nested) 메뉴를 제작하는데 유용할 것이다. - 모든 요소에 대한 하이퍼링크가 가능해진다. 예:
<li href="articles.html">Articles</li>
src
속성을 이용해 모든 요소에 대한 대체 메체 기술이 가능해진다. 예:<p src="lbridge.jpg" type="image/jpeg">London Bridge</p>
가<img src="lbridge.jpg" alt="London Bridge" />
를 대체.<img src="" alt="" />
요소는 제거되고<object type="MIME/ContentType" src="">Alt</object>
형태로 대체된다.- 표제 요소들(i.e.
<h1>
,<h2>
,<h3>
등)은<h>
의 단일 요소로 대체된다. 표제의 등급은<h>
에 포함된(nested)<section>
요소에 의해 지시된다. - XHTML 1.x(Strict 포함)에서 여전히 허용되는 표현형 요소인
<i>
,<b>
,<tt>
는 XHTML 2.0에서 빠진다. 표현형 요소는 첨자를 위한<sup>
,<sub>
만이 남게된다.
[편집] 다른 XHTML 계열
- XHTML 베이식: 모든 XHTML 집합을 사용하기 힘든 장치를 위한 "가벼운" 버전의 XHTML으로 이동 전화같은 핸드헬드 기기에 주로 사용된다. 이것은 WML과 C-HTML의 대체를 위해 정의되었다.
- XHTML 모바일 프로필: XHTML 베이식을 기초로 몇 가지 이동 전화 특화된 요소들이 추가된 것으로, 이동 전화에서의 사용을 목적으로 OMA(Open Mobile Alliance)에서 정의했다.
[편집] 유효 XHTML 문서 작성하기
XHTML 규격에 부합하는 XHTML 문서를 유효(valid) 문서라 부른다. 모든 브라우저가 웹 표준을 따르고, 유효한 문서들이 모든 브라우저와 플랫폼에서 표시되는 것이 가장 이상적일 것이다. 하지만 실제로는 유효 XHTML 문서가 항상 크로스-브라우저 호환성을 의미하는 것은 아니며, 그것은 단지 권고 사항일 뿐이다. 문서의 유효성을 검사하기 위해서는 W3C 마크업 유효성 검사 서비스를 사용한다.
[편집] 문서형 선언(DOCTYPE)
유효성 검사를 위해서는, 문서에 문서형 선언(혹은 DOCTYPE)이 포함되어 있어야 한다. DOCTYPE은 브라우저에 어떤 문서형 정의(DTD)를 적용할 것인가를 선언한다. 문서형 선언은 XHTML 문서의 가장 첫 부분에 위치해야 한다. XHTML 문서의 형 선언은 다음과 같다:
- XHTML 1.0 Strict
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">- XHTML 1.0 Transitional
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">- XHTML 1.0 Frameset
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">- XHTML 1.1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
XHTML 문서에서 문자 인코딩은 XML 선언이나 meta http-equiv 문에 반드시 명시되어야 한다. (만약 XML 문서에 인코딩이 기술되어 있지 않다면, 상위 프로토콜에서 미리 지정되지 않는 한, XML 해석기는 UTF-8이나 UTF-16으로 간주한다.)
[편집] 일반적인 오류
다음은 XHTML에서 흔히 있는 오류이다(유효성 검사 프로그램이 한글화되어 있지 않기 때문에 영문을 우선 표기함):
- Not closing empty elements (elements without closing tags) - 닫히지 않은 빈 요소
- 틀림:
<br>
- 옳음:
<br />
- 틀림:
- Not closing non-empty elements - 닫히지 않은 꽉 찬 요소
- 틀림:
<p>This is a paragraph.<p>This is another paragraph.
- 옳음:
<p>This is a paragraph.</p><p>This is another paragraph.</p>
- 틀림:
- Improperly nesting elements (elements must be closed in reverse order) - 부적합한 함유 요소
- 틀림:
<em><strong>This is some text.</em></strong>
- 옳음:
<em><strong>This is some text.</strong></em>
- 틀림:
- Not specifying alternate text for images (using the
alt
attribute, which helps make pages accessible for devices that don't load images or screen-readers for the blind) - 대체 텍스트가 기술되지 않음- 틀림:
<img src="/skins/common/images/poweredby_mediawiki_88x31.png" />
- 옳음:
<img src="/skins/common/images/poweredby_mediawiki_88x31.png" alt="MediaWiki" />
- 틀림:
- Putting text directly in the body of the document - 본문에 직접 텍스트를 삽입
- 틀림:
<body>Welcome to my page.</body>
- 옳음:
<body><p>Welcome to my page.</p></body>
- 틀림:
- Nesting block-level elements within inline elements - 인라인 요소에 블록-레벨 요소를 포함
- 틀림:
<em><h2>Introduction</h2></em>
- 옳음:
<h2><em>Introduction</em></h2>
- 틀림:
- Not putting quotation marks around attribute values - 속성 값을 인용부호로 감싸지 않음
- 틀림:
<td rowspan=3>
- 옳음:
<td rowspan="3">
- 틀림:
- Using the ampersand outside of entities (use
&
to display the ampersand character) - '&' 문자를 직접 사용 ('&'로 대체)- 틀림:
<title>Cars & Trucks</title>
- 옳음:
<title>Cars & Trucks</title>
- 틀림:
- Using uppercase tag names and/or tag attributes - 태그 이름이나 태그 속성에 대문자를 사용
- 틀림:
<BODY><P>The Best Page Ever</P></BODY>
- 옳음:
<body><p>The Best Page Ever</p></body>
- 틀림:
- Attribute minimization - 간소화된 속성 사용
- 틀림:
<textarea readonly>READ-ONLY</textarea>
- 옳음:
<textarea readonly="readonly">READ-ONLY</textarea>
- 틀림:
이것은 완전한 목록은 아니지만 XHTML 코드 작성 시에 흔히 생기는 일반적인 오류들을 포함하고 있다.
[편집] 예
XHTML 1.0 Strict 문서의 한 예이다.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>XHTML Example</title> </head> <body> <p>This is tiny example of an XHTML usage.</p> </body> </html>
[편집] 같이 보기
[편집] 바깥 고리
- W3C의 마크업 홈페이지
- XHTML 1.0 기술 규격
- XHTML 1.1 기술 규격
- XHTML을 text/html로 보내는 것은 위험하다
- XHTML 평가 - XHTML의 장단점
- Trio의 HTML 4.01 기술 규격(한글)
- Trio의 XHTML 1.0 기술 규격(한글)