October 10, 2010 6 Comments
Using White Space
Most of Web 2.0 pages are flat. Actually designers use empty space of a page to make it simple and focused. For example, imagine that you have a page with a Top Menu and a Main Content area, to get focus to your Main Contents you have to use a simple Top Menu and some white space between menu and Main Contents, by this, your Top & Main Sections will separate completely and visitor will determine the content area as easy as possible. It helps that Top Navigation and Main Contents, focus to their own content with no conflict to other parts.
Using Solid Area
You can use white space to split your page areas up in which your page sections are seperated from each other, or using Solid Areas for integrate sections. This approach help those which doesn’t like White Spaces on page and want to design an integrate page, so that, to make focus, use some Solid Areas on page. Simplest approach to make Solid areas is to use Color. You can assign different colors to different areas to distinct them. But note that you have to use different range of color for each section and finding a good composition is not so easy.
There are some Websites that gives you idea to have a good composition. One of the best one is http://www.ColorLovers.com. I like it so much, most of the time I choose one composition from suggested colors.
You have to make sure that your different areas are completly seperated by using different colors and they are in touch with each other with a good composition.
Bigger and Bold Texts
Text size in web pages can split your content areas. Actually when you got focus to an area (like Main Content or Top Menu or etc) you can break it into some local regions. You have some choices to do this, for instance, you can use images, Icons, Bold or Bigger Text sizes. (I’ll talk about using Icons and images later in another post). Using text to separate regions has some advantages like:
- It is Search Engine Friendly
- Cause to higher rank in search results (if you use standard html tag – h1, strong)
- It is easier to implement
- Users can understand it at a glance
- It is integrate with your contents
If you are familiar with some other approaches to make pages simpler share it with me.
- The Art of Distinction in Web Design (sixrevisions.com)
- [from h.greenwood] 39 Brilliantly Designed Login and Sign Up Web Forms | CreativeFan (creativefan.com)