Adding to what others have answered, for mobile sites you have two main options.
You can have different desktop and mobile sites or one responsive site that works on all devices.
For the first option, you can redirect mobile users to a completely different URL where you host only the mobile version of the site. To do this, you can control the redirection using http://detectmobilebrowsers.mobi/ or there are many options for redirecting .htaccess files.
JQuer Mobile is a really good way to develop a website for mobile devices only after that.
The advantage of this approach is that it is easier to develop a lite version only for the mobile devices of your site. One of the drawbacks is that you will have two support websites - desktop and mobile.
Another option is the responsive approach that others have suggested. Here you basically have one site that reconfigures depending on the size of the widow of the visitor’s browser. Bootstrap and Foundation are two great options, and there are many others.
Responsive sites rely on media queries to determine window size. This is well supported in modern browsers, but there will be problems with older browsers that you might need to work. Some of the advantages of a responsive site is that you only support one site, and theoretically it works for all screen and window sizes, so this will not cause problems when releasing the next mobile device with a different screen size.
Good luck, this is an interesting time to create web design.
David Taiaroa
source share