HTML5
Resources for anything HTML5 related including HTML5 templates.


Dabblet – CSS HTML Test

  • Posted By: Jason Taetsch
  • ...

Test out CSS and HTML code snippets before you use them in a design project thanks to the folks over at Dabblet. is a browser tool that allows users to test out CSS, HTML and JavaScript right from the comfort of a browser window without saving an item and exporting it to a debugging environment. The tool features a live view window as well as a full screen option to see how your code will render on a viewer’s screen.  Designers can save their code by creating a free login or save their code anonymously to share with the Dabblet community.

Responsive Calculator

  • Posted By: Jason Taetsch
  • ...

Responsive web designs are developed to handle the unique visual requirements of mobile devices, tablets and traditional displays.  The Responsive Calculator speeds up the design process by converting .PSD files into a basic HTML5 template that is ready to be turned into a responsive webpage. The tool transforms pixel based images into HTML and also includes the basic styling elements and layout such as padding, margins and borders.

HeatMap.JS

  • Posted By: Jason Taetsch
  • ...

Ever wonder what elements of a web page attract the most attention from visitors? Heat Map.JS might have the answer you’re looking for. by Patrick Wied is a JavaScript library that creates a custom heat map of your website, to track exactly which elements are drawing the eyes and attention of visitors to your page. The maps are fully customizable and allow the analysis of both mouse movement and clicks in real-time. The library is free for both commercial and personal projects and works on all browsers that support HTML5 canvas (including mobile web browsers).

Buzz Javascript Audio Library

  • Posted By: Jason Taetsch
  • ...

Thanks to advances in HTML5 standards, multimedia elements such as video and audio can be hosted directly on a webpage without the need for external plugins or embedded content. The helps designers include sounds and other audio effects on HTML elements that take advantage of the latest HTML5 features yet degrade nicely for visitors that are still using legacy browsers that cannot handle the multimedia content.

CSS Loading Animations

  • Posted By: Jason Taetsch
  • ...

Data heavy pages can put a drag on the loading process, either frustrating visitors with long load times or turning them away entirely. The team at Tympanus put together this tutorial on to let your site’s visitors know that the page is working properly and will be fully loaded with just a little patience. The tutorial creates an entirely CSS driven loading icon that can be easily customized for color themes, duration, speed and alternate animations. While JavaScript animations can also achieve the same effect, CSS animations are easily scalable and are faster than JavaScript since they rely on the browser’s engine.