Corporations that want a functional, knockout website in today’s mobile marketplace are increasingly doing so using HTML5. In fact, over 30% of Fortune 500 companies are taking advantage of all the markup language has to offer as of July this year.
HTML5 lets developers deliver in-browser experiences that previously required separate apps or additional software. It is especially useful because it supports video and geolocation services, and includes touch features among other benefits.
We have a list of some great HTML5 Tools for the people who haven’t started with HTML5 and looking for some useful tools to enhance their development skills, this list includes new HTML5 Tools to help them get their projects done faster so that they have more time to go and take in those ocean waves – or , even a walk in the park ( for those who can’t get near a beach ).
Below is a list of the New HTML5 Tools for Developers which will come in handy whether you are building your website, or your next client project.
1. Plyr
Plyr is a simple HTML5 media player with custom controls and WebVTT captions. It’s a lightweight, accessible and customisable media player that just supports modern browsers. Sure, there are many other players out there but they made it to keep things simple, using the right elements for the job. There is full support for captions and screen readers.
2. Hyhyhy
Hyhyhy is a tool for creating nice looking HTML5 presentations. It comes with a broad range of features: Markdown, Nested slides, Math typesetting, Compatibility, Syntax highlighter, Javascript API, Convenient skeleton. It supports Firefox 2+, Safari 3+, Opera 9.64+, Chrome, IE9, IE10, IE11.
3. Firfox.html
Firefox.html is an experiment, a proof of concept: trying to re-implement the Firefox UI in HTML, as an app. It is based on the Browser API and works the same way Gaia’s browser and system apps work. Even though it includes tags like vbox, hbox, spacer, etc… it’s all HTML.
Current priority is to re-implement the basic features of Firefox Desktop to make Firefox.html a usable browser, and understand what’s missing at the platform level for a perfect integration to the OS. Firefox.html requires a runtime: a special build of Gecko we call “htmlrunner”. The runtime code is based on Firefox.
4. Amalia.js
Amalia.js is a new extensible and versatile HTML5 multimedia player that allows you to view any type of metadata along with your video or audio streams. It follows the responsive design guidelines. Amalia.js video player packaged with all third party libraries and some examples, all source code and build scripts, allowing you to modify the plugins and learn how to create your own.
5. Popline
Popline is a HTML5 Rich-Text-Editor toolbar. Popline is inspired from popclip. Compared to traditional RTE, popline will float around the selected text. Popline also support View Mode, you can send a twitter, a facebook message, pin an image to pinterst, search with google in View Mode.
Popline provides commonly used editing features out-of-the-box. It’s easy to extend and easy to customize. You can easily customize the theme as well. It has been tested on Chrome 27.0, Safari 6.0.4, Firefox 21.0.
6. FormFive
formFive offers form support for legacy browsers via a polyfill that makes some HTML5 features work. Create placeholders, alternative submits, and more.
7. Konva.js
Konva is a 2D HTML5 canvas framework for creating desktop and mobile apps. It has an object oriented API, layering support, tween and animation support, filters, and custom shapes, among other features.
8. Stretchy
Stretchy gives you easy form element autosizing for responsive designs. It’s completely standalone, works with your existing HTML/CSS, and works in all modern browsers.
9. Vizor
Vizor is a visual programming environment for WebGL, WebVR and other HTML5 APIs. It features live preview, data flow visualization, network communication, publishing, unlimited undo, and a catalog of presets that can be used as modular building blocks. Complex logic can be nested in subgraphs and they can be rendered directly to a specific render target, or simply used as a texture. Loops are modeled as nested graphs that are evaluated once per loop iteration.
10. HTML Tidy
Tidy is a console application for Mac OS X, Linux, Windows, UNIX, and more. It corrects and cleans up HTML and XML documents by fixing markup errors and upgrading legacy code to modern standards. TidyLib is a C static or dynamic library that developers can integrate into their applications in order to bring all of Tidy’s power to your favorite tools. TidyLib is used today in desktop applications, web servers, and more.
11. WebPlotDigitizer
A web based tool to extract numerical data from plot images. Supports XY, Polar, Ternary diagrams and Maps. This tool has been developed using HTML5, CSS3 and Javascript and therefore runs from within the browser and requires no installation.
12. BladeRunnerJS
BladeRunnerJS (BRJS) is an open source development toolkit and framework for modular construction of large single-page HTML5 apps. It consists of a set of conventions, supporting tools and micro-libraries that make it easy to develop, test, deploy and maintain complex JavaScript apps.
13. Rgbselector
It’s a useful responsive tool that provides you a color selector. Find the RGB or HEX values for your favourite color.
14. Remote Control
Remote Control is a tool to control the slides of your HTML5 presentation through a cell phone. Remote Control is based on WebSockets, so you may have a good and modern browser, like Firefox, Chrome or Opera. The phone send a message through WebSockets to the server. The server receives the message as an action that must be executed, like ‘next’ or ‘previous’. These actions are emited to the HTML5 presentation.
15. Ruler
ruler.js is an HTML5 ruler plugin that provides a set of ‘photoshop’ like rulers to surround the ‘stage’ of your authoring tools. No jquery! No dependencies!
16. Sitecake
Sitecake is an easy to use CMS (Content Managament System) for small websites, with a WYSIWYG, drag&drop editor. A standard web hosting packet (a web server and PHP 5.4+) is all you need to install and use it. Sitecake reads, modifies and saves changes in regular HTML files. No PHP or template language knowledge required. All changes are saved directly in HTML page, all images in file system. Once you finish editing you still have a static website.
17. Blockrain.js
Blockrain.js is a tetris game in HTML5 + Javascript with autoplay. Just copy and paste a bit of code and you’ll be good to go. Best of all, it’s responsive, no matter how wide or narrow your display is, you’ll always be able to play. You can also customize it as you want. Change the colors to fit your site. Adjust how fast the blocks are falling to make it more difficult. Add the scoreboard or not. That’s your decision.
18. Slides
A tool to make and present HTML5 slides. It also supports mathematical equations using MathJax. This module provides CLI for making slides. The properties are used for generating title slide and setting up meta tags of the output HTML file.
19. Glyphr
Glyphr is a free, html5 based font editor. Font design has a high barrier of entry. Professional font design programs are very complex, and quite expensive. Glyphr is accessible, streamlined, and made for font design hobbyists, and it’s free. You can create complex shapes, copy & paste, flip ‘em around or lock them down, drag & resize to your heart’s content. Edit paths with cubic Bezier curves. Define a shape once, like an ‘o’, and re-use it across many characters, like ‘bdgpq’. Make changes to the Linked Shape, and it updates all the characters linked to it.
20. Ideal Forms
Ideal Forms is the ultimate framework for building and validating responsive HTML5 forms. It has just released V3, which is smaller, faster, and more extensible. It supports On the spot validation, Fully adaptive (adapts to the container, no css media queries needed), Keyboard support, Custom checkboxes/radios and file inputs, Custom seamless jQuery UI datepicker, Support for third party extensions, Localization.
