Aurinka Glass Studio

My wife and I own a custom stained glass design studio, and I designed this website to present our portfolio and provide information to prospective clients. The main drive behind the style of the site was to try to keep the focus on the stained glass artwork, while simultaneously trying to convince prospective clients that we offered a unique, high quality service and product.

This is the second incarnation of our site, but my first attempt to use CSS and standards-checked HTML. There is a small amount of javascript used only where I felt it was really necessary. The portfolio and tour sections were created using a heavily modified 3rd party slideshow generator tool that produces static HTML pages. After reading through everything I could find to understand "the way of CSS" and learning the hard way about browser incompatibilities, this is the result and I submit it for your dissection.

Your comments and feedback would be highly appreciated and I'm sincerely here to learn from you.

Jon E. - Owner/Web Designer Aurinka Glass Studio
Custom stained glass windows, doors, and art glass.
http://www.aurinkaglass.com

I like your website

Just to me the navigation menu items and section titles appear somewhat plain and not distinct ehough. Probably you should consider another font style ... But that's just my opinion - I am only now stepping into site building on my own ...

Hi Jon!
First let me say your work is amazing!
The site is very nice. I agree with Soho, the navigation is my least favorite part. I'm not a fan of all caps and even less of a fan of the enlarged hover feature and selected states.
I find the homepage a bit too busy and distracting from your work and message. I would suggest a little less text color and a little less italics. Maybe try the footer text normal rather than italics.

Overall, you have left nothing to the imagination. The information, process from start to finish is layed out excellently. The personal touches are great.
Great site!!

Jon,
I absolutely agree with Lchad. You have done some very nice work. As mentioned above all that's needed is a little tweeking and you will have a killer site.

Thanks to all for the comments so far! I will definitely take another look with your insights and suggestions in mind. Much appreciated!

I agree with the above to be honest but I'd like to make one or two other points as well.

Your CSS has 3 errors in it. Not a huge problem but one you should look into fixing as it will mean you can claim standards compliance for extra brownie points. Your HTML validates no problem though. Nice job.

I think a lot of your sales strategy is based on how your product uses colours. This being the case, I don't think a black background is the right look for this particular site. I would say experment with a few different combinations just to bring some more colour into the picture.

Nice job so far. Well done.

I personally like the black background. Since the stain glass is so colorful, it seems to me to make the work really stand out better. Again, this is all personal opinion, so take it or leave it, as you wish.

Yep, keep it black. Black sets of colours better and really helps make your excellent stained glass work stand out. I like the site it's nice and relatively easy to navigate. I do have two issues though.

The first is the picture gallery. It just had me stumped a bit, I think something more intuitive would be better. Don't make prospective customers think just let them see the work. Simple thumbnails and something similar to lightbox would do the trick.

