How to get perfect design for mobile website

Question

0.00/5 (No votes)

See more:

When I test my mobile website in various emulators I see that the design does not appear correctly in all devices.

If i adjust for one then the other goes bad. I am developing a mobile website for the first time. I need to fit my design in devices of all resolutions. For example if I have a form with 2 text boxes in the same line and i test this in iphone it looks fine but if i use a nokia phone, the 2 text boxes appear in 2 separate lines.

Also for any page i do not want a scroll to appear so that the user has difficulty in browsing. Please help.

Posted 6-Oct-12 3:05am

masterprogrammertech

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Sandip.Nascar · Answer 1 · 2012-10-06T08:19:00

Here are some links which will give you a fair idea to start,

http://www.webcredible.co.uk/user-friendly-resources/web-usability/mobile-guidelines.shtml[^]
http://www.smashingmagazine.com/guidelines-for-mobile-web-development/[^]
http://www.utahta.wikispaces.net/file/view/Mobile+Web+Standards+and+Guidelines+7.17.09.pdf[^]

One important point to emphasize is whenever you design the page with controls, try to specify the width of the control in "%". So, that controls change their width as per the resolution.

Hope this helps.
cheers