Theme Design for Screen Size

@kazookie,

You should probably not be so concerned about a particular screen size, since a browser width/height is variable. Recently the mobile first/responsive approach has become popular, and you may want to read into it. Other than that, I would just base my design off a popular device or desktop size, using percentages, and media queries to make it responsive. There are many popular grid systems available as well, based off common desktop screen sizes. Using your browsers developer tools, you can probably find common dimensions for mobile devices.

Maybe consider basing your theme on a framework such as Bootstrap or Zurb Foundation, because they take care of a lot of the basic responsiveness for you.

Or consider customizing out an already responsive starter theme, like https://underscores.me (with a great tutorial on customizing that at https://themeshaper.com/2012/10/22/the-themeshaper-wordpress-theme-tutorial-2nd-edition/ ) or https://roots.io/sage/

Some free responsive themes for inspiration: https://www.ads-software.com/themes/tags/responsive-layout/

Thanks. The problem is I designed another theme using 1920×1200 and when people use a macbook pro with retina – the default is 1440×900 and everything looks too large that it pushes everything down above the fold on the site as it loads.

Thoughts?

I understand using bootstrap and percentages but is it wrong to design on 1920 instead of 1440 if 1440 is closer to a more popular size right now?

My recommendation is the same as above, build a responsive theme which is adaptable to *all* screen sizes.