Design4U http://design4u.cn 生活造就英雄，设计成就未来！ Tue, 10 Apr 2012 09:04:11 +0000 en hourly 1 http://wordpress.org/?v=3.3 移动终端UI设计 http://design4u.cn/2012/04/10/%e7%a7%bb%e5%8a%a8%e7%bb%88%e7%ab%afui%e8%ae%be%e8%ae%a1/ http://design4u.cn/2012/04/10/%e7%a7%bb%e5%8a%a8%e7%bb%88%e7%ab%afui%e8%ae%be%e8%ae%a1/#comments Tue, 10 Apr 2012 08:59:24 +0000 admin http://design4u.cn/?p=1525


]]> http://design4u.cn/2012/04/10/%e7%a7%bb%e5%8a%a8%e7%bb%88%e7%ab%afui%e8%ae%be%e8%ae%a1/feed/ 0 网站设计 http://design4u.cn/2012/04/10/%e7%bd%91%e7%ab%99%e8%ae%be%e8%ae%a1/ http://design4u.cn/2012/04/10/%e7%bd%91%e7%ab%99%e8%ae%be%e8%ae%a1/#comments Tue, 10 Apr 2012 08:38:35 +0000 admin http://design4u.cn/?p=1513


]]> http://design4u.cn/2012/04/10/%e7%bd%91%e7%ab%99%e8%ae%be%e8%ae%a1/feed/ 0 管理平台设计 http://design4u.cn/2012/04/10/%e7%ae%a1%e7%90%86%e5%b9%b3%e5%8f%b0%e8%ae%be%e8%ae%a1/ http://design4u.cn/2012/04/10/%e7%ae%a1%e7%90%86%e5%b9%b3%e5%8f%b0%e8%ae%be%e8%ae%a1/#comments Tue, 10 Apr 2012 08:34:20 +0000 admin http://design4u.cn/?p=1510

]]> http://design4u.cn/2012/04/10/%e7%ae%a1%e7%90%86%e5%b9%b3%e5%8f%b0%e8%ae%be%e8%ae%a1/feed/ 0 数据看板UI设计 http://design4u.cn/2012/04/10/%e6%95%b0%e6%8d%ae%e7%9c%8b%e6%9d%bfui%e8%ae%be%e8%ae%a1/ http://design4u.cn/2012/04/10/%e6%95%b0%e6%8d%ae%e7%9c%8b%e6%9d%bfui%e8%ae%be%e8%ae%a1/#comments Tue, 10 Apr 2012 08:23:48 +0000 admin http://design4u.cn/?p=1505

]]> http://design4u.cn/2012/04/10/%e6%95%b0%e6%8d%ae%e7%9c%8b%e6%9d%bfui%e8%ae%be%e8%ae%a1/feed/ 0 触摸屏UI设计 http://design4u.cn/2012/04/10/%e8%a7%a6%e6%91%b8%e5%b1%8fui%e8%ae%be%e8%ae%a1/ http://design4u.cn/2012/04/10/%e8%a7%a6%e6%91%b8%e5%b1%8fui%e8%ae%be%e8%ae%a1/#comments Tue, 10 Apr 2012 08:00:57 +0000 admin http://design4u.cn/?p=1492


广东烟草触摸屏系统


广东烟草触摸屏系统_查询方式选择


广东烟草触摸屏系统_列表页


广东烟草触摸屏系统_详细页








]]> http://design4u.cn/2012/04/10/%e8%a7%a6%e6%91%b8%e5%b1%8fui%e8%ae%be%e8%ae%a1/feed/ 0 HTML5新标签解释及用法 http://design4u.cn/2011/11/30/html5%e6%96%b0%e6%a0%87%e7%ad%be%e8%a7%a3%e9%87%8a%e5%8f%8a%e7%94%a8%e6%b3%95/ http://design4u.cn/2011/11/30/html5%e6%96%b0%e6%a0%87%e7%ad%be%e8%a7%a3%e9%87%8a%e5%8f%8a%e7%94%a8%e6%b3%95/#comments Wed, 30 Nov 2011 07:29:01 +0000 admin http://design4u.cn/?p=1461 HTML 5 是一个新的网络标准，目标在于取代现有的 HTML 4.01, XHTML 1.0 and DOM Level 2 HTML 标准。它希望能够减少浏览器对于需要插件的丰富性网络应用服务（plug-in-based rich internet application，RIA)，如Adobe Flash, Microsoft Silverlight, 与 Sun JavaFX 的需求。

