Skip to main content

15 HTML5 tools to make your life easier

08. WebStorm (opens in new tab)

WebStorm is a reasonably-priced lightweight IDE

WebStorm is a reasonably-priced lightweight IDE

WebStorm is a lightweight integrated development environment (IDE). It provides full support for HTML5, JavaScript, Node.js and many modern frameworks, advanced debugging, and all the tools you need for productive web development. A personal license costs $49 and a commercial one $99.

09. W3 Validator (opens in new tab)

Ensure your markup is valid with this essential tool

Ensure your markup is valid with this essential tool

Once your web document is almost ready, you need to check its markup validity. Choose HTML5 as a document type and insert your webpage URL. The tool will test your code and show all errors and warnings in it if any. It's absolutely free.

10. HTML5 Reset (opens in new tab)

This tool is a handy markup rewriter

This tool is a handy markup rewriter

This tool lets web developers and designers to rewrite their old website designs in HTML5 coding. The package is hosted on GitHub as well as HTML5 Reset WordPress theme, which includes semantic HTML5 markup, CSS declarations for the basic WordPress elements, a widget-ready sidebar, iQuery, and built-in analytics.

11. CreateJS (opens in new tab)

Create rich interactive content with these tools

Create rich interactive content with these tools

This is a suite of open source libraries and tools to create rich interactive content. The suit comprises four main libraries which can work completely independently, or matched, and some related tools. For example, EaselJS lets work with graphics and interactivity using HTML5 Canvas. SoundJS provides HTML5 audio playback on different browsers and devices.

12. LiterallyCanvas (opens in new tab)

This drawing board can be embedded in HTML5

This drawing board can be embedded in HTML5

Literally Canvas is an open source HTML5 drawing widget. It's kind of like an extensible MS Paint in JavaScript. You can use it to embed drawing boards on your web pages, so that your users could sketch drawings. The tool uses React.js for its GUI.

13. HTML5 Please (opens in new tab)

HTML5 Please helps you to search for a feature that you want to use and find out how to do so. For instance, type video and you'll see the full list of useful resources about supporting browsers and devices, syntax peculiarities, general recommendations how to use this tag. If you think that the recommendation is incorrect, you may edit it and send a pull request.

14. Font dragr (opens in new tab)

This tool allows web designers to easily test custom fonts without the need for any CSS. All you have to to do is drag and drop the font. The bookmarklet button provided by the tool lets test any font from your file system, in the gallery or on any website.

15. Chrome Console (opens in new tab)

One of the simplest solutions for HTML5 coding is Google Chrome console. Go to a website, hit F12 and start coding straight away. The console lets customize any web elements on the webpage and immediately preview the changes. The device emulator is also indispensable for testing designs on various gadgets.

I hope this toolkit list will help you create stunning HTML5-based websites. Please share in the comments your favorite apps and software which do the same.

Words: Terry Smith (opens in new tab)

Terry Smith is a freelance web developer who loves to create beautiful responsive websites. He's into technology and education.

Like this? Read these:

Thank you for reading 5 articles this month* Join now for unlimited access

Enjoy your first month for just £1 / $1 / €1

*Read 5 free articles per month without a subscription

Join now for unlimited access

Try first month for just £1 / $1 / €1

The Creative Bloq team is made up of a group of design fans, and has changed and evolved since Creative Bloq began back in 2012. The current website team consists of six full-time members of staff: Editor Kerrie Hughes, Deputy Editor Rosie Hilder, Deals Editor Beren Neale, Senior News Editor Daniel Piper, Digital Arts and Design Editor Ian Dean, and Staff Writer Amelia Bamsey, as well as a roster of freelancers from around the world. The 3D World and ImagineFX magazine teams also pitch in, ensuring that content from 3D World and ImagineFX is represented on Creative Bloq.