Introduction
So,
you want to start a website on your favorite artist.
Are
you nuts?
Don't
answer that, but let's assume you can't be stopped. Let's further say
you’ve been through the JSS Virtual Gallery and like what you see. And
you are really seriously thinking about putting together something like
this on your own favorite artist and want to pick my brain. OR (better
yet for me) you know a bit about website building and computer coding
(had the benefit of some classes or a degree in the field) but want to
know where I am on the huge continuum of universal understanding.
<grin>
Let
me put the latter question to
rest – I know next to
nothing about web design. The operative words here, I suppose, are
“next to” as
obviously I know "something"
about web design. The problem is I know just
enough
to be dangerous. To hold myself out as a model of new virtual galleries
might
not be a good idea, although I’m very
supportive of the idea but more to that point later.
Having
given my caveat of ignorance, I’m convinced there is
a great deal of merit to opening some form of dialogue between
interested
parties. I realize that even with my limited ability, and with the
input of
others, that possibly there might be some insight which could be
helpful.
Understanding
the scope
How many hours did this take? A letter from Jacques L'Heureux (Wed, 03
Nov 2004):
I am working
on a similar project but with much fewer items and not a so well know artist. We
are just getting
started. Our website is at jeantabaud.com.
Could
you give
me an estimate as to how many hours have gone into your Sargent website
(coding, figure preparation but not including the research).
Thanks,
Jacques
It
was impossible to really answer Jacques' question in any meaningful
way, as the
scope of work
I have invested here spans over six intense years, and is into the
thousands (plural!!!)
of hours. Since both the coding, learning to code, and the research
happened all together -- for me it is hard to split them out.
But take a look at what Jacques’ been able to do
just since
November of 2004. It’s quite a nice looking website and I suspect he’s
using Dreamweaver (which is a package program) that let’s you automate
a lot of the web loading and design.
David Hyde, in his essay says: “To prepare [one
webplate for a gallery] where some image manipulation is required,
takes about three hours – even though I use a basic template.”
That seems excessive, even to me. Maybe I just don’t want to face the
ugly truth. My natural inclination is to downplay the amount of time
involved – half out of embarrassment that I can’t do it any faster.
Given the consideration of the inevitable snafu, coding
problems, program problems David's estimate might be a pretty fair
appraisal of the
time you'll be investing.
Virtual Galleries
– what
works and what doesn’t
To
be honest, I haven’t done a lot of web surfing recently
and so there are probably a lot of neat ways of doing things now that I
haven’t
even seen. I guess I can only speak for myself, but I have given this
some
significant thought on what I wanted to accomplish. So in understanding
my
evolutionary thought, I want to take you briefly across the spectrum of
art
websites that I greatly admire and point out the things I think are
outstanding
and the things I find limiting. In this way I hope to show you why I
have done
what I’ve done.
Computer
Database Designs
Computer
programming and databases have made some
significant progress in getting huge amounts of information and images
of
paintings online. I should quickly point out that I know very little
about them
(I’m trying to learn more), so I can only speak from a user’s point of
view. Individual
coding of individual pages, and/or using an HTML editor (like I’ve
done) is clearly a thing of the
past.
More and more of the big museums are moving to the Database Systems of
presenting their collections -- how wonderful is that? Clearly this is
the
future. If I were starting over from scratch, this is the way I would
be
thinking. Let’s take a look at some:
As
wonderful as database designs are, the restrictive
nature of standardization is very limiting in what you can do when a
database spits out the images to be married with any kind of narrative
text -- or at least it's been limited thus far. To try and
explain the problem, as I see it, let me try and define the two main
components of an art website as I understand it. They are 1) Thumbnail Pages and 2) Webplates.
Thumbnail
Pages
Thumbnail
Pages are kind of an index from which the visitor branches to
individual works of art. Once you get past the front page, the problem
is how are you going to present the art.
Most choose to do it with small thumbnail images which give the viewer,
in an instant, an idea of whether he/she wants to learn more about that
piece of work.
Here
is one of my Thumbnail Pages
Here
are some examples of other sites I GREATLY ADMIRE:
- The Museum of Fine Arts, Boston
Thumbnail, Name, Date and Serial Number. Maybe
not the
prettiest thing, but it works VERY well. All database driven
- The Vincent van Gogh Gallery David Brooks
has done some amazing stuff here. He won’t answer my inquires as to how
he’s put this together, but I’m guessing he is using “Access” which is
a Microsoft database that can spit out “Data Sheet” pages that look
like spreadsheets like this. It is a very clear way of organizing
information. Most people understand spreadsheets.
- Web Gallery or Art Again, another “spreadsheet”
type – it has a bit more “style” though – both I like.
- Art Renewal Center I never tried to write them, it
is such a huge website and I just assumed any kind of personal contact
between webmasters is out of reach. Early on I think they were building
these pages by hand but I assume this kind of thumbnail page has been
moved to a Database design. It’s very straight forward. My website was
underway before I found them, but what I like about this kind of design
is that you get the documentation along with the thumbnail. To my
tastes it’s a bit more appealing than the spreadsheet.
- Online Pablo Picasso Project Though I was never
able to get Enrique Mallen, Ph.D, Professor at A&M University, and
creator of this site, to ever answer any of my e-mails, I’m guessing he
is using programs such as DreamWeaver or Adobe Photoshop which will
automate the thumbnail process in a click of a button and dump a full
page of thumbnails with links already done onto one page such as this.
What
you do is put all your images in one file folder and the point the
program to the file-folder. Within seconds it will spit out a thumbnail
page along with Webplate pages that takes me weeks if not months to
build. It’s really quite amazing and I’m a little bummed that I can’t
get him to share how he’s done it. Obviously it’s some kind of database
behind it that populates both the thumbnail pages and the Webplate pages.
I know Dreamweaver and Adobe takes the
file name and use it as the title with a link -- it's a bit cryptic --
as you
can see. It would be easy to tweak or
refine to what you want.
Although you can upload huge amounts of paintings which automatically create thumbnails (I make all my
thumbnails by hand), I never liked the way Adobe and Dreamweaver uses the file name as the caption.
Still, in Enrique’s case, he has done so much with this design that I
really admire -- especially given the amount of works of art he has to
deal with.
- Frank Hyde Virtual Gallery David Hyde is the
creator here and I know him well from conversing through e-mail over
the years. He is a Friend of the JSS Gallery and has modeled his
design, in part, off of what I have done with the Boston Public Library pages. It’s all hand coded –
based on the style of web-frames. What I really like about this design
is it give you BOTH the Webplate AND the Thumbnail
Pages right in front of you. This “Frames” idea is nothing new, but you
know what – it works well as a design element for art websites because
it is so intuitive. David’s site is not Database powered.
- Charles S. Hopkinson Virtual Gallery: built by
Arthur Saltzman, again another friend of the JSS Gallery. He gives us a
kind of “contact sheet” thumbnail page that you can view art by
different types. This happens to be of Self-Portraits. If you look at
the top of the page, you will see links to other Contact Sheets. Arthur tells me
he's done all this using Photoshop -- here.
There
are probably endless variations of showing thumbnail pages but this
gives you some of the basic types I sort of enjoy and why i enjoy them.
My Thumbnail Pages are not database powered either and this is a huge
drawback, but unlike what databases can give you, I’ve worked really hard to show somewhat
of a narrative to the thumbnails which suites my objectives perfectly.
I don’t know how to marry a database to this kind of thumbnail
presentation, nor have I seen anyone else do it.
Webplates
This
might be only my terminology (I don’t know) but what I mean is the
referred page on which the features Artwork is
shown. It is here (Webplates) where you are
taken from the Thumbnail Pages to the full image of the work of art.
Some sites choose to disregard “Webplates”
all together and just give you a link to the image source – like this (link). I believe this is a mistake. Sure, it’s a
fast way of presenting the art and it will save you a ton of time, but
I believe it’s very important to keep the documentation with the large
image as much as you can.
Let’s
take a look at one of my
basic Webplates.
There are 4 elements to one of my Webplates.
Right
now this is set up as a single template on one page from which I add
paintings. What I hope to do (using databases which I'm learning) is to
split these 4 elements and automate some of it. Here are the four
elements
- Webpage
title with menu bar
- Painting
plate
- Text
which includes documentation, narrative, notes and thumbnails to other
places.
- Footer
giving JSS Gallery monogram, creation date, update, and copyright
Right
now, only part of the footer is automated using javascript. I think
there is a way to automate the Webpage Title and Menu Bar with
javascript but I haven’t figured it out yet. The Painting plate and
Text portions I’m hoping I can link with a database. Building the pages
would then be all about plopping in the images, name, date, source,
size etc in some sort of spreadsheet type form and the database would
populate the page; but this is all dreaming right now – Man would I
love some art loving professor of computer programming to assign a
class to help me out – hint -- hint.
Let’s take a look at how other sites treat Webplates.
- The Museum of Fine Art, Boston This is a pretty
straight forward Webplate that has all the basic 4 elements that my
Webplate has: 1) Title-links, 2) Painting-image, 3) Text-Documentation,
and 4) Footer. It's a bit jumbled around but they are all there.
I’m guessing here, as I can’t read minds, but I think the design idea
was to show all the four elements on one screen without the viewer
having to scroll down – this is something they pound in your head on
good webpage design; and they’re always telling you if you don’t do it
this way it’s not professional. Harvard, The Metropolitan Museum of Art, the Fine Art Museums of San Francisco, they all do
this – it’s classic textbook stuff. Personally, I think this design
thinking is all upside-down.
Think about it. What is the NUMBER ONE desire of an art lover
viewer or reader (Given that they have already taken the time to click
through a thumbnail) Isn’t their desire to see the largest/best image
of the painting -- to fill their screen without being cropped?
Primarily isn’t that what they/we all want first and foremost? Why make people click yet again at some
intermediate size image to reach what everyone wanted in the first place? And what’s wrong with scrolling down for some documentation – especially if you have the
documentation at the Thumbnail page? This is just my opinion, of
course, but trying to show how I arrived at my design.
It’s the
LOVE OF THE ART -- first and foremost. All that
librarian / scholar mumbo-jumbo (though very important and fun detail)
all that textbook hoopla of what’s proper and correct web-design is a
sad second cousin to the image of the art. – FILL THAT SCREEN,
MAN with the best image of the art possible within file-size
limitations.
- The Vincent van Gogh Gallery Again, all the four
elements present. The “Next Painting,”
“Previous Painting” links are a neat feature. If I do something like
that I have to manually copy the link on each page – but with a
database it’s done automatically.
- Web Gallery or Art If you click on
one of the thumbnails, it takes you to a zoomable image -- which is
kind of neat – Personally I prefer it my way.
- Art Renewal Center Tremendously wonderful site.
They have very large thumbnails so I guess they think they’re covered
on the documentation. For me, same answer as Web Gallery.
- Online Pablo Picasso Project As far as I’m
concerned this is near perfect. It has three of the four elements of a
Webplate that I think needs to be there. I just think he has really
missed an opportunity to also include a more lengthy text along with
the image, the text and narrative in this site is off buried by itself,
and looses me.
- Frank Hyde Virtual Gallery
David has the title at
the top of the page, with his links at the bottom, and there is such
richness in narrative that accompanies the image. He has taken
everything that I think is best about a Webplate -- it’s Perfect,
perfect in every way (LOL). Just top rate stuff. He’s even
managed to
get some music online to go with the lyrics of the song from which the
panting is based! Bravo! That’s EXACTLY what I’ve wanted to do
with my El Jaleo,
but I never got around to it – and then there’s the problem of getting
permission. He’s gone with a copyright free version, I'm hoping to get
permission from an artist for one great Flamenco piece.
Anyway,
I'm getting distracted. The
problem is
he, like me, does this all by hand (he more so than me) and it takes a
lot of time. Actually I use some HTML programs that helps speed things
up -- but more on that later.
Working with Images -
understanding the problem
The
Full Painting
The
most imortant thing in a virtual gallery is it's images of the art. You
can have the most fancy looking website with flashy graphics and cool
designs but if the images of the art are small or poor -- what's the
use?
Now
the textbook argument for doing
it by the book, besides having all the info on one screen, is that you
don’t want the viewer to have to wait on some large image to load. An
intermediate
size image gives the viewer a chance to progressively decide to move
forward.
That’s
all well and good for some business application, but it doesn’t work
for an art
website – not any that I like going to. If you give the viewer a large
enough
thumbnail to begin with (currently I’m sizing mine around 200 pix at
the
largest
dimension) you can pretty much tell what the painting is by its
thumbnail. At that size it comes down to this:
Do they want to see the painting, or
don’t they?
If
they want to see it – then give
it to them!!! In the days when I was
surfing at 56K from a dial-up modem I was fully willing to wait on a
large image to load if
and when
I trusted the webmaster to give me what I was wanted. That progressive
stuff –
you spend all your time loading pages.
How
large should the image
file-size be for a painting? With the sophistication of
compression programs there isn’t any reason that MOST full screen
images can’t
be held to around 100k level or under.
I call (this) a
full screen image -- there is no set size -- it's just "big". Picked at randum
I
see
that
its
file
size
is
56kb.
Here is my general
thinking:
Anything under 100k, you are doing just
fine. When I start getting over 125k, I start asking myself -- just how
important is this image and should I offer an intermediate size to get
that load time down. At 150k red flags are waving and anything over
that, you better have a good reason!
The internet is a medium
of tradeoffs. Even in the world of broadband we aren't in the world of
perfection, or anything near it. The internet is the world of
the-best-I-could-do.
When it comes to
thumbnails
there are three constraints to consider
1)
Clarity
of the image
2)
Physical
size of the image
3)
File
size of the image
In a perfect world I
want a
large, crystal clear thumbnail, 200 to 250 pix at its widest or tallest
and no more than 3kb in file size – that doesn’t happen
very often so I have to settle for less, so does everybody else on the
net.
Let’s take a look:
The Museum of
Fine Arts, Boston
They have chosen to
make
their concessions on physical size, and clarity. If it’s physically
small, the file
size will be smaller and the page will load fast -- most of their thumbnails
are around 1 to 2 k in size). Now it’s all a matter
of personal preference, but I think these are too small. You want to be
able to have a pretty good idea of the painting so a viewer can make
the decision of whether to invest the time to click through to the
webplate or move on – these aren’t that bad, but I’m trying to make a
point. I don't like reading with my nose scraping against the screen.
Let’s take a look at
the
other extreme. At the Art
Renewal Center -- and I
know what you’re going to say. They have made NO concessions. They’re
thumbnails and large, bold, crystal clear, clean and beautiful – God
bless the ARC, I like their attitude but I’m afraid they have in fact
made concessions. There are only 10 thumbnails on this page and it
loads slow. Consider
my Philip
Alexius de Laszlo page with their file-size of thumbnails.
For me, here is my
thinking –
the physical size HAS to be at least 200 pix large on all new
thumbnails I'm making – that’s the third rail I will never touch or go
below. If I have to sacrifice clarity – so be it. To me a larger
fuzzier image is more meaningful than microscopic clarity.
That’s not so hard
until you
bring in file size. There are a lot of programs out there that will
create thumbnails for you -- scads of thumbnails and they will do it
almost instantly with perfect clarity, but I’ve consistantly found the
file size of these created thumbnails to be too large – my thumbnail
pages load slow enough as it is – I’m looking for 3k perfect, 4k, 5k,
6k tops – there are always exceptions, but it gives you a yardstick or
a rule of . . . . thumb-nails
Hey! You -- the one
with your
hand on the mouse! Stop rolling your eyes!
For me I want a lot of
thumbnails on a page, I want them relatively large and I want the page
to load fast -- now that's not asking too much, is it? -- I say with more than
a little sarcasm. To get that, I have worked with each and every
thumbnail personally -- sometimes
they
don't end up that clear -- here
is one. This is 4.62 KB.
I know, It makes
Sargent look
more like Monet than he is. I'm not totally convinced I've made the
right concessions -- Of late -- (it's hard for me to admit this) but
I've let my file size creep more towards the 6k level -- and I'm having
a hard time sleeping with myself.
Programs I use to build the JSS Gallery
For the moment I offer this list of programs I’m using
without much editorial as I need to get back to working on my site –
but I will finish it
HTML point and click – What-you-see-is- what-you-get -– yeah
right, more like What-you see-is-what-you-now-have-
to-spend-hours-cleaning-up) programs I use
Mozilla 1.7 – Free,
The people at Mozilla
INVENTED web browsers and they adhere to The
World Wide Web Consortium. I
use this extensively. I like it because if it works here, it'll almost
work everywhere else -- notice the "Almost"
Microsoft
FrontPage – Cost? You
pay through the nose. I hate Microsoft.
Macromedia
Dreamweaver MX – Price? Your
first born but supposedly it is the benchmark of programs – I’m trying
to learn it -- even this needs a lot of cleaning up I've notice. Very
little of my website is done with Dreamweaver thus far.
HTML Editors
EditPlus – share wear – reasonable price – A
great program!
FTP
WS_FTP_LE 5.06 – the LE version is
Freeware, works great
Image Manipulation
Adobe
Photoshop 7.0 – Price? Ouch.
But the benchmark. I use this for full size paintings and thumbnails.
There are many other programs almost as good.
Structure of the Gallery (Site Index)
Section I plan
to add
Notes:
|