HTML 5 提供了一些新的元素和属性，反映典型的现代用法网站。其中有些是技术上类似 <div> 和 <span> 标签，但有一定含义，例如 <nav>（网站导航块）和 <footer>。这种标签将有利于搜索引擎的索引整理、小屏幕装置和视障人士使用。同时为其他浏览要素提供了新的功能，通过一个标准接口，如 <audio> 和 <video> 标记。

一些过时的 HTML 4 标记将取消，其中包括纯粹用作显示效果的标记，如 <font> 和 <center>，因为它们已经被 CSS 取代。还有一些透过 DOM 的网络行为（via）。

下面我们来看一下HTML 5提供的一些新的标签用法以及和HTML 4的区别。

<article>

标签定义外部的内容。比如来自一个外部的新闻提供者的一篇新的文章，或者来自 blog 的文本，或者是来自论坛的文本。亦或是来自其他外部源内容。
HTML5:<article></article>
HTML4:<div></div>

<aside>

标签定义 article 以外的内容。aside 的内容应该与 article 的内容相关。
HTML5:<aside>Aside 的内容是独立的内容，但应与文档内容相关。</aside>
HTML4:<div>Aside 的内容是独立的内容，但应与文档内容相关。</div>

<audio>

标签定义声音，比如音乐或其他音频流。
HTML5:<audio src=”someaudio.wav”>您的浏览器不支持 audio 标签。</audio>
HTML4:<object type=”application/ogg” data=”someaudio.wav”><param name=”src” value=”someaudio.wav”></object>

<canvas>

标签定义图形，比如图表和其他图像。这个 HTML 元素是为了客户端矢量图形而设计的。它自己没有行为，但却把一个绘图 API 展现给客户端 JavaScript 以使脚本能够把想绘制的东西都绘制到一块画布上。
HTML5:<canvas id=”myCanvas” width=”200″ height=”200″></canvas>
HTML4:<object data=”inc/hdr.svg” type=”image/svg+xml” width=”200″ height=”200″></object>

<command>

标签定义命令按钮，比如单选按钮、复选框或按钮。
HTML5: <command onclick=cut()” label=”cut”>
HTML4: none

<datalist>

标签定义可选数据的列表。与 input 元素配合使用，就可以制作出输入值的下拉列表。
HTML5: <datalist></datalist>
HTML4: see combobox.

<details>

标签定义元素的细节，用户可进行查看，或通过点击进行隐藏。与 <legend> 一起使用，来制作 detail 的标题。该标题对用户是可见的，当在其上点击时可打开或关闭 detail。
HTML5: <details></details>
HTML4: <dl style=”display:hidden”></dl>

<embed>

标签定义嵌入的内容，比如插件。
HTML5: <embed src=”horse.wav” />
HTML4: <object data=”flash.swf”  type=”application/x-shockwave-flash”></object>

<figcaption>

标签定义 figure 元素的标题。”figcaption” 元素应该被置于 “figure” 元素的第一个或最后一个子元素的位置。
HTML5: <figure><figcaption>PRC</figcaption></figure>
HTML4: none

<figure>

标签用于对元素进行组合。使用 <figcaption> 元素为元素组添加标题。
HTML5: <figure><figcaption>PRC</figcaption><p>The People’s Republic of China was born in 1949…</p></figure>
HTML4: <dl><h1>PRC</h1><p>The People’s Republic of China was born in 1949…</p></dl>

<footer>

标签定义 section 或 document 的页脚。典型地，它会包含创作者的姓名、文档的创作日期以及/或者联系信息。
HTML5: <footer></footer>
HTML4: <div></div>

<header>

标签定义 section 或 document 的页眉。
HTML5: <header></header>
HTML4: <div></div>

