How to Make a Website Mobile?

In the early days of the web people viewed websites only on computes, but now people may view your website on anything from a thirty inch monitor to a four inch phone (and anything in between). Because of the unknown form factor that your audience will use to view your website, the savvy site owner will ensure their site looks great on any device.
The primary difference between a desktop (or PC based) website and a mobile website is the amount of space your site can use to display its content. On a phone you have less room than you do on an iPad which has less screen real estate than a laptop or desktop computer.
Making a website mobile used to entail creating a mobile version of your website, which could lead to sluggish updates of the mobile version (or a slapped together version that was hard to use and unattractive).
The modern alternative to separate versions of you site for desktop and mobile devices is to create what’s called a responsive website. A non-responsive website is a website that is targeted at a particular form factor (this is the old fashioned website that would require multiple versions to support different devices). A responsive website is one that can automatically detect the size of the device and change its appearance based on the device being used.
Responsive websites us a combination of JavaScript and CSS to modify the appearance and layout of your site by detecting the size of the device being used to view your website. One of the best (and easiest) ways to make your website responsive is to use a responsive framework like Twitter Bootstrap or Foundation. Using a framework greatly simplifies the development process and assures you that your site will be built on code that has been well tested.