1. 마크업 언어의 분류
1-1. 순차적 마크업은 동질의 환경에서 정보 저장, 교환용으로 사용하기에는 문제가 없지만,
서로 다른 시스템 간의 정보 교환용으로는 부적절하다.
그리고 특정 응용 소프트웨어에서만 인식될 수 있다는 단점이 있는데, HTML이 대표적인
순차적 마크업 언어이다.
2. 서술적 마크업
1-1. 서술적 마크업은 문서가 기본 데이터와 구조(의미)만 가지기 때문에 결과적으로
문서 구조와 표현정보를 분리 할 수 있습니다.
또한 분리된 표현 정보를 필요할 때 다양하게 적용할 수 있고, 텍스트 기반의 서술적 마크업은
이질적인 환경에서 데이터 교환 형태로도 적합합니다.
서술적 마크업 언어는 XML을 들 수 있습니다.
3. XHTML 서식
1-1. 요소 사용 시 종료 태그의 생략 불가능
- HTML의 경우 P, TR, TH, TD, LI 등 요소명을 사용할 때 종료 태그를 생략할 수 있지만,
XHTML에서는 이를 허용하지 않습니다.
따라서 모든 요소는 반드시 시작과 함께 종료를 표현해야합니다.
1-2. 요소명과 속성명에 소문자 사용
- HTML의 경우에는 요소명과 속성명에 대소문자를 구분하지 않고 사용했지만,
XHTML에서는 모든 요소명과 속성명에 소문자만 사용할 수 있습니다.
1-3. 빈 요소 사용 시 <요소명 /> 형식으로 기술
- HTML의 경우 빈 요소는 시작 태그만 기술해도 되지만
XHTML에서는 모든 요소에 종료의 표현을 기술해야 합니다.
따라서 빈 요소는 HTML과 XHTML이 다르게 표현합니다.
1-4. 속성에 속성값 생략 불가능
- HTML은 몇 가지 속성의 경우 속성값을 생략할 수 있지만
XHTML에서는 이러한 단축 표기가 허용되지 않으므로 반드시 속성값을 지정해야 합니다.
1-5. 잘못된 중첩의 사용 불가능
- HTML은 규칙을 느슨하게 적용하여 중첩을 잘못해도 문제가 발생하지 않는 경우가 있었지만
XHTML에서는 잘못된 중첩이 허용되지 않습니다.
1-6. 모든 속성값에 인용 부호 사용
- HTML의 경우 속성에 값을 지정할 때 인용 부호를 생략할 수 있지만
XHTML의 경우에는 속성값은 시작과 끝을 반드시 인용 부호로 감싸야 합니다.
1-7. <,>,&을 <, &로 변환하여 사용
- HTML과 XHTML 모두 문자 참조(특수 문자)의 경우 Characters Entity Name이나
Characters Entity Code로 변환해야 합니다.
- 다음의 예와 값이 &의 문자 참조를 Entity Name으로 지정할 경우에는
&로, Entity Code로 지정할 경우에는 &로 지정합니다.
1-8. 주석은 바르게 사용하고 그 안에 --(더블대시) 사용 불가
- HTML과 XHTML에서 사용하는 올바른 주석은 <!-- 주석 --> 입니다.
- 특히 해당 주석에 영역을 구분할 목적으로 더블대시를 반복해서 사용하지 않아야 합니다.
4. 태그(tag)
- 태그는 <와>로 묶어서 표현하는 명령어를 말합니다.
- 기본 형식은 <Tag> ~ </Tag>이며, 일부 명령어 인 empty element(빈 요소)의 경우
<Tag/> 형태로 기술합니다.
1-10. 요소(element)
- 시작 <Tag> ~ 종료 </Tag>까지의 모든 명령어 집합을 요소(element)라고 합니다.
- XHTML 문서에서 콘텐츠는 이러한 요소들로 구성되며 각 요소의 의미에 따라 콘텐츠의
제목이나 본문의 구조를 가집니다.
1-11. 속성(attribute)
- 시작 태그는 태그의 의미와 필요에 따라 개별적인 옵셥을 가질 수 있는데, 이러한 옵션을 속성(attribute)
라고 합니다.
- 속성은 태그마다 다를 수 있으며, 여러 개의 속성을 하나의 태그에 지정할 때는 공백으로 구분하여
시작 태그에 지정할 수 있습니다.
1-12. 값(value)
- 각 속성이 가지는 값을 의미하며, 속성에 값을 할당할 때는 대입 연산자인 =과 함께 지정합니다.
5. XHTML 문서의 기본구조
1-1. DTD 선언
- 웹 페이지를 제작할 때 사용할 문서형 정의를 선언합니다.
- 문서형 정의의 종류에는 엄격형과 호환형, 프레임형 등이 있습니다.
1-2. <html> ~ <html>
- 모든 웹 페이지의 콘텐츠는 <html> 태그와 </html> 태그 안에 선언해야 한다.
- <html> ~ </html> 태그는 웹 페이지의 시작과 종료를 의미합니다.
1-3. <head> ~ </head>
- html 문서는 머리 부분과 본문 부분으로 나눌 수 있다.
- 머리 영역의 시작은 <head> 태그로, 종료는 </head> 태그로 선언합니다.
- <head> 태그 안에는 문서의 일반적인 정보와 title 등의 제목을 선언할 수 있습니다.
1-4. <body> ~ </body>
- body 요소는 html 문서의 본문 부분에 해당하며, 웹 브라우저 화면에 나타나는 모든 콘텐츠는
<body> 태그와 </body> 태그 사이에 선언해야 합니다.
6. 블록 요소와 인라인 요소
1-1. 블록 요소
- 블록 요소(block element)는 독립적인 형태의 상자를 의미하는데 어릴 때 가지고 놀았던
레고 블록으로 이해하면 좋을 것 같습니다.
- 레고 블록은 위쪽으로 쌓이지만, 마크업에서의 블록은 아래쪽으로 쌓인다는 것이 다릅니다.
- 블록 요소는 제목(<h1> ~ <h6>), 문단(<p> 요소), 작성자 정보(address 요소) 등이 있다.
- 대부분의 블록 요소는 인라인 요소와 텍스트 포함이 가능하고, 일부는 또 다른 블록 레벨 요소를
포함시킬 수 있습니다.
- 블록 요소와 블록 요소 사이에는 기본적으로 여백이 있는데, 이 크기는 웹 브라우저마다
약간씩 다를 수 있습니다.
2-1. 인라인 요소
- 인라인 요소(inline element)는 블록 상자 안의 일부라는 의미이다.
- 링크(a 요소), 이미지(img 요소), 강조(em, strong 요소) 등이 해당됩니다.
- 인라인 요소 안에는 대부분 인라인 요소와 텍스트를 포함할 수 있지만 블록 요소를 포함할 수는 없다.
- 인라인 요소와 텍스트는 반드시 블록 레벨 요소에 포함시켜 나타내야만 합니다.
- 즉 BODY 요소의 바로 하위에는 블록 레벨 요소만 자식 요소로 올 수 있고,
인라인 요소를 BODY 요소의 직접적인 하위 내용으로 하는 것은 옳지 않습니다.
7. 문서형 정의 및 선언
1-1. 문서형 정의
- 마크업 문서를 작성하려면 문서의 첫머리에 문서형 정의(DTD : Document Type Definition)를 선언해야한다.
- HTML이나 XHTML이라는 두 가지 마크업 언어 모두 세 가지의 문서형 정의가 있는데
여기서 말하는 문서형 정의란, 마크업 문서의 요소와 속성 등을 어떤 규칙에 따라 기술해야 하는지에 대한
기준을 의미합니다.
8. 문서형 정의 종류
9. 문서형 정의 및 선언
1-1. 문서형 선언
- 문서형 선언은 반드시 HTML 문서 첫 줄에 위치해야 하며, 문서형 선언의 위에는
공백을 포함해서 어떤 요소도 올 수 없습니다.
10. 네임 스페이스
- XHTML은 HTML을 XML로 재정의한 언어이기 때문에 XML이 가지는 확장성을 이용하여
다른 XML 형식의 문서 표준을 네임스페이스(xmlns)를 이용하요 지원할 수 있습니다.
- 만약 XHTML 문서에 XML 네임스페이스(xmlns)를 이용하여 MathML이라는 수학식 기호를 표현하기 위한
언어를 삽입하려면 네임스페이스(xmlns)에 http://www.w3.org/TR/2000/REC-xhtml1-0000126를 지정합니다.
- HTML을 XML로 재정의한 언어인 XHTML은 다음과 값은 네임스페이스값을 가집니다.
11. 휴먼 랭귀지
- 휴먼 랭귀지 명시는 한국어, 영어, 중국어 또는 독일어 등의 인간이 사용하는 언어를 HTML 문서에 선언하여
XHTML을 해석할 수 있는 소프트웨어들이 올바르게 동작하도록 하는 것을 의미합니다.
- 휴먼 랭귀지 코드는 주요 사용 언어에 따라 '한국어(ko)','영어(en)'...형식으로 지정할 수 있다.
- 선언하는 방법은 다음과 같습니다.
'프로그램 이론 > HTML' 카테고리의 다른 글
| [HTML]견고한 웹을 위한 구조설계(XHTML) - 3 (0) | 2018.05.09 |
|---|---|
| [HTML]견고한 웹을 위한 구조설계(XHTML) - 1 (0) | 2018.05.09 |
| [HTML]웹 접근성과 웹 표준 (0) | 2018.05.09 |
