Best way to make a web site… CSS!

I got a message from John at the Wayne County Arts group and he’s been tasked with updating their web site. It had been created a while back in Adobe GoLive. He commented on liking my site (above) and so here’s what I said. This mostly applies to small organizations and self-employed folks like me. It also requires some interest in graphic design, or you can make a crazy-ugly site… and we really don’t need more of those, do we

Here’s a good site about what’s possible with CSS, CSS Zen Garden. Both examples above have the exact same content, but use CSS to style them radically different. On the Zen Garden site, you can click to see for yourself all of the submitted CSS designs. It’s amazing. An example of CSS on this site is the design squares at the top left. Clicking on those change the background design, and could change the entire site if it was coded to do that.

I had used GoLive before I switched over to a CSS workflow. GoLive is gone and Dreamweaver is the current product from Adobe.

Now, those pages can be as beautiful or as ugly as the person’s skill. The two aspects are using a good graphic artist in the design and then someone who can make stuff happen via the options and coding (sorry if you already know that, just trying to be thorough). So to do it with Dreamweaver, you can work visually, not just hardcoding… drag images in and use the options/code to create links with images, etc. I’d guess that’s what was done with the county site.

The easier way is with CSS templating. I’m on Mac and use RapidWeaver.
You can create some really elegant pages, simply using template they have and that you can buy and add on.

It’s still possible to make a dull page, but you folks should have access to graphic designers that have worked enough on the web to steer you right. It’s more likely to create a site that looks like it’s from a template, so you have to fight that as well. BUT it’s easy to create a pretty powerful site quickly.
I suggest that young photographers look at lots of really great photos to learn what world-class work looks like. The same is true on the web. Search for sites that are in your industry and find the ones that are truly functional, useful and elegant. Then figure out how to steal (ah, I mean implement) those aspects of great sites into your site. Not making your site a rip off copy, but learning from what works and what is beautiful about the design and finding how that can work for you… just like in photography or your personal art!

I’d suggest that people use Dreamweaver because they are pros and want total control and all of the options. They should use CSS based solutions if they don’t want the hassle, or like me enjoy mixing tweaking the code with the ease of design.
Another CSS setup on the Mac is iWeb from Apple (free on every new Mac and wonderful).

There are other options… modifying a blog setup to be your web site (might not be as practical for an Arts site, but it could work, and could allow artists to write in now and then blog-style). Also there are just plain online templates you can buy and fill. One thing not to do is use Microsoft Frontpage if it still exists… it’s know to create nasty sites in many ways.

Oh, one final consideration. One that we bump into with our church web site… the way I create my site is great, but it’s hard to be modified by a group of people. Really it’s just meant for all changes to be made from the computer that created it (there are ways around this, but that’s for another show…). So if the goal is just to create a site that others will change on an ongoing basis, a CSS site sitting on your home computer might not be the best solution. If you are willing to make changes, (or willing to learn and implement the plug-in that allows changes to RapidWeaver sites via the web)… then you’d be OK.

Hopefully that’s a helpful walk through the web maze for anyone interested in creating their own site, or who wonders what tools I’m using to do my site and my blog.

High Quality Big Prints

I have a friend that attended one of my classes and was working on making enlargements of his digital photos for an art show. He asked how to ensure the prints had good quality up large… what numbers in Photoshop would ensure a good large print??

Here’s what KodakGallery Recommends:

In Photoshop, I would suggest 225 PPI/DPI is very safe at the size in inches you’ll be printing… so is Photoshop shows you can be at 16×20″ @ 225 PPI, then you are good.
From practice I know you can go much lower, but I try to not drop below 200 PPI @ the final print size just to be safe. The Kodak info above is quite a bit lower than that, and they are a lap that will make the prints with that minimum. What they say for 16×20″, in Photoshop works out to be 6×9″ @ 200 PPI… once again, these are their ‘minimums’.
If I want to go really big on a photo, I use Genuine Fractals.

But that’s $150 investment.

