<img src="//bat.bing.com/action/0?ti=5668523&amp;Ver=2" height="0" width="0" style="display:none; visibility: hidden;">
Get a Demo Log In

The Extended Blink - 8/17/2016

Posted by Justin Rondeau on Wed Aug 17, 2016 10:57 AM

Posted August 11th, 2016. This is a post by our friend Justin Rondeau, Director of Optimization at DigitalMarketer, part of an ongoing partnership between Crayon and DigitalMarketer analyzing the latest marketing redesigns, trends and best practices.

In this week’s post we’re taking a look at 3 new redesigns on Iron Mountain’s product page, Brightcove’s gallery page, and Freshdesk’s most recent blog design layout.

We’ll be covering everything from large-scale redesigns to subtle changes that the organization hoped would improve the overall user experience.  

If this is your first time reading The Extended Blink, then let me catch you up on how I evaluate these redesigns (if you want an in depth explanation then click here to give it a read).

• Clarity
• Readability
• Appearance
• On-site Experience
• Navigation

I’ll break down each variation by category and score a point to the version that has the edge. Now let’s take a look at this week’s redesigns. Remember, the older version is on the right and the updated version is on the left.

Iron Mountain Product Page (Information & Storage Management Company)

Clarity is absolutely crucial when you’re working on a product page. You have to speak to the desired end result, speak to any contentions, and finally persuade the customer to work with you. When you are working in the B2B world, this becomes increasingly more difficult because you the desire that most B2C people have when looking at product pages doesn’t exist.

In this case the updated variation tried breaking up the content more to develop a narrative that discussed their services

What hurt clarity on this page are the multiple offers! There’s ‘Contact Sales’, sub navigation, ‘Chat Live’, Download your free whitepaper, ‘Contact us’, ‘Learn More’ etc…There isn’t a singular focus here.

The previous version had fewer options, but also hid a lot of content under faux tabs. However, the new design and headline structure stands out than the above the fold content on the previous version.

The updated variation (on the left) just barely wins for clarity.  They would have swept it if they reduced the number of options on the page.

This one is going to be quick. The updated version is WAY easier to read. Though they still use block text, the text is broken by sub headlines. Further down the page they break up content with images and short text bursts.

The updated variation wins for readability.

Similar to readability, the appearance of the updated variation is much better. The previous variation reeks of dated B2B design practices. Just because you’re speaking to businesses doesn’t mean your appearance needs to suffer!

In fact, it’s quite the opposite. Would you rather do business with a company who can’t even update their site or one who values their external appearance online?

The updated version wins for appearance.

On-site Experience:
Despite the facelift, the on-site experience is about the same. They rely on tabs to share more content on the page, include several CTAs, and are quite wordy. Overall, the experience doesn’t really change outside of the aesthetic.

Neither Variation wins for on-site experience.

Being able to navigate the page is absolutely crucial. Fortunately for the previous version, it was a small page that didn’t really require any navigation and had a more focused message below the fold.

That said, the new variation attempts to provide more information and pull people deeper into the page.

In terms of global navigation, everything remained the same.

Neither Variation wins for navigation.

Final score
Updated Variation (on the left) 3
Previous Variation (on the right) 0

Iron Mountain is going in the right direction and this page should pay off for them. If they tighten up some of the messaging and focus on a singular clear offer they could do even better.  

Brightcove Gallery Page (Enterprise Video Deliverability & Monetization Solution)

This was an easy one; clearly the updated version has the most clarity. Just look at that headline ‘Creating Powerful & Engaging Video Experiences’ you know EXACTLY what this will do for you as opposed to the introduction of a product.

Unless your brand is ubiquitous with a certain offering, using clever product names in your headlines is going to hurt your conversion rates. Using clever product names instead of what it does will requires you to teach the visitor what the product is before you can even get into the benefit!

The previous version uses a softer CTA, but it is a singular CTA above the fold. However, the new variation sets expectations at the beginning by bringing up the free trial

The updated variation (on the left) wins for clarity.

The updated variation has the edge here too. Instead of cutting down the font size of bullet points so they sit above the fold, the updated variation used larger fonts and went long form.

