I'm in the process of revamping the primary template of my website.

My site is one gigantic photo album.  It's turned into a monster over
the years - way back when it was a cheaper way for the parents to see
the photos I'd taken on my travels, it now has something around 800MB
worth of photos.  I use ThumbsPlus to edit the photos, and its webpage
wizard to build the basic page, I then wrap it with a template in
Dreamweaver.  It's the template and homepage I'm working on just now;
this template is on the homepage as well as the individual photo pages.

http://jodi.ws is the original homepage

Could you take a look at

http://jodi.ws/test.htm (draft replacement of homepage) and
/test2.html (example photos page)
and tell me what you think.  I'm trying to improve:

Look and feel
Navigation and useability

Thanks for any comments, good and bad.

jmc

And lo, jmc didst speak in alt.www.webmaster:

> Could you take a look at
>
> http://jodi.ws/test.htm (draft replacement of homepage) and
> /test2.html (example photos page)
> and tell me what you think.  I'm trying to improve:
>
> Look and feel
> Navigation and useability

Neither the new or the old design fit in my preferred viewport width,
which is between 760 and 800 pixels wide.

Having all of the graphic location links above the fold (within the first
650px of height) would be a huge navigation bonus for me, and anyone who
still has a viewport size of around 800x600.

Actually, I like the eye-catching new top bar and links, but the rest of
the new design looks a lot "looser" and more "messy" than the original.

There are five different text/link colours used on the page in total.
Consider pruning the theme down to one colour for all plain text and one
for all links, plus one other colour for your "Possibly one of the
biggest..." header if necessary.

Grey

--
The technical axiom that nothing is impossible sinisterly implies the
pitfall corollory that nothing is ridiculous.
- http://www.greywyvern.com/orca#ring - Orca Ringmaker: Host a webring
from your website!

Suddenly, without warning, GreyWyvern exclaimed (19-Sep-05 10:05 PM):
> And lo, jmc didst speak in alt.www.webmaster:
> 
>
>
> Neither the new or the old design fit in my preferred viewport width,
> which is between 760 and 800 pixels wide.
>
> Having all of the graphic location links above the fold (within the
> first  650px of height) would be a huge navigation bonus for me, and
> anyone who  still has a viewport size of around 800x600.
>
> Actually, I like the eye-catching new top bar and links, but the rest
> of  the new design looks a lot "looser" and more "messy" than the original
.
>
> There are five different text/link colours used on the page in total.
> Consider pruning the theme down to one colour for all plain text and
> one  for all links, plus one other colour for your "Possibly one of the
> biggest..." header if necessary.
>
> Grey
>
The new version should fit 800px across, though I did forget to code for
the viewport.  I hadn't really thought about the too many colors
(colours) of text, I'll have a look at that as well.

Glad you like the top bar and links.  I thought the links in the
original were a bit too big, and the left nav redundant, stealing space
better used for pics for those with smaller resolutions.

Incidentally, I have no idea if I have one of the biggest personal image
collections on the 'net or not.  I haven't found bigger (I don't know
the image count, but the site is pushing 800MB).  I'd taken it out of
the new copy, but one of my best customers (ok, my Mom) thought it was
cool and wanted me to put it back.  I need a better tagline though :)

jmc

jmc <NOnewsgroupsSPAM@NOjodiBODY.HOMEus> writes:

> Incidentally, I have no idea if I have one of the biggest personal
> image collections on the 'net or not.  I haven't found bigger (I don't
> know the image count, but the site is pushing 800MB).  I'd taken it
> out of the new copy, but one of my best customers (ok, my Mom) thought
> it was cool and wanted me to put it back.  I need a better tagline
> though :)

