site map
    studio braun homesitebuilder home... because you need to do it right.sitehost home... because it needs to be home... because it has to look good.    

 site design
 content generation
 graphic arts

*|guide intro
|site map
|link 'em


Graphical Design ]

Everyone has an opinion about the appropriate look, feel, and style of graphical content, and many people have opinions about the technical and usability ramifications of such items as file size, colour availability, required plug-ins, browser compatibilities etc. It is probable that given the number of possible reasons for putting a web site together, at least one implementation exists to support any opinion regarding design.

Burton Snowboards - opens in new windowIf you're going on-line to introduce a new high-end snowboard, with a target buyer demographic of affluent 14-23 year olds, then you can bet there will be some level of acceptance (and expectation) regarding your web pages' demands for the latest plug-ins. Streaming video Macromedia Flash, and a requirement for a fairly modern connection bandwidth may even be appropriate.

The Handy-Cane - opens in new windowIf your market demographic suggests less technological currency (supply your own example or assume your visitors range across a wide span of categories) you will probably turn some people away if you have slow loading pages, cryptic user navigation tools, browser incompatibilities, or reliance on scripts that don't work for them.

You have your content, a site map, a working model of the way the pages will operate, and some convictions about colour, style, and technical considerations. Now you need to either hire a graphical designer or do it yourself. If you're going to do it yourself at least do yourself the favour of stipulating for yourself the same terms that you would have had to generate for the designer, i.e. make a contract with yourself.

Beyond the consideration of how your site will look and operate, you have to think about how you will maintain it. If you vary formatting from page to page, base navigation on intricate client-side image maps, or generate critically spaced groups of text, you will have a tougher time making changes and additions to your site later on (more on that in the next section).

Some considerations:

  • I mentioned earlier that you should always provide an easy route to the home page and consider linking back to originating pages. This often gets implemented with a set of custom designed arrows and icons. When carefully considered and properly executed such graphical items can be very useful, and will can make an attractive differences. Remember that a blue underlined word will for some time to come be universally recognized as a link, but a group of poorly designed icons with non-intuitive purpose will never be recognized.
  • Consider the use of style sheets in order to keep the body text straightforward. Inline formatting such as "FONT SIZE" tags or physical styles like "BOLD" can cause search engines' automatic indexing and text analysis programs to have a difficult time analyzing your content (and can even cause content to be skipped). They also add unnecessary bytes to the download size.
  • The use of frames can cause problems with navigation and with search engine indexing and so should be carefully considered regarding their added value. See the article On Frames for more discussion of this topic.
  • When a <table> is used to position graphics or text, the browser waits until all of the table is received before it displays any of it. This has large implications if the body contains either long text, large graphics, or relies on processing such as queries to a database or scripting. (You may have noticed that this page is laid out in a table. I figured that anyone seriously interested in designing and hosting their own web site probably has both a reasonably fast connection and a recent browser.)

Case Study Continued - Dave's Graphic Decisions

Dave has decided to hire a graphic designer to aid in the design of his site, for both navigability and look and feel. Dave expects to be revising some of his paper documents (invoice, business cards etc.) and needs consistency to be included from the start. He makes these future plans clear to the designer (even though he's going to wait a little while before producing them).

In order to help guide the designer, Dave lays out some basic requirements, and explains that an agreement must be reached on these items such that no design work contravenes them. Some of Dave's requirements might include:

  • No Frames or Java - Dave can't afford to build alternate content sites for browsers not supporting them, and wants better search engine visibility (see the article On Frames).
  • Don't make the pages one big table, I'm concerned with download times and want the user to be viewing some of my text as the pictures catch up.
  • Keep any custom link colours similar to the defaults, both to maintain a standard interface, and in case the user suppresses background graphics or overrides the colours.
  • Keep pages to a total of approximately 40-50 kilobytes or less, except in the gallery section of my arrangement portfolio (as people probably expect a bit of a slowdown there).
  • Don't insert a lot of overriding <font> tags, as Dave wants to be able to handle his own updates to content. (Style sheets are o.k.).

Next: keeping it running


All text and images unless otherwise indicated are Copyright © 1999 - 2001 by Studio Braun.