For laptop/desktop: consider smaller screens
Many of our clients view the web on small, company-issued laptops – 1366 x 768 pixels, with a visible area in the web browser of just 1366 x ~640 pixels. That's often what they're using to review our work. We should consider this as our lowest common denominator, and we should also consider this screen size to be a very high priority, because we need to make sure we're designing an experience that will be perfect for our clients on their machines.
Of course we need to design the experience to be fantastic for real users in the world, who will be looking at the site on a wide range of screen sizes: small laptops, especially at work, or larger external screens. (Or a tablet, or their phone, but I want to focus on laptop/desktop for this article.)
The challenge
We design website layouts on big screens — often 1920 x 1080 pixels. This just makes sense. However, it's critical that we preview our desktop layout in a smaller window set to 1366 x 640 pixels to get a "lowest common denominator" idea of how our clients and users will see it on their laptops.
An easy way to get an idea of this is to take a screenshot of a browser window at 1366 x 768 pixels and paste it into your comp as a see-through window that you can preview your layout through. Just put it on a layer at the top and drag it around to see how much content will be visible to users on smaller laptop screens. I recommend even including this window layer when showing clients how the site will look on larger and smaller screens! They'll get a kick out of it.
Now, if you're in pharma like I am, remember the floating ISI bar subtracts usually another ~150 pixels of height, leaving us with as little as 490 pixels of visible screen height on those small laptop screens. You can't fit a whole lot of content in 490 pixels of screen height, but luckily this is not an issue because users scroll without even realizing it. Remember, there's no such thing as "the fold" in digital media. We need to educate our clients about this!
If we acknowledge "the fold" as being real, that 490 pixels of screen height is a deadly trap; we probably can't make our clients feel thrilled with how much content we can show in that small area. But if we can bring them with us and help them embrace the idea that users scroll automatically (especially on smaller screens), then everyone's happy!
– Manning
Questions/comments? Feel free to contact me at manning@manningkrull.com. I update these articles pretty frequently — best practices evolve over time as the world of digital quickly changes, and I always welcome insights from others.