mobile question...

[maya90]

I don't see a forum specif. for mobile, so asking here...

I'm converting a conventional web page to mobile...

it was working fine, but as soon as I added this meta tag..

<meta name="viewport" content="user-scalable=no, width=device-width" />

the content covers only half the screen in iPhone..
(in Safari iPhone tester it looks fine...)
you're always supposed to add this tag for mobile devices, right??

it's looks exactly as I had wrapped everything in a div that's 50% wide and left-aligned..
(I did all widths in percentages.. outer wrapper is 100% wide..)

you're always supposed to add this tag for mobile devices, right??

thank you...

[itmitică]

This should work:

<meta name="viewport" content="width=device-width">

It's maybe the XHTML closing tag: />

And it's probable that you want to let the user be able to scale.

[maya90]

oh brother.. this prob is more complex than I thought..

it turns out it's for content generated from the back-end (JSP env); I have classic file-includes situation (header & main body, etc..)

so when I do "view src code" copy the code into a page and load it like that, as strictly html with all the markup hard-coded, it works, with both tags, the one I posted and the one you posted, but in JSP is where it gets messed-up.... man, that's just grand.... was not expecting to run into this problem with mobile... :-(

(still don't know if prob is the file-includes or the JSP per se.... yikes....)

in the JSP, the content inside the divs occupies the entire viewport, but the width of the wrapper divs is only half the viewport (100% width for the wrapper divs, this is correct, for mobile, right?)

thank you...

[maya90]

never mind, I found prob... ;-) has to do w/some floating divs inside.... ;-) ooops... oh brother.. new to mobile...

so: what is the diff between the two tags? the one I posted

<meta name="viewport" content="user-scalable=no, width=device-width" />

and the one you posted

<meta name="viewport" content="width=device-width">

??


is there any good documentation/tutorials on coding for mobile you know about off-hand that out there you can point me to?

thank you...

[MikesBarto2002]

User scalable tells whether the User is allowed to zoom the page in and out. If you set it to no, then the User cannot zoom the page.

A good website with more information: https://developer.mozilla.org/en-US/...wport_meta_tag

[itmitică]

so: what is the diff between the two tags? the one I posted

<meta name="viewport" content="user-scalable=no, width=device-width" />

and the one you posted

<meta name="viewport" content="width=device-width">

??

Not much, beside the user-scalable part. It's about consistency and I suggested maybe it's about some crazy bugs.

I suspect you're writing the webpage using the HTML syntax, like most of us are, and only a few tags in your code are affected by the XHTML syntax.

is there any good documentation/tutorials on coding for mobile you know about off-hand that out there you can point me to?

https://github.com/h5bp/mobile-boilerplate/wiki

Not a tutorial, per se, but you can learn a few things about mobile.

320andup uses M5HBP and takes things a bit further: tiny screen first not mobile first. You can also learn a thing or two by browsing through its code: http://stuffandnonsense.co.uk/projects/320andup/

[TechnoBear]

I don't see a forum specif. for mobile, so asking here...

There is one here. But design questions are fine in the Design forum.

[stwordia]

I find it interesting that there is not a single comprehensive guide to mobile application and website usability. With the explosion of smartphones and tablets in recent years and the massive usability industry why is there no such resource? Is is because it's too big a topic or is it just underserved? I'm not trying to derail this conversation I'm just echoing the poster's difficulty in finding authoritative information.

[Stevie D]

I find it interesting that there is not a single comprehensive guide to mobile application and website usability. With the explosion of smartphones and tablets in recent years and the massive usability industry why is there no such resource? Is is because it's too big a topic or is it just underserved? I'm not trying to derail this conversation I'm just echoing the poster's difficulty in finding authoritative information.

There have been plenty of general usability studies on mobile usage, but in terms of details and specifics, a big problem is that the marketplace is so diverse and fast-moving, and audiences so varied in their capabilities, competencies and browsing habits that it is difficult to pin anything down. If you're looking at website usability on a PC, you have half a dozen browser/OS combinations that you need to test in, you can check for keyboard accessibility, variable screen sizes and so on ... and then you can concentrate on the actual usability. Parameters from the device itself don't change a lot. Whereas for mobiles there are new phones coming out all the time, and this adds a huge variation into the mix. Different phones work in different ways, different screen sizes have different needs, different people have different needs. What was crucial one year may be largely irrelevant the next.

I'm not saying that mobile development and usability isn't worth further study – it undoubtedly is, it is where the bulk of future growth lies, but it isn't a mature technology, and it's so rapidly evolving that any detailed study would be out of date before it was published.