Saturday, May 20, 2006

Show rejections and "no refund after acceptance" policies

This week, I received rejections for 2 of the shows I applied to (Orchard Lake and Northville). Unfortunately, the rejection letter gives you no clue why you were rejected. If I had to guess, I'd suppose it was for 1 of 2 reasons.

One likely possibility is that they were not impressed with my booth slides. Being my first year, and having to get the booth slides ready months ago, I had to hurry up and take the photos with whatever setup I had available at that time. The display definitely looked a bit unprofessional.

The other likely possibility is that they simply didn't like my choice of slides of my work. The slides I sent in were of some of my best (in my option) shots, but were in the ordinary photographic landscape style. They weren't in the abstract style or done with artistic effects (watercolor or sketched). Since these shows seemed to be more of an upper notch fine art style of show, I now wonder if sending in my more artsy shots (even though those aren't in the style I focus on) would have had more success.

Of course, there are other possibilities. Perhaps a landscape photographer is not the type of artist they envision in their shows. Or perhaps they really liked my work and thought there was nothing technically or artistically wrong, but that they had enough people who were just a notch better than me.

Whatever the reason, I now have 2 more weekends without shows. I was hoping to get in a half dozen shows this year, but now I only have 2 confirmed shows with 1 more application out waiting for a response. Now I have to find some additional shows to apply for. I guess that, for the 2 shows that are an hour or so away and thus I was unsure about applying for, I guess I should go ahead and apply for them. An hour drive is better than no show.

One of the things that really irks me about many shows is their "no refund after acceptance" policy. In an ideal world, you could pay your jury fee, get accepted, and then have the choice of paying your booth fee or turning down the show and letting someone on the wait list take your spot. However, many of the shows want you to send your booth fee with your application and state there are no refund after you are accepted.

This burned me on the Orchard Lake show. I had 2 possible shows to apply to for that weekend. Both shows had due dates in the same week. The other show had the no refund policy, and its decision date was after the Orchard Lake refund deadline. I picked the show that I thought would be the more rewarding one to participate in, and now that I've been rejected, I'm not in either show. I have a feeling I would have stood a better chance of getting into the other show.

I'd like to say "oh well, lesson learned", but I'm not really sure what I learned. The reason for my rejection is completely ambiguous, and there's really no better way I could have worked the application/refund issue.
...click here to read more!

Friday, May 19, 2006

Preparing for upcoming shows

It's getting to be a lot of last minute work getting everything ready for the upcoming shows in June (3 and 5 weeks away). At the moment, I'm working on building up inventory. I have all of the pictures I want picked out and prepared (24 of them), and each one has been framed up once, and a few also have prints matted up in other sizes. Now my goal is to get every single photograph matted up in 3 different sizes(8x10, 11x14, and 16x20), 2 of each size. In the process of doing so, I just purchased 20 more sheets of matboard, a case (25 sheets) of foam backing board, and 300 clear plastic sleeves (100 in each size). I'm going through the time consuming task of cutting up all the mats. I also purchased a roll of bubble wrap and made sleeves out of it to hold and protect my framed prints.

Still on my todo list (which grows as fast as it shrinks):
1)Order plastic bags for the customer to carry their purchased prints
2)Get some clamps to help secure the top even better in case it gets rainy/windy
3)Test out my credit card processing (I have the equipment, but I'm still waiting for the service contract to arrive)
4)Setup some sort of shelf on the grid wall, so I can use it as a writing surface when I write up the sales slips.
5)Continue working on the inventory.
6)Do a trial run with my wife for setting up the whole display.
7)Create a list of all materials to bring to the show.
8)Buy or build my display bins for the prints
9)Get some sort of cart to help carry things back and forth from the car to the booth
10)Make certificates of authenticity for the prints
11)Make business cards.
12)Remember what else I forgot to put on my todo list
...click here to read more!

Wednesday, May 10, 2006

Official website and 2nd art show acceptance

