Website wireframe

Web Design & Development Guide

Website wireframe


In web design, wireframes are a basic visual guide used to suggest the layout and placement of fundamental design elements in the interface design. Because of this they must be completed before any artwork is developed. When completed correctly they will provide a visual reference upon which to structure each page. They also allow for the development of variations of a layout to maintain design consistency throughout your site. This is an important part of the initial development stage because it creates user expectations and helps to develop an awareness and familiarity throughout the site.

Creating a set of wireframes for any project also act as a communication tool to clients and stakeholders, such as content creators, engineers and developers. Over the course of a project the wireframing exercise functions as a stable base on which to consider changes, diverse user paths and new requirements. The information architect and information designer typically use the wireframes as a meeting of the minds, in terms of having solid working documents on which to establish the language, content and structure of interactions users will have with a given site or project.

The creation of wireframes also helps to define the positioning of global and secondary levels of navigation in a prominent and intuitive position, as well as providing an area for utilities such as helpful information and search facilities. When creating your wireframes it is critical to ensure that branding is central to the identity of a site so as to communicate the personality of the site.

Website Wireframing Tools

External links

Cascading Style Sheets
Printer friendly
Digital strategy
DOM scripting
Fahrner Image Replacement
Progressive enhancement
Spacer GIF
Techniques for creating a User Centered Design
URL redirection
Web Interoperability
Web modeling
Web template
Web-safe fonts
Website architecture
Website wireframe

Page created in 0.023703 Seconds