So after seeing hundreds of websites that are not mobile friendly, I thought may be I should write a simple post to give little hacks and techniques to make any site mobile friendly. The solutions mentioned below range from simplest of methods which require less time and effort to the ones which might require significant time and effort. Choose wisely :)

Twitter Bootstrap

If there not enough time to give to the design of a web project use Bootstrap. I provides support to define styles for screens of multiple dimentions and it's easy to use.

Viewport

NOTE

Most of the modern frameworks already come with this.

Again if you have extremely less time and don’t want to use Bootstrap then I would recommend using the Viewport property. Just add a meta tag into the head of your html and you would see miracles. This technique is magical in my opinion.

Just add the code given below to the headof your document and see the magic:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Media Queries

Use media queries if you have enough time to define style for devices with display of different dimensions. Search media query for more information. You can use this along with what is mentioned in point number 2 to get great results.

Happy coding!