A Roundup of Printable Wireframe Templates

One of the most crucial, and easily forgotten, aspects of website development is the design phase, in which the aesthetics and ergonomics of the site are laid down. Design starts with brainstorming, and brainstorming is usually easiest with pen and paper. A simple sheet of graph paper can make all of the difference, but sometimes it is more useful to have a template designed specifically for web design. Here are some templates to simplify this process.

1. Sketchbook for Web Designers (Free Download)

This template was based on the Safari web browser. It is designed for A4 sized paper. There are four different templates to choose from. The templates include a blank set up, a grid with widths of ten pixels, a grid with widths of a hundred pixels, and lined paper similar to school paper.

2. Web Design Sketchbook (Free Download, Project Book: $12, Full Sketchbook: $25

The Web Design Sketchbook is a series of tools that can be used for website design. The beginning of the sketchbook comes with a series of questions regarding the content and design of the site in planning. This helps you identify the goal of the site, the way that the information will be organized, a site map, and the aesthetic style of the site. Graph paper featuring grids designed around the Google Chrome browser can be used to plan out the appearance and function of the site. In addition to full pages, the sketchbook comes with thumbnail and detail sizes to get the most out of any brainstorming session.

3. iPad Sketchbook ($12)

Grid paper designed for planning out development for the iPad, built to actual size.

4. iPhone Sketchbook ($12)

Grid paper designed for planning apps and website development with the iPhone, built to actual size.

5. Erik Loehfelm’s iPhone Layout Template

Available for free, this is perfect for sketching out new apps and websites for the iPhone.

6. Paper Browser (Free Download, Designer’s Notebook: $16)

These templates are designed to be directly proportional to a 1024 by 768 pixel screen in order to ensure that the site is designed with the correct final product in mind. The screens are also split up into 800, 960, and 1024 in order to allow you to approximate the differences between the different views. The tool is very helpful for unleashing your creativity with web design.

7. UI Stencils Free Templates (Free Templates, Stencils: $24.95)

This site offers browser templates with grid paper for designing websites. The grids were designed to be used in combination with website stencils which simulate commonly used browser icons. The templates themselves are free and can be used for website brainstorming.

8. UI Stencils Browser Sketch Pad ($12.95)

Graph paper designed for website development, built with a Chrome browser header. The sketch pad is designed for use with the stencils sold on the site.

9. Henk Wijnholds: Sketching Paper (Free Download)

A browser sketching pad that is based on a screen which is 960 pixels wide. The grid is designed with a line for every four pixels, and a darker line for every sixteen pixels. The setup is perfect for designing websites with between three and six columns. It comes in two formats, the standard A4 and the large A3.

10. Konigi Graph Paper (Free Download)

This graph paper is designed for scanning. It is created with grid lines that are a shade of blue that can easily be removed. In this way, you can design a layout for a site, scan it into the computer. Some of the graphs also offers space for note taking on the side of the graph. It is available in landscape and portrait format.

11. Nathan Smith’s 960 Grid System (Free Download)

A template for sketching out web design that was built by Nathan Smith. It is based on a layout that is 960 pixels wide, and it is available in two forms: twelve and sixteen column. In the twelve column system, each section is sixty pixels wide. In the sixteen column template, each column is forty pixels across. Every column has a margin on either side that is ten pixels wide, creating a gap between columns that is twenty pixels wide.

12. Jason Robb’s Paper Wireframe Templates (Free Download)

A very basic, minimalist brainstorming browser sketch template.

13. Alfonso Bozzelli’s Wireframe Template (Free Download)

Another simple page layout template with space for taking notes and writing a title.

14. Adaptive Path Sketchboards (Free Download)

Simple sketchboards that allow a designer to jot down a quick idea for a web page layout.

15. Nunile’s Six Pages Template (Free Download)

A simple browser sketch sheet with six thumbnail sized templates for each page as well as lines for taking notes. Good for brainstorming.