<hgroup>

标签用于对网页或区段（section）的标题进行组合。
HTML5: <hgroup></hgroup>
HTML4: <div></div>

<keygen>

标签定义生成密钥。
HTML5: <keygen>
HTML4: none

<mark>

主要用来在视觉上向用户呈现那些需要突出的文字。<mark>标签的一个比较典型的应用就是在搜索结果中向用户高亮显示搜索关键词。
HTML5: <mark></mark>
HTML4: <span></span>

<meter>

标签定义度量衡。仅用于已知最大和最小值的度量。必须定义度量的范围，既可以在元素的文本中，也可以在 min/max 属性中定义。
HTML5: <meter></meter>
HTML4: none

<nav>

标签定义导航链接的部分。
HTML5: <nav></nav>
HTML4:<ul></ul>

<output>

标签定义不同类型的输出，比如脚本的输出。
HTML5: <output></output>
HTML4: <span></span>

<progress>

标签运行中的进程。可以使用 <progress> 标签来显示 JavaScript 中耗费时间的函数的进程。
HTML5: <progress></progress>
HTML4: none

<rp>

标签在 ruby 注释中使用，以定义不支持 ruby 元素的浏览器所显示的内容。
HTML5: <ruby>漢 <rt><rp>(</rp>ㄏㄢˋ<rp>)</rp></rt></ruby>
HTML4: none

<rt>

标签定义字符（中文注音或字符）的解释或发音。
HTML5: <ruby>漢 <rt> ㄏㄢˋ </rt></ruby>
HTML4: none

<ruby>

标签定义 ruby 注释（中文注音或字符）。
HTML5: <ruby>漢 <rt><rp>(</rp>ㄏㄢˋ<rp>)</rp></rt></ruby>
HTML4: none

<section>

标签定义文档中的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分。
HTML5: <section></section>
HTML4: <div></div>

<source>

标签为媒介元素（比如 <video> 和 <audio>）定义媒介资源。
HTML5: <source>
HTML4: <param>

<summary>

标签包含 details 元素的标题，”details” 元素用于描述有关文档或文档片段的详细信息。”summary” 元素应该是 “details” 元素的第一个子元素。
HTML5: <details><summary>HTML 5</summary>This document teaches you everything you have to learn about HTML 5.</details>
HTML4: none

<time>

标签定义日期或时间，或者两者。
HTML5: <time></time>
HTML4: <span></span>

<video>

标签定义视频，比如电影片段或其他视频流。
HTML5: <video src=”movie.ogg” controls=”controls”>您的浏览器不支持 video 标签。</video>
HTML4:<object type=”video/ogg” data=”movie.ogv”><param name=”src” value=”movie.ogv”></object>

]]> http://design4u.cn/2011/11/30/html5%e6%96%b0%e6%a0%87%e7%ad%be%e8%a7%a3%e9%87%8a%e5%8f%8a%e7%94%a8%e6%b3%95/feed/ 0 Meta标签详细参数——HTTP标题信息(HTTP-EQUIV)和页面描述信息(NAME) http://design4u.cn/2011/11/30/meta%e6%a0%87%e7%ad%be%e8%af%a6%e7%bb%86%e5%8f%82%e6%95%b0%e2%80%94%e2%80%94http%e6%a0%87%e9%a2%98%e4%bf%a1%e6%81%afhttp-equiv%e5%92%8c%e9%a1%b5%e9%9d%a2%e6%8f%8f%e8%bf%b0%e4%bf%a1%e6%81%afname/ http://design4u.cn/2011/11/30/meta%e6%a0%87%e7%ad%be%e8%af%a6%e7%bb%86%e5%8f%82%e6%95%b0%e2%80%94%e2%80%94http%e6%a0%87%e9%a2%98%e4%bf%a1%e6%81%afhttp-equiv%e5%92%8c%e9%a1%b5%e9%9d%a2%e6%8f%8f%e8%bf%b0%e4%bf%a1%e6%81%afname/#comments Wed, 30 Nov 2011 02:03:48 +0000 admin http://design4u.cn/?p=1450 meta是用来在HTML文档中模拟HTTP协议的响应头报文，META标签分两大部分：HTTP标题信息(HTTP-EQUIV)和页面描述信息(NAME)。
http-equiv属性详解

