>  기사  >  웹 프론트엔드  >  HTML5 표준 학습-상세 코딩 설명

HTML5 표준 학습-상세 코딩 설명

黄舟
黄舟원래의
2017-03-21 15:14:151636검색

우선 매우 간단한 예로 Yujian의 HTML 페이지를 사용하여 각 브라우저의 차이점을 확인합니다.

<!DOCTYPE html>

가장 간단한 HTML,

93f0f5c25f18dab9d176bd4f6de5d30e 모두 내용이 없습니다. , 서버는 특정 인코딩 설명을 제공하지 않습니다. 로컬 컴퓨터에서 직접 열고 각 브라우저에서 페이지 인코딩을 확인하세요. 6c04bd5ca3fcae76e30b72ad730ca86d

에서 볼 수 있듯이 브라우저마다 인코딩을 선언하는 수단을 전혀 사용하지 않는 페이지에 대한 구문 분석이 다릅니다. 물론 가장 간단한 페이지에서는 어떤 인코딩을 사용하더라도(물론 전제는 ASCII의 상위집합) 아무런 효과가 없지만, 인코딩을 올바르게 설정하는 것의 중요성을 보여주기에는 충분합니다.

인코딩문

HTML4와 HTML5는 각각 인코딩문 방법을 설명하는 장을 채택하고 있습니다. 여기를 클릭하면 HTML4의 관련 장을 볼 수 있고, 여기를 클릭하면 볼 수 있습니다. HTML5 장의 관련 장.

먼저 인코딩이란 무엇일까요? 인코딩은 정말 올바른 콘텐츠를 얻기 위해 특정 방식으로 바이트 스트림을 구문 분석하는 특수 알고리즘을 사용하도록 브라우저(또는 사용자 에이전트)를 지정하는 것입니다. HTML 표준에서는 별칭을 사용하여 인코딩을 표현할 수 있습니다. 인코딩 별칭은 IANA 정의에서 나오며 이 목록에 나타나는 인코딩만 브라우저에서 인식할 수 있습니다. 따라서 UTF-8을 UTF8로 작성하면 브라우저는 이를 완전히 무시할 수 있습니다. 또한 인코딩 별칭은 대소문자를 구분하지 않습니다.

HTML4에는 우선순위에 따라 페이지 인코딩을 지정하는 세 가지 방법이 있습니다.

  1. HTTP 헤더의 Content-Type 필드. 그 뒤에 문자 세트가 옵니다.

  2. 09d68f3bd6bfd0744f37150627c89edd 태그를 사용하여 선언하세요.

  3. 3f1c4e4b6b16bbbd69b2ee476dc4f83a 태그로 로드된 js 파일과 같은 일부 외부 리소스의 경우 태그의 charset 속성을 통해 선언할 수 있습니다.

물론 이에 대해서는 의심의 여지가 없습니다. 페이지가 09d68f3bd6bfd0744f37150627c89edd 태그를 통해 선언된 경우 브라우저가 해당 태그를 발견하면 사용 중인 인코딩과 태그가 일치하지 않으면 페이지가 다시 구문 분석됩니다. 이로 인해 페이지의 일부가 다시 구문 분석되므로 태그를 사용하여 인코딩을 선언하려는 경우 가능한 한 빨리 태그를 작성하는 것이 좋습니다. 가장 좋은 방법은 93f0f5c25f18dab9d176bd4f6de5d30e 태그 뒤와 다른 태그 앞에 작성하는 것입니다. 이 점에 관해 Google PageSpeed에도 해당 소개가 있습니다.

시대의 진화

그런데 시간이 지날수록 개발자들은 점점 한 가지 사실을 발견하게 됩니다. 실제로 DOCTYPE의 가장 간단한 구문과 마찬가지로 브라우저가 e8e496c15ba93d81f6ea4fe5f55a2244 태그의 인코딩을 읽을 때 표준을 엄격하게 따르지는 않습니다. 전체적으로 HTML 파싱 단계에서는 Tokenizer 단계 이전에 페이지의 인코딩이 결정되어야 하므로 브라우저가 e8e496c15ba93d81f6ea4fe5f55a2244 태그의 구조를 분해하여 http-equiv의 구조를 빼내는 것은 불가능합니다. content

