Wireframing Techniques for Web Page Design
The use of wireframes for web page design practices is a standard practice utilized by most web designers. Called in different ways by people coming from different industries, "wire frames" are web page design drafts that set out with a certain degree of precision, the elements that will be on page, their position and size, without getting into the actual graphic, identity and information design issues including use of colours, fonts and logotype.
The word "wire frames" comes from the world of Computer Graphics, where it has been a long established term to describe a mode of representing 3D objects by displaying only their wireframe, in order to save on processing and computing time.
Ten or twenty years ago it was in fact very time consuming to create 3D objects with computers, and to preview artwork and animation moves, the use of wireframes was very popular, because it allowed for rapid rendering and display of even complex images without a long wait.
With the web "wireframes" have come to mean draft page designs, web grids establishing the map of a page and of the content items that will be placed in it.
Also recommended are:
1)A very recent article by Martha Graham entitled "Wireframing" and accessible at:
This is an extremely well written article, with many visual examples and explanations. It provides also suggestions for wireframing tools such as Dreamweaver and Visio, and references to examples and complementary content.
2) "Where the Wireframes Are: Special Deliverable #3" is another recent article by Dan Brown which explores the risks involved in utilizing wireframing techniques for web page design, and provide further examples that promote the use of what he labels "Page Description Diagrams". According to Mr Brown "in a page description diagram, the content areas of the page are described in prose, as in a functional specification."
In this fashion and according to his logic one is able to address both the issues of content and the ones of priority placement on the page.
For the full article see:
blog comments powered by Disqus