Tips for laying out content in web design, part 1

Content is King in web design, a fact we all know.  As more and more websites of all natures, require more innovative ways to present content, your role as a web designer, is to come up with as many ingenious ways to present content that is meaningful, fashionable, and aesthetically pleasing as possible.

These tips for laying out content in web design, should give you a better understanding of the concept and therefore, make improve your designs.

Sliders and Carousels:  These are particularly handy, if you have content that you need displayed but only to the users who are interested in seeing it.  As each product or picture scrolls through a box, you can display any number of items, without having them fill up whole pages.  Also, the box provides a much better focus on a product than having lots and lots of them scrolling across a screen.

Sliders and carousels can go up and down as well as left and right, and the beauty of these is that they can be tucked away until a user wants to see them.  A little bit of creativity from you, and these can be very effective, and a very aesthetic way of bringing content to the user.

Tabbed Navigation Elements:  These are also useful for keeping content “on demand”.  The idea that each block of content is selected via a tab at the top of a screen.  These come into their own if the content is more information orientated rather than product or menu driven, in which case the slider will probably win out.

Tabs are very useful for users to keep track of information or forms they maybe completing, and they have a very nice ‘select when needed’ quality about them.  They work well with good button design, which to be a good design, should show each section clearly.

Modal Windows:  These are windows that appear to users that present additional information of some kind.  It is good practise to ensure that the link, graphic, or thumbnail that opens the window is strongly related to what the window shows.  It is essential that users can close the window should they wish too.

Modal windows are ideal for displaying information that will not fit on a layout, and they can be used for just about anything from forms, to videos, to text information.

Rollover Elements:  You have probably guessed that nothing actually rolls over, and the over part refers to the mouse.  The idea behind these is that the user rolls over the element with their mouse and a text box opens on the page and provides information that the user may need on a different part of the layout.  These are proving popular on corporate sites, for displaying portfolios and such like.

These can be useful as they give the user a sense of control and provide extra information that cannot be displayed on the layout due to space or similar considerations.  These are also knows as ‘mouse over’ elements.

These layout techniques should help you in designing the best way to present content in your designs.  They are becoming standard on many websites, and new techniques and code are being developed all the time for the sole purpose of presenting information.  Your job as a web designer is to choose the best elements for your design that will be the most effective, and create better, more fluid, and more informative experiences for your website users.

Hopefully these tips for laying out content in web design, will make the processes behind the creativity that little bit easier.  In part 2, we will be looking at other design elements that you can utilise.