I host a little store for any client who desires so that it is readily available from mobile products.

How do you identify when the user is browsing my website from the mobile phone?

After I did that, must i:

  1. See if the consumer has mobile phone after which forward these to another site? I believe the benefits could be:

    • I'm able to optimize layout from both sites for screensize
    • I'm able to use different approaches to the 2 sites (eg. jquery mobile for mobile)
  2. Use CSS for that different screen dimensions => like on tutsplus I believe the benefit could be:

    • I just have one site however it appears in my experience loads of work when speaking in regards to a small webshop

Ideally, you should attempt using jQuery Mobile page structure with your personal CSS and JavaScript for non-mobile products.

It is simple to detect user's browser and conditional script includes according to html5 [boilerplate]:3

/* Grade-A Mobile Browsers (Opera Mobile, Mobile Safari, Android Chrome)
consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {

Primary points to consider when striving at apple iphone customers:

  • ensure there is no vital expensive objects around the page because it is not based on many mobile browsers (yet?)
  • appropriate display size (using viewport meta tag)
  • bearing in mind that there are no mouse cursors, meaning no hover/double-clicks can be found any mouse dragging gestures will vary on touch products
  • remember all pop-ups are open in new tabs and will not be viewed in the same time because the primary window, use javascript modal divs as alternative
  • test all of your javascript and css to ensure everything looks and works the same (Safari requires -webkit- prefix for that latest CSS qualities)
  • produce a Desltop icon for the website (a pleasant factor to possess)

many of these situations are covered here

have a look at Safari Dev Center for lessons/videos/coding how to's etc.

You do not need jQuery whatsoever if you won't want to utilize it. We do not. Not too there's anything wrong with this.

Number Two is the greatest option. Should you produce a site with mobile in your mind first, it is, far simpler to grow and manipulate for that desktop than attempting to shrink items to a mobile screen.

You will find a number of options but this really is my personal favorite:

Has a API over a couple of different languages too

JQuery Mobile is presently in beta 1 at this time. Beta 2 is going to be out inside a month. It's fairly stable right now and you will gain lots of understanding by what is recognized as "best practice" from their store. You should use media queries for screen dimensions for various platforms which JQuery Mobile will also support.