Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Design

Ian Mackenzie
Ian Mackenzie
11,062 Points

For desktops, what screen resolution should I be targeting if I don't have any data to look into?

Need the size less the browser chrome.

5 Answers

Mauricio Zambrano
Mauricio Zambrano
14,849 Points

you could use http://gs.statcounter.com/ so you could check the most used resolution around the world and in you country

Ian Mackenzie
Ian Mackenzie
11,062 Points

Great resource Mauricio, thank you!

I agree! What an awesome resource. It's definitely going into my favorites.

If you're talking about creating images, it's best to go with the highest resolution possible and then scale down as needed. You want more pixels to be available to those who can view them.

If you're talking about creating a website, you would want to start designing for a mobile platform and then work your way up with media queries and such. Beyond 800px in width, the website can be scalable by simply replacing any fixed units (such as pixels) with relative units (such as "em" and %).

I hope that helps some.

Ian Mackenzie
Ian Mackenzie
11,062 Points

Thanks for your response Marcus. What is the min desktop size to design for if designing a website. Is it still 1024 x 768 or is it greater now?

Of that, I am not sure, Ian. The last data points I saw showed about 40-something % of users using the 5:4 format, another 40 something % using 16:9 format, and then an odd % using an unknown screen format.

The best way to go about this problem would be to use media queries to see what the current user's viewport width is. These are settings you'll have to play around with to see how they work. The best way to test how the website looks below a certain width is to simply resize the width of the browser window you are working in and see how it changes the flow of the content.

Check this code out from css-tricks.com as they have some awesome tricks there! Using Media Queries For Standard Devices