[XHTML] 11. XHTML 요약

11. XHTML 요약


11.1 XHTML 요약

- 이번 강좌에선 엄격하고 완전한 HTML 페이지를 어떻게 만들어야 되는지를 배웠다.

- 모든 XHTML 엘리먼트는 완벽하게 내포되어져야 한다. XHTML 문서는 잘-구성되어야 한다. 모든 태그 이름은 소문자이고, 모든 XHTML 엘리먼트는 닫혀져 있어야한다.

- 또한 모든 XHTML 문서는 DOCTYPE 선언을 가져야 하고, html, head, title, 그리고 body 엘리먼트는 표현될 수 있다.


11.2 XHTML 다음 단계에 배우게 될 것은?

- 다음 단계는 CSS 와 자바스크립트이다.


* CSS

- CSS는 한 번에 모든 웹 페에지의 스타일과 레이아웃을 조작할 때 사용된다.

- 더불어, CSS의 모든 포맷은 HTML 문서로 부터 제거되고, 구분된 파일 안에 저장된다.

- CSS는 문서 내용의 조작없이, 모든 레이아웃을 조작할 수 있다.


* 자바스크립트

- 자바스크립트는 더욱 동적인 웹페이지를 만들수 있게 한다.

- 정적인 웹 사이트는 고정적인 내용을 보여주길 바랄 때 유용하지만, 동적인 웹 사이트는 이벤트와 유저 상호작용을 바라는 웹 사이트에 유용하다.

- 자바스크립트는 인터넷 상에서 아주 인기있는 스크립팅 언어이고, 모든 주요한 브라우저에서 작동된다.

[XHTML] 10. XHTML 이벤트 속성

10. XHTML 이벤트 속성

- 최근의 HTML 4.0은 사용자가 HTML 엘리먼트를 클릭했을 때, 자바스크립트의 시작과 같은 브라우저 내에서 이벤트 행위를 유발하게 할 수 있다.


10.1 윈도우 이벤트

- body 그리고 frameset 엘리먼트 내에서만 유효하다.


10.2 폼 엘리먼트 이벤트

- form 엘리먼트 내에서만 유효하다.


10.3 키보드 이벤트

- base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, 그리고 title 엘리먼트 내에서는 유효하지 않다.


10.4 마우스 이벤트

- base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, 그리고 title 엘리먼트 내에서는 유효하지 않다.

[XHTML] 9. XHTML 표준 속성

9. XHTML 표준 속성

- XHTML 태그는 속성을 가질 수 있다. 각각의 태그를 위한 특별한 속성은 아래 리스트에 묘사했다. 아래의 코어 그리고 언어 속성 리스트는 모든 태그의 표준이다.(몇몇은 제외하고)


9.1 코어 속성

- base, head, html, meta, param, script, style, 그리고 title 엘리먼트에서는 유효하지 않다.



9.2 언어 속성

- base, br, frame, frameset, hr, iframe, param, 그리고 script 엘리먼트에서는 유효하지 않다.



9.3 키보드 속성

[XHTML] 8. XHTML Modularization

8. XHTML Modularization

- XHTML modularization-모델은 XHTM의 모듈을 정의한다.


8.1 왜 XHTML 모듈화를 하는가?

- XHTML은 간단하다. 그러나, 대규모 언어이다. XHTML은 웹 개발자가 필요로하는 대부분 함수화를 포함한다.

- 어떤 면에서 XHTML은 매우 대규모이며, 복잡하고, 또 다른 면에선, 매우 간단하다.

- XHTML을 모듈로 나눔으로써, W3C는 소규모 장치를 위해, 작게 만들 수 있고, 개별적으로 사용될 수 있는 XHTML 엘리먼트의 잘-정의된 집합을 만들 수 있거나, 대규모 그리고, 보다 복잡한 응용프로그램에서 다른 XML 표준을 결합할 수 있다.

- 디자이너는 XHTML 모듈을 이용해서 다음과 같은 것을 할 수 있다:

* 장치를 지원하는 엘리먼트를 선택함으로써, 표준 XHTML 빌딩 블락을 이용할 수 있다.

