StephenGrote.com Version 2 Launch
After much thought and toil on a new design with some fancy new features, StephenGrote.com version 2 is finally in the wild. The main goals of the project were to professionally present to potential clients, Stephen’s students, and passers by Stephen’s photographic portfolio and the many useful, photography resources from the courses he teaches. Version 2 of this site was a realign as well as a redesign, focusing in on our goals and addressing some user experience issues.
Our statistics from Mint and Google Analytics showed that 93% of visitor were viewing the site at 1024 x 768 or higher, but the layout was designed for 800 x 600. Presenting the content in a wider layout, therefore, was top on our list of goals for the redesign. The previous design also had a large photo in the header of every page to introduce viewers to Stephen’s work as they browsed the site. The problem with this approach is it pushed content closer or below the fold, often interfering with the user experience. Now the heading is kept to the essential information and the portfolio exclusively showcases Stephen’s photos.
We had some loading issues in the news section where many RSS feeds from various news sources are parsed and presented, thus making for a slow page load. The solution I arrived at was to use Ajax to load in each RSS headline box independently so the user can begin reading content as it appears rather than waiting 5-10 seconds for all feeds to load. I’m writing an article about how I built this RSS aggregator to be published on DMXZone.com hopefully some time before Christmas.
The home page was also an important area to restructure. To make it clear to users what photos and resources have just been added to the various sections of the site, the page automatically grabs a selection of the most recent items and displays them prominently. There are many other subtle improvements throughout the site that make it more usable and move it closer to our business and communication goals.
Behind the scenes to all of the site is an extensive, custom built CMS where Stephen can manage all of the site’s content including page and section creation, photo management, WYSIWYG text editing for all pages, RSS feed management, contact message archives, and much more.
It’s a site that I have put a lot of time into, and has given me the opportunity to stretch my technical skills. It’s a great resource if you are or hope to be a photographer.





I like the look and the feel of the site, its beautiful!
The only thing I don’t totally agree with is the width you’ve chosen. I am viewing the site on a monitor with a resolution of 1024 x 768 but I do not like to have my browser maximized to see the entire site. Screen Resolution tells you very little about user habits. I think if you do a little more research you will find that people with 1024×768 and higher resolution tend to surf with there browser view port at a size other than maximum(this comes from observing my own daily habits as well as people around me). For fixed width sites I tend to stay around 800px wide, maybe 850px if I absolutely must. If you want to go bigger than that I would suggest a more fluid layout, that is one that can accommodate the larger view port but doesn’t require it to be able to see all content on the page.
Just my 2 cents,
J
November 28th, 2006 at 12:50 pmThanks for checking out the site, Jeremy. You have a good point, that monitor resolution and actual canvas space within a browser window are not the same. Because I am using Mint and the Window Width pepper (http://www.shauninman.com/post/heap/2005/10/21/mint_example_pepper_window_width), I can actually research what my safe space will be for the vast majority of my viewers. I still found that 90% of visitors had their browser scaled large enough to accommodate the design. That’s the most reliable research one can do when planning the design of a site. Of course, the User Agent 007 pepper also gives useful data, but the window width pepper is more definitive.
November 28th, 2006 at 1:08 pm