Wireframes, as defined on Wikipedia:
A website wireframe (also "web wire frame", "web wireframe", "web wireframing") is a basic visual guide used in web design to suggest the structure of a website and relationships between its pages. A webpage wireframe is a similar illustration of the layout of fundamental elements in the interface. Because of this, they are often completed before any artwork is developed. When completed correctly they will provide a visual reference upon which to structure each page. Wireframes also allow for the development of variations of a layout to maintain design consistency throughout the site. This is an important part of the initial development stage because it creates user expectations and helps to develop an awareness of and familiarity with the site.
You will be taking your schematics one step further and closer to your final design. Building upon the structure you already defined to start to develop the design. Think of this as the Black and White or outline version of your site.Please consider designing your site on a grid! That is, things are aligned to one another with respect to a table of vertical columns. Check out the 960 Grid System for some ideas on how to approach this. Designing on a grid will make things A LOT simpler, both for coding, designing and for the viewer as well.
Consistency is KEY! If you use 10px margins for certain elements, use 10px margins for ALL elements! (FYI: Flash people obviously don't necessarily have to work on grids or be consistent). Read this great blog post about Common Web Design Mistakes and be sure not to make them!
Review the following sites for more information on wireframes:
0 comments:
Post a Comment