Updating the Any Occasion Photography website

In the last post, I mentioned that I had updated the Any Occasion Photography website. There were several core updates to the design, as well fundamental changes to make the site better. I thought I would give a small list, so you could get an idea of what types of updates occurred, and if they would be appropriate for your situation.

The Site Design

The design of the site is completely new, which many people who had visited will notice. However, each of the elements was specifically choosen to make the site easier to use. For example:

• Better grouping of pages in the navigation, so under photography examples one can now find the different types which Any Occasion takes, but then, can also find sub groups to show sections of weddings or sections and types of school photography. We also improved the behavior of the buttons so that they had some simple animations to them, instead of being so static.
• The total number of pages actually decreased. There used to be a page discussing the types of photos they took, then a second page for a sample gallery.  Now that is all combined, so the photo examples are on a page describing the type of photography.
• More prominent contact information on each page, under the main menu. This includes a phone number and e-mail link for people to be able to email the photographer.
• Enhanced homepage buttons – to really get the user to focus on some important pages which we wanted to highlight, such as the top 10 reasons to higher Any Occasion Photography, sample video, and a few other highlights. This helps direct the user to the high impact parts of the page.

Technology Improvements

• Use of CSS Framework – by using a CSS framework, I was able to create a page layout which will be more consistent between browsers, and should work with future browsers as well. I had originally looked at the YUI framework, however found it a little too cumbersome and meant the page sizes were growing.Instead, I opted to use the 960 grid system, and it worked well for this situation.
• Use of a JavaScript Framework – similar to using a CSS Framework, the JavaScript framework allows for development time to be reduced, and stability/sameness among all major browsers. It also luckily allows for faster code since the people who developed the framework work solely on that, which means they can spend the time to develop a robust and fast framework.
• Improved Search Engine Optimization – looked for and improved in several areas the local, on-site, optimization for search engines to improve its crawlability, as well as it’s abilty to rank for key terms.

Speed Improvements

• Faster to Download – By properly implementing the frameworks, and being more efficient in how the coding is processed, I was able to make the overall file sizes smaller. This means that the pages download faster, and consume less bandwidth for the same amount of content.
• Faster to Process – The number of externals which have to be processed compared to before has gone down. This means that the files are sent from the server to the client faster, and that more people can be on the server at the same time, since the server doesn’t require as much processing power.
• Faster to Update – I made several updates to the template engine which is used throughout the site, so that updates to the files, additional pages, and more can be updated and uploaded faster.
• Faster to Display – Taking some hints from the YSlow application, I was able to find a few bottle necks which was slowing down how the files were being processed by the client web browser. By improving its performance, we we able to make the site appear to be faster, without increasing the server, network connection, or any other expensive component. These enhancements will continue through time as the site is used more by more and different people.

Do you need assistance with your website? I provide affordable web design and optimization services to both new and existing websites. Contact me for more information.