Top and above To help capture the spirit of Vauxhall, the site shines the spotlight on local businesses and
their owners, which helps generate a community feelHow we built
Sticky-Kit to resolve a responsive issue
caused by AOS; Slick Carousel for all
carousels across the site; and finally
Bootstrap Select for our mega menu
dropdown navigation.
There’s plenty of animation and
constantly refreshing carousels on the
home page. How did you ensure it had a
good performance?
AS: Wherever possible on the website
we used lightweight and functional
plugins, prioritising CSS solutions over
jQuery unless absolutely necessary. We
also implemented Google PageSpeed
recommendations to maximise
performance across all devices and
connection speeds. This included things
such as CSS compression, alongside a
couple of WordPress plugins such as
TinyPNG (to compress both JPG and PNG
files) and caching optimisation tools.
On the back-end, a plugin called Query
Monitor allowed us to monitor API calls,
Ajax calls, database queries and scripts,
which enabled us to identify any problem
areas and implement performance
optimisations where necessary.
How did you approach testing? Did it
uncover any major issues?
PJ: We are big fans of keeping project
processes as simple and straightforward
as possible. For that reason we use
Trello boards for both internal UAT
and client testing phases, breaking our
Kanban boards very simply into three
columns: ‘To Do’, ‘Ready for Review’ and
‘Approved’. Early on in the project, the
To Do column is used for task setting,
such as ‘build this page’ or ‘develop
this feature’ but later down the line
when we reach the testing phase, it’s
repurposed for logging issues and bug
fixing. Each card on our Trello board
represents a single task or issue and
these are supported by screenshots,
annotated where necessary in order to
fully illustrate the requirements.
More recently we have started
experimenting with a tool called
Userback. This helps speed up our
workflow by allowing us to screenshot
and comment directly on top of our work
in progress web build and each task
or issue is then sent directly to Trello
automatically. At the moment we only
use this internally but it’s likely we’ll
start to open it up for client testing in the
near future.Did you learn any useful lessons during
this build?
PJ: The largest lesson we learnt was in
relation to the interactive map feature.
We have worked on several interactive
maps in the past and they are never
straightforward, particularly when it
comes to making them play nicely on
mobile. This map is without doubt our
most effective yet and we’ll be takinglearnings from how we implemented this
map into future projects.How has the site been received?
PJ: The response has been overwhelming.
Aside from gaining a few honourable
mentions on award sites, the most
important thing for us is that the client
is happy and to that end we received the
following feedback: “Web development is
the single biggest source of anxiety for us
when delivering a project for a client. But
the ‘first look’ we got back from Mallard
& Claret was pixel perfect – it looked
exactly like the designs. That’s never
happened before.”