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 Comments

  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.

    ReplyDelete