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

CSS How to Make a Website Responsive Web Design and Testing Adding Breakpoints for Devices

Sreng Hong
Sreng Hong
15,083 Points
Posted by Sreng Hong
Sreng Hong
15,083 Points

Is there any standard breakpoints that most people follow?

Because there are many screen sizes, so I'm just curious if in web design community come up with standard breakpoints that most people should follow?

2 Answers

ilithya
ilithya
19,818 Points
ilithya
ilithya
19,818 Points

Pretty much I, myself, and what I've heard in conferences and from other developers is that is best to come up with the breakpoints needed for ones design layout. And I'd say try to have around 4 - 6 breakpoints. I consider 4 or less a best fit, so that you don't go crazy with your code with many breakpoints.

If you are curious as to see what breakpoint sizes some developers choose, you should look at front-end frameworks like bootstrap or foundation.

As I personally code thinking mobile first, I tend to choose my breakpoints depending on the nature of the design like this:

  • Big mobile screens

  • Tablet screens

  • Regular screens

  • Big screens and up to huge TV screens

Nevertheless those 4 options are not always the same size, nor I end up using all of them all the time. Sometimes I end up using only 2 or 3 of those breakpoints, or even 1 more.

I'd say, that as long as your site looks good when resizing your browser, and your code is as DRY as possible you'll be good to go ;)

Brandon Ashcraft
Brandon Ashcraft
10,259 Points
Brandon Ashcraft
Brandon Ashcraft
10,259 Points

From what I've seen, it seems like designers would rather stay flexible with their breakpoints than pigeon-hole themselves into a "rule" that they will only end up breaking at the next iPhone release.