html5页面提示翻译,HTML5 for Web Designers部分翻译(含中英文)

KEEPING IT REAL

保证HTML5规范的合理和实用

The creation of HTML5 has been driven by an ongoing internaltension. On the one hand, the specification needs to bepowerful enough to support the creation of web applications.On the other hand, HTML5 needs to support existing content,even if most existing content is acomplete mess. If thespecification strays too far in one direction, it will suffer thesame fate as XHTML 2. But if it goes too far in the other direction,the specification will enshrinetags and tables forlayout because, after all, that’s what a huge number of webpages are built with.It’s a delicate balancing act that requires a pragmatic, levelheadedapproach.

HTML5的创建是由其自身压力驱动的。一方面,规范必须强大到足以支持Web应用程序的创建。另一方面,HTML5的需要支持现有的内容,即使大多数现有的内容槽糕的一塌糊涂。如果规范偏离太远,它将为XHTML2遭受同样的命运。但如果规范在另一个方向走得太深,同样也会有失偏颇,例如大量网站采用的标签的存在和不合理地用表格进行布局。而要保证这两方面的微妙平衡,需要一个务实,冷静和理性的方法去实践。

GIVE IT TO ME STRAIGHT,DOCTYPE

Doctype,用最直接的方式展现给我

A Document Type Declaration, or doctype for short, hastraditionally been used to specify which particular flavor ofmarkup a document is written in.

文档类型声明,或简称DOCTYPE,传统上一直用于指定和声明某文档所使用的编写规则

The doctype for HTML 4.01 looks like this:

HTML 4.01的DOCTYPE的基本书写方式如下:

HTML PUBLIC »

"-//W3C//DTD HTML 4.01//EN" »

"http://www.w3.org/TR/html4/strict.dtd">

Here’s the doctype for XHTML 1.0:

html PUBLIC »

"-//W3C//DTD XHTML 1.0 Strict //EN" »

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

They’re not very human-readable, but, in their own way, theyare simply saying “this document is written in HTML 4.01,” or“this document is written in XHTML 1.0.”You might expect the doctype declaring “this document iswritten in HTML5” would have the number five in it somewhere.It doesn’t. The doctype for HTML5 looks like this:

这种写法的可读性不高,而这些仅仅是用来声明:"这是按照HTML4.01规范写的"或"这是按照XHTML1.0规范写的"。你可能期望DOCTYPE这样声明:this document iswritten in HTML5”。而实际上HTML5的DOCTYPE是这样的:

html>

It’s so short that even I can memorize it.

这简单到我都能记住!

But surely this is madness! Without a version number in thedoctype, how will we specify future versions of HTML?

但是,这肯定是太疯狂了!如果没有一个版本号的doctype,我们将如何指定的HTML的未来版本?

When I first saw the doctype for HTML5, I thought it was theheight of arrogance. I asked myself, “Do they really believethat this will be the final markup specification ever written?”

当我第一次看到了HTML5的的doctype,这样声明会不会过于自信?我问自己:"难道他们真的相信这将是他们写的最后一个标记规范?"

It seemed to be a textbook case of Year Zero thinking.

这似乎最新思维方式的经典案例。

In fact, though, the doctype for HTML5 is very pragmatic.Because HTML5 needs to support existing content, the doctypecould be applied to an existing HTML 4.01 or XHTML1.0 document. Any future versions of HTML will also need tosupport the existing content in HTML5, so the very conceptof applying version numbers to markup documents is flawed.

事实上,HTML5的DOCTYPE非常简约务实。由于HTML5需要支持的现有内容,HTML5文档类型可用于现有的HTML或XHTML1.0文档4.01。HTML的任何未来版本也将支持现有内容,因此用应用版本号来标记也就多余了。

The truth is that doctypes aren’t even important. Let’s sayyou serve up a document with a doctype for HTML 4.01. Ifthat document includes an element from another specification,such as HTML 3.2 or HTML5, a browser will still renderthat part of the document. Browsers support features, notDoctypes.

