homepage Welcome to WebmasterWorld Guest from 54.166.84.82
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Hardware and OS Related Technologies / Smartphone, Wireless, and Mobile Technologies
Forum Library, Charter, Moderators: bakedjake

Smartphone, Wireless, and Mobile Technologies Forum

    
making site mobile friendly
vertical vs. horizontal
smallcompany

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4464632 posted 11:57 pm on Jun 12, 2012 (gmt 0)

I started working on making one of my HTML static sites mobile friendly.

My idea is to adjust existing template so it can be used by mobile users with one change in coding only: Switch between two different CSS files.
This way, I can continue using the same template, change content, while all visitors can load exact same page and get it accustomed to their device.

I started with fixed width which is 300px. This fits all the content within the 300px and prevents the vertical scroll bar.

Now I wonder about vertical vs. horizontal usage. Do more people flip their mobile devices one or the other way?

At the end, I'll probably try to create something that adjusts the width to the user's screen, so I can set the maximum width only.

For now, I want it to be fixed until I get satisfied with the look and feel.

Thanks

 

Leosghost

WebmasterWorld Senior Member leosghost us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 4464632 posted 12:13 am on Jun 13, 2012 (gmt 0)

This fits all the content within the 300px and prevents the vertical scroll bar.

That would be the lateral scroll bar there :)

IME from watching ..most people begin with their phones held vertical "portrait"..and only flip "landscape" if they have to ..or to watch movies or look at pictures they have taken in landscape mode..

nomis5

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4464632 posted 9:24 pm on Jun 13, 2012 (gmt 0)

When I designed my site for mobiles, the same question cam up - vertical or horizontal.

From a personal perspective I always use my mobile in horizontal mode for the internet but then discovered that the rest of the world uses it in vertical mode. I have no idea why because horizontal provides a far better experience, but who am I to argue with the vertical world!

Why not try 320 though instead of 300? And don't forget this, designing your site for 320 wide vertical browsers is designing it for almost certain obsolesence. Next year the ideal width will be 450 or whatever.

Hoople

10+ Year Member



 
Msg#: 4464632 posted 11:26 pm on Jun 13, 2012 (gmt 0)

I found that a combination of meta viewport and media queries worked best for me as a high amount of my mobile users had iPhones.

See [quirksmode.org...]

[edited by: incrediBILL at 10:10 pm (utc) on Jun 25, 2012]
[edit reason] fixed link [/edit]

smallcompany

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4464632 posted 11:45 pm on Jun 13, 2012 (gmt 0)

And don't forget this, designing your site for 320 wide vertical browsers is designing it for almost certain obsolesence. Next year the ideal width will be 450 or whatever.
Once I get this working, I'll switch to max width, whatever the device, if possible.

combination of meta viewport and media queries
Thanks for the link. That is my next step.

Now, I'm using online browser simulators, and I wonder how that works.
What I need is that whatever I use to check the website sends the real mobile user agent, like from the real device.
I'm not getting my layout switch script to work when I use online simulators and I don't have any smart device on hand (as I still resist them personally and would rather live without mobile phone).

Are there emulators that send a real user agent?

Thanks

smallcompany

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4464632 posted 11:55 pm on Jun 13, 2012 (gmt 0)

Ha, if I did not ask I would not come back here to post what I found:

[addons.mozilla.org...]

and my switch script worked when I used iPhone 3.0!

ebizjh



 
Msg#: 4464632 posted 4:30 pm on Jun 25, 2012 (gmt 0)

Thanks "small company" that is great. I haven't tried to set that up yet. I will be checking back to see how you are coming with that.

surrealillusions

5+ Year Member



 
Msg#: 4464632 posted 11:02 am on Jun 26, 2012 (gmt 0)

Why not go for percentages? There's alot of different mobile devices out there with alot of different screen sizes.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Hardware and OS Related Technologies / Smartphone, Wireless, and Mobile Technologies
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved