In part 1 of our tips for laying out content in web design, we showed you four ways to display content in a web design. Though these tips are very useful in their own right, we have another four that we wish to bring to your attention, and we are going to start with a technique called progressive design.
Progressive Design: The idea behind this technique is that a user follows a natural flow over several pages to obtain the information he or she needs. This is normally navigated by buttons like “click next”, and so on and so fourth, and is often used for completing forms, where sections are displayed one after another. Another use is if your site wants to demonstrate to the user, a series of steps that were taken to complete a task. Hence the name of progressive design.
Grids: Undoubtedly the most essential element to any layout, is a grid. A good grid system will separate content on a web page in an almost seamless way. Many web designers believe that the grid system should be subtle, and some of the best grid systems are just broken lines that divide one section of the page from another. They also make the content very scannable, which is essential.
To make a good grid layout, aesthetics are everything, as chunky, padded grids do not make the best use of white space, and can be very off putting to users as the information will not be defined, and, or have a broken flow.
Accordions: Accordions work in a very similar fashion as sliders and carousels, as they display focused content in a box. Again they are very good if used for their purpose. The main difference is that they appear on top of related information, and one can be displayed one after another, like an accordion.
Accordions come into their own when several types of related information or related products are to be displayed. This shows the user that there is a relationship between the content that they are viewing, and like sliders and carousels, it is only viewed if the user wants to view it.
Mega Drop Down Menus: These are similar to rollovers, as they present information when the mouse hovers over the element, but as the name would suggest, a vast menu appears giving the user a choice of the information they want to see. This is technique is being used on many websites that feature products. The mega drop down menu can display information about it, or indeed another set of related menus.
These are particularly good because information is presented without having the user navigate away from the original page. This is technique is growing in popularity especially if there is a lot of information to be displayed about a product. Such as a car.
Together with the tips highlighted in part 1, we feel you have a good comprehensive guide to choose the best way to present your content. In many cases, it is the subtleness of the presentations that will win the day, and create that killer design. So think about what information is to be presented and the way to present it will choose itself.
The key to content layout is to give the site a natural flow that will either take the user on a journey, or simply give the user an option to select the content they wish to see. Content is King, and choosing the best way to present your monarch, is paramount to a successful design.
We hope these tips for laying out content in web design help you do exactly that.