而且,文档类型甚至不是重要的。比方说,你的文档声明为HTML4.01。如果该文档中仍包括来自其他如HTML3.2或HTML5的内容规范或者元素,浏览器将仍然呈现该文档的那些部分。这是浏览器的支持特点,而与文档类型基本无关。

Document Type Declarations were intended for validators,not browsers. The only time that a browser pays any attentionto a doctype is when it is performing “doctype switching”—a clever little hack that switches rendering between quirksmode and standards mode depending on the presence of adecent doctype.

文档类型声明的目的是程序验证,而不是为了浏览器。浏览器唯一一次关注DOCTYPE是当它正在执行“DOCTYPE切换(根据doctype切换标准和模式)“之时。

The minimum information required to ensure that a browserrenders using standards mode is the HTML5 doctype. In fact,that’s the only reason to include the doctype at all. An HTMLdocument written without the HTML5 doctype can still bevalid HTML5.

HTML5的DOCTYPE提供了最少信息量,以保证保证浏览器用标准方式渲染文档。事实上,这也是DOCTYPE存在的唯一理由。一个没有DOCTYPE的HTML文档依旧可以正常显示。

KEEPING IT SIMPLE

保证HTML5的简单

The doctype isn’t the only thing that has been simplified inHTML5.

HTML5简化的不仅仅是doctype声明标签。

If you want to specify the character encoding of a markupdocument, the best way is to ensure that your server sendsthe correctContent-Typeheader. If you want to be doublycertain, you can also specify the character set using atag. Here’s themetadeclaration for a document written inHTML 4.01:

如果你想指定一个文档的字符编码,最好的办法是要确保你向服务器发送正确的Content - Type。如果你加倍仔细,也可以用标记指定使用的字符集。下面是在HTML4.01元的书面文件声明:

Here’s the much more memorable way of doing the samething in HTML5:

而HTML5的方式就简单好记的多了:

As with the doctype, this simplified character encodingcontains the minimum number of characters needed to beinterpreted by browsers.

这是浏览器能识别接受的最简约的字符集声明了

The

Browsers don’t need that attribute. They will assume that thescript is written in JavaScript, the most popular scripting languageon the web (let’s be honest: theonlyscripting languageon the web):

浏览器不需要这些属性。HTML5假定文档脚本语言就是JavaScript(网上最流行的脚本语言),说实话,这确实是唯一的Web脚本语言。

Likewise, you don’t need to specify atypevalue of “text/css”every time you link

to a CSS file:

而在文档中添加CSS文件的标签同样也瘦了一大圈,下面以前版本的标签:

You can simply write:

而你可以这样简写:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
以下展示部分源码,需要完整版的请下载文件 <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <title>Document</title> <style> *{margin:0;padding:0;list-style:none} body{background:#ccc;} .wrap{margin:100px auto;width:900px;height:300px;box-shadow:0 0 4px #434343;background:#fff;padding:20px;border-radius:10px;} .wrap .language{position:relative;width:100px;height:30px;padding:0 30px;margin:20px;text-align:center;line-height:30px;border:1px solid #434343;cursor:pointer;} .wrap .language .languages{position:absolute;top:30px;left:-1px;width:354px;height:auto;border:1px solid #434343;display:none;background:#fff;color:#fff;line-height:40px} .wrap .language .languages ul li{float:left;width:78px;height:40px;margin:4px; border:1px dashed #ccc;background:#368;} .wrap .input, .wrap .show{width:430px;height:150px;float:left;background:#fff; color:#000;margin:10px;box-shadow:0 0 4px #222;line-height:40px;font-size:20px;text-indent:10px;color:#333;font-family:'微软雅黑';} .wrap .input textarea{z-index:3;height:100%;width:400px;border:0;resize:none;outline:0;color:#333;font-family:'微软雅黑';margin:0;padding:0;line-height:40px;font-size:20px;text-indent:10px;} .wrap span.btn{width:140px;height:30px;float:right;margin:10px;line-height:30px;text-align:center;background:#368;box-shadow:0 0 4px #ccc;border-radius:5px;color:#fff;cursor:pointer;} </style>

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值