WIREFRAMES 101

what is it?

When a designer begins brainstorming a website, most likely he will begin by figuring out what will appear on each page. This can be visualized through the creation of a wireframe. Basically a wireframe will give the designer a roadmap of where each element (i.e. logo, navigation, images, headings, blocks of text . . .) of the page will live.

Everything included in the wireframe is meant to be very basic and uncolorful. The main point is to focus on layout and content placement, as well as solving navigation and functionality problems in a format that is easy to adjust.


why is it important?

By creating a wireframe, the designer of a website can make sure that he includes everything he wants to include in his new web page.

Also, the production of a wireframe also makes the designer think about how his website is going to display on narrow widths (since 50% of online users are via their mobile devices). Planning things out helps the designer prioritize site elements that should draw the eye of the webiste user whether its on a narrow screen or a wider screen (desktop or tablet).

try it yourself!

go mocking bird
lovely charts
sketch