1、＜meta http-equiv=”Content-Type” content=”text/html”;charset=gb_2312-80″＞和＜meta http-equiv=”Content-Language” content=”zh-CN”＞用以说明主页制作所使用的文字以及语言，又如英文是ISO-8859-1字符集，还有BIG5、utf-8、 shift-Jis、Euc、Koi8-2等字符集；

2、＜meta http-equiv=”Refresh” content=”88;url=http://www.design4u.cn”＞定时让网页在指定的时间88秒内，跳转到页面http;//www.s027.cn；

3、＜meta http-equiv=”Expires” content=”Mon,12 May 2009 00:20:00 GMT”＞可以用于设定网页的到期时间，一旦过期则必须到服务器上重新调用。需要注意的是必须使用GMT时间

格式；

4、＜meta http-equiv=”Pragma” content=”no-cache”＞是用于设定禁止浏览器从本地机的缓存中调阅页面内容，设定后一旦离开网页就无法从Cache中再调出；

5、＜meta http-equiv=”set-cookie” content=”Mon,12 May 2001 00:20:00 GMT”＞cookie设定，如果网页过期，存盘的cookie将被删除。需要注意的也是必须使用GMT时间格式；

6、＜meta http-equiv=”Pics-label” content=”"＞网页等级评定，在IE的internet选项中有一项内容设置，可以防止浏览一些受限制的网站，而网站的限制级别就是通过meta属性来设置的；

7、＜meta http-equiv=”windows-Target” content=”_top”＞强制页面在当前窗口中以独立页面显示，可以防止自己的网页被别人当作一个frame页调用；

8、＜meta http-equiv=”Page-Enter” content=”revealTrans(duration=10,transtion=50)”＞和＜meta http-equiv=”Page-Exit” contect=”revealTrans(duration=20，transtion=6)”＞设定进入和离开页面时的特殊效果，这个功能即 FrontPage中的”格式/网页过渡”，不过所加的页面不能够是一个frame页面。

name属性主要用于描述网页，对应于content（网页内容），以便于搜索引擎机器人查找、分类。这其中description（站点在搜索引擎上的描述）和keywords（分类关键词）是最重要的，所以应该给每页加一个meta值。

参数：Keywords (关键字)
说明：为搜索引擎提供的关键字列表
举例：<meta name=”Keywords” Content=”关键词1,关键词2，关键词3,关键词4,……”>
提示：各关键词间用英文逗号”,”隔开。meta的通常用处是指定搜索引擎用来提高搜索质量的关键词。当数个meta元素提供文档语言从属信息时，搜索引擎会使用lang特性来过滤并通过用户的语言优先参照来显示搜索结果。
例如：<META NAME=”Keywords” CONTENT=”信用卡查询,信用卡进度查询,网银导航,招商信用卡,交通信用卡,民生信用卡,中信信用卡,浦发信用卡,光大信用卡,兴业信用卡”>

参数：Description (简介)
说明：Description用来告诉搜索引擎你的网站主要内容。
举例：<meta name=”Description” Content=”你网页的简述”>
提示：无
例如：<META NAME=”Description” CONTENT=”本站点是银行卡快速导航站点,能帮您快速进入各银行网站查询所需资料,减少记忆麻烦”>

参数：Robots (机器人向导)
说明：Robots用来告诉搜索机器人哪些页面需要索引，哪些页面不需要索引。Content的参数有all、none、index、noindex、follow、nofollow。默认是all。
举例：<meta name=”Robots” Content=”All|None|Index|Noindex|Follow|Nofollow”>
提示：许多搜索引擎都通过放出robot/spider搜索来登录网站，这些robot/spider就要用到meta元素的一些特性来决定怎样登录。
all：文件将被检索，且页面上的链接可以被查询；
none：文件将不被检索，且页面上的链接不可以被查询；(和 “noindex, no follow” 起相同作用)
index：文件将被检索；（让robot/spider登录）
follow：页面上的链接可以被查询；
noindex：文件将不被检索，但页面上的链接可以被查询；(不让robot/spider登录)
nofollow：文件将不被检索，页面上的链接可以被查询。(不让robot/spider顺着此页的连接往下探找)
例如：<META NAME=”Robots” CONTENT=”All”>

