《HTML5 设计原理》读后感

286 阅读3分钟

写在前面

本文是对李松峰《HTML5 设计原理》的阅读记录,文章不长,半小时就可以读完。相信你读完后会对 HTML5 的发展历程有更深入的了解。

HTML5 设计原理

设计原理是行动的基石,人类的行为是基于一定的价值观念。不论是制定一个规范,还是建立一个国家,你都能发现背后蕴含着设计原理,如美国的立国之本《独立宣言》。因此学习 HTML5 时,了解它背后的设计原理也很有必要。

一、避免不必要的复杂性

HTML5 中简化了一些声明,避免之前规范中的繁琐的表达。

HTML 4.01 的 doctype:

<!DOCTYPE html PUBLIC "-//W3C/DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">

XHTML 1.0 的 doctype:

<!DOCTYPE html PUBLIC "-//W3C/DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

HTML 5 的 doctype:

<!DOCTYPE html>

HTML 4.01,指定文档的字符编码

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 

XHTML 1.0

<?xml version="1.0" encoding="UTF-8" ?>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

HTML 5

<meta charset="utf-8">

二、支持已有的内容

向后兼容,兼容已经存在的的语法,不应对过去全盘否定,让所有网站都符合新规范是不可能的。

从浏览器的角度看,以下这四种写法没有区别。在 HTML5 中,你可以随意使用下列任何语法。

<img src="foo" alt="bar" />
<p class="foo">Hello world</p>

<img src="foo" alt="bar">
<p class="foo">Hello world

<IMG SRC="foo" ALT="bar">
<P CLASS="foo">Hello world</P>

<img src=foo alt=bar>
<p class=foo>Hello world</p>

黑格尔:存在即合理。不合理的实践方式也有一定的市场。 伯斯塔尔法则(Postel’s Law): 发送时要保守;接收时要开放。 浏览器应尽可能接纳页面的错误,而不是有一个错误就拒绝解析

三、解决现实的问题

规范的制订应解决实际开发中的问题,如链接 a 标签包含块级元素

HTML4 或 XHTML1

<h2><a href="/path/to/resource">Headline text</a></h2>
<p><a href="/path/to/resource">Paragraph text.</a></p>

HTML5

<a href="/path/to/resource">
	<h2>Headline text</h2>
	<p>Paragraph text.</p>
</a>

四、求真务实

新语义标签

  • header
  • footer
  • section
  • article
<body>
    <header>...</header>
    <nav>...</nav>
    <div id="main">...</div>
    <aside>...</aside>
    <footer>...</footer>
</body>

旧的实践

<body>
    <div id="header">...</div>
    <div id="navigation">...</div>
    <div id="main">...</div>
    <div id="sidebar">...</div>
    <div id="footer">...</div>
</body>

新语义标签对于页面内容组织管理的意义远大于凸显语义的功能。

五、平稳退化

浏览器应具备合理解释它不支持的属性的能力, 如:对于 input 的一些新 type 值,那些不理解它们的浏览器会把新值看成 type=“text”

六、最终用户优先

一旦遇到冲突,最终用户优先,其次是作者,其次是实现者,其次标准制定者,最后才是理论上的完满。

理论上的完满,大致是指尽可能创建出最完美的格式。标准制定者,指的是工作组、W3C 等等。实现者,指的是浏览器厂商。作者,指的是开发人员。用户是第一位的。开发者的声音在标准制定过程中也同样非常非常重要。

总结

HTML5 的设计原理是其发展演变的基准线。基于相对正确的原则去设计规范,基于合理的规范去开发实践,才能达到一个所有人共赢的局面。