And you can upsample the image in Photoshop, but using GF is a somewhat higher quality. If you start with a very nice file, with very little artifacts (like film grain), you can go huge in GF. That’s with a low-compression JPeg or RAW file. If you took a tiny JPeg, that was highly compressed in the camera, and maybe wasn’t the sharpest file to begin with, any upsampling to give it more pixel resolution won’t really help.

‘Resampling’ is a checkbox in the Photoshop menus, Image Menu/Image Size. I tell everyone when they are changing a photo for most uses going bigger to have the ‘Resampling’ box unchecked, so that the image quality won’t suffer. You would leave it checked to have Photoshop add some fake pixels to try to make the image have a bit more resolution to print better at a large size. Genuine Fractals is a Photoshop add on that is designed to do the same thing, just a bit better.


As a side note, if you are making an image smaller, you leave the ‘Resampling’ box checked, as you are throwing away pixels and if you don’t have it checked, you are not really making the file size smaller (like for the web, or an e-mail photo).
Your best bet is to just do a test print early at the size you want to use and see how it looks. Maybe one with the normal file, and one with a resampled file to get to 200PPI@ the print size… and see how they compare. Let me know how a test like that goes.

The last point is what sort of camera you use. A file from a digital SLR of any price is much more likely to handle upsampling better than a file from a little snap camera. I discuss that in my class, but the image sensor is soooo much bigger and better in the SLRs (the bigger cameras where you can change lenses), and they invest a lot in how they compress the Jpeg files.

Photo Usage Rights

This is a huge topic with clients; here are some thoughts I shared recently:

FYI: I don’t want to argue with lawyers, but I’ll just give you my understanding of it… just my opinion, don’t sue me

They always say that photo rights are on a sliding scale of ‘Location’ and ‘Usage’… the more public the location and the more ‘news’ the usage, the more clear the ability to do what you want with the photo. The more private the location and the more ‘advertising’ the use, the more you need signed permission. You have to decide on how far the balance is tipped in each situation.

This is pretty consistent with what my clients do. At the biggest college I work for, we don’t get photo release permission forms on anything during Reunion. And those photos go up in several online galleries.
We do get them when I photograph in a hospital (no surprise… not ‘public’, very private and with HIPAA rules) and I’m sure the Marketing team gets them for the Billboards and ads (which I don’t take the photos for).

What shots don’t need releases?

There is a point where the group is large enough in a photo, that a release isn’t expected. If it’s a very public event, and a very wide shot of the crowd with no real main subject focus, you would be less apt to be told to get a photo release for fairly ’safe’ uses, like promoting the event next year, etc.

And let’s not forget the classic ‘no faces showing’ option, where people are only seen from behind. When done well, you don’t even think about it.

(in this photo, the only face showing is a staff member)

But the lawyers!

It’s totally possible that lawyers might say that you must have every single photo released before using it in any fashion… but that would be crazy and impossible to do on a large scale event. But a lawyer’s job is to play it super-safe and they may not think through the implications.

I’d estimate that getting permissions would cut the number of photos by a factor of 10 and add one or two workers to follow me. Imagine getting the form from every subject in groups taken on the run. I’d be holding things up and being a pest. Really, I’d just have to focus at each event on 2 or 3 good shots, and not get the other 20 things I get. And that becomes a decision you’d have to make.

We did releases once for a brochure (so it was marketing use, not news), at a very public event and it was so crazy, I’d think twice before doing it again… or more likely would change what I attempted to do… and for that shoot, I had 2 helpers getting forms signed.

Hope that helps explain the difficulties of a system of having every photo taken having a signed release at every public event.

Slaved Flash for Snap Cameras

I’m always teaching people that the weak link in any small snapshot camera isn’t the image quality, it’s usually the flash power. People take flash photos all the time and the shots turn out ugly from low power, or just the awful placement of the flash by the lens (red-eye anyone?!). I started in digital with some snapshot cameras (still $900 back then!!) and a good flash, and you wouldn’t have known I was using a snap-level camera.