Your competition includes <www.bostonbaden.com> (used to be hosted
here, but now using Dreamhost commercial hosting).  Also perhaps
<olegvolk.net>, also formerly hosted here, and when we were specing
out the move to Dreamhost we figured Oleg needed 7GB storage (but I
still think he has vestigial copies of old stuff hiding in directories
that now can't be reached).

My own collection on display, merging the snapshots and "real" photos,
is currently at about 7500 images, about 440MB, so you're well ahead
of me (it looks like your images are mostly smaller than mine, so the
ratio of sizes suggests you have *more* than twice the number of
images up that I do).  (URLs in the sig, third line "Pics:").
--
David Dyer-Bennet, <mailto:dd-b@dd-b.net>, <http://www.dd-b.net/dd-b/>
RKBA: <http://noguns-nomoney.com/> <http://www.dd-b.net/carry/>
Pics: <http://dd-b.lighthunters.net/> <http://www.dd-b.net/dd-b/SnapshotAl.../dragaera.info/>

jmc <NOnewsgroupsSPAM@NOjodiBODY.HOMEus> writes:

> http://jodi.ws is the original homepage
>
> Could you take a look at
>
> http://jodi.ws/test.htm (draft replacement of homepage) and
> /test2.html (example photos page)
> and tell me what you think.  I'm trying to improve:
>
> Look and feel
> Navigation and useability
>
> Thanks for any comments, good and bad.

My biggest objection is that the width is fixed; if I have a narrower
window than that, I have to scroll horizontally, and if I have a wider
one I get no benefit from it.  This is a nearly-universal fault in
commercial photo album solutions, so you're by no means alone in
having this problem.  I spent considerable time getting the thumbnail
page to do what I want in my sites (third line of sig; "Pics:"
below).  I see that the homepage old-style at least takes advantage of
extra width if available.

Given that many people still run a 1024x768 screen, but some like me
run 1600x1280 and larger (plus, in my case, a secondary 1280x1024
monitor), there's just no good one size fits all.  Not that I run a
browser window full-screen except in dire emergencies anyway.

And, I'm sorry, and perhaps some people are great friends with Rudy
the singing pony, but I've never met him before, and to me he's just a
piece of animated distraction messing up my screen.

In the old style image pages, I don't like the image butting right up
to the top border of the cell it's in (I see you fixed this in the new
format), and I don't like the variety of backdrops or some of the
backdrops themselves.  It's also unfortunate that the caption
information disappears when you click through to the bigger version of
the picture.

It's nice to see the EXIF data still in the image files; sometimes I
wonder about the lighting conditions, and knowing the ISO and exposure
settings is useful to me.  (I only tried a couple of files, so I may
have just gotten lucky and found ones you forgot to strip I suppose.)

In the new design, I like the top bar with the image collection.  I'd
want the title larger; maybe not superimposed on the title bar, or
maybe done in larger semi-transparent letters so it doesn't completely
obscure what it's over.  I generally like the use of space on the
homepage better in the new design -- devoting it to information on
sets of photos, rather than to some fairly generic text as you did in
the old version.

I think you're right to reduce button sizes -- I run a higher screen
resolution than most people, and they look too big even on my screen.

I also think you're putting up too high quality photos; 640x480 images
coming out over 100k routinely means too high-quality a jpeg level.
In my experience I can reduce a couple of notches from what you're
probably using and not see the difference.

Hope any of this is of some use to you!
--
David Dyer-Bennet, <mailto:dd-b@dd-b.net>, <http://www.dd-b.net/dd-b/>
RKBA: <http://noguns-nomoney.com/> <http://www.dd-b.net/carry/>
Pics: <http://dd-b.lighthunters.net/> <http://www.dd-b.net/dd-b/SnapshotAl.../dragaera.info/>

