About the client
Heathrow is the UK’s biggest port by value for trade with countries outside the EU*. Heathrow serves more than 200 destinations in more than 80 countries, connecting the UK to the world and the world to the UK. Heathrow Airport’s expansion vision is to provide the infrastructure Britain needs to secure its future as a prominent trading nation – by building a third runway.
From January 2018 to September 2019 Heathrow carried out four consultations. These gave residents and interested parties the chance to make their views known about aspects of the proposals and the design of the final plans.
* At the time of writing, before the pandemic.
The consultation challenges
Participants could access the consultation in a range of ways including by email, post, and face to face. The client preferred that feedback was submitted via the website.
For the online consultation, we had some big challenges to solve, including:
- data security and privacy: protecting the privacy of respondents
- cyber security: keeping the site secure from any hacking attempts
- website performance: the client was looking for 100% uptime
- user experience: helping users to access the information they need and giving them the time they needed to respond.
Here’s how we solved these challenges for the June 2019 consultation.
Data security and privacy
The challenge
It was paramount to protect the privacy of respondents and keep their responses secure throughout the consultation process. Both while submitting their responses and those responses being sent to the team who analysed them.
The solution
- We advised the client on aspects of data security and privacy and provided guidance throughout the project, for example, when designing the consultation feedback form.
- To meet GDPR guidelines, non-essential cookies such as Google Analytics (GA), were only activated if users of the site specifically agreed to their use. For anyone who accepted GA cookies, we made sure their data was anonymised.
- We kept data sets separate. For example, once a user had submitted their consultation response, if they went on to complete the equal opportunities monitoring form, this data was kept completely separate. This made it impossible to tie the two sets of data together.
Cyber security
The challenge
A number of organisations were protesting the plans, so the site needed to be very secure to fend-off hacking attacks.
The solution
- Access management was limited via a combination of two-factor authentication, strong password policies, and user-specific SSH keys.
- Access to the Content Management System (CMS) was limited by IP address rules.
- We worked closely with WP Engine to implement a DDOS (Distributed Denial Of Service attacks).
Performance, resilience, and uptime
The challenge
As the website was the main way Heathrow wanted people to submit feedback, it was important that the site remained online as close to 100% as possible – and that in the event of a site crash, a back-up mechanism was in place to give people access to the information. There was also a legal imperative to make sure that all content for the consultation was available for public review – so that it gave people the full amount of time to review and respond.
The solution
- We used Varnish, via WP Engine, to cache non-personal information to reduce the number of requests to the web server directly which helped to deliver page content significantly faster to the end users’ device.
- In previous consultations, we’d seen peak usage of the sites at the start and end of the consultation period. To ensure that the site could cope with additional traffic at peak times, our test partner, Zoonou, ran load tests on the site. We used these results to change the server configuration and allow for additional bandwidth if needed. This meant that anyone who visited the site was able to do so, even during times of high site traffic.
- In case the site was taken down, we created a static back-up version. All consultation information was available for viewing, although people could not submit their responses. In case of a disaster, our recovery plan was to put a maintenance page up and direct users to the static site until the main site could be restored. We didn’t ever need to use this option, as the main site stayed up
- We also created a site archiving system that backed up the site on a regular basis and supplied a snapshot of the site at intervals. This ensured Heathrow had a clear record of what content was on the site on any given day.
Access to information
The challenge
The online consultation had to legally give exactly the same information, word for word, as the paper consultation. No mean feat considering the volume of information being consulted on. This was a considerable user experience challenge, to display the information in a way that:
- gave enough initial information to be understandable and not overwhelming, while also getting key points across;
- signposted users to more detailed documentation where relevant / required.
The solution
- People could explore expansion plans via topic pages. Not every topic was being consulted on, but where there was an opportunity to respond, the topic would contain questions.
- A ‘shopping basket’ style navigation allowed users to see how many questions they had responded to and led them through to the ‘checkout’ pages, where answers could be edited or confirmed.
- A document library held copies of every single document in the consultation. Users could explore documents by searching or browsing collections such as ‘environment’.
- People could search by postcode on a map, to see if their property was in one of the compensation zones. This was done using exact matches of property UPRN numbers to ensure the accuracy of results.
- The event section allowed people to search via their postcode for their closest events and Document Inspection Locations.
A robust response mechanism
The challenge
Another user experience challenge – to direct respondents not only through the large volume of documentation required for consultation, but also to lead them through the questions that could be answered, and provide a mechanism to help users avoid losing their answers if their internet connection drops, the site crashes or they just want to ‘save and complete later’.
The solution
A ‘save for later’ function was available for users to save their responses and finish them later. Two weeks before the consultation was closed, anyone who had started but not completed their response was contacted to remind them they had limited time to finish. To keep the responses anonymous the ‘save for later’ data was abstracted away from the responses, and once a response was finalised and submitted, any save for later data was deleted.
To ensure the system performed well under high load we had to think carefully about how we managed caching in the application. Due to the fact the system captured and presented dynamic data, many of the pages could not be cached. However, every page that did not need to display dynamic data on page-load was cached. We implemented the injection of data after the page had finished loading to display the dynamic data we needed on cached pages.
High web standards
The challenge
Alongside the above, the site needed to work responsively across a large range of browsers and devices and was designed with accessibility requirements in mind.
The solution
- We designed the site to work ‘mobile first’ to ensure that it worked in the most restrictive format, before expanding how it would look.
- The site was tested on a wide variety of browsers and devices by Zoonou so we were confident that it worked for a large audience on both modern and older browsers.