So this is a good idea… a relatively inexpensive slave flash that bounces (shoots light into the ceiling for really pretty, soft light).

I haven’t tried it yet, but there’s not much to worry about. It will fire along with your camera’s tiny flash but with more power and nicer quality. One issue you might have is ‘double flash’ showing, where you can sort of tell by two sets of shadows that you used two flashes. If that happens, just get some little softening material (even a tissue folded over, or some frosted plastic) and use it to make your camera’s flash output enough to trigger the slave, but not so much that it has a big effect on your image.

And for really tough shots like group photos, or subjects a bit away, you’ll never see your tiny on-camera flash anyway (which is why you bought a big slave flash in the first place!).

And it opens up the possibility of creative lighting, but using it as a flash even more off-camera for different lighting effects, as noted here.

Mac Screen Capture

My friend Paul asked about the best Mac Screen Capture.

Built into the Mac are some pretty good options (Command-Shift-3 for grab screen and Command-Shift-4 to get a selection crosshair to drag around anything you want a capture of.) BTW, when you are in the Crosshair mode, you can hit the spacebar and get the Camera, where you can then just hover over screen windows and they beautifully autoselect (even the dock and menus).

The next step up, which I bought when I started teaching and writing so much is Snapz Pro X. It has a ton of options and you can save other places that then Mac built-in default of the desktop. The big upgrade is drop-shadow on grabs and the ability to grab video, so any thing that can appear on your Mac’s screen can be recorded.

The new software is LIttleSnapper, and we’ll see when it finally releases, how it’ll be different… They are blogging up a store and there’s a demo movie on their site. It’s from the same people that make my web creation software (RealMac’s RapidWeaver), so it’s bound to be good.
Happy snappin’!

Web Hall of Fame

Since I was so hard on organizations not using photos quickly on the web, here are some examples of clients doing big things right on the web.

RIT Reunion:

For a number of years now, RIT has let me run with this idea of a ‘Virtual Reunion’. We post photos throughout the weekend to a site I create and this year I tested this new interface where comments can be left, photos can be sent as e-cards, music can be played, etc.

Results: 3061 Unique Visitors (not ‘hits’ or counting people twice, actual different people). More people saw the photos than attended Reunion.281,000 Page views… that’s huge. My normal would be around 6,000 for a week.

For the ImagineRIT event, my Associate Ron Cronk and I did the same thing with big results:Over 3000 viewers on Flickr (over 20,000 image views of any sort on Flickr… not counting people just seeing the slide show on the RIT site
To my web site’s ImagineRIT Gallery:Over 1100 unique visitors in 3 daysOver 13,000 page views
OK, less chatter from me and more examples to inspire you…

Harley School:

They have a system built into their new web site design and can easily upload my photos. Under the ‘News & Events’ Menu, click Media Gallery.

UofR:

I do online slideshows like this for my top clients (that I know will share them), and the UofR does a great job of promoting what I’ve done. The Wilmott Cancer Center and the UR School of Nursing particularly promote when I create online photo content for them. I see people visiting these shows for months after an event.

One very telling thing is that I see that many people will Google the name of a major event, or the organization and will find my site with these shows… so if your attendees are looking that hard for the photos, you know eventually all client web sites will be set up to show off things like this.

RIT (Again!):

Innovation must be in the water at RIT, because they let me try so many things and they really run with new ideas.

RIT hosted a cool conference for kids in elite science and tech high schools. I covered the event and they wanted my photos right away for a dinner slide show and they paid me to create this online component. I even did this wild 3-D gallery as part of it, figuring tech kids would enjoy the fun interface.

Thanks so much to all of my clients that have been so supportive of these projects… this kind of display of my best work really gets me excited and I think is a ‘Wow’ for event attendees.

Homework: How can you use these ideas with your photos at your next event? What IT person can you befriend to get support to put photos up right after an event, rather that weeks later when no one is looking any more? What can you change with your next web redux to make a space for simple (but elegant ala Harley School) galleries.