Header Ads Widget

Responsive Advertisement

10 Cool HTML Tricks

Are you creating or maintaining a blog or a website? You should then know that websites use HTML markup language to represent the content. You would like to have a cool feature or layout? Check out this 10 cool tricks!

HTML trick no. 1 – Clear form input

If you want to provide a visitor a possibility to easily clear his or her input in a form, you just need to add a required button. This line does it all:


HTML trick no. 2 – Add spacing

To add spacing between certain items, add one or more non-breaking space special characters:   . In the following example there are 4 non-breaking spaces between the circle and the square:


HTML trick no. 3 – Add a horizontal line

You just have to use the
// “

” tag.

HTML trick no. 4 – Set character encoding

If you use non-ASCII characters, you should set character encoding in order to display those characters properly. The most commonly used encoding is UTF-8. You have to add the following code into the head section of a document:


Make sure that the document itself is also saved in UTF-8 encoding.

HTML trick no. 5 – Get found!

In order to be more visible to search engines, you should provide some meta data about your site. For example, if you have a web site for selling car parts, you should add meta data somewhat like this:



HTML trick no. 6 – Redirect visitor

If you want to redirect the visitor to another URL, for example 5 seconds after accessing your page, add the following line to the head section:


HTML trick no. 7 – Encode URL

If you want to link to a document or file which’s path contains non-ASCII characters, you should “URL encode” Check this link out for the complete reference: http://www.w3schools.com/tags/ref_urlencode.asp

HTML trick no. 8 – Add voice recognition (HTML 5)

If you want to add speech recognition to a text input in a HTML5 document, just insert the following line:

HTML trick no. 9 – Insert math equations (HTML 5)

HTML5 supports adding math equasions using MathML language. The just have to be between the tags: // and . For example, to insert a fraction x/y use the following code:


// x
// y


HTML trick no. 10 – Insert a SVG image (HTML 5)

HTML5 supports adding SVG (Stored Vector Graphics) images to documents. The just have to be between the tags: .  For example, to add a circle to a document use the following code:

Post a Comment


  1. Thanks for taking the time to discuss this, I feel strongly about it and love reading more on this topic. If possible, as you gain expertise, would you mind updating your blog with extra information? It is extremely helpful.