参数：Author (作者)
说明：标注网页的作者或制作组
举例：<meta name=”Author” Content=”Design4u，QQ:66383210，admin@design4u.cn,”>
提示：Content可以是：你或你的制作组的名字,或Email
例如：<meta name=”Author” Content=”D4U STUDIO，admin@design4u.cn”>

参数：Copyright (版权)
说明：标注版权
举例：<meta name=”Copyright” Content=”本页版权归design4u.cn所有。All Rights Reserved”>
提示：无
例如：<META NAME=”Copyright” CONTENT=”本站版权归D4U STUDIO版权所有。All Rights Reserved”>

参数：Generator (编辑器)
说明：编辑器的说明
举例：<meta name=”Generator” Content=”PCDATA|FrontPage|”>
提示：Content=”你所用编辑器”
例如：<meta name=”Generator” Content=”PCDATA|FrontPage|”>

参数：Language (语言)
说明：网页语言的说明
举例：<META NAME=”Language” CONTENT=”zh-CN”>
提示：无
例如：<META NAME=”Language” CONTENT=”zh-CN”>

参数：Designer(设计者)
说明：网页设计者的说明
举例：<META NAME=”Designer” CONTENT=”your name”>
提示：一般而言，发布者为个人信息
例如：<META NAME=”Designer” CONTENT=”design4u”>

参数：Publisher(发布者)
说明：网站发布者的说明
举例：<META NAME=”Publisher” CONTENT=”your name”>
提示：一般而言，发布者为发布公司信息
例如：<META NAME=”Publisher” CONTENT=”D4U STUDIO”>

参数：Title(主题)
说明：网站主题说明
举例：<META NAME=”Title” CONTENT=”your title”>
提示：通常这里的值是网页的内容标题
例如：<META NAME=”Title” CONTENT=”Design4U个人站点”>

参数：Subject(内容的主题)
说明：主要是指这篇文章的主题是什么，核心内容是什么。
举例：<META NAME=”Subject” CONTENT=”your Subject”>
提示：无
例如：<META NAME=”Subject” CONTENT=”Design4U个人站点”>

参数：Abstract(摘要)
说明：网页页面说明
举例：<META NAME=”Abstract” CONTENT=”本网站为Design4U个人站点”>
提示：对页面内容进行简短的描述，常见于内容页面中，可以加强搜索引擎对页面内容的保存，便于用户搜索。
例如：<META NAME=”Abstract” CONTENT=”本网站为Design4U个人站点”>

参数：Expires(期限)
说明：网页页面期限
举例：<META NAME=”Expires” CONTENT=”time”>
提示：必须是GMT标准时间，定义过期时间，超过时间后即不能从cache中掉出。
例如：<META NAME=”Expires” CONTENT=”Wed, 11 Feb 2010 00:51:09 EST”>

参数：Distribution(分配目标)
说明：META NAME在那些页面有效
举例：<META NAME=”Distribution” CONTENT=”Global”>
提示：是指网站都在哪些地区范围出现，一般设置为Global即为全球范围。
例如：<META NAME=”Distribution” CONTENT=”Global”>