Suddenly, without warning, David Dyer-Bennet exclaimed (20-Sep-05 12:16 AM):
> jmc <NOnewsgroupsSPAM@NOjodiBODY.HOMEus> writes:
>
> 
>
>
> My biggest objection is that the width is fixed; if I have a narrower
> window than that, I have to scroll horizontally, and if I have a wider
> one I get no benefit from it.  This is a nearly-universal fault in
> commercial photo album solutions, so you're by no means alone in
> having this problem.  I spent considerable time getting the thumbnail
> page to do what I want in my sites (third line of sig; "Pics:"
> below).  I see that the homepage old-style at least takes advantage of
> extra width if available.
>
I do have some people who are regular visitors and use 800x600
resolution; I'd prefer to code my pages to 1024 but want to make my site
more useable for those who need bigger resolutions due to vision
problems.  I'm still somewhat new at this; I'm a bit flummoxed as to the
best way to do my page banner to look its best no matter what the screen
resolution.  Do I center it?  Make it bigger/longer?  Leave it where it
is, on the left? Options I'm missing?

> Given that many people still run a 1024x768 screen, but some like me
> run 1600x1280 and larger (plus, in my case, a secondary 1280x1024
> monitor), there's just no good one size fits all.  Not that I run a
> browser window full-screen except in dire emergencies anyway.
>
I use 1280x1024 myself; I was led to understand that for best
accessibility, to code for 800x600.  Though I'm not particularly happy
with restricting the width either, but I thought that looked better than
a 800px width banner with a 100% width body, for those with better
resolutions.  Could be wrong though.
> And, I'm sorry, and perhaps some people are great friends with Rudy
> the singing pony, but I've never met him before, and to me he's just a
> piece of animated distraction messing up my screen.
>
Well, he's been my mascot for many years now.  I suspect my best
customer (ok, my Mom <g> ) would miss him if he was gone.  He's the only
bit of animation I use.  Is he really that annoying?  I'm so used to the
little guy, don't even notice him anymore.

> In the old style image pages, I don't like the image butting right up
> to the top border of the cell it's in (I see you fixed this in the new
> format), and I don't like the variety of backdrops or some of the
> backdrops themselves.  It's also unfortunate that the caption
> information disappears when you click through to the bigger version of
> the picture.
>
That's because I don't have the time to build a separate page for each
image, which I'd have to do to keep the caption information.  Any
suggestions?

> It's nice to see the EXIF data still in the image files; sometimes I
> wonder about the lighting conditions, and knowing the ISO and exposure
> settings is useful to me.  (I only tried a couple of files, so I may
> have just gotten lucky and found ones you forgot to strip I suppose.)
>
Um, giving me more credit than I deserve there - I never considered
stripping out the EXIF info.  What are the reasons to strip the data?

> In the new design, I like the top bar with the image collection.  I'd
> want the title larger; maybe not superimposed on the title bar, or
> maybe done in larger semi-transparent letters so it doesn't completely
> obscure what it's over.  I generally like the use of space on the
> homepage better in the new design -- devoting it to information on
> sets of photos, rather than to some fairly generic text as you did in
> the old version.
>

> I think you're right to reduce button sizes -- I run a higher screen
> resolution than most people, and they look too big even on my screen.
>
Of course, I have another tester who said the buttons were now too small
:)  Can't please everybody, I guess...

> I also think you're putting up too high quality photos; 640x480 images
> coming out over 100k routinely means too high-quality a jpeg level.
> In my experience I can reduce a couple of notches from what you're
> probably using and not see the difference.
>
That, I can fix.  I hadn't really considered that either, just kept the
resolution down so that they aren't candidates for theft.

> Hope any of this is of some use to you!

No, this is terrific, just the sort of thing I'm looking for!  Thanks
Bunches!

jmc

jmc <NOnewsgroupsSPAM@NOjodiBODY.HOMEus> writes:

> Suddenly, without warning, David Dyer-Bennet exclaimed (20-Sep-05 12:16 AM
): 
> I do have some people who are regular visitors and use 800x600
> resolution; I'd prefer to code my pages to 1024 but want to make my
> site more useable for those who need bigger resolutions due to vision
> problems.  I'm still somewhat new at this; I'm a bit flummoxed as to
> the best way to do my page banner to look its best no matter what the
> screen resolution.  Do I center it?  Make it bigger/longer?  Leave it
> where it is, on the left? Options I'm missing?

