If you’re a web designer, it helps to use sticky headers to guide your readers to your calls to action. But how can you optimise these for the best results? Let’s take a look at some good practices to get the most from your work.
Image credit
What makes a great sticky header
When you’re designing HTML 5 ads, sticky – or persistent – header design principles can be very useful. These types of headers are ideal for users if they are high-contrast, unobtrusive and minimally animated. Here are some good practices to know.
1. Keep them small
When you design sticky headers or HTML 5 ads, keep them small to maximise the content-to-chrome ratio. This makes sure the ad is big enough to be readable and tappable, but doesn’t take up valuable content real estate, especially for mobile users.
2. Consider content and contrast
Look at whether the sticky header or HTML 5 ads have been designed with sufficient contrast to the content in all sections of the page. If you aren’t sure, professional designers such as thebannermen.com/banners/animated-ads/html5 can bring the latest best practices to your work.
3. Minimise motion and keep it natural
4. Make use of partially persistent headers
Not all headers need to be persistent and your A/B testing may show that these aren’t fulfilling your users’ needs. Try alternatives such as partially persistent alternatives which are less obtrusive.
5. Do you even need a sticky header?
As a designer, it’s easy to assume that what you’re doing is the best course of action. But sometimes, a completely alternative course of design action is worth trying. Maybe, for example, you don’t actually need a sticky header at all!
Image credit
Design features such as HTML 5 ads and sticky headers can be extremely useful when it comes to guiding website visitors to your intended actions. These tips above will help you to optimise your work for the best possible results.