新手如何制作简单的h5页面？

新手可以尝试用意派Epub360制作一些简单的H5作品，这是一款专业的H5制作工具，大量基础功能均可免费使用。

你可以先到意派官网上的案例库中找找灵感，然后再到其教程中心查找相关教程慢慢学，合成海报、长页面、测试题等比较简单的H5创意形式都可以自学完成。此外，你还可以直接套用一些简单的模板，比自学制作更方便一点。

一、AdobeEdge目前还处于预览阶段的AdobeEdge是用HTML5、CSS、JavaScript开发动态互动内容的设计工具。内容可以同时兼容移动设备和桌面电脑。Edge的一个重要功能是Web工具包界面，方便确保页面在不同浏览器中的架构一致性，此外Edge还将整合TypeKit这样的字体服务。

动画和图形可以添加到HTML元素中，程序也能通过Edge自身的代码片段库或者JavaScript代码进行扩展。动画可以在独立的时间线上进行嵌套，还能实现互动功能。符合可以服用并通过API和代码片段控制。通过Edge设计的内容可以兼容iOS和Android设备，也可以运行在火狐、Chrome、Safari和IE9等主流浏览器。

二、AdobeDreamweaverCS6AdobeDreamweaverCS6作为一个Web设计软件，提供了对HTML网站和移动程序的可视化编辑界面。其FluidGrid排版系统整合CSS样式表功能，提供自适应版面的跨平台兼容性。

开发者可以完全实现Web设计的可视化 *** 作，无需为代码所困。用户不但还能在LiveView中预览，还提供多屏幕预览功能。开发者可以通过MultiScreen预览面板查看HTML5内容的渲染效果。LiveView通过WebKit渲染引擎支持HTML5。

三、AdobeColdFusion10ColdFusion是用来开发企业Web程序的服务器端技术，通过Websockets、互动表单、视频和地理标签等HTML5技术创建富媒体用户体验。四、SenchaArchitect2在开发移动和桌面应用的工具中，Sencha的定位是HTML5可视化应用开发。

开发团队可以在一个单一集成的环境中完成应用的设计、开发和部署。开发者还可以开发SenchaTouch2和ExtJS4JavaScript应用，并实时预览。五、SenchaTouch2SenchaTouch2是移动应用框架，也被看作是Sencha的HTML5平台。

开发者可以用它开发面向iOS、Android和Blackberry、KindleFire等多种平台的移动应用。六、DojoFoundationMaqetta来自于IBM的一个项目，DojoFoundationMaqetta是为桌面和移动设备开发HTML5应用的开源工具，支持在浏览器中查看HTML5界面。

用户体验设计师可以通过拖放组装UI样板七、微软VisualStudio2010ServicePack1虽然一开始并不支持HTML5，但微软在2011年三月发布的VisualStudio2010SP1中提供了IntelliSense，追加了针对HTML5的一些元素。

八、JetBrainsWebStorm4。0作为拥有HTML编辑器的JavaScript集成开发环境，WebStorm4。0提供了开发web应用的HTML5样板。开发者可以在创建HTML文档时可获得对HTML5文件的支持。例如砍伐者键入。

开发者还可以在chrome浏览器中实时预览HTML文档。九、GoogleWebToolkit该开发工具用于开发浏览器应用，但库中支持很多HTML5功能。包括对客户端或web存储的支持。其他HTML5功能还包括支持Canvas可视化，以及音频和视频widget。

十、DCloudHBuilderHBuilder是当前最快的HTML开发工具，强大的代码助手帮你快速完成开发，最全的语法库和浏览器兼容性数据让浏览器碎片化不再头痛。

H5是指HTML5，它万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言（HTML）的第五次重大修改。

HTML5提供了一些新的元素和属性，例如（网站导航块）和。这种标签将有利于搜索引擎的索引整理，同时更好的帮助小屏幕装置和视障人士使用，除此之外，还为其他浏览要素提供了新的功能，如

它有以下改进：

1、取消了一些过时的HTML4标记

其中包括纯粹显示效果的标记

2、将内容和展示分离

b和i标签依然保留，但它们的意义已经和之前有所不同，这些标签的意义只是为了将一段文字标识出来，而不是为了为它们设置粗体或斜体式样。u，font，center，strike这些标签则被完全去掉了。

3、一些全新的表单输入对象

