Sent by Thomas Vander Wal on 8 December 2004 22:10
On Wed, 8 Dec 2004 12:22:09 -0800, Joy Bower [EMAIL-REMOVED]> wrote:
>
>
> > I stopped using photoshop and illustrator early in the process and I
> > saved a lot of headaches. This step introduced too much print medium
> > bias that did not fit in the web medium (I also tend to hire folks
> > that have do not use the graphic tools until the end). We get things
> > done much more quickly and have a far more flexible framework. We
> > also have a product that has the possibility of working well across
> > platforms (desktop, mobile, etc.).
> >
> > 1 - Assess the content types
> > 2 - Assess the content objects needed (photos, headers, browsing
> > structures (navigations and link lists), text, charts, data tables,
> > etc.)
> > 3 - Outline page types needed (home page, browsing pages, destination
> > pages (newsletter, memo, brochure/catalog, etc.))
> > 4 - In valid XHTML and using proper semantic markup build wireframes
> > for page types including content objects that are needed in these page
> > types (use a wireframe CSS that turns on borders and only uses black,
> > white, and greys)
> > 5 - Add classes and ids where need to hang design, being sure to name
> > these semantically (logo, localnav, globalnav, category1, etc.)
> > 6 - Start adding presentational design in the CSS (required images,
> > coloring, type weight, visual cues, etc.) - this is where one begins
> > to use photoshop and illustrator
> > 7 - Evaluate templates for redundant CSS and test design on people,
> > and browsers
> > 8 - Fix
> > 9 - Dump in content
> >
> > I began working in this manner in 2001 and have been refining it
> > since. If you are familiar with CSS Zen Garden and have designed for
> > it, you have started at step 6. The hard work is done and the
> > presentation can be modified on a whim quite easily. Starting with
> > Photoshop and Illustrator too early, it is too easy to marry the
> > content to the design and it will be hell fixing. This is the web we
> > are building for not print (actually if designing print and web you
> > would be benefited by following a nearly identical process and at step
> > 6 design for print and web in conjunction and they should not be
> > identical interfaces as they are very different medium).
>
> Thanks for sharing your good ideas. I'm not sure I understand on part.
> Will you please clarify?
>
> Do you at some point in the process (and when?) spend time designing
> the look/design of the visual interface? It appears to me from your
> description that you do not spend time designing the interface. Step 6
> sounds like the point at which you make whatever graphic pieces
> (masthead, bullets, etc.) that you'll need. Is this correct? If not,
> then what is the visual design process that you do and at what point in
> the process is it done? Also, what is the name of the application you
> use?
Yes, visual design starts at Step 6. In earlier steps (4 & 5) the
rough layout and placement of content objects can begin within the
simple wireframe.css file. One can still do extensive visual design
at this point. I use BBEdit, HomeSite, or Dreamweaver all depending
where I am and what OS I am using.
> I like the idea that the look/design of the visual interface grows out
> of the information architecture and user experience requirements. That
> makes a lot of organic sense.
>
> If you are saying that the visual design of websites should be
> completely different from visual design for print, I disagree. Print
> design has successfully addressed the making of many different kinds of
> pages readable, with logical hierarchy and good flow of information. I
> don't recommend taking a print design and making it into a website
> without running it through the full web design research, analysis,
> planning and design process, there is much of value in print visual
> design for web designers.
The visual design does not have to be completely different, but print
and web are two entirely different medium with very different
properties for page boundaries, visual characteristics of the medium,
and control of the environment and medium that the person using the
information has before them. There are many things that can be
learned from print design, but far too much of it has bled over to the
web, which hinders some of the constructive properties of the web.
Over use of graphics for text elements makes it impossible for the
user to copy and paste the text so it can be reused (particularly
silly is when addresses, phone numbers, dates, etc. are presented in
graphic formats -- ironically AIGA is one of the worst offender of
this).
Gradients and reverse text can work very well in print, but keeping
the same presentation of the information on the web begins to hinder
the readability. What makes a stunning print piece can be a mess on
the web. Oh, and the converse it very much true as well. Learning
which visual assets translate well is important. Designing brand
across platforms is a difficult craft to master, but it can be done
beautifully and still keep consistancy while playing to the mediums
strengths and weaknesses.
People have many options on the device to view web-based information.
Desktops, laptop, handheld, and mobile phones are options that we deal
with today (the mix is different depending where the users of the
information are located). Extensively designed sites can hinder the
information use on some devices and should be a consideration when
building the visual presentation. The great thing with CSS is
different platforms can use different stylesheets, which improves the
information use for a device.
> If you are saying that no website should be highly visually designed, I
> don't agree with that either. The visual design of any website should
> be appropriate to the full spec of the project, including what the site
> should look like and what it should do. Design is a choice (or rather a
> series of many choices), up to the designer/developer and the customer.
> Many highly designed sites are wonderful and gorgeous. So are many
> sparely designed sites.
No, not saying that. There is a definate balance that needs to be
understood. Visual design should help the content not hinder it. I
tend to find highly visually designed sites have people behind them
that are bored with their content. Site's with content owners that
are excited about the conent tend to have somewhat more restrained
visual design. One of the things that the focus on the content first
process does is re-energize the site owners about their content and
their reason for being. I have had clients that demanded highly
visually designed sites that have rediscovered their content and have
actually asked to have a moderate visual designed site toned down.
Content greatly benefits from well designed visual presentation. This
too is a craft that must be learned and learning the qualities and
limits of any medium is important to being a master at the craft.
All the best,
Thomas
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
