Currently, I am in the process of developing 3 HTML5 responsive websites that will need to be optimized for various devices. So far, I have successfully implemented media queries for smaller devices such as 320px, 375px, 425px, 480px, 768px, and 1024px.
However, the challenge arises when it comes to larger screens. For instance, my workplace has a massive screen with a resolution of 2560px. How can I effectively write the appropriate queries for this size?
Personally, I use an 11" MacBook while my colleagues have 13" laptops, resulting in different homepage displays. Do I need to consider setting max-widths at 1680px, 1920px, and 2560px to accommodate these common large screen sizes?
After researching on Google, I discovered that these resolutions are among the most popular for big screens and seem to work well based on my observations in the office.
Therefore, my main concerns are: How should I approach designing for larger screens? What settings should I implement to ensure consistent webpage display across various big screens?