参数：Revisit-After(重访时间)
说明：一般大型网站，蜘蛛爬行频率相当频繁，导致服务器重压。因此做这样的限制是让蜘蛛在限定日期内重访，例如7 days就是七天访问一次
举例：<META NAME=”Revisit-After” CONTENT=”N Days”>
提示：是指网站都在哪些地区范围出现，一般设置为Global即为全球范围。
例如：<META NAME=”Revisit-After” CONTENT=”7 days”>

]]> http://design4u.cn/2011/11/30/meta%e6%a0%87%e7%ad%be%e8%af%a6%e7%bb%86%e5%8f%82%e6%95%b0%e2%80%94%e2%80%94http%e6%a0%87%e9%a2%98%e4%bf%a1%e6%81%afhttp-equiv%e5%92%8c%e9%a1%b5%e9%9d%a2%e6%8f%8f%e8%bf%b0%e4%bf%a1%e6%81%afname/feed/ 0 有用的HTML5学习资源 http://design4u.cn/2011/07/11/%e6%9c%89%e7%94%a8%e7%9a%84html5%e5%ad%a6%e4%b9%a0%e8%b5%84%e6%ba%90/ http://design4u.cn/2011/07/11/%e6%9c%89%e7%94%a8%e7%9a%84html5%e5%ad%a6%e4%b9%a0%e8%b5%84%e6%ba%90/#comments Mon, 11 Jul 2011 03:24:51 +0000 admin /?p=1343 虽然HTML5还是很新，没有被所有主要浏览器支持，但现在还是有许多设计师和开发人员使用。毫无疑问，几年下来，HTML5将对web开发起着很 重要的作用。我注意到很多人都在使用它，但也有许多人还没有接触过HTML5。为了帮助学习这个任务，我们收集了7个有用的HTML5学习资源。

一、HTML5开发者指南

html5-w3c

这个文档举例说明了如何编写HTML5文档，为初学者提供了简单和可实践的应用程序，也为高级开发人员提供了更深度的信息。

二、WHATWG博客

html5-whatwg-blog

WHATWG博客是网络超文本应用技术工作小组（Web Hypertext Application Technology Working Group）的博客，就是负责HTML5规格的那群人。

三、Dive Into HTML 5（钻研HTML5）

web design books

Dive Into HTML 5是从HTML5规格和其他标准中精心挑选并详述其特征的一本书。

四、HTML5医生

html5-doctor

HTML5医生发表了许多文章，都是关于HTML5及其语义、及如何正确使用它的。他们也通过“询问医生”收集了很多问题，并在文章中予以回答，所有人都可从中受益。

五、When can I use

html5-when-can-i-use

这是一个以表格制成的备忘单形式的单页面，描述了HTML5、CSS3、SVG及其他未来网络技术的特征。

六、HTML5可视备忘单

html5_visual-cheat-sheet

这个备忘单就是一个简单的可视网格，包含了所有HTML5标签和相关的属性。

]]> http://design4u.cn/2011/07/11/%e6%9c%89%e7%94%a8%e7%9a%84html5%e5%ad%a6%e4%b9%a0%e8%b5%84%e6%ba%90/feed/ 0 学习HTML5不可错过的12家国外网站 http://design4u.cn/2011/07/11/%e5%ad%a6%e4%b9%a0html5%e4%b8%8d%e5%8f%af%e9%94%99%e8%bf%87%e7%9a%8412%e5%ae%b6%e5%9b%bd%e5%a4%96%e7%bd%91%e7%ab%99/ http://design4u.cn/2011/07/11/%e5%ad%a6%e4%b9%a0html5%e4%b8%8d%e5%8f%af%e9%94%99%e8%bf%87%e7%9a%8412%e5%ae%b6%e5%9b%bd%e5%a4%96%e7%bd%91%e7%ab%99/#comments Mon, 11 Jul 2011 03:20:08 +0000 admin /?p=1339 HTML5 是下一代 Web 语言，它不单单是一种标记语言，更为下一代 Web 提供了全新功能，并将引领下一代 Web 实现类似桌面的应用体验。本文提供了学习HTML5不可错过的十二家国外的网站，供大家参考。

HTML5 是近十年来Web开发标准最巨大的飞跃。和以前的版本不同，HTML5并非仅仅用来表示Web内 容，它的新使命是将Web带入一个成熟的应用平台，在 HTML5平台上，视频、音频、图象、动画以及同电脑的交互都被标准化。对于广大开发人员和设计者，究竟该如何入手HTML5及获取相关的国外最新资源。

以下是广大HTML5技术爱好者学习和参考相关技术不可错过的12家外网，它们或是采用HTML5技术开发出的案例，或是HTML5相关的学习资源，供国内的开发人员参阅。