This makes it much easier to read.

The updated variation wins for readability

Oh icons…you were once the bell of the ball, but well things have changed. The previous variation used branded icons to differentiate between product feature and benefits. This used to be the design norm, but visitors respond to images better than the respond to icons.

The sectional layout with product shots, headlines, and bulleted text makes the product feel more complete. The more you can ‘productize’ your offering, the better. Especially if what you’re providing isn’t a tangible good, you need to make it feel like it’s tangible.

The updated version wins for appearance

On-site Experience:
Overall the experience remains somewhat the same. However, the new variation sets a bad precedent by having a clickable video on the first image where the subsequent images do nothing when you click on them. If you’re using a video you might want to put it at a different weight so you don’t set the wrong expectations.

This is updated variation also has a great example of how to use a ghost button. Sites that use ghost buttons (or buttons that don’t have any fill and just an outline) for their primary call to action are making a major mistake. Ghost buttons denote a ‘lesser than’ call to action and Brightcove did this very well.  

The updated variation wins for on-site experience.

The new navigation layout on the updated variation looks a lot better. In the previous variation the ‘Search Bar’ carried the most weight. Search bars can be a good thing (assuming your internal search is solid) but do you really want that to be the first thing people notice in your header?

The updated version uses an icon for search, which in general is a conversion killer (people have to make the connection that the magnify glass stands for search). However, they still include search function, but make the focal point the ‘Talk to us’ CTA. Great work.

The updated variation wins for navigation.

Final score
Updated Variation (on the left) 5
Previous Variation (on the right) 0

There is no doubt in my mind that Brightcove has a better page than they had before. Great stuff.  

Freshdesk Blog Page (Cloud-Based Customer Service Solution)

We’re taking a different approach and rather than looking at homepages, sales pages, product pages, etc…let’s take a look at the blog. At DigitalMarketer we take a ‘value first’ approach and that starts with content. So for us, content becomes the lifeblood of our company.

A blog’s clarity comes from the ease of consumption. Not every post will appeal to every audience, so you do need to diversify. In this case the updated version shows more content to choose from below their featured post. Sometimes more is less, but on this page more is definitely more.

The updated variation (on the left) wins for clarity.

The post windows slightly changed between the two variations. The previous version had the author line above the headline and had the same font hue on the ‘read more’ button.

Overall the updated version flows a lot better and is a much tighter content pane than the previous version.

The updated variation wins for readability.

There are a few notable changes in the appearance. Most notably there was a change in navigation, column width, subscription window, category vertical height, and the addition of contributors.

The updated variation definitely has the edge on appearance despite the lame attempt at convincing someone to join their mailing list (nobody wants more emails! You have to give them a better reason!)

The updated version wins for appearance

On-site Experience:
The on-site experience didn’t change much. They did include a live chat, but when it comes to content that might be a little TOO much. I feel like asking for live chat at this stage would be more of a turn off for people who are trying to consume content.

Remember, when you’re interrupting someone’s experience you need to have a good reason to do it and if the visitor has just landed on your blog there is no good reason to bug them just yet.

The previous variation wins for on-site experience mainly because it didn’t bother people with live chat. It would have been a draw if this weren’t included.

The updated variations navigation went very minimal. They included ‘Search’ and three other navigation elements. In the previous variation they included a ‘Sign up’ button that easily gets the most attention.

Normally I would give the point to the page with the button, but if there is cold traffic on this page (or people unfamiliar with your company) then the sign up button might be too much too soon. It looks like Freshdesk wants to keep their user focused on the content and they’ll get them later on through retargeting or other methods.

The updated variation wins for navigation.

Final score
Updated Variation (on the left) 4
Previous Variation (on the right) 1

Overall this blog redesign is better than its predecessor. Most blog designs will follow this 2 column format, but as there is a shift in mobile consumption I’m curious how much longer this style will be relevant. This page went almost a year without a facelift and may need another soon.  

So that’s a wrap for this week’s redesign evaluation. Let me know if you agree with my evaluation and if there are any sites you want me to take a look for my next post.

Filed Under: