分类：HTML5

2016
12-14

HTML5 语义化 - main

早在2013年，<main>元素就被正式添加到W3CHTML规范中，到目前位置，关于该元素的定义已经很完善了，所以现在是时候深入了解什么时候适合使用<main>元素了。那么，下面就开始吧。W3C规范<main>的主要目的是将ARIA的地标性作用main映射到HTML中的元素。这可以帮助那些屏幕阅读设备和辅助设备知道页面的主要内容是从哪里开始的。W3C规范将<main>描述为：文档或应用程序的主要内容。主内容区域... 继续阅读 >
2016
12-12

HTML5.1 里的新东西

HTML5.1概览两年前HTML5标准的发布对于web开发社区来说是一件大事。不仅是因为它包含了一系列让人印象深刻的新特性,还因为它是1999年发布的HTML4.01标准以后，对HTML的第一个大版本更新。你现在依然可以看到一些网站夸耀他们在使用“现代”的HTML5标准。幸运的是我们不需为下一次HTML标准的更新等待那么长时间。2015年10月，W3C开始着手HTML5.1草案，其目标是修复一些HTML5遗留的问题。多次迭代后,草案... 继续阅读 >
2016
10-05

6个最好的 HTML5/CSS3 演示（PPT）框架

HTML是全世界最流行的网页编程语言。而HTML5是这门语言的升级版本。越来越多的开发者和设计师开始使用HTML5.今天我们要介绍的是最好的几个HTML5/CSS3的演示工具和框架，你可以用它们来创建你的网页PPT。1.html5Slides这是Google提供的HTML5幻灯片模板。你可以下载这个模板，然后编辑它，就可以创建你自己的幻灯片了。2.SlidesPresentationwithHTML5这个工具用了纯HTML做主题和框架，CSS做切换效果，还有一个简... 继续阅读 >
2016
04-11

你真的了解H5吗？

H5广告，包括H5广告的设计流程，究竟有什么讲究，和阶段。为了能帮助更多的人了解H5广告，我专门做了一个讲义。同时，也让我意外的收到了非常好反馈和认！这是对我的极大鼓励！我的讲义内容仍然还有不少不完善和有待系统的内容。但是，我相信你在现在的互联网上应该很难再找到像是我这种体量的带有系统性的H5广告讲解内容了～希望能对这个行业作出微薄的贡献！目前互联网上最为全面的H5普及知识分享干货内容讲义！ 对H5的最初... 继续阅读 >
2016
01-11

web App VS native App，路遥知马力

HTML5HTML5这个概念也已经炒作了几年了，看了很多关于HTML5的文章，包括一些技术书籍，对这一概念吹的雨里雾里，说了一大堆新特性讲了一大堆抽象的概念。搞得我很长时间才搞清楚什么是HTML5。其实没什么太多的东西，就是督促各个浏览器厂商都支持一些新的比较实用的属性，大家的行为尽量保持一致。给HTML添加了一些实用的标签，让一部分以前需要写很多JS代码才能实现的效果，只需要一个标签就可以简单搞定，当然这是在得到了浏... 继续阅读 >
2015
12-26

戏说HTML5

如果有非技术人员问你，HTML5是什么，你会怎么回答？新的HTML规范。。。给浏览器提供了牛逼能力，干以前不能干的事。。。（确切地说应该是给浏览器规定了许多新的接口标准，要求浏览器实现牛逼的功能。。。这里感谢红枫一叶）给浏览器暴露了许多新的接口。。。加了很多新的效果。。。问的人其实并不明白他想问的真正问题，回答的人貌似明白，但又好像少了点什么。牛逼的能力、新的接口、炫酷的效... 继续阅读 >
2015
11-09

HTML5的这些api你知道吗？ HOT