(1)HTML5 Labs

查看：http://html5labs.interoperabilitybridges.com/

HTML5实验室，这里有HTML5标准、范型和应用规范的最新内容。

(2)HTML5 – Wikipedia

查看：http://en.wikipedia.org/wiki/HTML5

维基百科对HTML5的介绍包括了它的历史、特性、与HTML4.01和XHTML 1.X的异同、HTML5的LOGO、参考资料、深度阅读及相关的链接等等。

(3)Apple – HTML5

查看：http://www.apple.com/html5/

最新的苹果移动设备和每一款Mac，包括最新的Safari浏览器，都支持最新的HTML5、CSS3和JavaScript。这里有苹果关于HTML5的最新成果和案例。

(4)Youtube HTML5 Beta

查看：http://www.youtube.com/html5

YouTube上推出了HTML5视频试用，用户可以选择是否参加。如果用户使用的是受支持的浏览器，则可以选择使用HTML5播放器而不是Flash播放器播放大多数视频。

(5)Dive into HTML5 by Mark Pilgrim

查看：http://diveintohtml5.org/

这是一本Mark Pilgrim写的介绍HTML5的畅销书籍，内容包括关于HTML5你不得不知的5件事、HTML5的历史、HTML5包含的元素、视频演示以及更多的使用技巧等等。

(6)HTML 5 Cheat Sheet (PDF) – Smashing Magazine(关于HTML5资料的PDF文档精华 )

查看：http://www.smashingmagazine.com/2009/07/06/html-5-cheat-sheet-pdf/

(7)HTML5 Rocks(需翻墙)

查看：http://www.html5rocks.com/

HTML5 Rocks的内容包括了HTML5的演示、视频、如何使用HTML5的API、基础进阶教程等等。

(8)World’s Biggest PacMan

查看：http://worldsbiggestpacman.com/

用HTML5开发出的在全球畅销的经典游戏。

(9)HTML5 Gallery

查看：http://html5gallery.com/

这里汇集了用HTML5开发出的各种应用和演示。

(10)HTML5 Demos

查看：http://html5demos.com/

全球开发者用HTML5开发出的示范案例和演示。

(11)W3Schools HTML5

查看：http://www.w3schools.com/html5/default.asp

在W3Schools HTML5,“私人教师”会向你介绍HTML5最新的特性以及如何应用它们。此外，

(12)Gury

查看：http://guryjs.org/

也是HTML5爱好者不可错过的。

]]> http://design4u.cn/2011/07/11/%e5%ad%a6%e4%b9%a0html5%e4%b8%8d%e5%8f%af%e9%94%99%e8%bf%87%e7%9a%8412%e5%ae%b6%e5%9b%bd%e5%a4%96%e7%bd%91%e7%ab%99/feed/ 0 html5Gallery：专门收集HTML5网站设计 http://design4u.cn/2011/07/11/html5gallery-%e4%b8%93%e9%97%a8%e6%94%b6%e9%9b%86html5%e7%bd%91%e7%ab%99%e8%ae%be%e8%ae%a1/ http://design4u.cn/2011/07/11/html5gallery-%e4%b8%93%e9%97%a8%e6%94%b6%e9%9b%86html5%e7%bd%91%e7%ab%99%e8%ae%be%e8%ae%a1/#comments Mon, 11 Jul 2011 03:08:14 +0000 admin /?p=1330 html5Gallery是专门收集使用HTML标记创建的网站设计。如果你正准备学习HTML5，可以从这些网站里面查看各种实例，提高你对HTML的认知和使用。

另外再推荐几个其它网站：
html5Gallery
苹果官方HTML5案例收集
html5beauty.net
html5mania.com
arshtml5gallery.com
101besthtml5sites.com
html5based.com
html5-showcase.com

]]> http://design4u.cn/2011/07/11/html5gallery-%e4%b8%93%e9%97%a8%e6%94%b6%e9%9b%86html5%e7%bd%91%e7%ab%99%e8%ae%be%e8%ae%a1/feed/ 0