1. Home
  2. Business & Finance
  3. Graphic Design

How to Create Website Wireframes

By Eric Miller, About.com

3 of 4

How to Create Website Wireframes

OmniGraffle Screenshot

OmniGraffle Screenshot

There are a variety of ways to create a website wireframe. They include:

Drawing it by hand on paper
This method comes in handy when face to face with a client. Sketch out your layout ideas on paper, with a focus on what elements should go where.

Using Adobe Photoshop, Illustrator, or other graphics software
Most graphics software packages come equipped with all of the basic tools necessary to create wireframes. Simple lines, shapes and text (to label your elements) are all you need to create a presentable wireframe.

Using software created for this type of task
While Photoshop and Illustrator can do the trick, some software packages are developed specifically for this type of work. OmniGraffle is a piece of software that simplifies the creation of wireframes by providing shape, line, arrow and text tools to use on a blank canvas. You can even download custom graphics sets (for free) at Graffletopia, which gives you more elements, such as common web buttons, to work with.

Explore Graphic Design
About.com Special Features

Start your new business on the right foot with these helpful tips. More >

Easy steps to take control of your credit card debt. More >

  1. Home
  2. Business & Finance
  3. Graphic Design
  4. Layout
  5. Effective Web Design
  6. Website Wireframes - How to Create Website Wireframes

©2009 About.com, a part of The New York Times Company.

All rights reserved.