What is the best way to develop a website for mobile devices? [closed]

Question

Closed. This question needs to be more focused. It is not currently accepting answers. Learn more.

---

Want to improve this question? Update the question so it focuses on one problem only by editing this post.

What is the best way to develop a website for mobile devices? I can't seem to find a simulator/emulator for the mobile devices. Is there any way to edit the CSS from the mobile device like firebug? I am just looking for tips on how to develop for the phone because for some odd reason my website acts oddly on the iPhone and Droid.

Answer 1

I would recommend you to use a framework for mobile development (such as http://jquerymobile.com/). In that way you are sure to make a website that will perform well on many mobile devices.

• For debug purpose, why don't you try to use an Android virtual device?

  http://developer.android.com/guide/developing/devices/managing-avds.html

  You got it when you download the android sdk or the eclipse ADT plugin to develop android apps.

• You can also have a look to the Blackberry simulator:

  http://www.blackberry.com/developers/downloads/simulators/index.shtml.

• To get an Iphone simulator I think that it is mandatory to have a mac.

  It is a part of the IOS SDK called iOS Simulator (that you install in XCode).

I think anyway that there exists many less cumbersome way to test your code.

Answer 2

What is the best way to develop a website for mobile devices?

Read Mobile Web Development series on this blog

http://davidbcalhoun.com/2010/viewport-metatag

Part 1: The viewport metatag

Part 2: The mobile developer’s toolkit

Part 3: Designing buttons that don’t suck

Part 4: On designing a mobile webpage

Part 5: Using mobile-specific HTML, CSS, and JavaScript

Part 6: Dealing with device orientation

Part 7: Mobile JavaScript libraries and frameworks

---

I can't seem to find a simulator/emulator for the mobile devices.

for emulators see here http://www.mobilexweb.com/emulators

Is there any way to edit the CSS from the mobile device like firebug?

for debugging see here

List of bookmarklets for mobile web debugging http://www.blog.highub.com/mobile-2/list-of-bookmarklets-for-mobile-web-debugging/

How to easily debug websites on mobile devices with “Weinre” http://envyandroid.com/archives/483/easily-debug-mobile-websites-with-weinre