html5 문자셋을 사용할 수 있나요?

앞 문단에서 IE6에서 갑자기 프로젝트 페이지가 깨져서 나타나는 현상이 있었습니다. 당시 여러가지 트러블슈팅을 하다가 결국 HTML5의 DOCTYPE과 Charset, 중국어 주석을 사용하는 문제인 것으로 추측하여 임시로 예전 버전을 사용했습니다. 이를 수정하기 위한 Charset 방법으로 인해 잘못된 코드가 다시 나타나지 않았습니다.

사실 IE6에서 HTML5 Charset을 인식할 수 있는지 확신할 수 없어서 테스트를 해봤습니다.

테스트 환경:

Windows XP Sp2, 중국어 버전 + IE6 영어 버전, Windows 7 및 다양한 호환 모드와 현재 Stable 버전의 Chrome, Firefox 등에서 IE9;

우리가 사용하는 HTML 파일은 모두 UTF8로 인코딩되어 있으므로 여기 테스트 사례의 HTML 파일도 UTF8(BOM 없음) 형식입니다. 프로젝트도 유사하게 gbk 또는 gb2312로 인코딩됩니다.

테스트에는 두 가지 방법이 사용되었습니다.

메타 방법: HTML5 및 HTML4 메서드와 해당 매시업을 포함합니다.

서버 측 방법: 서버 측에 문자 집합을 설정하고, nginx는 여기에 사용됨, charset=utf-8

테스트 케이스 - 메타 메소드:

UTF8

UTF8 HTML4 메소드

UTF8-GB2312

메타 앞의 UTF8+ 중국어 주석

HTML과 HEAD 사이의 UTF8+ 중국어 주석

GB2312

GB2312 HTML4 방식

GB2312-UTF8

GB2312+메타 전 중국어 주석

GB2312+HTML과 HEAD 간 중국어 주석

테스트 케이스 - 서버 방식:

서버 설정 인코딩

메타 인코딩 서버 인코딩과 일치하지 않습니다

위의 각 사용 사례에 직접 액세스할 수 있습니다

테스트 결과:

각 브라우저에서 일관되게 수행된 테스트 사례

UTF-8 방식에서는 모든 것이 정상적으로 표시됩니다.

문자 세트는 gb2312로 선언되어 문서의 UTF-8 인코딩과 일치하지 않으므로 모든 문자가 깨졌습니다.

1, 6은 HTML5 문자 집합 UTF8과 gb2312가 각각 정의되어 있으며, 1은 잘못된 문자 없이 정상적으로 표시되고, 6은 잘못된 문자로 표시됩니다. 이는 IE6의 중국어 버전과 IE6의 영어 버전 모두에 해당되며, 이는 IE6이 HTML5의 문자 집합을 인식할 수 있음을 나타냅니다.

1, 2 유스 케이스와 6, 7 유스 케이스, HTML5 및 HTML4 메소드를 사용하여 문자 세트를 별도로 정의하면 효과는 동일합니다.

세 번째 유스 케이스를 먼저 주목할 가치가 있습니다. HTML5 방식을 사용하여 UTF-8 인코딩을 설정한 후 HTML4 인코딩 설정을 사용합니다. gb2312인데 페이지가 정상적으로 표시되는 반면, 여덟 번째 Use Case에서는 반대로 결과 페이지에 문자가 깨져서 표시됩니다. 두 번째 메타 태그가 적용되지 않는 것으로 추측할 수 있습니다.

사용 사례 4와 5에는 문자가 깨져 있지 않습니다. 즉, 단순히 HTML 주석이라고 해서 반드시 문자가 깨지는 것은 아닙니다. 이 두 위치에서 다른 인코딩을 가진 js와 같은 외부 파일을 로드하면 어떻게 될까요?

서버 방법에서 유스 케이스 1은 문자 세트를 설정하기 위해 메타를 사용하지 않으며 페이지는 정상적으로 표시되지만 사용 중입니다. 사례 2, 메타를 사용하여 charset=gb2312를 설정했는데, 이는 서버 버전과 다르지만 여전히 잘못된 코드가 없어 서버에서 반환한 문자 집합의 우선순위가 더 높다는 것을 나타냅니다.

결론:

실제로 charset 사양과 관련하여 Google 개발 문서에는 다음과 같이 설명되어 있습니다.

은 HEAD 태그에 있어야 하며

는 다른 콘텐츠 앞에 있어야 합니다. HEAD 앞에 ;

공백과 DOCTYPE 선언을 포함하여 처음 512바이트 내에 있어야 합니다.

HTML5와 HTML4는 동일한 효과를 가지므로 둘 중 하나만 사용하세요.

위 테스트에서도 항목 4가 정확하고 두 가지 작성 방법 모두 허용된다는 것이 입증되었습니다.

또한, 서버 측에서 charset을 설정하는 것도 좋은 방법입니다. charset 문은 HTTP 응답에서 직접 가져오므로 더 효율적이고 편리합니다. Google은 현재 이 접근 방식을 사용하고 있습니다.

그래서 페이지를 표준화된 방식으로 작성하면 문자가 깨져도 문제가 없습니다. 따라서 HTML5의 DOCTYPE 및 Charset 선언을 과감하게 사용할 수 있습니다. 하지만 위에서 언급한 구글 문서의 사양을 따르도록 하세요. 머리에 너무 많은 것을 넣지 말고, 뒤에 js와 같은 외부 리소스를 넣으세요.

시험에서 누락된 부분이 있을 수 밖에 없습니다. 틀린 부분이 있으면 바로잡아 함께 토론해 보세요~~