Your text is too small

Posted by Cătălin on Fri, 20 Aug 2010

Your text is too small

As technology changes, design changes to adapt. Consider screen resolutions over time. In the past decade, designs have moved from accommodating 640 x 480 (still over 10% of users in 2000) to 800 x 600, and now to at least 1024 x 768 pixels (with around 75% of users having higher resolutions).

In the same time period, the physical size of displays has also generally increased but now includes a lot more variety. A decade ago, 15” desktop screens were common, and 20” screens were about the largest in regular use. Today, anything under 19” is uncommon for desktops, with screens ranging up to 30”. But notebooks with smaller screens are everywhere, netbooks with displays even smaller yet abound, and mobile devices proliferate with comparatively tiny screens. Technology solutions have largely helped deal with this disparity, such as the iPhone’s easy zooming feature for web browsing. And with 1024 x 768 as the current default minimum target resolution, it’s really only phones with lower resolutions.

But there’s another, related issue: with the disparity in screen sizes and resolutions comes a compounded variance in pixel density. While a standard desktop 20” widescreen monitor at 1680 x 1050 has a pixel density of 99 pixels per inch, my 15” MacBook Pro running the same resolution is 128PPI. An older 19” CRT at 1024 x 768 is 67PPI, almost half—meaning that elements such as text are physically half as big on the newer screen. And mobile device disparity is even greater: the iPhone 4’s 3.5” display at 640 x 960 is 326PPI.

Designers need to rethink the scales they’ve always used for design. Increasing pixel density means that 10- and 12-pt fonts are basically illegible on many screens. While we’re accustomed to working to the lowest common denominator (for screen resolution), we need to be actively considering higher-end users in terms of pixel density.

One mitigating factor is that most browsers have now adopted the “zoom the entire page” model instead of “make the text larger”, resulting in a better experience for those outliers who we fail with our designs. But relying on technology to compensate for our failure to accommodate our users isn’t a reassuring thought. There is a definite opportunity here for designers focusing on legibility and usability to lead the way on web design trends.

Source: zu.com

web

Articles & Code Snippets

Your text is too small

Posted by Cătălin on Fri, 20 Aug 2010

Your text is too small

Archives

Articles & Snippets