Website Review 6

A reivew on media breakpoints and responsive design.

What are media breakpoints?

A breakpoint is how many pixels wide a specific device is, and when the number of pixels exceeds the limit of the device, the website adjusts itself as if it's being viewed in a different device. The most obvious difference is using a breakpoint for phones, and changing the size of a website on a laptop until the breakpoint is hit, and the website changes it's view to be similar to that of a phone.

What is responsive design?

Responsive design is the process of designing a website that is intended to be used on multiple devices, such as a computer, tablet, and phone.

How do developers know what breakpoints to use in media?

According to blog.logrocket.com, there are two different ways to determine breakpoints to use for websites. The first is to to target specific screen sizes by targeting specific devices. People usually group devices up to make the process easier to code, so it really depends on the developer's choosing on when and how often the breakpoints occur. The second way is to use breakpoints based on the content on the website. This way uses media querys to change the design of a website as the screen of the device changes, so the content of the website shapes the website itself, and it can vary from device to device.

Sources:

https://testsigma.com/blog/css-breakpoints/

https://blog.logrocket.com/css-breakpoints-responsive-design/