Video walk down of Cataphract's homepage
Before we start tearing down Cataphract’s homepage, check out this video below to briefly get an idea of what it’s like.
I would say for such a serious and boring industry, Cataphract has successfully designed its homepage into something light-hearted and interesting to browse through.
Video summary of Cataphract.co.uk
Above the fold
The homepage section above the fold earns trust with it’s dark colour and makes me interested to read further with the varied coloured fingerprint graphics.
Here are some of the takeaways:
- Logo can be smaller.
- The Marketing Insight Group did a test and found out a surprising truth to how much the hamburger is driving traffic away: “Just adding the “menu” label increased the number of visitors who tapped on the hamburger menu by an impressive 61%.” Don’t assume your audience know that the three lines refer to “menu”
- Bigger font size for title and contrasting font style from body text.
- Description text is short and kept up to two lines
- The thumbprint graphics are created in a fun and relaxed way to engage readers.
Key Improvement: Consider adding a call-to-action after description
Section two
- Good enough spacing to start and end the section.
- Graphics created in a consistent doodle style as with other sections. Interesting that only one solid colour is used rather than using their other brand colours like dark orange and blue. I thought using different colours may make the section more lively. On second thought, one colour keeps the section simple and draw the eyes more to the call-to-action.
- Call-to-action buttons are clear and bold. But what if we change the words “Learn more” to be in all caps, make them bolder and change the button colour to the dark orange? Below is an example with the buttons changed:
I find that this makes the buttons less bold, but the colour helps differentiate the buttons from the black text and graphics. Something to think about?
Section three
- A simple and relevant graphic used helps to describe the product visually.
- The black buttons make them bold but I would prefer one to be bolder than the other. See below for more on how it looks if they are given a different colour, with all caps and bold text:
I don’t know which call-to-action is of priority. Both may be important to Cataphract. Either way, one of them should be bolder than the other so that one stands out enough to grab attention.
This also helps the audience to take action without having to consider which button to click on.
You want to help them make a choice with the least resistance and effort as much as possible.
The more choices you make throughout the day, the harder each one becomes for your brain, and eventually it looks for shortcuts.
Section four
- Love the simplicity of this testimonial section. The interesting part of it is the font used for the testimonial itself. I would have conveniently used the body text font. Instead, the header font is used here with the size blown up to be bigger than the headers. This makes the testimonial message stand out more than if the default body text font and size are used.
- Great way to add in doodle arrows as part of their brand style.
Last section and footer
- The thumbprint graphics are back to brighten up this section for people to take notice and take action.
- Great way to make the button stand out with the starburst or sparkling doodle around the button.
- Interesting that they’ve got the call to action section and footer combined in one solid colour section. This makes the whole section big, bold and hard to miss.
