Portfolio Website: David Naylor

Every now and again you work on something that you feel truly proud of, that you feel showcases the best of your abilities. The new David Naylor website is one of those moments for me.

Back in December I took the decision to finally look into redesigning davidnaylor.co.uk. The previous design which I did only back in March 2008 appeared dated and when initially building the website certain decisions were taken that later created problems resulting in what felt like an incomplete, rushed and under developed website.

As most designers should attest to a client that knows too much about the web can be as difficult to design for as one who knows nothing, if not more difficult. When that client is your boss the process becomes even more complex. To remove the potential for issues I designed the new website at home. This allowed me to take my time with the design and concentrate on my own ideas, without outside interference. I prefer to work this way if possible and then amend or change a design upon gathering people’s opinions. Of course I would never recommend for a developer to work for free in their personal time, however in this case it was an enjoyable project and one I knew would benefit from being undertaken in my free time.

Design

At the start I had a clear style I wanted for the website, however even in the design stage this evolved. Initially I tend to start with some very rough sketches of layout and what elements may appear where. Ideas for what JavaScript functionality may be required can also come out at this stage.

Next I tend to have a look around different websites, looking for ideas and elements that may represent the ideas I have had or some that may work better that what I have thought of. This normally results in a collage of ideas within Photoshop giving me a better idea of how things will fit together. Some feel this method of working is copying, I disagree. If I were to take these elements pixel for pixel, or a whole design and republish it I think this is copying. Instead I use these bits I’ve collected, rebuild and alter them to fit together to create an individual design.

The previous version of the David Naylor website was created to be a very clean, business focused website. For that reason we went with a clean white design with glossy gradients. This website needed to retain that business focus but I wanted to move from the sterile look and bring in a little warmth. For this reason I altered the white and blue background for greys and altered the shade of green to avoid the harsh lime colour. I also kept the site structure and most of the layout similar to ensure a familiarity for repeat visitors.

Although it was important to retain a visual link between the new and old designs it is important to include something new to keep the site up to date and build upon what existed previously. For this reason we dropped the frankly annoying Flash carousel and in its place came the JavaScript slider. Although not planned the logo was also changed as I felt it did not blend with the new design and could not be amended to suit to my liking.

Upon completing I presented the site to Dave and the team where it was rushed into development.

Development

The development was a quick process, but as the project moved within work time is was subject to interruptions as all internal projects are by client work. When building the website I started from scratch, as I do with all websites I build (if possible). I much prefer to work this way as it allows me to use newer techniques and minimise code bloat. I can then import any old code to save time as required.

The website like its predecessor required WordPress to run the blog. Although WordPress can be utilized as a full CMS I prefer to keep as much code external to WordPress as possible. This gives me added control over the code and means the site is less reliant on plugins for simple functionality like forms. Integrating WordPress in this way does cause its own issues, something we came across in the previous version of davidnaylor.co.uk. This time we moved the structure around and built the index page of the website within the WordPress theme; I did this as doing so put no compromises on what I wanted to do with that page but did simplify the build and solved a number of issues.

Although the normal audience of the website would suggest extensive browser testing unnecessary, especially in IE6, this was still undertaken to ensure the site was still easy to navigate and the content accessible in a range of browsers, even if the design was not pixel perfect for older browsers.

Completion

Overall the site took a month to complete, however this includes an extended design process and the Christmas holidays. When launched the website received positive reviews with many commenting on the improvements and refinements in the design over the previous version. This kind of feedback is always great as it confirms your own views about a design.

When the site launches it was submitted to a few CSS galleries, this served as a platform to show off the new design as well as generate traffic that could potentially convert into new clients for both our web and search divisions.

The Future

Already I’m looking to implement a few new features into the website that have come from the feedback received on the new design, as well as fix a few usability issues that have arisen. I took the decision to leave doing these changes immediately to ensure that they are not rushed and that they are in fact necessary. Making rash decisions upon launch of a new website can potentially be counterproductive; therefore it’s best to wait to implement any non critical changes.

With the new website came another new logo, this coupled with the growing demand for Dave to attend more conferences it seems that it’s time create a more solid brand identity for Dave. To assist in this we will be looking at the best methods to achieve this and how best the website can assist in this goal.

If you have any opinions to add or would like to comment on the new design of davidnaylor.co.uk please comment below.