속성을 ​​분석하는 것과 마찬가지로 DOM 트리가 구축될 때 태그를 지정한 다음 인코딩을 결정합니다.

e8e496c15ba93d81f6ea4fe5f55a2244실제로 브라우저는

태그에 정의된 인코딩을 읽는 매우 간단한 작업을 수행합니다.
  1. e8e496c15ba93d81f6ea4fe5f55a2244이 태그가 태그인지 확인하세요. 이는 HTML 구문 분석의 상태 시스템에 의해 결정되며 "메타" 문자열

    에 "13b0b697626526710937bd9bd22d384e
  2. acbc3b8881b6b4f3abaf7379ad2340e7

  3. 5c63b0c9e2aeb7f2e73596ac1dc2ffb0

  4. …외 다수 이상한 글쓰기 방식.
  5. 그래서 역사가 진행됨에 따라 마침내 어느 날 다양한 브라우저 제조업체가 함께 앉아 이 문제에 대해 논의하기 시작했습니다... 결국 그들은 그들의 구현이 매우 훌륭하다는 사실에 놀랐습니다. (어쩌면 서로에게서 배운 것일 수도 있습니다) 그래서 이 방법을 표준으로 바꾸기로 결정했습니다... 마침내 오랜 논의 끝에 널리 사랑받는 HTML5의 코딩 선언 방법이 탄생했습니다. HTML5에서는 이를 "메타 문자 집합 요소"라고 하며 가장 간단한 형태는 다음과 같습니다.
    <meta charset=utf-8>

    当然这是HTML的语法,如果遵从XHTML并觉得XHTML更加亲切地话,写成acbc3b8881b6b4f3abaf7379ad2340e7也是没问题的。

    而前文所述的具体获取编码的算法也被详细地记录在案,可以在这里看到。

    到了HTML5时代,标准再次对编码的声明方式做了修正和细化,总得来说有以下的区别:

  • HTML5允许使用BOM来决定编码,但仅支持UTF-16的BOM(即U+FEFF),且没有说明BOM指定编码的优先级如何。

  • HTML5添加了meta charset标签。

  • HTML5规定如果一个页面没有指定编码,则使用ASCII作为其编码,而HTML4则规定浏览器可以根据所处的环境自行选择。

其他杂项

除了编码的基本声明方式外,标准中还有不少需要注意的细节:

  • 如果使用e8e496c15ba93d81f6ea4fe5f55a2244标签声明编码的话,该编码只能是ASCII的超集编码。可以简单地认为ASCII超集就是支持ASCII的256个字符的编码。

  • HTML5非常推荐使用UTF-8编码。

  • 标准中提出不要使用UTF-32、JIS_C6226-1983、JIS_X0212-1990、HZ-GB-2312、JOHAB等字符集,并禁止使用CESU-8、UTF-7、BOCU-1和SCSU字符集。但事实上浏览器却至少能识别UTF-7。

  • 对于想要严格遵守XHTML的开发者,应当使用XML声明来指定编码,即e4f551cb26a907a6bcdf652256fc4dfd。但是这个在IE6下会影响到DOCTYPE,所以开发者也不得在这一点上给予妥协,乖乖地去用HTML的声明方式。

  • 关于现实中各编码声明方式的优先级,以及一些其他需要注意的细节,这篇文章值得一读。

最佳实践

  • 尽可能使用HTTP头指定编码。

  • 尽可能使用UTF-8,或者至少全站所有资源使用统一编码。

  • 如果想使用UTF-16,就给文件加上BOM,以确定是Little Endian还是Big Endian的。

  • 如果使用e8e496c15ba93d81f6ea4fe5f55a2244标签指定编码,可以不使用http-equiv的形式,但尽可能让标签出现在前面,至少保证在任何非ASCII字符之前。

  • 链接外部的脚本,如果无法确定编码相同的话,加上charset属性。

위 내용은 HTML5 표준 학습-상세 코딩 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.