HTML5的这些api你知道吗？ 以下是之前学习的一些HTML5API的总结，在HTML5中有许多功能和接口很值得我们去了解和学习。页面可见性API--pageVisbility全屏API--fullScreen获取MediaAPI--getUserMedia电池API--battery资源预加载API--linkPrefetchingPageVisibility页面可见性API该API可以用来检测页面对于用户的可见性，即返回用户当前浏览的页面或标签tap的状态变化。在最小化浏览器、切换tap页面时生效.(如需对app... 继续阅读 >
2015
10-23

HTML5 Charset能用吗？

前一段某项目中页面在IE6突然出现了乱码，当时做了各种排查，最终推测是使用了HTML5的DOCTYPE和Charset以及中文注释的问题，于是临时采用旧的Charset方法来修复了下，后面乱码再没出现。其实一直不太确定HTML5的Charset能否被IE6识别，于是做了一些测试。先说下两种Charset声明方法，其实大家应该都很熟悉的：后面我们简称第一种方法为HTML5方法，第二种方法为HTML4方法。测试环境：WindowsXPSp2，中文版+英文版两个版本的... 继续阅读 >
2015
10-08

基于 HTML5 的 3D 网络拓扑树呈现 HOT

在HTforWeb中2D和3D应用都支持树状结构数据的展示，展现效果各异，2D上的树状结构在展现层级关系明显，但是如果数据量大的话，看起来就没那么直观，找到指定的节点比较困难，而3D上的树状结构在展现上配合HTforWeb的弹力布局组件会显得比较直观，一眼望去可以把整个树状结构数据看个大概，但是在弹力布局的作用下，其层次结构看得就不是那么清晰了。所以这时候结构清晰的3D树的需求就来了，那么这个3D树具体长成啥样呢，我们... 继续阅读 >
2015
02-12

HTML5七大优势“逼宫”APP HOT

HTML5颠覆了PC互联网的格局，优化了移动互联网的体验，接下来几年，HTML5将颠覆原生App世界。跨平台：在多屏年代，开发者的痛苦指数非常高，人人都期盼HTML5能扮演救星。多套代码、不同技术工种、业务逻辑同步，这是折磨人的过程。有点类似个人电 脑早期世界，那个时候的每家电脑都有自己的操作系统和编程语言，开发者疲于做不同版本，其实DOS的盛行也很大程度是因为开发者实在没精力给其他电脑写程 序... 继续阅读 >
2015
02-04

HTML5应用程序缓存Application Cache详解

什么是ApplicationCacheHTML5引入了应用程序缓存技术，意味着web应用可进行缓存，并在没有网络的情况下使用，通过创建cachemanifest文件，可以轻松的创建离线应用。ApplicationCache带来的三个优势是：①离线浏览②提升页面载入速度③降低服务器压力而且主要浏览器皆以支持ApplicationCache，就算不支持也不会对程序造成什么影响离线存储技术HTML5提出了两大离线存储技术：localstorage与ApplicationCache，两者各... 继续阅读 >
2015
01-27

HTML5 History API 实现无刷新更新地址栏URL

History是有趣的，不是吗？在之前的HTML版本中，我们对浏览历史记录的操作非常有限。我们可以来回使用可以使用的方法，但这就是一切我们能做的了。但是，利用HTML5的HistoryAPI，我们可以更好的控制浏览器的历史记录了。例如：我们可以添加一条记录到历史记录的列表中，或者在没有刷新时，可以更新地址栏的URL。为什么介绍HistoryAPI？在这篇文章中，我们将了解HTML5中HistoryAPI的来源。在此之前，我们经常使用散列值来... 继续阅读 >
2015
01-25

使用HTML5中postMessage实现Ajax中的POST跨域问题 HOT

HTML5中提供了在网页文档之间相互接收与发送信息的功能。使用这个功能，只要获取到网页所在窗口对象的实例，不仅仅同源(域+端口号)的web网页之间可以互相通信，甚至可以实现跨域通信。浏览器支持程度：IE8+，firefox4+，chrome8+ opera10+1.首先，要想接收从其他的窗口发过来的消息，就必须对窗口对象的message事件进行监听，如下代码：window.addEventListener(“message”,function(){},false);2.其次，需要使用wi... 继续阅读 >
2015
01-23

HTML5会是下一个风口吗？

2014年10月底，W3C（万维网联盟）正式宣布HTML5正式定稿，科技圈就像发现了可以打破谷歌、苹果所统领的原生APP世界的方法，发表了很多宣讲HTML5将真正开始颠覆原生（Native）App的文章，也开始着力发展HTML5，开始抢占HTML5这个未来的风口。那么HTML5为成为下一个风口吗？HTML5的定稿真正可以颠覆目前火热的原生APP吗？个人认为，存在以下的机遇。1.苹果、谷歌的态度苹果、谷歌所代表的iOS、安卓系统，占据了移... 继续阅读 >
2015
01-09

7款绚丽的jQuery/HTML5动画及源码 HOT

jQuery是一款非常流行的JavaScript框架，利用jQuery，我们可以制作简单的动画效果，但是结合HTML5，这样的动画效果就会变得更加出彩。本文分享了7款jQuery结合HTML5的动画以及源码下载。1、HTML5/SVG实现布谷鸟时钟动画这是一款非常有意思的HTML5动画，它是一个老式的时钟，有布谷鸟报时，情侣的浪漫舞蹈。在线演示源码下载2、HTML5/CSS3实现图片倒影3D效果这款应用主要利用了CSS3的transform属性实现... 继续阅读 >
2015
01-07

8个最新炫酷的HTML5动画应用 HOT

HTML5目前已经逐渐成熟，越来越多的Web项目都已经用到了HTML5技术，包括CSS3。本文主要分享了一些最新的HTML5动画应用，大部分都比较炫酷，也有一些比较实用的，并且每一个动画都提供源代码下载。1、HTML5Canvas实现画板涂鸦动画应用这是一款HTML5网络画板，拥有基础的图形绘制功能，相对比较简单，基于canvas，因此非常灵活。在线演示源码下载2、HTML5堆木头游戏这款游戏的玩法是将木头堆积起来，... 继续阅读 >
2015
01-05

HTML5的性能不输原生app 可以用拼积木的方式做HTML5产品 HOT

可能你已经发现了，一个好玩有趣的HTML5页面在微信朋友圈里获得的用户关注度会远超过那些普通的独立应用。在移动应用越来越多，推广越来越难做的情况下，你的产品是不是也应该有一个HTML5页面？如果答案是肯定的，那么或许可以试试AmazeUI这套开源的HTML5前端框架，利用它提供的Web组件、JS插件和层叠样式表（CSS），你可以快速的搭建出一款HTML5产品。对于那些经常在移动设备上访问Web页面的用户... 继续阅读 >
2014
12-03

大势所趋 HTML5成Web开发者最关心的技术

最近，在StackExchange上出现了一个比较热门的问题：Web开发者最头疼的问题是什么？结果并不是大家通常认为的兼容性问题，而是关于HTML5。在所有与前端开发相关的技术中，如JavaScript、CSS3、HTML5等，Web开发者们私下最经常讨论的技术领域是哪一个呢？理解这个问题就可以更好地了解当前在Web技术领域，大家所面临的挑战是什么？为了一探究竟，英属哥伦比亚大学就“Web开发者经常挖掘的问题”展开了研究。... 继续阅读 >
2014
12-03

推荐18个基于HTML5 Canvas 开发的图表库

如今，HTML5可谓如众星捧月一般，受到许多业内巨头的青睐。很多Web开发者也尝试着用HTML5来制作各种各样的富Web应用。HTML5规范引进了很多新特性，其中最令人期待的之一就是Canvas元素。HTML5Canvas提供了通过JavaScript绘制图形的方法，非常强大。今天，本文收集了一些非常好的基于HTML5Canvas的图表方案推荐给大家。1. VisualizeVisualize通过Javascript从结构化的HTML表格获取数据并借... 继续阅读 >
2014
12-03

18 款超酷的 HTML5 和 JavaScript 游戏引擎库

现在的游戏开发变得越来越复杂，需要制作各种炫丽的效果，还要制作各种基于2D或者3D的场景。为了节省游戏开发者的时间，让开发者集中精力在游戏的创新上，出现了许许多多的游戏引擎。而现在为了实现跨平台，HTML5和JavaScript成功为了游戏开发者必备的利器，特别是移动端的开发者，必须要能很好的掌握HTML5和JavaScript。现在这么多的游戏引擎，各有各的优点和缺点，为了帮助开发者们找到属于自己的那款游戏开... 继续阅读 >
2014
12-03

为什么HTML5将主宰在线视频？

磁带、光盘、Flash等媒介都需要播放器，这些媒介正在或者已经死亡。就像CD取代磁带成为一种更高效的音乐播放方式一样，数字文件也将取代CD。依此类推，HTML5也会让Flash成为昨日黄花。HTML5与Flash的对抗在网页开发者中已经成为多年热议的话题，但是无论站在哪一边，不可否认的一点是，HTML5对视频和网站的影响是实实在在的。对于在线视频来说，HTML5有两点是Flash不能做到的：移动能力和语义标记。移动参与性的增... 继续阅读 >
2014
12-03

必须Mark！最佳HTML5应用开发工具推荐

HTML5自诞生以来，作为新一代的Web标准，越来越受开发人员及设计师的欢迎。其强大的兼容性，一次开发，到处使用，大大减少了跨平台开发人员的数量及成本。特别是在如今日新月异的移动时代，除了iOS、Android两大平台，还有WindowsPhone、Blackberry、Bada等多个竞争，恰恰给了HTML5展现才能的机会。本文就搜集了十款HTML5工具，希望能对大家的开发工作有所帮助。1.AnimatronAnimatron是一款简单而又强大的在线工... 继续阅读 >
2014
12-03

Web 开发人员必备的经典 HTML5 教程

对于我来说，Web前端开发是最酷的职业之一，因为你可以用新的技术发挥，创造出一些惊人的东西。唯一的问题是，你需要跟上这个领域的发展脚本，因此，你必须不断的学习，不断的前进。本文将分享能够帮助您快速掌握HTML5的实例教程，值得好好学习。MeasuringPageLoadSpeedwithNavigationTimingNavigationTiming 是用于精确测量网站性能的JavaScriptAPI。该API提供一种简单的方式来获得准确，详细... 继续阅读 >