新手入门:HTML5是什么?
Html 5开始大热标志性的事件是Apple 前CEO Steve Jobs 公开炮轰Flash,并指出Flash在移动终端的不利因素,而且Html5将获得胜利。顿时it界,数字营销界,数字媒体界等相关领域的人开始一窝蜂的议论,追捧,打击,HTML 5成了当仁不让的明星(就在不久前Adobe宣布停止对Mobile端flash的开发与更新)。但是很多人,都在问:HTML5是什么?如何鉴定HTML5产品?
我们这次的《知识普及》栏目就来看看初步的探索下HTML5。
一、什么是HTML,以及HTML 5
1. HTML
HTML是超文本标记语言的英文缩写,这是一种标记语言,不需要进行编译,直接由浏览器执行。
语言就必须有一个语法的规则,如果没有规则,谁知道应该把一个HTML元素以怎样的形式展现给用户呢?目前HTML语言的标准是由 W3C(World Wide Web Consortium)负责制定的。依照规则,无论是何种浏览器,对于相同的HTML代码,应当展现给用户相同的效果。
目前HTML语言最新版本为4(HTML 4),此外还有一个可扩展超文本标记语言(XHTML)作为其扩展版本,提供更为丰富的功能和更严谨的语法规范。
2. HTML 5
HTML5草案的前身名为Web Applications 1.0。於2004年被WHATWG提出,於2007年被W3C接纳,并成立了新的HTML工作团队。2008年1月22日,W3C发布了最新的HTML5工作草案,HTML工作组包括AOL、Apple、Google、IBM、 Microsoft、Mozilla、Nokia、Opera等数百个开发上。HTML5中增加了许多新特性,例如嵌入音频、视频和图片的函数、客户端存 储数据、交互式文档等,通过制定如何处理所有HTML元素以及如何从错误中恢复的精确规则,HTML5进一步增强了互动性,并有效减少了开发成本。
二、HTML5 有哪些特质
我们来看看W3.org列举出来的8个Class技术描述:
A. 语义特性(Class:Semantic)
HTML5赋予网页更好的意义和结构。更加丰富的标签将随着对RDFa的,微数据与微格式等方面的支持,构建对程序、对用户都更有价值的数据驱动的Web。
B. 本地存储特性(Class: OFFLINE & STORAGE)
基于HTML5开发的网页APP拥有更短的启动时间,更快的联网速度,这些全得益于HTML5 APP Cache,以及本地存储功能。Indexed DB(html5本地存储最重要的技术之一) 和API说明文档。
C. 设备兼容特性 (Class: DEVICE ACCESS)
从Geolocation 功能的API文档公开以来,HTML5为网页应用开发者们提供了更多功能上的优化选择,带来了更多体验功能的优势。HTML5提供了前所未有的数据与应用接入开放接口。使外部应用可以直接与浏览器内部的数据直接相连,例如视频影音可直接与microphones及摄像头相联
D. 连接特性(Class: CONNECTIVITY)
更有效的连接工作效率,使得基于页面的实时聊天,更快速的网页游戏体验,更优化的在线交流得到了实现。HTML5拥有更有效的服务器推送技术,Server-Sent Event和WebSockets就是其中的两个特性,这两个特性能够帮助我们实现服务器将数据’推送’到客户端的功能。
E. 网页多媒体特性(Class: MULTIMEDIA)
支持网页端的Audio、Video等多媒体功能, 与网站自带的APPS,摄像头,影音功能相得益彰。
F. 三维、图形及特效特性(Class: 3D, Graphics & Effects)
基于SVG、Canvas、WebGL及CSS3的3D功能,用户会惊叹于在浏览器中,所呈现的惊人视觉效果。
G. 性能与集成特性(Class: Performance & Integration)
没有用户会永远等待你的Loading——HML5会通过XMLHttpRequest2等技术,帮助您的Web应用和网站在多样化的环境中更快速的工作。
H. CSS3特性(Class: CSS3)
在不牺牲性能和语义结构的前提下,CSS3中提供了更多的风格和更强的效果。此外,较之以前的Web排版,Web的开放字体格式(WOFF)也提供了更高的灵活性和控制性。
Apple 官方对HTML5的各个特性做了详细并且动态的展示:http://www.apple.com/html5/showcase
三、Html 5与Html 4的区别
A.简化的语法
更简单的doctype声明是HTML5里众多新特征之一。现在你只需要写,这就行了。HTML5的语法兼容HTML4和XHTML1,但不兼容SGML。
B. 一个替代Flash的新”canvas”标记
对于Web用户来说,Flash既是一个惊喜,也是一种痛苦。有很多的Web开发人员对HTML5对Flash产生的威胁很不满。但对于那些忍受着要花几年时间加载和运行的臃肿的Flash视频的人来说,用新的 “canvas” 标记生成视频的技术已经到来。
目前, “canvas” 标记并不能提供所有的Flash具有的功能,但假以时日,Flash必将从web上淘汰。我们拭目以待,因为很多人还并不认同这种观点。
C. 新的 “header” 和 “footer” 标记
HTML5的设计是要更好的描绘网站的解剖结构。这就是为什么这些”header” 和”footer” 等新标记的出现,它们是专门为标志网站的这些部分设计的。在开发网站时,你不在需要用”div”标记来标注网页的这些部分。
D. 新的 “section” 和 “article” 标记
跟”header” 和 “footer”标记类似,HTML5中引入的新的”section” 和 “article” 标记可以让开发人员更好的标注页面上的这些区域。
据推测,除了让代码更有组织外,它也能改善SEO效果,能让搜索引擎更容易的分析你的页面。
- 栏目搜索>>分类导航
-
Flash幻灯
jQuery幻灯
JS幻灯
Flash相册
jQuery相册
图片特效
导航菜单
广告代码
在线客服
表单按钮
其它特效
-
HTML
CSS
JavaScript
Dreamweaver
Fireworks
设计分享
-
建站教程
网站运营
实用工具
网页模板
网页素材
- CSS酷站 网上购物 设计团队 设计博客
- 教程排行榜
- 神奇的HTML5动画效果演示网站
- 十款基于HTML5开发的精彩WEB应用(HTML5网站演示)
- 25个超炫的HTML5+CSS3网页应用案例欣赏
- 十三个网站案例让你提前体验HTML5和CSS3的魅力
- 15个采用HTML5实现的网站界面设计欣赏
- 体验HTML5 Canvas对象的强大 五款在线绘图应用示例
- 16个颇具创意的HTML5网站设计
- 网页设计师必收藏的十五个HTML5资源
- HTML的电子邮件链接标签mailto用法详解
- 21款效果惊艳基于HTML5的应用程序欣赏
- 采用HTML5搭建的多个网站尝鲜试用
- 如何用HTML5制作网页?
- HTML5的一些的趣味小应用
- HTML中的文本框textarea标签
- HTML标签的语义化概念、意义和实践
- 新手入门:HTML5是什么?
- 下载排行榜
- 带标题显示拉洋片式的jQuery滑动幻灯特效插件
- 带标题和数字导航的JS焦点幻灯特效代码
- 基于jQuery的超炫酷的3D切换JS幻灯焦点图特效代码
- 支持幻灯、相册、滚动、TAB选项卡等效果的...
- 半透明立体质感的宽屏flash+xml焦点幻灯代码
- 31款简单实用的CSS+JS下拉菜单脚本
- 适合摄影网站超漂亮的宽屏flash+xml幻灯轮换代码
- 简洁效果多图切换flash幻灯焦点图代码
- 基于jQuery实现的瀑布流布局列表特效代码
- 3D立体效果金字塔环形旋转的flash+xml相册代码
- 透明质感上下滑动带小图预览5屏JS焦点图幻...
- 兼容firefox和IE的QQ、淘宝旺旺在线客服代码
- 自带多种幻灯效果支持缩略图导航的jquery画...
- 能自动弹出对话信息框的QQ在线客服代码
- 6屏幻灯上下滑动式带缩略图和文字介绍的fla...
- 很好看的带缓冲效果CSS下拉菜单导航代码

