1. HTML5 Starter Template
You need a starter template when you start a new project. Below is a simple and clean HTML5 starter template. You can use it to begin your work easily and quickly.
2. A form used to show directions on Google Maps
This is a simple but powerful form. Visitors can input a location and show the directions on Google Maps. It’s very useful for contact page.
3. A Base64 encoded Transparent 1×1 GIF
Sometimes you have to stretch a transparent 1×1 gif IMG element to fill some box. The traditional way is host the separate 1×1 gif image to your server, which just a few dozen bytes. The browser has to send one more HTTP request to the server for the tinny stuff, which is wasteful task. Now you can simple use code below to do this.
Or alternative, you can use black one
4. Work with HTML5 Form Validation With Regex
Or more simply, use a “email” type for the input field
5. Embed Flash
Well, actually it’s not a code snippet special for HTML5, but it’s useful for those people who often embed Flash into their pages.
6. HTML5 Video with Flash fallback
Build-in video stream support is another great feature of HTML5, but some old browsers cannot process the new HTML5 video tags, so you have to use codes like below for compatibility with the old browsers.
7. Calling and texting for Mobile Websites
If you are building websites for Mobile, favorite below snippet.
8. HTML5 Build-in auto-complete feature
You can use the new datalist to build a auto-complete list for fields, which is very useful.
It works like this:
9. Force a link downloadable
If you need a link downloadble, you have to set the HTTP header like this:
You no longer need to change your server code to do this on HTML5! You only need use below code:
10. Crash IE6
HTML5 is so great, but some users stick to the old browser, even IE6! It’s nightmare for you, isn’t it? Now you can do something for yourself, the magic code will crash IE6. Amazing!.