HTML5简单介绍
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
HTML5与互联网广告
Gartner(高德纳)的分析师Nick Jones( Gartner副总裁暨杰出 分析师)提出了未来四年移动和无线技术值得关注的十大趋势: 1.HTML5 2.NFC(近距离无线通讯技术)及类似支付之类的“触动”应用 3.独立于平台的广告工具 4.位置和周边(室内外)定位 …… 富媒体广告:它并不是一种具体的互联网媒体形式,而是指具有动 画、声音、视频和/或交互性的信息传播方法,包含下列常见的形 式之一或者几种的组合:流媒体、声音、Flash、以及Java、 Javascript、HTML等程序设计语言。富媒体可应用于各种网络服 务中,如网站设计、电子邮件、弹出式广告、插播式广告等。
HTML5与互联网广告
由以上两点可以看出,html5正是结合了多种信息展 示而不需要添加额外插件的展示平台。可见它不仅是开发 者的工具,也可能在将来还是广告业不可或缺的工具。
总结与学习
HTML5极大的解放了Web开发人员的工作量; HTML5能提高互联网应用程序的开发效率; 由于浏览器支持程度并不一致,可以预见的是HTML5 在互联网站上的普及还需要相当长的时间(IE9也将全 面支持HTML5),但是这并不妨碍HTML5在新鲜出炉 的各类移动终端设备上进行推广,譬如iPad等; 在一些内部应用上可以考虑指定浏览器并使用HTML5 进行开发。
HTML5
HTML发展历史 HTML5特性 HTML5 VS FLASH 浏览器兼容性 HTML5与互联网广告 总结
发展历史
W3C发布 HTML4.01 W3C内部对 XHTML2产生分 歧,WHATWG 成立 HTML5 第一份 正式草 案公布 W3C 解散 XHTML 2工 作组 HTML5成为 推荐标准
新的Web时代——HTML5
杨苏明
什么是HTML5???
HTML的全称是Hypertext Markup Language(超文本标记语言)。
HTML 是用于描述网页文档的标记语言。 HTML 从 1993到如今的发展,它 作为网络语言标准规范,在计算机的发展史中有着不可或缺的地位。在 2000 年对基于 Html4.0 的版本进行了微小改进 HTML4.01 ,并成为了国际 标准化组织和国际电工委员会的标准,被沿用至今。 HTML5 同样是一个 4.0 之上的新的网络标准,现在仍处于发展阶段。 目标是取代现有的HTML 4.01标准。
自学网:
http://www.happinesz.cn/archives/1389/ 解读 http://www.w3school.com.cn/html5/ 教程
Thank You !
特性-语义化
结构更加清晰明确。
特性-语义化
表单增强, HTML5为表单提供了几个新的属性、input 类型和 标签。
特性-语义化
多媒体播放。没有HTML5的时候,我们需要借助Flash的力量。
特性-语义化
多媒体播放。HTML5新增<audio>和<video>标签使得浏览器不 需要插件即可播放视频和音频。
特性-Canvas(画图)
CanvasRendering-Context2D对象 getContext(“2d”)
HTML5 VS FLASH
浏览器兼容性
浏览器兼容性
Firefox3.5、Chrome3.0、Safari4、 Opera 9.5,这四个浏览器的支持排名为前 四名。IE 从9 Beta版本也开始支持html5。 支持HTML5的不同浏览器会使得显示效果也 有差异
W3C发布 XHTML 1.0
W3C和WHATWG 合作开发下一代 HTML
HTML5成为 候选标准
XHTML:可扩展超文本标记语言,表现方式与超文本标记语言(HTML)类似,不过语法 上更加严格。从继承关系上讲,HTML是一种基于标准通用标记语言的应用,是一种非常 灵活的标记语言,而XHTML则基于可扩展标记语言,可扩展标记语言是标准通用标记语 言的一个子集。XHTML 1.0在2000年1月26日成为W3C的推荐标准。
特性-技术概览
语义化 本地存储和离线应用程序 获取地理信息位置 Web Workers —— 优化Javascript(多线程) Canvas
web worker 是运行在后台的 JavaScript,独立于其他脚本, 不会影响页面的性能。您可以继续做任何愿意做的事情:点击、选 取内容等等,而此时 web worker 在后台运行。所有主流浏览器均 支持 web worker,除了 Internet Explorer。
特性-本地存储和离线应用程序
离线应用程序。没有接入Internet也可以使用Web应用。
特性-技术概览
语义化 本地存储和离线应用程序 获取地理信息位置 —— 更丰富的用户数据 Web Workers Geolocation API Canvas 获取位置方式:
1.IP 2.GPS 3.WIFI 4.GSM
总结与学习
无论如何,HTML5是不可阻挡的技术发展趋势,它 只会使我们未来使用互联网的方式越来越方便,越来越 贴心。虽然现在还没有形式正式的标准,但从各个浏览 器厂家的积极态度可以看出,无论标准何时被审核通过 ,都会促使网站建设者逐渐向HTML5标准靠拢,这对 于所有的开发人员来说一定是一件幸事。
HTML5
使用Web Storage在客户端存储数据 容量更大,减轻带宽压力,操作简便
特性-本地存储和离线应用程序
"与Cookie相比,Web Storage存在不少的优势,概括为以下几点: 1. 存储空间更大:能提供5MB的存储空间(不同浏览器的提供的空间 不同),Cookie仅4KB 2. 存储内容不会发送到服务器:当设置了Cookie后,Cookie的内容会 随着请求一并发送的服务器,这对于本地存储的数据是一种带宽浪费。 而Web Storage中的数据则仅仅是存在本地,不会与服务器发生任何 交互。 3. 更多丰富易用的接口:Web Storage提供了一套更为丰富的接口, 使得数据操作更为简便。 4. 独立的存储空间:每个域(包括子域)有独立的存储空间,各个存 储空间是完全独立的,因此不会造成数据混乱。
特性-技术概览
Web Workers 定义:让一部分 JS 程序运Baidu Nhomakorabea在客户端操作系 统的线程中而非浏览器的线程中,从而实现多线 程。 运用:相对复杂的数据计算的JS代码 效果:与用于与用户交互的操作分离,再次 提高系统的效率
特性-技术概览
语义化 本地存储和离线应用程序 获取地理信息位置 Web Sockets Canvas —— 摆脱插件,更佳的效果
Canvas画布摆脱插件, 实现网页的炫酷效果
特性-Canvas
这个 HTML 元素是为了客户端矢量图形而设计的。它 自己没有行为,但却把一个绘图 API 展现给客户端,帮助 用户使用脚本把想绘制的东西都绘制到一块画布上。 <canvas> 标签只是图形容器(一个矩形区域的画 布),因此,必须使用 JavaScript 在网页上绘制2D图像。 并且, canvas 拥有多种绘制路径、矩形、圆形、字符以 及添加图像的方法。
特性-示意
HTML4
HTML5
特性-技术概览
语义化 —— 提升用户体验,有利于搜索引擎和屏幕阅读器的抓取。 本地存储和离线应用程序 获取地理信息位置 Web Workers Canvas
语义化是指用合理HTML标记以及其特有的属性去格式化文档内容。 通俗地讲,语义化就是对数据和信息进行处理,使得机器可以理解. 语义化的 HTML 文档有助于提升你的网站对访客的易用性,比如使用 PDA(又称为掌上电脑)、文字浏览器等。对于搜索引擎或者爬虫软 件来说,则有助于它们建立索引,并可能给予一个较高的权值。
<audio>
<video>
特性-技术概览
语义化 本地存储和离线应用程序 获取地理信息位置 Web Workers Canvas
1.Web存储 2.本地数据库(Web SQL Database)
特性-本地存储和离线应用程序
HTML4
使用cookie在客户端存储数据; 大小受限制,占用带宽,操作复杂