0

Let's say I have a website (This is the actual one).

It has a fixed width of 1024px and the content is centered. I use width=device-width, initial-scale=1 for setting up the website to be nicely viewable on a mobile device.

Note: This is not a programmer question, but for clearance, I added this meta tag here.

On my iPhone, I only see the top right corner and don't get an overview of the site at all:

site

(I removed content that is irrelevant to the question from the screenshot)

I always get recommendations for width=device-width over width=1024, but despite the programming behind this: What is the recommended default viewport for fixed-width websites?

  • Like on the screenshot?
  • Website width = iPhone width? (Would that be too small?)
  • Something in between maybe?
4

Setting default viewport size is typically used for responsive or mobile-optimized sites to prevent unnecessary resizing of the viewport because the webpage has been optimized for that particular viewing format.

If you have a fixed width site that is NOT optimized for small screens. Then you really should not be setting a viewport size and allow the native mobile browser to resize the entire layout downwards to fit the screen.

Reason being is the user needs to be able to orientate themselves to content of the page. With a fixed width site, you can't possibly suggest optimal scaling because you wouldn't know what's the browser width a particular user has. Screens come in many different sizes. The user may rotate their device from portrait to landscape mode. So the easiest and best way is to not specify anything and let the mobile browser handle the resizing.

When they need to zoom in to interact with specific elements, they'll pinch and zoom. If this experience isn't good enough, then you should consider redoing your site to a responsive layout.

  • You have a good point there with the "overview of the site". Thanks! – bytecode77 Mar 26 '15 at 12:03
2

The recommendation is typically to go responsive. Barring that, there is no one recommended size. That's something you need to decide based on your users' needs, the context of your site, your business needs, etc.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.