[thelist] site critique request + Creative Director question

[Paola Kathuria]

Colin Buttimer wrote:
> http://www.mdx.ac.uk

First impressions are that the blue, white and grey choices are,
hmm, friendly and approachable.

The rest is hopefully constructive criticism:

design:

+ I find that the abundance of colour photos clutters the main
  pages - having rubbed shoulders with some designers, I wonder
  whether you could kill two birds with one stone by making them
  duotones (colorise 'em).

  If you colour code each main section (what I'm calling the things
  that the top horiz links go to), you then colorise the photos
  accordingly.  This'll mean you can get away with having the
  photos 16-col GIFs (smaller filesize perhaps), but if you then
  colour-code the photo montage for each section too, it'll also
  provide additional landmark info of what section one's in.

  Simple photo buttons would be: unselected = colorised, no
  border, selected = full-colour, with border

  Here's the full monty of how the photo buttons could behave
  to show the states selected and clickable:
  1) When not in the section, photo button is colorised.
  2) Mouseover of unselected photo shows full-colour photo.
  3) When on the target page, photo icon is full-colour and
     icon has border (which is now white) or the section colour and
     the link text is black (or a dark shade of the section colour.
  4) When further down in a section, photo button colorised but with
     coloured border
  5) Mouseover of button when further down in a section is 
     version 3.

  You can then apply the colour-coding to things like the main
  page heading, the top links, other photo buttons.  One-off
  pages like the home page, contents, search and results, and
  feedback can then be considered to be notionally in a "site"
  section, and given their own colour to apply in the same way.

+ Too many "top" links - having them at the end of every logical
  content section clutters the page - I tend to add them every
  100 lines in the source page (which is about 2 screenfuls at
  1024 x 768 resolution)

+ Consider making the "current" section link colour black and not
  white - I think that the current page link should be the most
  prominent (adds to the "you are here" cues), not the least.

+ I think that the Middlesex Uni logo at the far right of the
  photo comp is overwhelmed by the photos.  If you colorise
  the montage (duotones), perhaps this'll no longer be the case.

+ The 17K for the photos montage per section seems excessive
  for what is really just decoration (colour-coding them would
  make them functional, though).  A compromise would be to have
  the Uni logo (far right) a separate image and just finish the
  montage earlier.

+ I'd prefer the two columns swapped - content on the left
  and links on the right.

+ Consider duplicating the horiz section links at the bottom
  of pages (see http://www.limitless.co.uk/stdterms.lml for an
  example)

+ Add the photo icons to the relevant links in the site map
  and pehaps make these <h2> links on the page.

bugs:

+ The link to http://www.mdx.ac.uk/research/portfolio/cs.htm (from
  http://www.mdx.ac.uk/research/portfolio/index.htm) gives error
  message - looks like the css file hasn't been referenced properly.

+ The error page has an error (maybe the same as the previous
  problem) - symptoms suggest that the .css path is incorrect.

+ Photos and gif heading don't match on http://www.mdx.ac.uk/aboutus/

usability:

+ Set visited link colour for main navigation (and all links) -
  at the moment, I can't tell if I've visited a section because
  the blue link colours remains the same.

+ Don't include index.htm in internal links - it makes the URL
  longer and thus more to get wrong if people are going to pass
  URLs on to others.

  To illustrate, a radio program advertised an appeal published
  on a client's site - the page URL ended readers/index.htm but
  the radio program said it was readers/index.html - visitors got
  an error message (as they will on
  http://www.mdx.ac.uk/research/portfolio/index.html for instance)
  So 1) set up a redirect so that all references to *.html are
  redirected to the same prefix at .htm

  Then 2) remove index.htm from internal links - to do this
  from directories above, replace <a href="portfolio/index.htm">,
  say, with <a href="portfolio/">.  To reference the index page
  from a directory directly below, use <a href="../">.  To
  reference an index page from within the same directory, use
  <a href="./"> (on a Unix server) or <a href="../portfolio/">
  To reference the home page, use <a href="/">

  This'll mean that /index.htm will never appear in the URL.

+ Mark off-site links differently (that is, to sites other than
  www.mdx.ac.uk) from internal links - Reuters once used the @ symbol
  as a graphic, I tend to use a pointy hand graphic (for an example,
  see http://www.limitless.co.uk/~paola/tmp/chi-web/whyfox.html - this
  is an old demo page - links don't go anywhere).

+ Consider replacing mailto links in the page footer with links to a
  form - 1) you'll get less spam (by not advertising your address to
  email harrvesters) and 2) anyone will be able to contact you, even
  if at a library or internet cafe or a friend's house.

+ The breadcrumb [sic] trail looks broken by ending with ">" - I'd put
  the current page as the last link or remove the trailing ">" as the
  last link.

+ I don't understand what "back to your links" means (without clicking
  it) - almost as sinister and confusing as "The Page you Made" on
  Amazon...

+ Page layout too wide - requires minimum 800x600 screen resolution
  or a wide browser width - visitors using WebTV'll get a horiz
  scrollbar (and I did, with 1024x768 - as I have multiple windows
  open).  I realise this'd be a major change but it would make the
  site more accessible (in the general sense).

+ I've just figured out what the links mean on the home page 
  under "Custom tours" - they've a vertical list of section links
  that appear horizontally at the top of every other page!

  These really should be presented in the same way on all pages or
  else they just look like a different set of links.  I initially
  thought that they were a list of tours.  The tour idea is great -
  I think that the home page can stand to start with the horizontal
  section links but you can use the vertical space with a bulleted
  list of the tours.

> Also, I've been working with a graphic designer for a few months now in the
> role of Creative Director e.g. I come up with concepts, keywords, etc then
> agree with client and develop and direct with the designer. I'm doing this
> without prior experience - can anyone recommend a good book/website for
> guidance in the area of art/creative directing?

Having worked with a creative director (as a web producer), an issue
is of documenting and storing the design process.  It's sometimes
useful to be able to go back to a source image from a certain date
and so this presupposes that you keep all originals in a dated form.

And having some record of considered routes and discounted designs
means that the person who will eventually take over your job, won't
end up reinventing the wheel or waste time considering things you
know didn't work or which you know there won't be approval of.

Finally, if you don't already, when briefing the designers to come up
with design routes, encourage them to present one "off the wall" route
even if it doesn't strictly adhere to the brief.  This often produces
elements that you can bring into other "safer" routes.

I hope this helps.


Paola, paid pedant