Which Is Best Width For Responsive Design?

[anotherusername]

Is there a "best" width for responsive design?

If I use the default Genesis framework (which is 1200 pixels maximum width), is it going to look bad on mobile devices like smartphones and iPads???

I use the Agency theme (Max width = 960px) on a few sites and on desktop machines it looks TINY!!!

Right now, all my own mobile devices are not really working, so I can't really see how they would look on a mobile device 🙁

So in short, is there any reason I shouldn't just use the Genesis Default theme of 1200px max width if I expect half my visitors will be using a mobile device of one kind or another?

Thanks in advance.

[Lauren @ OnceCoupled]

The Sample child theme (which is just the style of the Genesis defaults, but editable) is already responsive and will re-size to your users devices. The maximum width will not make any differences for them in terms of responsive design -- because they won't see that layout on their mobile devices.

---

We create mobile-first, PageSpeed-optimized, pixel-perfect custom themes! https://www.oncecoupled.com

[anotherusername]

Thanks Lauren, for the quick response.

So can I ask one more question along those lines?

Why is it so common for Genesis themes to have a max width of 960 pixels if most desktop monitors have a much higher resolution, and if the sites will resize to fit mobile device screens anyway?

Why don't more themes have a native max width of 1200px (or even wider) then?

Thanks, and sorry if this is an "unanswerable" question.

[anotherusername]

Oh, and I almost forgot...

If I activate the "Genesis Framework" do I still have to install a "child theme" as well?

Meaning, if I choose to activate the Genesis Framework in themes, then I modify it, then I later update it using auto updates, will all my theme customizations be overwritten?

Do I need to upload the Genesis Sample theme and use that as the child theme?

Thanks again.

[Lauren @ OnceCoupled]

Actually, most desktop monitors aren't considered to have a much higher resolution. You can see a breakdown from January of this year, http://www.w3schools.com/browsers/browsers_display.asp, and 20% of browsers are still 1280x1024 or smaller. A max-width of 1200px would look oversized on those browsers.

Then you have to consider that not everyone with a larger screen is viewing your site in a full-sized browser.

That being said, if you wanted to build something larger, for larger screens, you could easily size down with media queries, as you suggested. However, bigger isn't always better -- especially depending on the type of content that you're displaying. Larger text and larger images would be needed for larger areas.

-------------------------

Yes, you should always use a child theme with the Genesis Framework. Whenever the Framework is updated, all of your changes will be lost.

---

We create mobile-first, PageSpeed-optimized, pixel-perfect custom themes! https://www.oncecoupled.com

[anotherusername]

Thanks again for all the help, Lauren. And thanks for the link!!!

[Author]

Posts