“Information density” is a frequently used buzzword you may have seen around the web lately. In short, it refers to the amount of information that is displayed within a user interface (UI).
Many web designers take information “above the fold” — the content the user sees before having to scroll down — very seriously. However, since the explosion of mobile and tablet screens, where that fold actually lives now varies hugely between devices.
The general trend in web design has led to longer pages, spaced-out content, large typography and giant screen-filling images.
Way Back When
One thing I love to do occasionally is dip into the Wayback Machine website – the massive cache of websites going back into the 1990s. Take a look at the Russell Investments site now in 2014, versus what it looked like in 2004.
Back then many websites were still designed for a rigid 1024×768 display (or even still 800×600). Mobile sites were either absent or separate sites and responsive design wasn’t thought of yet. Russell.com is now an awesome responsive site scaling down perfectly for mobile screens.
Now many designers have flipped the process round by working on mobile designs first and then marking their way back to desktop.
All content-heavy interfaces need to strike an appropriate balance between visual simplicity and information density —Luke Wroblewski
Here’s another example which is more heavily packed with information. Interactive Investor is a popular site for UK traders with portfolio tools – here’s the site in 2005 and 2014.
Note how densely packed the links and the market information were 9 years ago. Mind you, now I have to scroll down two screens to view the market data panel!
In a tug of war between having a more visually appealing web page and displaying the important information users want to see, some might argue that the UX has actually suffered rather than improved over time.
On the whole I don’t think this is the case. With more real estate on screens, designers have much more room to breathe in their designs, and that can only be a good thing. The balance for information design – particularly with data visualizations and financial data display – is to make sure that all crucial data is easily accessible, yet at the same time make sure that users are not bombarded and can quickly disseminate the information.
Typography Plays a Big Part
Take a look Old Mutual, from 2014 to 2004. Note the large font size now used for share prices and dates.
Ten years ago people would have raised eyebrows at the idea of numbers on a web page being that size! Naturally there is more screen space for such things, but designers are pushing the boundaries with cool fonts and applying the same design principles we see in the print world.
Further Reading
Check out this article by Liam Spradlin, “Information Density Isn’t As Important As Information Hierarchy,” where he takes a look at the Google’s new approach to mobile app design.
Some users question the new visually-focused designs, which put pretty images of content at the forefront, and introduce a significant amount of white space that couldn’t be found previously.
What have you noticed about information density in financial websites? Is less really more? Drop us a comment below and let us know!
