Graphics Reference
In-Depth Information
Map
Once you have groups, you're ready to impose a hierarchy on them. Will you go
directly from the home page to your work, or will you have a second level of pages for
each group? Will all the work in a group be equally available, or will you want people
to see some pieces in a specific sequence? These are big decisions. That's why you
need a
site map
.
A site map is a flowchart representing every page in your portfolio. This chart
will enable you to recognize links within your pages, and links out to other sites. It
will also help you to organize your ideas logically, so visitors to your site won't feel
lost as they explore it.
A good site map shows three things at a glance:
•
Grouping:
How you've broken out your work.
•
Hierarchy:
Where each page fits within the site.
•
Connections:
What links to and from each page.
There is no standard form for this chart, although you'll find a flowchart in
this chapter's Portfolio Highlight on page 221 that will help you get started. A small
site can start as a sketch on paper or Post-its, and then become an Illustrator file as
it solidifies. Flow-charting software can make the process easier, particularly if you
anticipate a complex site. On Mac OS X, I can recommend OmniGraffle
(www.omni-
group.com),
an inexpensive and fun tool. Many Windows users work with Microsoft
Visio (office.microsoft.com), which is comprehensive but expensive if you don't plan
on doing many maps. On either platform, the best free selection is VUE (vue.tufts.
edu), an excellent open source option.
No matter what physical form your site map takes, make sure that you leave
enough room on it to insert items. You may discover as you work that you need to
move things around, or add a major project that develops while you're still designing
your portfolio.
What will your chart contain? A home page, of course, and perhaps an opening
page for each group. Every group should branch from one of these types of pages.
Remember to account for single pages that aren't part of your work groupings.
After you've accounted for every page, move them around to make sure that
you've got their hierarchy correct. Pages that are only accessible from a main page
should be drawn beneath that page. With your pages in
position, draw lines to document your planned links.
Remember to consider outside links too. For example, if
you have a link to a client's site or a secondary portfo-
lio site like Flickr or Behance, document that.
People often forget the importance
of persistent elements. A friend of
mine was showing me his site.
After the home page, there was no
link to email him.
—Layla Keramat