* XHTML을 추가할 목적으로, XHTML 표준의 방해 없이, XML을 이용할 수 있다.

* hand held 컴퓨터, 모바일 폰, TV 그리고, 홈 애플리케이션 같은 장치를 위한 XHTML을 단순화 할 수 있다.

* 새로운 XML 함수화(MathML, SVG, Voice 그리고 Multimedia와 같은)를 추가함으로써 복잡한 애플리케이션을 위한 XHTML을 확장할 수 있다.

* XHTML 기초(모바일 장치를 위한 XHTML의 부분)처럼 XHTML 개요를 정의 할 수 있다.


8.2 XHTML 모듈

- W3C는 XHTML에 28개의 모듈로 분할 정의하고 있다.


- 비난받는 엘리먼트는 XHTML내에서 사용할 수 없다.

[XHTML] 7. XHTML Validation

7. XHTML Validation

- XHTML 문서는 문서 타입 정의에 대해서 유효해야 한다.


7.1 유효한 XHTML 과 DTD

- XHTML 문서는 문서 타입 정의(DTD)에 대해서 유효해야 한다. XHTML 파일이 적절하게 유효하기 전에, 파일의 첫 라인에 올바른 DTD를 추가해야 한다.

- 엄격한 DTD는 비난받지 않거나, 프레임셋에서 나타나지 않게하기 위해서 엘리먼트와 속성을 포함한다.

!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"


- Transitional DTD는 엄격한 DTD안에 더해서 비난받는 엘리먼트와 속성의 모든것까지 포함한다.

!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"


- Frameset DTD는 transitional DTD안에 더해서 프라임까지도 포함한다.

!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"


- 다음은 간단한 XHTML 문서 예제이다.

[XHTML] 6. XHTML HowTo

6. XHTML HowTo


6.1 DOCTYPE 정의가 추가된다.

- DOCTYPE 선언은 모든 페이지의 첫 번째 라인에 추가된다:

- 우리는 transitional DTD를 사용했다. strict DTD를 취했지만, 너무나도 "엄격"해서, 일치시키는데 약간의 어려움이 있었다.


6.2 DOCTYPE에 관한 노트

- 올바른 XHTML의 정당성을 입증하길 바란다면, 페이지는 DOCTYPE 선언을 가져야한다.

- 그러나, 새로운 브라우저(인터넷 익스플로러 6 같은)는 문서를 선언에 의존하여 다르게 취급한다는 것을 알아챘을 것이다. 만약 브라우저가 DOCTYPE 문서를 읽었다면, "올바른" 문서로 취급했다는 것이다. 기형의 XHTML은 불규칙적이고, DOCTYPE 없이, 보다 다르게 나타낸다.


6.3 소문자 태그와 속성 이름

- XHTML는 대,소문자를 구별한다. 그리고, XHTML은 소문자 HTML 태그와 속성 이름을 취한다. 일반적인 검색과 함수 교체는 모두 대문자 태그가 소문자 태그로 교체되어 실행된다. 속성 이름 또한, 그러하다. 우리는, 자신의 웹에서 소문자 이름을 이용해야한다. 그래서, 대신하는 함수가 현실적으로 대용되지 않도록 한다.


6.4 모든 속성은 따옴표 사이에 위치한다.

- W3C XHTML 1.0 Recommendation 상태이후, 모든 속성 값은 따옴표 사이에 위치해야한다. 웹 내에서 모든 페이지는 속성 값이 알맞게 따옴표 사이에 위치되었는지 체크해 봐야 한다. 이것은 시간-소비 작업이고, 우리는 확실하게 우리의 속성 값 주변을 따옴표로 둘러쌓야 한다는 것을 잊으면 안될것이다.


6.5 엠티 태그: <hr>, <br> 그리고 <img>

- 엠티 태그는 XHTML에서 받아지지 않는다. <hr> 그리고 <br> 태그는 <hr />,
<br />로 교체되어야 한다.

- 이것은 네스케이프에서 잘못 해석되는 <br/>태그 문제를 줄여준다. 왜 그런지 알지 못하지만, <br /> 로 작업하는 것이 편하다. 일반적인 검색과 함수 교체는 태그의 교환을 목적으로 실행된다는 것을 나중에 발견하게 된다.

