调整字号

HTML中应该抛弃的书写习惯

本文翻译自Mozilla Developer Network

许多人学习HTML, CSS 和 JavaScript都是通过查看某些站点的源代码,然后复制粘贴,而不管这些网站用得正确不正确。这意味着有时候粘贴过来的代码可能已经过时了。本页将列出一些历史遗留产物,随着时间的推移我们已经没有必要再采用这样的写法了。

DOCTYPE

(X)HTML 的 doctype 大约有10种,它们之间的差异很小(甚至没有),建议使用HTML5 的 doctype:

<!DOCTYPE html>

它在任何浏览器中都会触发标准模式(也包括IE6)。

<meta> 元素和 charset 属性

很多网站中都能看到这行代码:

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

将其精简一下变成下面这样,也可以在所有浏览器(包括IE6)上实现同样的功能:

<meta charset="UTF-8" />

这就是向后兼容和实用主义的体现。试着用用这个吧。

无效的<meta>元素

许多被弃用的或者不规范的代码仍然会被相互粘来粘去,尤其是注意下面这些:

  • <meta name="MSSmartTagsPreventParsing" content="true">这行代码只在IE6的一个beta版本中有效,现在这个版本已经没人再使用了,而且smart tags也会被抛弃。
  • <meta name="robots" content="all"> robots这个值可以用,但后面的all是一个不规范的值。默认值为index, follow,可以达到和all相同的效果,所以只需把这一句删掉。
  • <meta name="copyright" content="…">不存在这样的meta,应当直接删掉,新建一个版权页面或div层,然后通过<link>rel="copyright"属性来链接到它。
  • <meta name="rating" content="…">此meta不存在,应当删掉。

脚本中的HTML注释

曾经只有一部分浏览器可以识别标签,其他的浏览器会把脚本内容当作文本输出。因此有一种做法是把脚本放在HTML注释里面,这样,能够识别脚本的浏览器将会执行脚本,而其他的浏览器则忽略。

因此许多人都在使用如下的传统写法:

<script>
<!--
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "bla.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
//-->
</script>

或者:

<script type="text/javascript">
<!--//--><![CDATA[//><!--
Blabla.extend(MyFramework.settings, { "basePath": "/" });
//--><!]]>
</script>

这些都没必要了,现在几乎所有的浏览器都能够支持脚步,即使一些浏览器不支持,它们也会直接忽略<script>标签。所以只要把脚本内容写在<script>开始和结束标签之间就可以了。更好的做法是将脚本放在外部文件中,然后设置src进行引用,并且你可以试一试defer和HTML5的async属性,

应该被抛弃的标签

font

应该停止使用font标签。CSS可以通过标签名或者 id/class 来控制元素外观。

b, i, u

这一点可能会有争议,但是应当尽量使用<strong><em><span> 以及CSS(text-decoration:underline)来代替。

在使用这些元素时需要考虑语义。有些人的做法只是简单地用<strong>来替换<b>,用<em>来替换<i>这也是不正确的。从语义化的方面来讲,<strong>表示一些极其重要的语句,而<em>只是代表除此以外的强调性的文字。为了显示斜体而使用<em>标签就是一种不好的做法,非强调性的文字应该通过CSS的font-style:italic来实现斜体。与之类似,书名和作品名通常用斜体来表示,但是考虑到语义化,用<cite>标签就比用<em><i>更好。

还没有评论,沙发空缺中……
flight