의견.png

"XHTML"의 두 판 사이의 차이

위키원
이동: 둘러보기, 검색
26번째 줄: 26번째 줄:
 
XHTML을 사용할 때, 작성된 페이지가 XHTML로 작성되었음을 알려주기 위해 네임스페이스를 지정해줘야한다. 특정 네임스페이스를 지정하게되면 확장성 있는 XML 형식의 문서를 지원할 수 있다. 먼저 XHTML은 HTML과 XML의 조합으로 만들어졌기 때문에 HTML과 XML 기반의 브라우저와 상호 교환이 가능하고, HTML과 XML을 결합한 구조적인 HTML이기 때문에 기계가 이해하기 쉽다. 즉, 색상, 글꼴 형식, 레이아웃 등 사람의 눈으로 볼 수 있는 표현적인 요소가 완전히 배제되어 있기에 확장성이 높다. 다음은 재생산성이 확대된다. 기존의 HTML로 웹 페이지를 구성할 경우 디자인을 바꾸기 위해서는 모든 HTML문서를 수정해야하는 불편함이 따랐다. 하지만 XHTML은 구조와 표현이 분리되어 있기 때문에 CSS파일만 수정하면 전체적인 디자인 변경이 가능하기에 유지비용이 감소되고 생산성이 증가하게된다. 세번째, 재사용이 용이하다. XHTML은 논리적인 구조이기 때문에 다른 플랫폼에서 콘텐츠를 좀 더 쉽게 다시 사용할 수 있다. 네번째, 경량화를 통해 로딩 속도를 향상시킬 수 있다. 앞서 말했듯이 XHTML은 구조화된 문서이기 때문에 가독성이 높으며, 표현 요소를 분리할 경우 웹 페이지의 로딩 속도를 향상시킬 수 있다.  <ref name="Code Dragon">〈[https://codedragon.tistory.com/3335 XHTML(eXtendibleHyperTextMarkup Language), 문법, 특징]〉, 《개인블로그》</ref> <ref name="WEBDIR">〈[https://webdir.tistory.com/35 XHTML1.0]〉, 《개인블로그》, 2012 </ref>
 
XHTML을 사용할 때, 작성된 페이지가 XHTML로 작성되었음을 알려주기 위해 네임스페이스를 지정해줘야한다. 특정 네임스페이스를 지정하게되면 확장성 있는 XML 형식의 문서를 지원할 수 있다. 먼저 XHTML은 HTML과 XML의 조합으로 만들어졌기 때문에 HTML과 XML 기반의 브라우저와 상호 교환이 가능하고, HTML과 XML을 결합한 구조적인 HTML이기 때문에 기계가 이해하기 쉽다. 즉, 색상, 글꼴 형식, 레이아웃 등 사람의 눈으로 볼 수 있는 표현적인 요소가 완전히 배제되어 있기에 확장성이 높다. 다음은 재생산성이 확대된다. 기존의 HTML로 웹 페이지를 구성할 경우 디자인을 바꾸기 위해서는 모든 HTML문서를 수정해야하는 불편함이 따랐다. 하지만 XHTML은 구조와 표현이 분리되어 있기 때문에 CSS파일만 수정하면 전체적인 디자인 변경이 가능하기에 유지비용이 감소되고 생산성이 증가하게된다. 세번째, 재사용이 용이하다. XHTML은 논리적인 구조이기 때문에 다른 플랫폼에서 콘텐츠를 좀 더 쉽게 다시 사용할 수 있다. 네번째, 경량화를 통해 로딩 속도를 향상시킬 수 있다. 앞서 말했듯이 XHTML은 구조화된 문서이기 때문에 가독성이 높으며, 표현 요소를 분리할 경우 웹 페이지의 로딩 속도를 향상시킬 수 있다.  <ref name="Code Dragon">〈[https://codedragon.tistory.com/3335 XHTML(eXtendibleHyperTextMarkup Language), 문법, 특징]〉, 《개인블로그》</ref> <ref name="WEBDIR">〈[https://webdir.tistory.com/35 XHTML1.0]〉, 《개인블로그》, 2012 </ref>
  
 +
==문법==
 +
:{|class=wikitable cellpadding="10" cellspacing="0" border="1"
 +
|+
 +
!width = "150px"| 문법(규칙)
 +
!width ="550px"| 설명
 +
|-
 +
|width ="150px" align="center" style="font-weight:bold"| 정확한 문서 구조
 +
|width ="550px"| XHTML 네임스페이스를 지정해야하며, 문서에는 head, title, body의 구조 요소가 포함되어야 한다.
 +
|-
 +
|width ="150px" align="center" style="font-weight:bold"| 완변한 중첩 구현
 +
|width ="550px"| 요소들을 중첩하여 사용할 시 중첩이 완변하게 구현되어야 한다.
 +
|-
 +
|width ="150px" align="center" style="font-weight:bold"| 모든 속성값의 인용부호("") 지정
 +
|width ="550px"| 요소에 포함되는 속성값은 반드시 값을 입력해야하며, 속성값은 인용부호("")로 감싸줘야한다.
 +
|-
 +
|width ="150px" align="center" style="font-weight:bold"| 속성값은 속성과 함께 선언
 +
|width ="550px"| 모든 속성은 최소화되어 표기되어선 안되며 선언된 속성의 속성값은 모두 작성해줘야한다.
 +
|-
 +
|width ="150px" align="center" style="font-weight:bold"| 소문자 사용
 +
|width ="550px"| 모든 요소와 속성은 소문자로만 사용이 가능하다. XHTML을 구성하고 있는 XML은 대소문자를 구별하기 때문이다.
 +
|-
 +
|width ="150px" align="center" style="font-weight:bold"| 종료태그 사용
 +
|width ="550px"| 모든 요소에는 반드시 종료태그로 닫아야하며, 종료태그가 없는 빈 태그는 자동으로 종료된다. 단, XML을 사용할 수 없는 브라우저와의 호환성을 위해 종료 태그 사용시 태그 앞에 〈br /〉 이와 같이 공백이 있어야 한다.
 +
|-
 +
|width ="150px" align="center" style="font-weight:bold"| script 및 style 요소에는 type 속성 명시
 +
|width ="550px"| HTML4 이후로 script의 요소의 type 속성은 반드시 지정해야한다.
 +
|-
 +
|width ="150px" align="center" style="font-weight:bold"| image 및 area 요소
 +
|width ="550px"| 모든 image 및 area요소를 사용할 시에 alt 속성을 반드시 설정해야한다.
 +
|-
 +
|width ="150px" align="center" style="font-weight:bold"| 프래그먼트 식별자는 id속성
 +
|width ="550px"| XHTML은 프래그먼트 식별자에서 끝에 URI는 속성과 함께 요소들을 언급하지않고, id속성을 가진 요소들을 언급한다. 그러므로 프래그먼트 식별자는 name속성이 아니라 id속성으로 되어야한다. 단, 오래된 브라우저의 호환을 고려한다면 name속성과 id속성을 함께 사용해야한다.
 +
|}
  
 
{{각주}}
 
{{각주}}
31번째 줄: 64번째 줄:
 
==참고자료==
 
==참고자료==
 
* 위키피디아,〈[https://ko.wikipedia.org/wiki/XHTML XHTML]〉, 《위키피디아》, 2020-06-06
 
* 위키피디아,〈[https://ko.wikipedia.org/wiki/XHTML XHTML]〉, 《위키피디아》, 2020-06-06
 +
* Code Dragon,〈[https://codedragon.tistory.com/3335 XHTML(eXtendibleHyperTextMarkup Language), 문법, 특징]〉, 《개인블로그》
 +
* WEBDIR,〈[https://webdir.tistory.com/35 XHTML1.0]〉, 《개인블로그》, 2012
  
 
== 같이 보기 ==
 
== 같이 보기 ==

2020년 9월 1일 (화) 12:03 판

XHTML(엑스에이치티엠엘)은 "Extensible Hypertext Markup Language"의 약자로서, 기존 HTML보다 엄격한 문법을 가진 웹사이트 코딩 언어이다. 기존 HTML은 다소 부정확한 코딩이 있어도 PC 브라우저에서 잘 처리해 주었으나, 인터넷 접속 기기가 PC뿐 아니라 스마트폰, 태블릿 PC 등 다양한 기기로 확대됨에 따라 부정확한 코딩을 처리하기 위해 불필요한 자원을 낭비하게 되었다. 이를 막기 위해 "모든 태그는 반드시 닫혀야 한다."는 등 엄격한 문법을 지키는 XHTML을 사용할 수 있다. 2014년 HTML5가 배포되어 기존 XHTML의 모든 기능을 포함하게 되었다.

개요

XHTML은 2000년 1월을 기준으로 W3C 권장 사항이며 HTML과 XML의 조합니다. XHTML에서는 HTML과 달리 모든 것을 마크업해야한다. 이를 통해 형식화된 문서가 생성되는데 오늘날엔 다른 브라우저 기술이 널리 사용되기 때문에 매우 중요하다. XHTML은 XML의 강점인 데이터 설명용으로 설계된 것과 HTML의 강점인 데이터 표시용으로 설계된 것을 결합하여 엄격하게 형식화된 마크업 언어를 제공하기 때문에, 형식이 잘못된 마크업 언어로 페이지를 해석할 일이 없다.[1] 하지만 아직까지도 HTML을 사용하는 개발자들이 많다. 이는 XHTML이 HTML에 해당하는 내용을 거의 포함하고 있기 때문이다. 최신 웹 브라우저들은 XHTML을 정확히 표현해주고 있기에 XHTML을 지원하는 거의 모든 브라우저들이 HTML을 완벽히 지원해주는것과 같은것이 된다. 즉, XHTML을 정확히 구현하지않아도 실행되기 때문에 W3C에선 XHTML 이용을 권장하지만 이에 대한 전환이 더디게 이뤄지고 있다. [2]

배경

많은 사람들은 XHTML을 HTML의 최신버전으로 생각한다. 하지만 HTML과 XHTML은 별개의 분리된 표준이다. W3C는 지속적으로 웹 출판에서 XHTML 1.1, XHTML 1.0, HTML 4.01 등을 이용하길 권장하고 있다. XHTML이 나오게된 가장 큰 이유는 웹 콘텐츠가 기존의 전통 컴퓨터에서 벗어나 여러가지 이동기기에서 이용되기 시작하면서, 부정확한 HTML을 지원하는데 필요한 자원이 부족한 환경이 생겨났기 때문이다. [2]

역사

XHTML 1.0

W3C의 XHTML 첫 권고안인 XHTML 1.0은 단순히 HTML 4.01을 XML로 다시 규정한 것이다. XHTML 1.0은 3가지 문서형이 있는데 이것은 각각 HTML 4.01 버전들의 범위와 동일하다. [2]

  • XHTML1.0 Strict - 문서가 반드시 체계화되어야 한다. 이것은 HTML 4.01 Strict의 XML 형식이다.
  • XHTML1.0 Transitional - XHTML 1.0 Strict에서는 사용되지않는 몇몇 요소들의 사용을 허용한다.
  • XHTML1.0 Frameset - HTML 프레임셋의 사용을 허용한다.

XHTML 1.1

가장 최근의 XHTML W3C 권고안은 XHTML 1.1: 모듈 기반의 XHTML이다. 작성자는 자신의 마크업에 프레임셋과 같은 새로운 기능을 도입할 수 있다. 이 버전은 동아시아 언어의 기술을 위해 필요한 RUBY 마크업 지원을 포함한다. 또한 W3C에서 모든 새로운 웹 페이지에 적용하도록 권고하는 기술 규격이다.

XHTML 2.0

XHTML는 2002년부터 2006년까지 총 8번의 XHTML 2.0 초안을 W3C에서 발표한다. 하지만 하위 호환성 문제와 HTML5에 의해 XHTML 2.0은 2009년에 개발이 중단된다. [3] 발표됐었던 XHTML 2.0 초안에 대한 내용을 간단히 설명하자면 하위 호환성에 대한 문제 때문에 논쟁이 많아, 단순히 새 버전을 만들기보단 HTML의 제약을 벗어나는 사실상 새로운 마크업 언어를 제작하도록 계획되있었다. XHTML 2.0이 HTML 계열의 마크업 언어에 가져오게 될 새로운 기능은 첫번째, HTML 폼(form)과 프레임(frame), DOM 이벤트는 XForms와 XFrames, XML DOM을 사용하는 XML 이벤트로 교체된다. 두번째, 내비게이션 목록을 위해 특별히 설계된 새로운 목록 요소인 〈nl〉 요소가 추가된다. 이 요소는 현재 다양한 방법을 통해 제작되는 내포된 메뉴를 제작하는데 유용하다. 세번째, 모든 요소에 대한 하이퍼링크가 가능해진다. 요소 내부에 'href' 속성을 이용하여 url을 지정하여 링크를 생성할 수 있다. 네번째, src 속성을 이용해 모든 요소에 대한 대체 매체 기술이 가능해진다. 예를들면 img 요소를 사용하지않아도 다른 요소 내부에 src 속성을 이용하여 이미지를 삽입할 수 있다. 다섯번째, 표제 요소들은 〈h〉의 단일 요소로 대체된다. 단, 표제의 등급은 〈h〉에 포함된 〈section〉요소에 의해 나눌 수 있다. 여섯번째, XHTML 1.x에서 여전히 허용되는 표현형 요소인 〈i〉, 〈b〉, 〈tt〉는 XHTML 2.0에서 빠지게 된다. 표현형 요소는 첨자를 위한 〈sup〉, 〈sub〉만 남게 된다. [2]

XHTML5

XHTML5는 HTML5 초안에서 HTML5와 함께 정의되었다. [4]

특징

XHTML을 사용할 때, 작성된 페이지가 XHTML로 작성되었음을 알려주기 위해 네임스페이스를 지정해줘야한다. 특정 네임스페이스를 지정하게되면 확장성 있는 XML 형식의 문서를 지원할 수 있다. 먼저 XHTML은 HTML과 XML의 조합으로 만들어졌기 때문에 HTML과 XML 기반의 브라우저와 상호 교환이 가능하고, HTML과 XML을 결합한 구조적인 HTML이기 때문에 기계가 이해하기 쉽다. 즉, 색상, 글꼴 형식, 레이아웃 등 사람의 눈으로 볼 수 있는 표현적인 요소가 완전히 배제되어 있기에 확장성이 높다. 다음은 재생산성이 확대된다. 기존의 HTML로 웹 페이지를 구성할 경우 디자인을 바꾸기 위해서는 모든 HTML문서를 수정해야하는 불편함이 따랐다. 하지만 XHTML은 구조와 표현이 분리되어 있기 때문에 CSS파일만 수정하면 전체적인 디자인 변경이 가능하기에 유지비용이 감소되고 생산성이 증가하게된다. 세번째, 재사용이 용이하다. XHTML은 논리적인 구조이기 때문에 다른 플랫폼에서 콘텐츠를 좀 더 쉽게 다시 사용할 수 있다. 네번째, 경량화를 통해 로딩 속도를 향상시킬 수 있다. 앞서 말했듯이 XHTML은 구조화된 문서이기 때문에 가독성이 높으며, 표현 요소를 분리할 경우 웹 페이지의 로딩 속도를 향상시킬 수 있다. [5] [6]

문법

문법(규칙) 설명
정확한 문서 구조 XHTML 네임스페이스를 지정해야하며, 문서에는 head, title, body의 구조 요소가 포함되어야 한다.
완변한 중첩 구현 요소들을 중첩하여 사용할 시 중첩이 완변하게 구현되어야 한다.
모든 속성값의 인용부호("") 지정 요소에 포함되는 속성값은 반드시 값을 입력해야하며, 속성값은 인용부호("")로 감싸줘야한다.
속성값은 속성과 함께 선언 모든 속성은 최소화되어 표기되어선 안되며 선언된 속성의 속성값은 모두 작성해줘야한다.
소문자 사용 모든 요소와 속성은 소문자로만 사용이 가능하다. XHTML을 구성하고 있는 XML은 대소문자를 구별하기 때문이다.
종료태그 사용 모든 요소에는 반드시 종료태그로 닫아야하며, 종료태그가 없는 빈 태그는 자동으로 종료된다. 단, XML을 사용할 수 없는 브라우저와의 호환성을 위해 종료 태그 사용시 태그 앞에 〈br /〉 이와 같이 공백이 있어야 한다.
script 및 style 요소에는 type 속성 명시 HTML4 이후로 script의 요소의 type 속성은 반드시 지정해야한다.
image 및 area 요소 모든 image 및 area요소를 사용할 시에 alt 속성을 반드시 설정해야한다.
프래그먼트 식별자는 id속성 XHTML은 프래그먼트 식별자에서 끝에 URI는 속성과 함께 요소들을 언급하지않고, id속성을 가진 요소들을 언급한다. 그러므로 프래그먼트 식별자는 name속성이 아니라 id속성으로 되어야한다. 단, 오래된 브라우저의 호환을 고려한다면 name속성과 id속성을 함께 사용해야한다.

각주

  1. XML과 XHTML의 차이점-2020-기술〉, 《BETWEENMATES》
  2. 2.0 2.1 2.2 2.3 XHTML〉, 《위키피디아》, 2020-06-06
  3. [HTML5HTML과 HTML의 역사]〉, 《개인블로그》, 2014-08-11
  4. HTML〉, 《위키백과》, 2020-07-28
  5. XHTML(eXtendibleHyperTextMarkup Language), 문법, 특징〉, 《개인블로그》
  6. XHTML1.0〉, 《개인블로그》, 2012

참고자료

같이 보기


  의견.png 이 XHTML 문서는 프로그래밍에 관한 토막글입니다. 위키 문서는 누구든지 자유롭게 편집할 수 있습니다. [편집]을 눌러 이 문서의 내용을 채워주세요.