Please note that I am currently re-coding this website in Google AMP HTML



NorCal Veterinary Services | New Website

  • Steps
  • 1. Understanding Main Goals
  • 2. Sitemap & Mockups
  • 3. Testing & Review
  • 4. DNS Configuration

Quick Summary

NorCal Veterinary Services is a local farm vet that runs in the Wantage & Thame area. They decided that it would be beneficial to them if their website was updated. My goal was to create a modern website which took into consideration their aims and future needs. I also had to figure out who managed their current domain and hosting, then transfer it all to a single company whilst ensuring that the companies email service did not go down.

The Process

I visited the NorCal office in Wantage to understand what was needed for this project. After learning about how their business works, we then took a look at other similar websites and I noted down the main aspects that they liked.

From the discussion, I created the homepage and a template for the services pages. We exchanged messages and thoughts on what they liked about it the most which led me to having a first draft of the site.

Here is what their previous website had looked like:

Their previous website was not responsive which meant that it was very difficult to use on smaller devices. Below is an image of the first draft of the new website (this was significantly changed in the second draft):

The goal of the first draft was to create a responsive website that was centered around funneling customers to the contact page. This worked and looked modern, however, there were still some improvements that needed to be done.

The second draft landing page now has a smaller image to make room for the services to become visible. This allows customers to explore the website without using the menu navigation, therefore improving user experience. The new header image is much lighter than the previous, which makes it seem happier, and more modern.


Here, I will discuss the different types of pages needed to complete the website and how I went about making them.

1. Services

I created a template for the service pages. This ensures that the user experience is as simple as possible - consistency is key. All of these pages included high-quality header images. All of the images on the site are optimised to help keep the site as fast as possible.

Again, referencing back to a previous point, the main goal is to get the user to get in contact with a veterinary branch. The page has all the required information, and there is a very clear call-to-action at the bottom to help funnel the user straight to the contact page. This button is essential to keeping the site constantly focusing on getting the user in contact with a vet branch.

2. Team Members (Home Page)

This section is positioned right below the landing page. In my discussion with the client, we discussed about what their customers value about them and what would be most useful to them. Their customers get assigned a specific vet - this helps build up a good client to customer relationship.

We decided to create a meet-the-team section below the landing page to enable clients to easily contact their vet (Vet details are listed when you click on them).

3. Media Hub (Newsletters, Farmer Meetings & Useful Links)

This section helps condense down a few separate sections that the client had on their previous website. It helps keep the new website clean and easy to use. The media hub includes 3 main sections: Farmer Meetings, Newsletters and Useful Links.

4. Blog

I implemented a blog to the website for SEO purposes. They were currently producing monthly newsletters containing valuable up-to-date information - they are now taking chunks from the newsletters and creating blog posts out of them. This may pull in some organic traffic from google and will also help with rankings due to new, fresh content being created.

4. Contact

The contact page needed to display both branches of the company. As this page is arguably the most important page of the website, it was very important to make it as easy as possible for the user to either get directions to a specific branch, email a branch, or call a branch. Opening times are also listed below, alongside some more specific directions.

Explore More