wireframe

A **wireframe** is used in web design to plot out the contents of a web site's multiple pages, including the layout design, text content, image content, language, and navigational structure. Since wireframes are considered the "skeletal versions" of any web site, they are a very important part of the web designing process, and so they must be completed before work on the final web site has begun. Wireframes provide the web site creator room to generate multiple layouts in order to develop more consistent design and stronger structure for maximum user-friendliness.

Also, wireframes can act as a communication tool for clients, allowing them to call for any necessary changes, new requirements, or other additions throughout the creation.

There are two types of wireframes, the static wireframe and the dynamic wireframe.

The static wireframe is a simple hand-done drawing of a single page, in order to sketch out the basic layout of the page. Details are not usually incorporated at this point.



As for the dynamic wireframe, it consists a set of pages that are linked together. It acts more as a functional prototype of a web site and its text contents. Some examples of the dynamic wireframe include:



In the above, several comments are made visually open for people to see, communicating things such as "this goes here" and "that takes me there."


 * Sources**

"Usability Glossary: Wireframe." //Usability First.// 2005. Foraker Design. 21 Jan 2008. 

"Wireframe Your Site." //Sitepoint.// 2008. Sitepoint. 21 Jan 2008. 


 * Image Sources**

Image source: "Wireframes for Ajax." //Boxes and Arrows//. 2008. Public Square. 21 Jan 2008. 

Image source: //Chromatic Sites Web Technologies//. 2008. Chromatic Sites. 21 Jan 2008. 

This page was added by caitchu.