【51CTO精选译文】对于想要着手新建Web项目的人来说，HTML5实例确实很能给人以灵感，毕竟HTML5是未来的网页标记技术，我们都需要为此作好准备。HTML5是作为HTML(超文本标记语言)的下一个主要版本而开发的。主要的市场和互联网领导企业已经在转而改用HTML 5平台。由于苹果和谷歌都大力推行这项标准，以便从事更高级的Web开发，随着更多的公司支持HTML 5的先进特性，我们现在看到实施HTML 5的网站遍地开花。
51CTO推荐专题：HTML 5 下一代Web开发标准详解
由于Flash在Web和互联网应用程序中的应用越来越少，HTML5为Web设计师和开发者打开了新的大门。在这种情况下，每一个Web开发者的确有必要了解HTML 5的基本教程、技巧和术语。
下面我们介绍了一份完整的列表——如果你是位Web开发者，绝对不想错过这30余个HTML5实例、教程和技巧。
不妨先看一下几个HTML5实例
IBM的技术库里面有一篇由IT架构师Dietmar Krueger撰写的内容翔实的文章。作者在该文中描述和介绍了为什么为操作系统和移动平台编写应用程序困难重重。作者选择了走开放的道路，通过HTML 5来进行开发，而不是依赖学习针对特定平台的语言，比如面向iPhone平台的带Cocoa框架的Objective-C语言。这篇文章介绍得非常清晰、深入浅出。
2. HTML 5演示和实例
这个网站到处都有HTML5实例，还有很不错的实例。有些是本人一起改动的HTML 5实例和演示。点击浏览器支持图标或技术标签，就可以过滤演示(过滤器是“或”过滤器)。
3. WTF is HTML5
这一页概述了HTML5，非常实用，还有很不错的HTML5实例!
这个教程表明了如何用HTML 5和CSS3来构建一个新闻网站。HTML和CSS中的每一行代码都附有解释。
HTML 5的功能特性大部分涉及JavaScript应用编程接口(API)，因而让你更容易开发出交互网页，但是有一批新的元素让你可以为传统的Web 1.0网页添加额外的语义。这个教程通过为你提供博客布局，以便研究分析这些元素。
6. HTML 5中的语义
在最近一年左右的时间里，万维网联盟(W3C)最近加大力度开发的下一代HTML：HTML 5发展势头相当猛。这是个庞大项目，不但涵盖HTML的结构，还涵盖解析模型、错误处理模型、文档对象模型(DOM)、资源获取算法、媒体内容、2D绘图、数据模板、安全模型、网页装入模块、客户端数据存储等方面。
HTML的结构、语法和语义也进行了修改，一些内容在Lachlan Hunt所著的《HTML 5先睹为快》一书(http://www.alistapart.com/articles/previewofhtml5)中有所提及。
在本文中，我们不妨只关注HTML的语义。它是作者多年来关注的方面;他认为，语言对HTML的未来来说至关重要。
概述了HTML 5浏览器兼容性。
Dive Into HTML 5力求详细介绍从HTML 5规范及其他优秀标准精挑细选的一系列特性。时间允许的话，我会定期发布草案(Drafts)。
你在这里能找到非常实用的兼容性表，介绍了HTML5、CSS3、SVG及其他即将推出的Web技术中的特性。
HTML 5规范里面有一堆好东东，其中之一是Canvas，这是一种使用JavaScript，以编程方式来绘图的方法。 我们会在本文中介绍Canvas的基本细节，并演示了可以用实例和链接来实现什么。
12. 用HTML5表单大显身手
表单通常被认为是我们必须添加标记和样式的讨厌鬼。我不敢苟同：表单(其重要性不亚于表)是我们所要处理的最激动人心的东西。
我们在这里要看一下如何运用一些先进的CSS和最新的CSS3技巧，为漂亮的HTML 5表单添加样式。你看了本文后，我保证你也想为自己的表单添加样式。
14. 利用HTML 5和CSS3，编写向后兼容的单页网站模板
HTML5是Web开发的未来;但信不信由你，你现在可以使用它。HTML5非常顾及语义和可访问性，因为我们没必要到处添加毫无意义的div标签。它为导航和脚注等常用元素引入了有意义的标签，这些标签极其合理，也更自然。
这概述了HTML5和CSS3的基本内容，同时仍关注旧版浏览器。在我们开始之前，记下这个问题的答案。
网址：http://inspectelement.com/tutorials/code-a-backwards-compatible-one-page-portfolio-with-html5-and-css3/
15. 从头开始编写HTML 5布局
诚然，HTML5和CSS3都在完善之中，这种情况还会持续一段时日，但没有理由不立即开始使用。毕竟，时间证明实施未完成的规范确实可行，很容易换成W3C建议的完整版。这时候，渐进增强和适度降级就能发挥作用。这里有一些很不错的HTML5实例。
我知道，你郁闷了差不多有一年。所有铁杆派的Objective-C开发者一直在争先恐后地为iPhone编写应用程序。你也许甚至试着读一两篇关于为iPhone进行开发的教程，但是发现很难学会。
你可以运用已经拥有的技巧来进行开发：HTML(5)、CSS和JavaScript。
这个教程表明了如何开发一个离线的HTML5 iPhone应用程序。更具体地说，我会逐步介绍开发俄罗斯方块游戏的过程。
学习通过五个宏步骤，运用大脑、铅笔、纸、Photoshop、HTML和CSS来构建一个精致的网站。但幸好技术并没有止步，我们将来还有另外两个朋友：HTML 5和CSS3来设计更好的网站。
看看如何使用CSS3和jQuery带来的一些新特性，以及scrollTo插件，创建一个HTML5 Web模板。由于HTML5仍在完善中，你还有个办法：可以在这里(http://tutorialzine.com/2010/02/free-xhtml-css3-website-template/)下载XHTML版的模板。
19. 用HTML 5设计和编写一个酷酷的iPhone应用网站
HTML5绝对是眼下的宠儿，每个设计者都为它的发布而激动。在该教程中，我们将领略通过使用HTML 5结构来编写酷酷的iPhone应用网站会怎样，并运用一些CSS3效果来添加可视化样式。
在这个教程中，我们将使用来自HTML 5和CSS 3的下一代技巧，构建一个博客网页。该教程旨在演示等规范完成后、浏览器开发商实施这些规范后，我们将如何构建网站。如果你已经知道HTML和CSS，应该很容易按步骤行事。
面向初学者的HTML5有很不错的HTML5实例。现在就使用，它很容易!本文饶有趣味地介绍了HTML5的一些基本方面。
22. Rocking HTML5
这里演示的是一个HTML5网站，它非常详细而清晰地概述了HTML5的元素。
23. 用HTML 5构建网页
HTML 5不是构建语义更丰富的Web的下一个重要步骤，就是会用另一组不全面的标签和标记淹没Web的灾难，这取决于你在问谁了。
不管是哪一派观点，存在的问题在于，目前外面使用HTML 5的网站为数不多;所以要解决明显的问题，理论上的办法仍然基本上没有得到考验。
话虽如此，不难看到下一代Web标记工具存在的好处和潜在问题。
24. HTML5速查表
网址：http://www.html5test.com/
这不是HTML5实例，HTML 5 Visual Cheat Sheet是我为Web设计者和开发者设计的一份实用的速查表。这份速查表实际上就是一个简单的可视网格，列出了所有HTML标签以及HTML版本4.01及/或5支持的相关属性。我用来设计该速查表的可视化样式让你一眼就能看清楚所要寻找的东西。
25. html5test.com
这是个浏览器测试，有许多细节。非常实用。
26. HTML5 Canvas试验
我们可以体验一下这项技术。我们创建了一个小试验，装入100条与HTML5有关的Twitter消息，然后用基于Javascript的粒子引擎来显示它们。每个粒子代表一条Twitter消息——点击其中一个粒子，它就会在屏幕上显示(点击图像就能看到它的实际运行。)
27. 12个极出色的HTML5试验
你在这里可以找到一组极出色的基于HTML5 canvas的试验，你会从此爱上HTML5。
28. HTML 5速查表(PDF)
29. html5手册
好了，你看到HTML 5已出现在我们面前，那你应该使用它吗?
我通常认为这取决于你在开发的网站。如果它是访问量很大的商业网站，那么你可能需要再忍一阵子。不过如果它是个人博客，我认为现在就可以入手，学习如何使用HTML 5中的新特性。
英文：http://www.tripwiremagazine.com/2010/07/30-very-useful-html5-tutorials-techniques-and-examples-for-web-developers.html
相关推荐
这个《HTML5和CSS3实例教程》的源代码集合为学习者提供了丰富的实践材料，帮助理解并掌握这两种语言的实际应用。 HTML5是超文本标记语言的第五个版本，它的主要改进包括： 1. **新元素的引入**：如`<header>`、`...
这个“Html实例教程”是一个非常适合初学者入门的学习资源，旨在帮助你理解和掌握HTML的基本概念和实践技巧。 HTML由一系列元素组成，每个元素都有其特定的功能。例如，`<html>`元素是文档的根元素，`<head>`包含元...
在本节"一站式网页设计零基础HTML5布局实例教程(第九节PS篇)"中，我们将深入探讨Photoshop（PS）中的图层高级操作，这对于网页设计师来说是至关重要的技能。在网页设计过程中，高效地管理和操作图层可以极大地提高...
总的来说，"JavaScript实例教程.zip"提供了一个全面的学习路径，通过实例解析JavaScript的基本原理和实践技巧。无论是零基础的新手还是希望提升技能的开发者，都能从中受益匪浅。通过深入学习和不断实践，你将能够...
这个教程将深入探讨jQuery的各种实例，帮助你掌握其核心功能和实用技巧。 一、jQuery的选择器 jQuery 的强大之处在于其强大的选择器系统。例如，`$("#id")` 用于选取ID为特定值的元素，`$(".class")` 用于选取具有...
在这个压缩包中，包含的文件是《PHP网站开发实例教程》一书中的各个章节示例代码，每个文件代表了一个具体的学习点或实例。 首先，我们需要了解PHP（PHP: Hypertext Preprocessor）是一种广泛使用的开源脚本语言，...
ASP.NET是微软公司推出的...通过这个“ASP.NET经典实例教程”，初学者能够逐步掌握ASP.NET的基本概念和技巧，通过实例操作，提升实际开发能力。记得理论与实践相结合，不断尝试和改进，才能真正成为ASP.NET开发的高手。
总之，通过这个“HTML实例教程”，新手可以系统地学习HTML的基本语法和常用技巧，从而迈出成为网页设计师的第一步。在实践中不断练习和探索，你将能够熟练运用HTML，创作出富有创意和吸引力的网页。
在《JSP 实用教程》（第二版）中，作者耿祥义和张跃平详细介绍了JSP的各种核心概念和技术，旨在帮助读者快速掌握JSP编程技巧。全书分为10个章节，涵盖了以下主要内容： 1. **JSP简介**：这一章首先解释了JSP的重要...
这个精心整理的"七个DIV+CSS实例教程"旨在帮助初学者和有一定基础的学习者深入理解和掌握这种技术，提升网页设计能力。下面我们将详细探讨这些实例教程可能涵盖的知识点。 1. **基础概念** - `DIV`元素：`<div>`是...
这个"非常好的手机HTML5标准实例"显然是一个展示HTML5在移动设备上强大功能的示例集合，由一位技术高超的国外开发者创建。这个实例集可能包含了各种互动效果、多媒体元素以及离线存储等功能，对于初学者来说，是一个...
网站设计是数字时代的核心技能之一，本教程"网站设计基础与实例教程(PDG).rar"旨在为初学者提供全面的指导，涵盖了多个关键工具和技术。下面将深入解析这些知识点： 1. Dreamweaver：Adobe Dreamweaver是一款强大的...
《Flash动画制作实例教程》是一本专为初学者设计的指南，旨在帮助读者掌握Adobe Flash CS3这款强大的动画创作工具。教程通过实例教学的方式，详细阐述了如何利用Flash进行动画创作，涵盖了从基础操作到高级技巧的全...
该教程通过丰富的实例，详细讲解了如何利用这款软件创建、编辑和发布网页，覆盖了网页设计的基础到高级技巧。 Dreamweaver CS3是Adobe公司开发的一款集成开发环境（IDE），广泛应用于网页设计和开发。它提供了直观...
《ASP.NET3.5网站开发实例教程》的一大亮点是提供了丰富的实践案例，涵盖电子商务、社交网络、博客系统等多个领域，通过这些案例的学习，读者可以将理论知识转化为实际操作能力，从而更好地理解和掌握ASP.NET3.5的...
本教程“JavaScript基础与实例教程”由中国电力出版社出版，旨在为初学者和有经验的开发者提供一个深入理解JavaScript核心概念和实践技巧的平台。 首先，JavaScript的核心概念包括变量、数据类型和操作符。变量是...
这个“Html教程 精辟详细的实例讲解”旨在为初学者和有经验的开发者提供深入理解HTML的实例和指导，帮助他们掌握创建网页的基本技巧和高级特性。 HTML教程通常涵盖以下几个核心部分： 1. **HTML基础结构**：教程会...
JavaScript实例教程着重于通过具体实例来讲解JavaScript编程中的关键概念和编程技巧。本次我们将围绕以下几个重要知识点展开详细介绍。 首先，事件处理是JavaScript中不可或缺的一部分。在用户与网页交互时，浏览器...
【DHTMLX实例教程文档】是一份针对初学者的指南，旨在帮助他们快速掌握DHTMLX的使用。DHTMLX是一种基于JavaScript的富客户端库，它结合了HTML、CSS和JavaScript，提供了丰富的用户界面组件，用于创建动态和交互式的...