W3C 유효성 검사는 때때로 사용하기 어려울 수 있지만 이를 사용하면 레이아웃 디자인으로 인한 오류를 볼 수 있습니다. 유효성 검사기는 XHTML이 아직 완성되지 않았으며 여러 브라우저에서 일관되게 작동하지 않을 수 있음을 나타내는 많은 오류와 경고를 표시합니다. 다음 10가지 미묘한 실패 문제는 많은 프로그래머들을 난처하게 만들었고, 우리는 이를 해결하는 방법을 알려드리겠습니다. 본 글을 시작하기 전에 W3C 유효성 검사기를 사용할 때 주의해야 할 몇 가지 사항을 소개하겠습니다.
검증자의 경고에 대해 걱정하지 마십시오. 검증자가 12개의 오류와 83개의 경고를 발견했다고 말하면 이를 무시하고 다음 단계로 넘어갑니다.
한 번에 하나의 오류 수정 - 위에서 아래로 순서대로 작업하여 한 번에 하나의 오류를 수정합니다. HTML은 브라우저를 사용하여 위에서 아래로 볼 수 있으며 이러한 오류는 동일한 순서로 표시됩니다.
다시 유효하도록 수정한 후 코드를 새로 고치십시오. 작은 실수로 인해 전체 페이지에 걸쳐 연쇄 오류가 발생할 수 있는 경우가 많습니다. 따라서 잘못 수행하면 "오류 수정"으로 인해 더 많은 오류가 발생할 수도 있습니다. 각 수정 후 코드를 다시 검증하면 문제가 완전히 해결됩니다.
위의 기본 예외 사항을 알고 레이아웃 디자인이 유효하지 않은 몇 가지 이유를 살펴보겠습니다.
1. div 태그가 닫히지 않습니다. 이는 레이아웃 디자인 실패의 가장 일반적인 이유 중 하나입니다. 이로 인해 얼마나 많은 섬세한 레이아웃 디자인이 실패하는지 알 때마다 항상 놀랍습니다. 설문 조사에 따르면 개방형 div 태그는 가장 일반적인 섹션 디자인 오류 중 하나이며 진단하기 가장 어려운 오류 중 하나입니다. 유효성 검사기는 때로는 건초 더미에서 바늘을 찾는 것과 같을 수 있는 잘못된 여는 div 태그를 가리킵니다.
2. 골치 아픈 embed 태그 1990년대 초, Microsoft와 Netscape 브라우저는 비표준 고유 글꼴을 인식할 수 있게 되었습니다. 불행히도 이는 이러한 태그가 널리 사용됨에도 불구하고 W3C 유효성 검사기가 "embed"와 같은 특정 핵심 HTML 태그를 아직 인식하지 못한다는 것을 의미합니다. 정말로 엄격한 DOCTYPE(문서 유형) 유효성 검사를 원한다면 중첩만 포기하면 됩니다.
효과적인 레이아웃과 삽입된 미디어를 동시에 원한다면 Flash Satay 방식을 시도해 볼 수 있습니다.
3. 부적절한 DOCTYPE 선언 DOCTYPE을 선언하지 않거나 파일 시작 부분에 DOCTYPE을 잘못 선언하는 것도 일반적인 실수입니다. 일반적인 경험에 따르면 Strict DOCTYPE은 모든 사람이 추구하는 최고 수준의 검증입니다. 엄격한 검증은 귀하의 웹 페이지가 모든 브라우저에서 최적으로 표시된다는 것을 의미합니다. 엄격한 선언 코드는 다음과 같습니다.
4. 후행 슬래시 웹사이트를 확인할 수 없는 경우 후행 슬래시가 코드 어딘가에서 누락되었을 가능성이 높습니다. 특히 이미지 태그와 같은 요소에서는 후행 슬래시와 같은 사항을 간과하기 쉽습니다. 예를 들어:
이는 엄격한 DOCTYPE에는 영향을 미치지 않습니다. 이 문제를 해결하려면 img 태그 끝에 "/"를 추가하세요.
5. Align 태그 DOCTYPE을 Transitional로 설정하면 "align" 태그를 사용하게 되지만, 좀 더 까다롭고 엄격한 검증을 원하는 경우 오류가 많이 발생하게 됩니다. Align은 레이아웃 디자인에 사용할 수 없는 또 다른 태그입니다. 요소를 변환하기 위해 정렬 대신 "float" 또는 "text-align"을 사용해 볼 수 있습니다.
6. 자바스크립트
Strict DOCTYPE이 선언된 경우 JavaScript에서 CDATA 태그를 재정의해야 합니다. 웹사이트는 광고 및 추적 스크립트에 내장된 JavaScript를 사용하는 경향이 있기 때문에 확인 프로세스의 이러한 측면은 많은 프로그래머를 당황하게 합니다. JavaScript를 사용해야 하는 경우 JavaScript 앞뒤에 다음 태그를 추가할 수 있습니다.
7. 이미지에는 "alt" 속성이 필요합니다. 눈치 채지 못했을 수도 있지만 이미지는 고급 검증에 잠재적인 걸림돌이기도 합니다. 후행 슬래시 외에도 고급 유효성 검사에는 alt= "Scary 뱀파이어 사진"과 같이 이미지를 설명하는 alt 태그도 필요합니다.
검색 엔진은 또한 alt 태그를 사용하여 웹 페이지의 이미지를 식별하므로 항상 alt 태그를 추가하는 것이 좋습니다.
8. 알 수 없는 엔터티 데이터 엔터티 데이터는 검증에 영향을 미치는 또 다른 일반적인 실수입니다. "&"와 같은 기호를 대체하기 위해 적절한 인코딩 문자를 사용하는 것을 고려할 수 있습니다. XHTML 섹션 디자인에서 사용할 수 있는 적절하게 인코딩된 문자 엔터티 데이터의 전체 목록입니다.
9. 잘못된 중첩 중첩은 요소에 Sweet! 요소가 포함되어 있음을 의미합니다.
중첩된 요소의 순서를 혼동하기 쉽습니다. 예를 들어 div 태그 전에 강력한 태그를 시작한 다음 div 태그를 먼저 닫습니다. 이렇게 하면 섹션 레이아웃이 변경되지 않을 수 있지만 섹션 디자인이 무효화됩니다.
10. "제목" 태그 누락 이것이 명백한 실수인 것처럼 보이지만, 많은 프로그래머(나 자신 포함)는 종종 "head" 섹션의 제목 태그를 누락합니다. "HEAD의 필수 하위 요소 누락"(HEAD의 필수 하위 요소 누락)이 표시되면 제목 태그를 추가하는 것을 잊어버린 것입니다.