How to Maximize Space on a Website

By Lisa Lopuck from Web Design For Dummies, 3rd Edition

Even though web-page space is too, too limited, you can make creative use of a number of technologies out there in order to maximize your interface. For each of the following techniques described, there are a lot of websites that offer code samples, forums, and resources to help you get started.

Accordions. Accordion interfaces allow different content to share the same space. Typically, labeled bars — either vertical or horizontal — like Venetian blinds can each expand to reveal their associated content.
Revealing layers upon rollover. Another common convention is to expand a navigation component upon rollover to reveal a larger image, more information, and a call to action. That way you can condense several navigation options into an area and yet provide enough information for each one to entice people to click.
Carousels. A carousel interface houses a number of options within a contained space. By scrolling either horizontally (most typical) or vertically within that contained space, users can see all of the options.

Credit: © Geert De Deckere
There are all kinds of online resources that provide code bases you can customize to create accordion spaces for your website.

Credit: © Sourcebits Technologies Pvt. Ltd.
Carousel interfaces allow users to scroll horizontally through contained spaces to find what they are looking for.

Credit: © Soh Tanaka
Upon rollover, this image enlarges and provides more information.
Enhanced drop-down menus. Most people think of a drop-down menu as only a text list that expands underneath a main navigation component. This limitation doesn’t have to apply to your drop-down menus. Instead of a simple text list, you can design an "enhanced drop-down menu" that reveals a neatly organized list — even with images and daily promotions.