The whole concept of coding to a fixed page size is, IMHO, bogus.
There are a *few* places where you have to consider it directly --
especially when presenting photos (a 300x200 photo is quite small on
my screen; an 800x600 photo scrolls both dimensions on some people's
screens).

I make use of max-width quite a lot in my CSS, and occasionally do
*interesting* things to the headers.  Look at the behavior of the
headers on <http://ellegon.com> as you change window size, for example
(couple of other things broken right now, but the headers are doing
the right things).  I don't propose that as a universal solution;
there is no universal solution, you have to think about each design
and try to find something that works.

Similarly, in my photo gallery at
<http://dd-b.lighthunters.net/gallery/> note how the
thumbnails (or directory links) rearrange to work in different window
sizes.  A very different solution -- and one that cost me a LOT of
time fighting with CSS until I got it working adequately in all the
major browsers of the time (I think it's still okay).
 
> I use 1280x1024 myself; I was led to understand that for best
> accessibility, to code for 800x600.  Though I'm not particularly happy
> with restricting the width either, but I thought that looked better
> than a 800px width banner with a 100% width body, for those with
> better resolutions.  Could be wrong though.

As I said, too narrow a view I think.  Trying to code for the web as
if you're designing on a piece of paper rarely works out well.
 
> Well, he's been my mascot for many years now.  I suspect my best
> customer (ok, my Mom <g> ) would miss him if he was gone.  He's the
> only bit of animation I use.  Is he really that annoying?  I'm so used
> to the little guy, don't even notice him anymore.

Often he's off the bottom of the screen, not annoying *at all* then.
If he's personally important, then he has a reasonable place on a
personal website.
 
> That's because I don't have the time to build a separate page for each
> image, which I'd have to do to keep the caption information.  Any
> suggestions?

I eventually broke down and wrote a cgi to handle it for my albums
(both photo gallery and snapshots; urls above and in the sig).  That
seems to be how Chaz is doing it at
<http://www.boston-baden.com/hazel/Pix/>, too.  Another approach is to
have a one-time script produce static html pages encapsulating each
photo when you generate the gallery.

Basically, the solution to "time to build" is "get the computer to do
it" :-).
 
> Um, giving me more credit than I deserve there - I never considered
> stripping out the EXIF info.  What are the reasons to strip the data?

File size and hence bandwidth (but it's quite small, so these days
that seems like maybe optimizing a triviality).  The related IPTC data
can possibly give away things you don't want to publish on the web,
depending on how much captioning and personal identification info you
put into your files (none that I found, in your case).  Some people
may, in addition, want to conceal the camera they used or other
technical details.  People who badly want to suppress the information
are often IMHO kinda kooky on the subject, but it's their choice.  I
can see it as important to suppress camera and exposure info if you
were testing to see who could visually spot the differences, for
example, or in some other kinds of situations; even to avoid the
discussion focusing on technical trivia if you really wanted to
discuss something else about the photo when you posted it.
 
> 
> Of course, I have another tester who said the buttons were now too
> small :)  Can't please everybody, I guess...

Ah, you have learned the first rule of web design :-).
 
> That, I can fix.  I hadn't really considered that either, just kept
> the resolution down so that they aren't candidates for theft.
> 
>
> No, this is terrific, just the sort of thing I'm looking for!  Thanks
> Bunches!

My pleasure, always willing to bash around some opinions.
--
David Dyer-Bennet, <mailto:dd-b@dd-b.net>, <http://www.dd-b.net/dd-b/>
RKBA: <http://noguns-nomoney.com/> <http://www.dd-b.net/carry/>
Pics: <http://dd-b.lighthunters.net/> <http://www.dd-b.net/dd-b/SnapshotAl.../dragaera.info/>