How to create a Webapp for iOS, Android, BBerry, Symbian

Question

The Challenge

I would like to create a simple website for:

• iPhone 3 and 4
• iPad
• Android 2.2 – BBerry OS 7 and Playbook Browser
• Symbian
• Desktop Webbrowser

The Problem

Whats the "best-practice" for detect, optimize and deliver the Webapp for each device/screensitze? I know this is about HTML5, CSS3 Mediaqueries and JS. HTML5 Boilerplate is a good point to start.

But:

• Should I detect Browser/Devices via backend/front? What are good libraries?
• How Do I detect different screensizes? What are good libraries?
• etc.

Answer 1

Use Phone Gap as your starting point.

Depending on your use case, there may be other libraries you may want to pile on top of it, but basically Phone Gap is what you should start with.