包括日期，URL，Email地址，其它的对象则增加了对非拉丁字符的支持。HTML5还引入了微数据，这一使用机器可以识别的标签标注内容的方法，使语义Web的处理更为简单。

4、全新的，更合理的Tag

多媒体对象将不再全部绑定在object或embedTag中，而是视频有视频的Tag，音频有音频的Tag。

5、本地数据库

这个功能将内嵌一个本地的SQL数据库，以加速交互式搜索，缓存以及索引功能。同时，那些离线Web程序也将因此获益匪浅。不需要插件的丰富动画。

6、Canvas对象

将给浏览器带来直接在上面绘制矢量图的能力，这意味着用户可以脱离FlashSilverlight，直接在浏览器中显示图形或动画。

7、浏览器中的真正程序

将提供API实现浏览器内的编辑，拖放，以及各种图形用户界面的能力。内容修饰Tag将被剔除，而使用CSS。

8、Html5取代Flash在移动设备的地位。

9、其突出的特点就是强化了web页的表现性,追加了本地数据库,

扩展资料：

HTML5的未来趋势：

1、移动优先

从如今层出不穷的移动应用就知道，在这个智能手机和平板电脑大爆炸的时代，移动优先已成趋势，不管是开发什么，都是以移动为主。

2、游戏开发者领衔“主演”

许多游戏开发商都被Facebook或者Zynga推动着发展，而未来的Facebook应用生态系统是基于HTML5的，尽管在HTML5平台开发出游戏非常困难，但游戏开发商却都愿意那么做。

通过PhoneGap及appmobi的XDK将Web应用游戏打包整合到原生应用中也是一种方式，Facebook差不多就这么干的——基于Web应用及浏览器，但却将之打包整合进原生应用。

01

H5在狭义和广义上有两层含义，狭义上的H5只是一种编程语言，而广义上的H5则涵盖了互联网上绝大多数使用了HTML5的技术页面。

近年来，H5这个词逐渐走进人们视野，人们不禁好奇H5是什么，是一个页面制作工具吗？H5页面是什么？微信H5又是什么东西，怎么制作呢？

H5在狭义和广义上有两层含义，狭义上的H5只是一种编程语言，而广义上的H5则涵盖了互联网上绝大多数使用了HTML5的技术页面。

狭义上的H5是一种编程语言，是HTML5的简略写法。HTML又是英文中的“超文本标记语言”的缩写，HTML5也就是第五代超文本标记语言。很有趣的是，由于HTML5本身已经是一个缩写，实际上将HTML5进一步缩写成H5在英语语法中是错误的，因此只有在中国H5才会被当做HTML5的缩写，以英语为母语的人群反而并不能理解H5的意思。

H5语言对互联网时代到来的帮助很大，我们在网上或是微信中看到的网页和内容，多数都是由HTML写成的。另外，由于乔布斯禁止在苹果手机上使用flash，并且大力推行H5作为flash的替代品进行APP开发，因此目前在苹果手机中的软件几乎都有H5的功劳。

广义上的H5则不同，正如上文中所说的，我们浏览的网页、使用的微信乃至于手机中的软件，大部分都有H5的功劳。因此H5在国内互联网圈涵盖的范围极大，凡是使用了H5技术的网页微信页面等页面都可以被称为H5。H5技术也不仅仅局限于单纯的HTML5了，涵盖了HTML5、CSS3、JavaScript等一系列前端技术。

那么近年来很火的H5页面、微信H5又是什么呢？在微信朋友圈中，我们常常看到各种制作精美的电子邀请函、电子海报、抽奖或是红包等营销活动。由于这些页面使用了广义上的H5技术，因此大家也将其称之为H5页面。

由于直接使用H5技术制作H5页面需要较深的技术背景，因此市面上出现了诸多H5编辑器，它们可以帮助用户快速简单地制作H5页面。个人如果想制作H5页面或者企业想制作比较简单的H5页面就不会被技术局限了。编辑器会提供一些素材给用户，用户也可以自行上传素材。用户用这些素材制作出一个简单的页面后，添加音乐、视频、动画效果等功能，就可以像制作PPT一样制作出一个H5页面。制作完成后，用户可以自行将H5页面分享至朋友圈等社交网络，也可以通过H5编辑器的推广功能扩大作品的传播范围。

---