- 다른 태그(<img> 태그 같은)는 위에서 언급한 같은 문제로 고통이 수반된다. 우리는 <img> 태그에 </img> 종료 태그를 사용하지는 않지만, 태그의 끝에 />를 넣어야 한다. 이것이 메뉴얼이다.


6.6 웹 사이트는 유효해야 한다.

- 결국, 모든 페이지는 공식적인 W3C DTD와 함께 다음 링크 XHTML Validator에서 다시 한 번 정당성을 입증해야한다. 소수의 에러가 발견되면, 수작업으로 고쳐야한다. 일반적인 에러는 리스트 내부의 </li> 태그이다.

- TIDY의 교환 툴을 이용할 수도 있다.

- Dave Raggett의 HTML TIDY는 완전한 HTML 코드를 위한 프리 유틸리티이다.

- Tidy를 이용하지 않은 이유는 웹 사이트를 작성할 당시, 우리는 XHTML에 관한 모든 것을 알고 있었다. 우리는 소문자 태그 이름과 속성은 따옴표 안에 넣어야 한다는 것을 알고 있었다. 그래서, 변환해야 할 시기에 다다랐을 때, W3C XHTML validator을 이용하여, 약간의 에러를 올바르게 수정할 수 있었다.

[XHTML] 5. XHTML DTD

5. XHTML DTD

- XHTML 표준은 세 가지의 문서 타입 정의를 정의한다.

- 가장 일반적인것은 XHTML Transitional이다.


5.1 <!DOCTYPE>은 강제적이다.

- XHTML 문서는 세개의 주요한 부분으로 구성된다:

* DOCTYPE

* Head

* Body

- 기본적인 문서 구조는:

- DOCTYPE은 항상 XHTML 문서내에서 첫번째 줄에 선언되어야 한다.


5.2 XHTML 예제

- 다음은 최소 XHTML 문서 예제다:

- DOCTYPE 선언은 문서 타입을 정의한다:

- HTML와 닮은 문서의 나머지:


5.3 세 가지 문서 타입 정의들

- DTD는 SGML내에서 웹 페이지의 신택스를 지정한다.

- DTD는 HTML 처럼, 특별한 타입 문서의 마크업 적용, 일련의 엘리먼트 포함, 그리고 엔티티 선언의 지정, 같은 SGML 응용으로 사용된다.

- XHTML은 SGML 문서 타입 정의, 또는 'DTD' 내에서 지정된다.

- XHTML DTD는 컴퓨터 신택스와 XHTML 마크업의 문법을 받아들이고, 컴퓨터-읽기쉬운 언어로 정확하게 묘사된다.

- 현재 세 가지의 XHTML 문서 타입이 있다:

* STRICT

* TRANSITIONAL

* FRAMESET

- XHTML 1.0은 세 가지 DTD에 부합하는, 세 가지 XML 문서 타입을 지정한다:Strict, Transitional, 그리고 Frameset


5.4 XHTML 1.0 Strict

- 이것은 표상적인 어지러움의 자유로 부터, 정말 완전한 마크업을 바랄 때 이용한다. 이것은 캐스케이딩 스타일 시트와 함께 이용한다.


5.5 XHTML 1.0 Transitional

- 이것은 HTML의 표상적인 특징의 광고를 필요로 하거나, 캐스케이딩 스타일 시트를 이해하지 못하는, 브라우저를 지원하길 바랄 때 이용한다.


5.6 XHTML 1.0 Frameset

- 브라우저 윈도우 안에, 2개 또는 그 이상의 프레임을 나누는 HTML 프레임을 이용하길 바랄 때 이용한다.

[XHTML] 4. XHTML 신택스

4. XHTML 신택스

- XHTML을 작성할 때, 클린 HTML 신택스를 요구한다.


4.1 추가적인 XHTML 신택스 규칙:

- 속성 이름은 소문자여야 한다.

- 속성 값은 따옴표 속에 넣는다.

- 속성 최소화는 금지되어야 한다.