The second issue I have is with the navigation menu under the header. I firmly believe that there shouldn't be more than about seven option on any one menu. People can't remember that many anyway as a rule (there's been research and everything) it overcomplicates things a bit and clutters that area of the screen. Try cutting it down and creating sub categories after the links are clicked or you could use a drop down list (javascript/css) but I think it's unecessary.

Another thing is the text size change on hover, it makes everything jump across and is really offputting. Either change it or display:block the li's and set their height and width to prevent the jumping.

Overall though it's good, these are just little things.

Pete.

Seems a mix of feelings about the black background, but some consensus about the weak navigation. I had some misgivings about the number of navigation items too, and pa007's comment will push me towards more subcategorization. Definitely want our nav easy and friendly.

pa007 - I'm a little confused about your comment with regard to the picture gallery not being intuitive enough and making customers think more than necessary (paraphrased). The suggestion to use simple thumbnails leads me to think that you weren't actually looking at our picture gallery. Pictures of our work are in the section called "Portfolio" and the first thing you see when you click that menu link is a screen that shows small icons on the left , in the main display area a sample photo of work, and at the bottom of the photo, text that reads "You may see this and many more of our works by clicking on the thumbnail photos to the left.". When you do this, each subsequent screen shows thumbnails on the left, with text in the main display area that says "Click on thumbnails to see photo collections".

I would like to understand your perception better - what specifically did you find non-intuitive? It would help me to see it through your eyes. If the Portfolio I described is not the one you viewed, were you misled by the menu item wording "Galleries" implying that thats where you would see photos of our work? It was meant as a page to show physical art galleries that are displaying our work. Does anyone else find this confusing?

Thanks!

Jon E. - Owner/Web Designer Aurinka Glass Studio
Custom stained glass windows, doors, and art glass.
http://www.aurinkaglass.com

When I clicked on your portfolio, I saw the thumbnails on the left. When I clicked a thumbnail it took me to another set of thumbnails which I was not expecting. It was only there, upon clicking again, that I found a photo. Was a bit confusing, but it may have just been me. And sorry for the misunderstanding, I meant portfolio not gallery.

Pete.

I'm curious as to what others think about the commission information section at http://www.aurinkaglass.com/The%20Process.html . Looking over our tracking logs, I don't see much in the way of people going beyond this index page into the actual content. Is this page clear and intuitive? Is it compelling? Would we better off just going straight to the first content page? Please look through this and comment with any impressions or suggestions.


Again, thank you all so very much for your time and great suggestions thus far!

Jon E. - Owner/Web Designer Aurinka Glass Studio
Custom stained glass windows, doors, and art glass.
http://www.aurinkaglass.com

Regarding the gallery section, where you go "deeper" into the site, you should maybe consider displaying the first thumbnail first, rather than displaying "click the thumbnails on the left". That is "normal" web behaviour and I would agree with others that this page is somewhat distracting and unexpected.

Black backgrounds are generally to be avoided I would say. They look too 'spacey' in a lot of people's minds including my own. And yeah, the menu where you rollover and it comes up in caps needs to be toned down so that the font size doesn't change when I rollover (and thus makes the text jump around).

Regarding the intuitiveness of the site, I would recommend building in far more links into your actual content that take readers to the important parts of the site where you can obtain potential leads from. An example would be on your home page near the bottom where it says "Please contact us soon to arrange a complimentary consultation." Why not make "contact us" a link to your contact page? That way, more people would follow the flow of the site a lot more and you may see better traffic going to the places you want.

I'm definitely getting the message that the background/text color needs serious reconsideration, and the text-size changing on hover has to go. Thanks to all - point made.

The trouble I ran into when I considered this was that the thumbnails that appear when you first enter a section, i.e. "Work In Progress" actually represent folders (projects) which contain multiple photos. So, with multiple folders represented by icons, each containing multiple photos, it begs the question as to just which photo to display. I understand and appreciate where you're coming from - you click on a thumbnail that is showing a small image and the result is that you don't actually see that image. I tried indirectly to show that the thumbnail actually represents a folder of photos by including a title underneath the thumbnail and hover text that describes the contents, but this is apparently not clear enough. A default way was to actually use an image of a folder, but that is truly ugly and without a representative image of the content doesn't really seem compelling. Perhaps an icon/outline of a folder with a content-representative image overlaying it would be better? Hmmm.... feedback welcome.

That's a great idea, and easy to implement!

OK, still need comments on the Commission section navigation ( http://www.aurinkaglass.com/The%20Process.html ) ...

Jon E. - Owner/Web Designer Aurinka Glass Studio
Custom stained glass windows, doors, and art glass.
http://www.aurinkaglass.com

Hi Mate,

Ouch, The menu text increases on size on hover, wouldnt be a biggy but the whole menu text moves.

The CSS is invalid and needs a fix.

The glasswork is impressive... I think the sites abit dark though, Glass is supposed to bring life and light into a room or house, a site should possibly reflect that.

However good job with the HTML Coding.