Where UX and marketing cross over
Season 5, Issue 11, we're back on niche website topics
Adding things or making changes to your website is a pretty common occurrence for us marketers. Usually we’re pretty restricted as to what changes we can make on our own, and occasionally a more significant change comes along that results in someone asking “can we change the menu?” Take for example:
You’re running your first event or implementing an events strategy, and want to add an “Events” tab to your nav bar
You’ve significantly invested in a piece of content and want to introduce a “featured content” banner in the drop down of your “Resources” menu item
You’re releasing a product or feature that is making the product section of your menu ‘too full’
You want to segment your navigation by persona
There’s endless reasons you might want to shake things up in your menu and navigation. I’ve been looking at it this past week or so as part of collating a couple of microsites into one main site, which obviously has implications for the navigation, and led me down a research rabbit hole.
The first question was simple - what are my options here? What have I got to work with?
The spirit of Mehdeeka is always no resources and small team, so how far can I get without hiring a UX designer (either because I have none, or they belong to Product and don’t work on the “marketing” website), and running a whole research program is outside of my budget.
So I started looking into menu styles, and found some great examples:
The basic menu
Just a straight up list of links like Product, Pricing, About Us with no drop downs or things appearing when you hover over them.
Simple drop downs
When you hover or click, a secondary menu appears, with just a basic list of more links to choose from.
Mega menus
I’ve always been a fan of ClickUp’s website and their menu, which has quite a lot in it but is very neatly laid out. This is where menus start getting exciting and you can squeeze in personas, use cases, and features all in one menu item.
Stripe has a similar layout, but with a third layer:
Mailchimp also have a three layer menu, with a vertical design rather than landscape:
Disneyland has an ugly but super good menu design. Considering how big a Disneyland trip can be (travel, accommodation, tickets, food, and of course picking what rides you want to go on, all with children) a huge task, so I love how they’ve segmented the menu into tickets, accommodation, activities, and other very functional items.
Full screen menus
Harvard uses this style with three layers. Interesting to note is that the background image only appears on the third layer too.
And those are the styles we have to work with!
An interview with UX and CRO Specialist, Evans Li!
Special shout out to Evans who was the only name that came up when I went around asking “do you know anyone who has strong opinions about menus?”
Evans has a background in digital and growth marketing before moving over to UX, and is currently at the Cancer Council (which also has a big menu). Evans also has a really interesting side hustle making really good looking pizzas - check out his very interesting portfolio and links to his socials here.
Kayla: There are a lot of instances where a marketing team might want to make tweaks to a site's navigation and request the change without putting too much thought into UX implications, what is something from a UX perspective that they should be aware of?
Evans: As a UXer, the priority is always the user. A marketing team might not always be considering the full scope of users as they're suggesting or implementation changes to the navigation/key parts of the digital product. Additionally, things such as terminology (the language internally might not be what's best for end users) and also following a design system to align with other parts of the product (brand colours, font, icons, element size).
K: The more complex a company gets, the more complex their site gets. There can be a really big push to just put it all into the menu - how do you decide whether something should get menu space (say the first drop down) or be put behind a "see more" button or secondary dropdown? (Or be put into the footer)
E: I think there's arguments for any type menu - there's no one size fits all approach. As a UXer, I want freedom of movement and accessibility for users (additional links, breadcrumbs, hierarchy), terminology that makes sense to them and having everything in close proximity/familiarity. Your product owner/designer should have a vision for what pages are a priority, looking through the analytics for traffic, user testing (tree/card sorting) as well as balancing the business needs from sales, support and marketing.
K: You're also a CRO specialist, what is the impact of a huge menu on CR? Do smaller menus always mean a better CR?
E: I've noticed in situations where navigations are removed from landing pages, CR does see an uplift. However, it does come at the cost of some users frustrated or confused at the lack of freedom on the website. I think it depends on the context, minimalism is something to aspire towards aesthetically, but it may not be the most functional. The answer is most likely somewhere in between, but can vary across industries and products. i.e. retail/news have designs that offer expansive options whereas a tech product site may focus on a few pages.
K: Are there trends in menu design? What are some of your preferred menus, or navigation styles that feel really good?
E: I think a UI/IX designer could comment more on this. From my end, I'm seeing a greater shift towards accessibility in navigation from organisations. Making searching for pages, content and information more easy in terms of font, colour, size, language and alternative methods for users with impairment. As well as this, designing for mobile first - almost everyone is on mobile whether they're shopping or searching, you're missing out if you're not making it mobile-friendly. From a not-for-profit standpoint, Lifeline find a good balance of content and key services. I'd also suggest Koala and The Iconic for ecomm in terms of how they group their key products/demographics. Slack's website has a nice balance between simplicity and navigation.
Links
Ooooh we’ve got quite a lot this week! Let’s go rapid fire:
First, this one is from Evans, as a ‘sums up everything’ kind of link to go with his article: The rules for modern navigation via UX Booth
Foreplay - not what you think, a pintrest-like platform for collecting ads you like and using them to build briefs and mood boards for your own work
This McDonald’s ad from the Phillipines:
More McDonald’s goodies, in China they’re collaborating with Tetris and are selling mcnugget-shaped, handheld Tetris games (with a limit of 400k units)
Sydney based tech marketer Bennie Liu wrote about acquiring a million users through ads, and whether you should consider ads as part of your startup/growth strategy
This week I’m procrastinating by looking at beautiful books
Next week is the last issue for Season 5!
That’s right folks, I’m runnin’ out of steam so this season is wrapping up. For the new subscribers this season, I take a break at the end of each season for however long I feel I need to make sure I’m publishing work I think is actually interesting and worthwhile.
During the break I occasionally send out ‘Intermission’ issues with links or interesting stories if and when I find any. But yeah, just so it’s not a surprise, next week is the last one for now!