Last week I received my 2nd art show acceptance letter (chronologically, this show will be my first). It's for the Livonia Art from the Heart show on June 10-11th. I've sent out 3 more applications in the last couple weeks, but I'm still waiting to hear back. I've got 3 more shows I'm considering applying to this year, but trying to decide if they are worthwhile and if I want to drive that far (they are about 1 hour away). The application deadlines aren't for a few months, so I think I'll see how my first couple shows turn out.

The other news is that I've launched my official website for Ronald Frazier Photography.

http://www.ronfphoto.com

There's not a lot to talk about with the content of the website, so I'll take a deviation from photography to show off a bit of my inner geek and talk about the technology and design processes behind the construction of the website.

Goals

Of course, the primary goal of the website is to look good....good enough to help sell prints (especially once I get the ability for customers to purchase prints via the website). But almost as important is that the website is fast. Too many websites use a lot of graphics to make the site pretty, and it takes forever to even be able to see any content. Finally, the 3rd major goal was that the site render well in all the major browsers, even without plugins or javascript. This means not using Flash (which I personally dislike anyway).

Optimizing Graphics

The first step is to make sure all the images are as small as possible. For this, Photoshop's "Save for Web..." feature is absolutely critical. First, because it strips out all of the extra (non-visible) metadata that usually gets stored in the image. Second, because it allows you to very easily and quickly see what the results will be if you save the image with varying levels of compression or even using a different file format. It shows you both what the graphic will look like as well as an exact file size.

In addition to simply adjusting the file format, I also investigated where I could shrink the file size by splitting an image into 2 parts. I did this first with my logo. The top section of the logo is narrower than the bottom, so I trimmed off a bit of blank space on the right. I also did the same with my slides (film strip) at the top . I trimmed off the top and bottom black & white edges, put those in a separate png file (and used the same file for both the top and bottom edges). Having the edges separate allowed me to use a fairly aggressive jpeg compression on the slides (where the quality degradation's not as noticeable) without making the edges look bad.

These 2 techniques allowed me to shrink the images in my navigation header significantly. What started out as nearly 100KB worth of images now sits at under 30K. In addition, most of that space is accounted for in the 18.5KB slides. The second largest image is 3.5K. Also, since most web browsers will load at least 2 files at once, although the slides are a bit slow for a dialup user, the rest of the images (logo top and bottom, and the navigational links) will load right along side the slides, and they'll do so quickly. So even while the slides aren't fully loaded, The rest of the navigation will be in just a second or two.

Finally, even though the slide strip is 18KB, it is saved as a progressive jpeg, which means that the image loads incrementally. After the first 2.3KB loads (2 seconds or less), users on a slow connection will see a very low resolution version of the slide strip (on browsers that support incremental display). After 8KB it will be blocky, but the images will be recognizable. After the full 18KB loads they see the full resolution image. While this doesn't make the page load any faster, it makes it SEEM to load faster, which is what's REALLY important. I used this same trick on the other large images in the content area of my home page.

The above information is little more than simple graphical optimizations that should be well within the reach of any photographer who knows his/her way around a graphics program in even the slightest way. Next up is an optimization that's a little bit more advanced, but worth considering by anyone who is reasonably knowledgeable in web design.

Using CSS

My entire web site is designed around CSS. CSS is a technology well beyond the scope of this blog, but there should be plenty of CSS tutorials out there to get you started.

In a nutshell, CSS lets you simplify your HTML by moving all of the formatting information out into an external CSS file. It also makes it easy to set appearance attributes (default font, sizes, and color) for your entire website.

In the past, formatting on websites was done by putting everything in tables and then adjusting table dimensions and using spacer images to make everything line up. This has 2 disadvantages. 1) It clutters up your web page code with tons of extra tags, and every tag adds to the size of the file, which makes your page load slower. 2) Tables are very inflexible. Some layouts are extremely difficult (if not impossible) to do, and once you get it working how you want, it's even harder to make adjustments to make it appear a little different (moving one small image can wreck havoc on the entire page).

Using CSS allows you to reduce and simplify all of this. Your file sizes will generally be smaller (thus faster to load) and your HTML will be cleaner and easier to modify.

Combining CSS and Javascript

Now we are starting to get more complicated. Although not super advanced, we are now in the realm where you should have a little bit of software programming or web scripting experience.

Combining CSS with javascript also allows you to do some cool things. Take a look at my "SHOWS" page and notice how the show information is collapsible. This makes the page look more organized. When the user first loads the page, they don't have to be bothered with all the extra details about each show (time, address, notes, etc). Instead, they see a simple and concise listing of the shows, which they can then expand for more details if they are interested. This is done by using javascript to dynamically change the CSS class of the tags in the page.

Of course, its important to make sure your website still works properly if the user has javascript turned off in their web browser. In the case of the "SHOWS" page, the user will see the full cluttered list of information. It may not be ideal, but it's about the best you can do.

Also, I should point out an optimization I use. Almost all of my javascript is in an external javascript file. The advantage of this is that once a visitor loads the file once, they don't have to wait for the javascript to load again each time they visit a new page.

Stepping up to AJAX

Now we are getting pretty serious. This isn't for those without a decent amount of software programming experience. However, even if you don't have what it takes, please read on to see what I'm talking about so that you know what is possible. It might make you want to hire someone to do it for you, or even be the motivation to teach yourself how to program.

AJAX is a combination of Javascript, CSS, XML, and server-side scripting (such as PHP, which is what I use). AJAX allows you to load data into your webpage dynamically. The advantage of this is that you can update small segments of your page WITHOUT having to reload the entire page.

Take a look at my gallery. Of course, make sure you don't have javascript disabled. When you first enter it, what you see is the left menu and a bunch of empty space. In that empty space are 3 more empty boxes (div tags), waiting to accept content. When you click on a link from the left, the second box gets loaded with some new data from the web server...in this case, it contains 4 thumbnails, and optionally some up and down scroll arrows. The interesting thing you will notice is that, other than that box with the thumbnails, the rest of the page does NOT reload. Now, click on one of the thumbnails. When you do, once again, the page does NOT reload, but now you get a larger image in box 3, and a bunch of information (title, location, etc) in box 4. Now, in the thumbnail box, click the down arrow and you should see up to 4 more thumbnails get dynamically loaded and scroll into position while the old ones scroll out of view.

So how does this help? As stated earlier, only certain sections of the page need to be updated. This means the user doesn't see the rest of the page flicker as it reloads. In addition, the amount of data downloaded from the web server is considerably smaller. As an example, for the 4 steps above (load the gallery, select lighthouse, click on the first lighthouse, then click the down arrow), without the use of AJAX the pages are 4.3KB, 5.4KB, 6.0KB, and 5.2KB in size, respectively. That's a total of 20.9KB of data to be downloaded (not counting images). On the other hand, using AJAX, the downloads are 4.3KB, 2.5KB, 0.8KB, and 1.3KB in size respectively, for a total of 8.9KB. It's very easy to see how much faster this could be for a user on a dialup connection.

A side benefit of using AJAX to load the galleries is that I can do interesting transition, like the way the thumbnails scroll in, rather than appearing in place immediately.

Of course, once again, the site needs to be fully functional if javascript is disabled. I accomplished this by making each clickable link (the left menu items, the thumbnails, and the scroll arrows) so that it reloads the entire page with the correct contents in each block. However, when javascript is enabled, the javascript overrides the link's url and initiates the AJAX action instead.

Conclusion

A lot of the motivation for doing these optimizations comes from wanting to make the page load quickly for dialup users. However, some of you may be thinking "who cares about dialup...most of my users have broadband". Well, despite the fact that you are probably wrong, even if we assume that's a correct statement, these optimization will also benefit a user with a high speed connection. During peak times of day, even fast connections can get slow, and using AJAX to avoid reload flicker make your website more visually enjoyable to everyone at any speed.

Well, I hope this gave you some useful ideas for how your web page can be optimized for better performance. There should be at least something in here for everyone, regardless of experience level.
...click here to read more!