Michael Travis

I noticed some sites have a fixed width and some sites have a width that changes with screen size. For example some mobile sites have buttons that span across the screen no matter if you are looking at it with a tablet or a smartphone. Others look good on a smartphone but don't span on a tablet.

Which is better and why?

Thanks,

Michael

WillR

The stretch to fit designs are always going to work better because they will look the same on a larger number of devices. If you use fixed width then obviously on larger screens they won't stretch across and on some really small screens the design will be too wide which then creates a left to right scrollbar which is one of the BIG things we try to avoid with a mobile site. A mobile site should only have scrolling in one direction - in most cases this will be up and down only.

.

➨ Here's How to Make Your First $177 Online
This Week Using the Piggyback Method...

.

Quentin

Lots of the bigger companies use separate designs for each phone type and then use agents to direct the visitor. This is why they charge thousands of dollars for their mobile sites.

I ran into one the other day that a company paid over $2000 for.

Stretch and fit or fluid design is the way to go.

Q

JBroyer44

ya I have been struggling with this myself. I am only playing around with building a site right now for my day job pool company but I am not sure how to best manage the content. I have a nice picture of one of our pools on the hom page above the menu. On the verticle alignment on my EVO it looks great as you can see the image the header and the full menu, but flip it horizontal and the image expands out to fill the screen. The image looks awesome as I croped and scaled it to expand and flex with the correct aspect ratio. BUT the menu drops below the fold on horizontal view.

Therefore I am struggling to figure out if i want an image on the homepage at all?

"The force is strong with this one"
Facebook Ad Services: http://sellabletraffic.com

herbaluss

Get Will or Quentins scripts I been using those and tweeking look fine on all devices

Jay Rhome

The stretch to fit designs are the obvious winners, no doubt. Screen size for desktop computers are few, while there are 100s of different ones for smartphones.

I have bought some great templates that don't use it and IMO it's a real shortcoming.

My addition: also use a MAX width to the template, so they also look good on desktop computers!

Use <div style="margin: 0pt auto; max-width: 600px;"> just after the body tag, and </div> just before the </body>

You can use 500 or 550px instead of 600. The "mobile" site then becomes usable as a normal site as well, or at the very least, still looks good if a searcher comes upon it somehow on his desktop. So simple an addition yet so few people use this.

It also helps for the occasional client with no regular site. He gets a mobile and web presence for the price of one.

Michael Travis

Jay,

I never thought of it like taking the middle ground. I will definately try it.

Thanks to everyone who have contributed.

Michael

Jay Moreno

Another reason though is that not all functionality is the same across all phones take google maps for instance, works great linking to it using for iPhone or android but link to the same URL on a blackberry 85xx or older and your likely to see a nice grey screen as you have to use a different version/URL for blackberries.

Sadly as we all know there isn't a one solution fits all hence why I prefer user agent detection.

But to answer the OPs question fluid layout for me is preferable as the design will remain relatively consistent across most devices and not make your sites scroll horizontally.

Hope that helps

Jay