Tony wrote:
> can i get the mark henderson take on my newest site :)
>
> http://www.salisburycorporatelaw.com/live.cfm
>
> thanks :)
> tw
>
Wow, that truly is one male dominated firm!
I like your design style, and the site is aesthetically pleasing, but it
does suffer from some drawbacks. Font sizes are reasonable at normal
browser defaults (there is very little mouse text and when this is used
it seems appropriate enough to me) and the content positioning/layout is
good, with one caveat. The bottom navigation bar (and I believe EriKa
suggested you need a navbar) still makes no sense to me. Those links are
all significant and don't feature anywhere else in the layout, so why
are they at the bottom? It's common practise to place such an important
aspect of the design 'before the fold'. To that end, I would expect it
at the very top, probably below the header logo but before the company
photo. That just seems intuitive to me and, like I said, your average
web surfer (and we surely don't fall into that category) will thank you
for it. Ask yourself this - who wants to have to scroll to the bottom of
every page in order to navigate elsewhere on the site? On that note, you
could also then add the same 'text only' links in the footer (make them
small, make them subtle, make them anything you want!). And besides,
it's recommended to always have an equivalent text link for every image
link. I'll talk more about the use of images and possible alternatives
shortly (and the nav bar is one example where this can be applied).
But, and there is a but! I pose the same question to you as Michael -
have you tested all the various scenarios I described in the other
thread?? The answer is NO! OK, so the question was rhetorical :-) The
site works well without styles, but with images disabled breaks
horribly, and that comes down to your CSS. When I disable images I get a
lot of black text on a black background, and a bunch of dark red links
on the same black background, making it totally impossible to use[1]. I
would just close out and move to the next site if this happened. Match
your background colours closely with the background images you are using
and the text will always be readable (see the color warnings in your CSS
validation results). This all comes down to testing - and to make it
easier simply use the web developer toolbar for Firefox (it's as
invaluable for this kind of thing as firebug is for debugging). I'm
pretty sure you already have it, and if not, that's your first task![2]
I mentioned above very little mouse text, and that's true where text is
used. But your site relies heavily (a little too heavily in my opinion)
on the use of images. This is more opinion than fact, but I would have
simply used CSS to position the text that reads "Thanks for visiting. We
are busy wrapping up..." especially since this is obviously only
temporary. I would not have used full images for the services/planning
boxes either, and they ARE unreadable for me. The headings, sure, but
not the content. Another aspect to consider when using images this
heavily are those little buggers called the search engines - they do
enjoy textual content a lot more. To that end, there are various
techniques to create equal height boxes, and this appears to be an
important design feature[3][4]. There are also other ways to reduce the
image weight of sites these days, another being FIR[5] and this is an
approach you could easily use on your headings (all of them!) and in
this case even the boxed content will probably be ok. The navigation
does look nice, but there are CSS methods available using a single small
background gradient to achieve the same thing[6]. Unfortunately the
image in that example no longer exists so you wont see the true effect,
but you get the idea (there are many more examples of navbars on
maxdesign, and here's a better example of the type of visual effect that
can be achieved[7], even in gray!). The only thing sacrificed in these
instances is the drop shadow on the text, and even that will change with
the introduction of the text-shadow property in CSS3 (and now that IE8
is on-board, this probably wont be as far away as once thought).
Delving into the code now. Validation results are pretty good. However,
this is 2009 and the likes of align="center" (along with
<center></center) are well and truly deprecated and should not be used.
You can use margin: 0 auto and text-align: center to replicate this
across browser-land. Also, with your tables (is that tabular data I
see?) you still need the cellspacing attribute, but the rest can go.
Equivalent CSS would be something like table {margin:0; padding:0;
border-collapse:collapse;}
Oh, you probably already know this one too but I thought I should
mention it. I'm getting an invalid security certificate on the payment
link.
Food for thought at least.
HTH
Mark
--------------------------------------
[1] http://www.cwc.co.nz/sandbox/salisbury-attorneys.png
[2] https://addons.mozilla.org/en-US/firefox/addon/60
[3] http://www.gunlaug.no/contents/wd_additions_22.html
[4] http://www.gunlaug.no/tos/moa_11f.html
[5] http://www.mikeindustries.com/blog/sifr/
[6] http://css.maxdesign.com.au/listamatic/horizontal26.htm
[7] http://css.maxdesign.com.au/listamatic/vertical07.htm
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know
on the House of Fusion mailing lists
Archive:
http://www.houseoffusion.com/groups/cf-community/message.cfm/messageid:297163
Subscription: http://www.houseoffusion.com/groups/cf-community/subscribe.cfm
Unsubscribe:
http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.5
