Introducing the NEW Hannon Hill Website

In the Fall of 2019, our team decided it was time to redesign the Hannon Hill website. And we’re so excited to say that, as of this week, we’re officially live! This is our account of the experience, what went well, what caused hiccups, and what we learned. 

This redesign represents a striking change for our company and the way we present ourselves to the world. We improved our implementation, editing experience, information architecture, visual identity, and content strategy. Phew!

But the answer to why we did it is simple: we want to significantly impact your experience with our site.

What We Did

Once the project was greenlighted, we launched an extensive discovery and goal-setting phase to gather important information. Not only did this guide us through the redesign process, it will help us determine if the new site is performing in the manner we’re anticipating.

Phase One: Discovery 

First and foremost, we dove into our website to perform an audit of what was currently working and not working. This was done in multiple ways, starting with an analysis of our Google Analytics data.

• We took an in-depth review of which pages, assets, and keywords were top and bottom performers
• We reported on pageviews, trends in views, time on site, and bounce rate
• We studied where our leads were coming from, which pages they looked at, and conversion rates

We also took a good bit of time reviewing competitor’s sites, industry sites we admire, sites we don’t like, design elements we think are cool, good / bad visitor experiences, and endless bootstrap templates 

We documented all of this research in a collaborative tool and kept it on hand through the duration of the project.

Overall, the discovery phase was a critical part of the process because it enabled us to make informed decisions and confidently update our course when needed. We referred back to this data constantly.

Phase Two: Build Out

After a lengthy discovery phase, it was time to begin the development process. We created a detailed project plan, audited all indexable pages, firmed up our goals, wrote copy, and purchased a template.

When we got rolling, we found creating graphical comps to be an unexpected challenge. Consistency with banners, headings, spacing, and other elements required thoughtfulness and discipline. But it was important to us to create a fluid and straightforward end-user experience.

When our comps started coming together, our story was truly unfolding.

Development started when each page was thoughtfully laid out. While there would of course be changes, we wanted to eliminate as many on-the-fly updates as possible. We referred to our project plan and comps to keep us on time and within scope.

Phase Three: QA and Testing 

We made it! After both the discovery and build out phases, we were ready for quality assurance (QA) and cross-device testing. 

From a rigorous QA and testing phase, we were able to identify issues that may have not been caught otherwise. Keeping in mind the importance of responsive design, testing was stretched across all devices, confirming a mobile friendly experience.

Additionally, as a new URL structure was implemented, the team worked to build redirects and ensure minimal 404 errors.

Alas, the QA phase is never truly complete. We’re testing a lot now and that volume will go down, but it will never cease.

Highlights Specific to Our Process:

• We redefined calls to action and reset our expectations about visitor behavior.
• We improved our internal linking structure to keep people on the site longer.
• We gave Cascade CMS, Clive, and Services clear visual hierarchy.
• We removed side navigation completely for simplicity.
• We wrote content in our distinct voice, keeping in mind our key differentiators, who our customer is, what they care about, and why an organization should choose Hannon Hill.
• We made sure an eighth-grader can understand our message.
• We utilized paragraphs, chunks of text, bullet points, icons, and more to increase readability.
• We boosted accessibility compliance via a handful of third-party tools including SiteImprove and Tenon.
• Inside Cascade CMS, our implementation is neat and tidy. Images are in their place. Folders are set up logically.
• Our editing screen is clean and intuitive. We don’t overuse blocks. Non-technical contributors have a lot of autonomy.
• We created core pages and we published. We were never striving for perfection with the initial launch and expect to improve upon what we’ve built for the foreseeable future.

How Long it Took

The redesign kickoff date was August 2019. The new site was rolled out March 2020.

 Our seven-month timeframe can be attributed to a few things:

• We were a lean mean team of three. Two marketers and one developer.
• While the redesign was a priority, all three of us kept up with our day-to-day responsibilities.
• We experienced a lull during the holiday season.
• 75% of the 367 pages were either created from scratch or received some form of content update.

How Many People Were Involved

We gave it away that the core team was two marketers and one developer. This was largely by choice to 1.) prevent “too many cooks in the kitchen” and 2.) protect the time of developers working on customer projects.

That being said, we certainly had spontaneous help from other departments. A great example is the video on the Clive page, which was created internally by one marketer to write the script, one support engineer who’s a wiz with video editing software, and one sales person as our voice actor.

Overall, we worked together very well because roles and responsibilities were clearly defined in advance. We respected each other and stuck to the project plan. 

What We Learned

Phase One: Discovery 

• Data told us that visitors were consuming site content quickly and specifically. Not much storytelling was going on and not much value was delivered to prospects.
• It was tough for members of the general public to explain what we do after reading our site. Who is Hannon Hill? What’s Cascade CMS? You’re both?
• Our branding was not consistent with the modern and forward-thinking company we are.

Phase Two: Build Out 

• The absolute perfect template does not exist. We combined elements from different pages to achieve the look and functionality we wanted. 
• Take the time to write content from scratch, if needed. Don’t get lazy or push for a target launch date. Get it right.
• Always keep accessibility in mind. Don’t build and build, expecting to fix errors later. Also, test templates for accessibility before you buy (if that’s the route you take).

Phase Three: QA and Testing

• Bring fresh eyes from varying backgrounds into the QA process. We couldn’t see the forest through the trees at times.
• Bring in the heavy-hitters (aka high-ranking technical resources) to provide feedback. Try not to worry too much about the rows they will add to the project plan. Think how great the site will be and how it’ll help you achieve the goals you own.
• Organization and realistic expectations are the keys to success. Make a plan and execute the behaviors. It feels simple, but it’s the golden nugget.

Wrap Up

Going through a website redesign is definitely something that should be well planned out based on your specific objectives, with room for improvement beyond launch. Utilizing benchmarks, you can easily evaluate the success and determine next steps as you continue to grow and improve.

And what are we thinking about for the future of our site? More video. More personalization. Publishing to AI platforms. Voice search. Chatbots. It's an exciting time!

We hope you enjoy the new Hannon Hill site. We welcome conversations about our experience and how we can help if you are considering a redesign.