- 이름 속성은 id 속성으로 교체되어야 한다.

- XHTML DTD는 강제적인 엘리먼트를 정의한다.


4.2 속성 이름은 소문자여야 한다.

- 이것은 잘못된 표현이다.

- 이것은 올바른 표현이다.


4.3 속성 값은 따옴표 속에 넣는다.

- 이것은 잘못된 표현이다.

- 이것은 올바른 표현이다.


4.4 속성 최소화는 금지되어야 한다.

- 이것은 잘못된 표현이다.

- 이것은 올바른 표현이다.

- 다음 리스트는 HTML 내에서 최소 속성을 XHTML에서는 어떻게 사용되어야 하는지를 보여준다:


4.5 이름 속성은 id 속성으로 교체되어야 한다.

- HTML 4.01은 a, applet, frame, iframe, img, 그리고 map 엘리먼트를 위한 이름 속성을 정의한다. XHTML내에서 이름 속성은 비난받는다. 대신에 id를 사용해야 한다.

- 이것은 잘못된 표현이다.

- 이것은 올바른 표현이다.

- Note: 오래된 브라우저를 사용하는 동안에는, 다음과 같이, 동일한 속성 값으로 id와 이름 속성을 모두 사용해야 한다.

- Important Compatibility Note: 오늘날 브라우저에서 XHTML을 작성할 때에는, "/" 심볼전에 여유 공간을 추가해야 한다.


4.6 Lang 속성

- lang 속성은 거의 모든 XHTML 엘리먼트에서 적용된다. 엘리먼트 내에서, 내용의 언어를 지정한다.

- 엘리먼트 내에서 lang 속성을 사용하려면, 다음과 같은, xml:lang 속성을 추가시켜야 한다.


4.7 강제적인 XHTML 엘리먼트

- 모든 XHTML 문서는 DOCTYPE 선언을 가져야한다. html, head 그리고 body 엘리먼트는 있어야하고, title은 head 엘리먼트 내부에 있어야 한다.

- 다음은 최소 XHTML 문서 템플릿이다:


- Note: DOCTYPE 선언은 XHTML 문서의 부분이 아니다. XHTML 엘리먼트를 선언하지 않으면, 닫기 태그를 가질 수 없다.

- 다음장에서 XHTML 문서 타입 정의에 대해서 배운다.

[XHTML] 3. XHTML과 HTML의 차이점

3. XHTML과 HTML의 차이점

- 우리는 엄격한 HTML 작성을 위한 시작으로 XHTML을 준비 할 수 있다.


3.1 XHTML을 어떻게 준비할 것인가?

- XHTML은 HTML 4.01 표준과 아주 다른 것이 아니다.

- 그래서, 4.01 표준을 보는 것은 유용하다. 참고로 HTML 4.01 참조를 확인한다.

- 추가해서, 소문자로 HTML 코드를 작성하고, 엔딩 태그( </p> 와 같은 )는 결코, 건너뛰지 마라.


3.2 가장 중요한 차이점:

- XHTML 엘리먼트는 정확하게 내포되어야 한다.

- XHTML 엘리먼트는 항상 닫혀져 있어야 한다.

- XHTML 엘리먼트는 소문자여야 한다.

- XHTML 문서는 하나의 루트 엘리먼트를 가져야 한다.


3.3 XHTML 엘리먼트는 정확하게 내포되어야 한다.

- HTML에서, 몇몇 엘리먼트는 다음 처럼, 각각 알맞지 않은 내부에 내포될 수 있다.

- XHTML에서, 모든 엘리먼트는 다음 처럼, 각각 알맞게 내부에 내포되어 있어야 한다.

- Note: 리스트 내포의 일반적인 실수는 리스트 내부에 <li> 와 </li>와 태그 없이 사용하면 안된다는 것을 잊어버리는 것이다.

- 이것은 잘못된 표현이다.

- 이것은 올바른 표현이다.

- "올바른" 코드 예제에서 </ul> 태그 후에 </li> 태그를 삽입되어야 한다는 것을 알아채야한다.


3.4 XHTML 엘리먼트는 항상 닫혀져 있어야 한다.

- Non-Empty 엘리먼트는 종료 태그를 가져야 한다.

- 이것은 잘못된 표현이다.

- 이것은 올바른 표현이다.


3.5 엠티 엘리먼트는 또한 닫혀져 있어야 한다.

- 엠티 엘리먼트는 종료 태그를 가지거나, 시작 태그는 />와 종료되어야 한다.

- 이것은 잘못된 표현이다.

- 이것은 올바른 표현이다.


3.6 XHTML 엘리먼트는 소문자여야 한다.

- XHTML 명세서에는 태그 이름과 속성은 소문자여야 한다고 정의되어 있다.

- 이것은 잘못된 표현이다.

- 이것은 올바른 표현이다.


3.7 XHTML 문서는 하나의 루트 엘리먼트를 가져야 한다.

- 모든 XHTML 엘리먼트는 루트 엘리먼트 내부에 내포되어져야 한다. 나머지 모든 엘리먼트는 하위(자식) 엘리먼트를 가질수 있다. 하위 엘리먼트는 짝과 그들 부모 엘리먼트내에서 올바르게 내포하고 있어야 한다. 기본적인 문서 구조는 :

[XHTML] 2. 왜 XHTML인가?

2. 왜 XHTML인가?

- XHTML은 HTML과 XML(EXtensible Markup Language)의 결합이다.

- XHTML은 HTML 4.01내의 모든 엘리먼트와 XML의 문법으로 구성되어 있다.

2.1 왜 XHTML인가?

- 우리는 웹상에서 "불량한" HTML이 포함된 다수의 페이지를 보게 되었다.

- 아래 HTML 코드는 브라우저에서는 보이지만, HTML 규칙에는 어긋나는 예이다.

- XML은 "잘 구성된" 문서의 결과를 올바르게 표시하는 마크업 언어이다.

- XML은 데이터를 묘사하기 위해 디자인 되었고, HTML은 데이터를 나타내기 위해 디자인 되었다.

- 오늘날의 마켓은 서로 다른 브라우저 기술로 구성된다. 몇몇 브라우저는 컴퓨터상의 인터넷에서 실행되고, 몇몇 브라우저는 모바일 폰과 핸드 헬드상의 인터넷에서 실행된다. 마지막으로 언급할 것은, "불량한" 마크업 언어를 번역하기위한 리소스나 파워를 가지면 안된다는 것이다.

- 그러므로, HTML과 XML 그리고, 그들의 장점의 조합으로, 현재와 미래에 유용한 마크업 언어는 XHTML이다.

- XHTML 페이지는 모든 XML 장치를 활성화시켜 읽을 수 있게 하고, XML을 지원하는 브라우저로 업그레이드될 때까지 세상에 남아 기다린다. XHTML은 "잘 구성된" 문서를 작성하기 위해 주워졌고, 지금은, 이전 브라우저와 공존하는, 모든 브라우저에서 작동된다.

[XHTML] 1. XHTML의 개요

1. XHTML의 개요

- XHTML은 HTML의 엄격하고 완전한 HTML 버전이다.


1.1 배우기전에 알아야 할 것들

- XHTML을 배우기전에 선행되어야 하는 학습:

* HTML 그리고, 웹 페이지 작성의 기초지식


1.2 XHTML이란?

- XHTML은 EXtensible HyperText Markup Language의 약자이다.

- XHTML은 HTML 교체를 목적으로 한다.

- XHTML은 HTML 4.01과 거의 동일하다.

- XHTML은 HTML의 엄격하고 완전한 HTML 버전이다.

- XHTML은 XML 응용처럼 HTML이 정의된다.

- XHTML은 W3C Recommendation이다.


1.3 XHTML은 W3C Recommendation이다.

- XHTML 1.0은 2000년 01월 26일 W3C Recommendation 되었다.

- W3C는 HTML의 최종 버전처럼 XHTML이 정의된다. XHTML은 차차 HTML을 대신할 것이다.


1.4 새로운 모든 브라우저는 XHTML을 지원한다.

- XHTML은 HTML 4.01과 공존한다.

- 새로운 모든 브라우저는 XHTML을 지원한다.