WonderCSS

简化工作流程,10款必备的HTML5开发工具

懒汉兄弟们,名为简化工作实为偷懒得闲的“10工具”文章又来了!

我们都知道,利用HTML5工具不仅可以帮助设计师和开发者创建更具吸引力的网站,还能增加网站的可用性和可访问性。此番我们收集了10款HTML5在线开发工具让你在网页中搭建特效、动画、视频、音频等诸多功能,为你节省更多开发时间。

1 Patternizer

html5-tool-patternizer

这个工具可以让你开发真正炫酷的设计,比如各种线条。你可以随意修改线条的宽度、色彩、角度等等。有了它,帮你打造超赞的背景图片

2 Font Dragr

html5-tool-fontdragr

这款工具可根据你的实际项目选择适宜的字体,你还可以通过拖放功能随意查看网站字体。

3 Adobe Typekit

html5-tool-adobe-typekit

这款工具允许你可根据视线范围来选择适宜的字体并查看实时页面。

4 Rendera

html5-tool-Rendera

如果你渴望这样一个工作氛围,可以检查、发现和研究不同类型的CSS、HTML或者JavaScript ,那么这款工具就可满足你的需求,根据选择的类型提供实时的结果并且让你的编码过程更加快速、炫酷。

5 CanvasLoader Creator

html5-tool-canvasloader

这款颠覆性的工具允许你修改载入程序,使其看起来更加引抢眼,并为访问者提供一个更加合理的理解(即使其选择的区域正在加载),它不需要任何编程教学。

6 Webdirections

html5-tool-webdirections

Webdirections是一款不错的代码集合工具,允许开发者检查、搜索、试验代码。你可以选择HTML5工具、CSS工具以及设计类工具等等,可以毫不费力的迅速点击打开。

7 Initializr

Initializr是一个HTML5模板生成器,以帮助你启动HTML5项目开发 。你可以根据自己的项目进行选择哪些项目可包含在HTML中,哪些不可以。

8 On/Off Flipswitch HTML5/CSS3 Generator

html5-tool-On-Off-FlipSwitc

Flip-Switches允许用户在网站上在线/离线状态下移动图片。只需修改小段代码即可实现这一功能,让你坦然面的各种操作系统、Web浏览器。

9 Liveweave

html5-tool-liveweave

LiveWeave是一个极好的在线工具,该工具支持HTML5、CSS3、JavaScript,允许你检验、测试并运行代码。

10 HTML KickStart

html5-tool-HTML-KickStart

该工具让你轻松创建网站,支持排版、表格、按钮、列表等功能。

最后Wondercss还要友情提示下,在线工具虽好用,但也别盲目的使用。无为无意义的花样设计只会让页面亲和度降低,更加加重了页面承载力。适度的使用,最重要的是在使用中能学到其中的语法才是最棒的,毕竟吃在肚子里的才是实货!

By 于湛 发布于 2013.08.29 2,599 次浏览

发表评论

电子邮件地址不会被公开。 必填项已用*标注