If you’re a marketer… you probably don’t think about design standards every day.
If you’re a web designer… you know that standards can help you do your job.
If you’re the visitor… you just know the site is confusing and where the back button is.
Your visitors are not blank slates. Your website is the millionth site they’ve visited, so they come with strong ideas about what they’ll find and where they’ll find it. So conforming to standards is generally a good way to help meet your visitors’ expectations.
But if you’re a designer, standards are about website features and designs, not code or content.
Web design standards are norms and models for web page layouts and UX features, used by marketers and web designers in comparative evaluations. They are guidelines for usability.
This little research project answers those questions.
To answer this question, we created a checklist of 14 web design elements, then looked at 500 marketing websites to see just how standard these standards really are. Using guidelines from an earlier NN Group article, we use the following thresholds:
Note: The dataset was mostly B2B marketing websites from five major industries: finance, tech, manufacturing, food and construction. Websites were reviewed in desktop view with a focus on homepages. Data was gathered in the fall of 2021.
We learned that there are surprisingly few standards, but quite a few web design conventions.
Conforming to standards is usually a good thing. We all visit a lot of websites, so we have a lot of expectations. When something works the way we expect, we’re happy. When something doesn’t work the way we expect, we feel friction and frustration.
So conforming to norms is generally a good way to meet visitors’ expectations for usability.
But standards can let us down.
We shouldn’t do something just because a lot of other people do it. Often the popular features don’t even align with best practices. Many of the most common features consistently test poorly in usability studies.
Let’s look at the features in context on a page. This chart shows both their popularity and our input on how well these align with lead generation website best practices.
The data comes from our review of 500 websites.
The recommendations come from our experience building and measuring patterns of visitor behavior on 1000+ websites.
So clearly, web design standards and web design best practices are not the same. This becomes even more evident when you see just how common it is for websites to miss simple opportunities to add clarity.
The first job of every webpage is to tell visitors that they’re in the right place. This can be done simply by being specific and descriptive in several places: titles, headers, navigation labels, calls to action and evidence.
The majority of websites fail to be descriptive in at least one of these elements, even though each of these elements could be addressed in minutes at no cost in any content management system.
This may be simpler to review in context. If we show each of these in a sample layout, you can clearly see just how prominent these elements are in user experience.
If your website doesn’t tell visitors what you do in these visually prominent areas, your visitor is likely to be confused or even frustrated, especially when it’s their landing page.
Now let’s look closer at each UX feature and web design element we looked for:
93% of websites have a logo in the top left corner.
Where else would it go?
This is really one of only two web design standards. Center aligned is the alternative, which can work well, but you need to plan the navigation around it carefully.
13% of websites have social media icons in the header.
That number is half of what it was five years ago.
The top of every page is definitely the most prominent place to promote your social media presence. Social icons in the header are especially common on B2C websites and niche publisher websites, where brand awareness and pageviews are life and death.
But on a B2B lead generation website, it’s a weird idea. These are candy-colored exit signs.
Traffic is hard to win and easy to lose. If the visitor clicks one of those icons, they’ll land on a site that does everything possible to keep that visitor. They’ll be distracted. They’ll forget about you. That’s why this is on our list of things to remove from your website immediately.
Recommendation: Remove the social icons from your header. Put them at the very bottom of the visual hierarchy, down in the footer.
53% of websites have a search tool in the header.
About half of all websites have a search tool available on every page in the header, which is unchanged from the first time we conducted this research five years ago in 2016.
Site search is a very common feature, but it’s not necessarily helpful to visitors.
A site search tool that no one uses is a cost with no benefit. It adds visual noise for no reason.
55% of websites put a contact link or button in the top right corner of the header.
Most websites put “contact” in the top right. It’s sometimes a link with the same treatment as the other navigation. Sometimes it’s treated like a button, with a contrasting color, increasing its visual prominence.
Visitors expect to find it there. So it’s a good spot for it.
Here’s an example of a web design standard (or convention) that aligns with best practices. In this case, website navigation best practices, along with a bunch of other global elements.
Recommendation: If you’ve got a contact button in the top right, keep it there. But don’t expect this little guy to do all the work. Make sure there are other, more specific calls to action in other key locations. See #8 below.
90% of websites have a horizontal navigation bar in the header.
This is another true standard. The vast majority of websites have horizontal navbars in the header, which collapse into the three-lined “hamburger icon” for the mobile visitor looking at the responsive design.
Horizontal navigation saves pixel width for content, compared to the left-side navigation menus in earlier eras of web design. It’s expected and space efficient.
For the secondary navigation menu, it’s common for designers to put these above the main menu across the very top. This is sometimes called the “eyebrow.”
Recommendation: Stick with the standard and use a horizontal main navigation bar. But be specific in the navigation labels. See #12 below.
58% of websites have dropdown menus.
Most marketing websites have dropdown menus. The idea is to let the visitor go anywhere from anywhere. Dropdowns “save a click.” The alternative is to make them visit the top level page before seeing sub-navigation, thereby deliberately guiding the visitor through a series of pages.
Why are dropdown menus so popular?
Because they work for everyone. For the visitor, they’re a shortcut. For the marketer, they are segmentation.
Every click tells you more about the visitor’s intent, allowing you to speak more directly to them based on their needs. Dropdowns get them to the right page faster, where the chance for conversion is higher.
Recommendation: Use dropdowns only if the section has a lot of pages and subsections. (Avoid little dropdowns with few options because they don’t test well in UX studies). These really big dropdowns are called “mega menus.”
54% of homepages put the value proposition in the H1 header.
Those hard working words at the top of the homepage…
The homepage H1 header is the single most prominent bit of text on a website. The web copywriter has four options:
The majority of homepages use the first option. The header is the value proposition, the business category or the services provided.
Recommendation: Use the H1 header on the homepage to simply say what the business does. Don’t miss the opportunity to tell the visitors they’re in the right place. Some of your visitors don’t know you yet. Plus, a keyword-focused H1 is also an SEO best practice.
33% of homepages have a call to action (not just ‘contact us’).
The contact button may be standard, but calls to action are not. Two thirds of websites do not have an actual call to action on the homepage.
A call to action is more than “contact” or “read more.” It has a more action-focused verb and it’s more specific. When the visitor reads it, it makes the benefit feel high or the commitment feel low.
Consider the difference:
Source: How to design a button that wins clicks
Recommendation: Set up an A/B test to see if your CTAs have room for improvement. For the variant, try something longer and more specific. Use words in the CTA (or nearby) to let the visitor know that this isn’t a huge commitment.
Here’s what an A/B test of a call to action looks like, using Google Optimize. Although this test wasn’t done running, you can already see the variant pulling ahead from the original.
42% of homepages have slideshows or carousels.
They are timed to advance after a certain number of seconds (slideshow) or they can be navigated by clicking a label or thumbnail (carousel).
This is an alarmingly high number, considering the overwhelming evidence showing the poor performance of homepage slideshows.
Probably, slideshows are still popular because they are built into cheap website templates. Or it may be because they help resolve conflicts in meetings when every department wants a little piece of the homepage.
The slider was invented to keep people from stabbing each other in conference rooms.
Recommendation: Rather than hide content in a second (or fifth) slide, make each slide a section on the page and stack them on a tall page. Prioritize them based on their likely importance to your visitor.
Kurt CruseCreative Director, Orbit Media
“Actually, sometimes sliders are a great idea. If it’s really just a photo gallery and the content is outside of the slides (i.e. the same for all), they can work really well. It’s just a way to add more visuals to a hero area. Great for design firms, architects, etc.“
18% of homepages feature some kind of video, not just a looping background video in the hero area.
When we first conducted this research, very few homepages had video. Now in 2021, times have changed. Video isn’t a web design standard, but it’s become far more popular.
Changing the format of a message from text to video is the ultimate format upgrade, especially effective when the message is critical. Here are the three big opportunities
These are all conversion-focused, bottom-of-the-funnel videos, not content marketing videos on blog posts. Conversion videos are the most important of the three types of videos. For these, it’s worth hiring a pro producer and using a pro hosting/streaming service.
54% of homepage have descriptive title tags.
Close to half of all homepages fail to be descriptive in their title tags. Many just show the business name, include the tag line or simply say “home.”
This is a missed opportunity to say what business the company is in, similar to putting the value proposition in the H1 header. It’s especially important for search.
The homepage title tag is the single most important piece of SEO real estate on any website. It’s the strongest place to indicate relevance on the page with the most ranking potential (homepages almost always have more page authority than any other URL on a given domain)
Recommendation: Use the title tag on the homepage to indicate the value proposition, the business category or the name of the main service. Do it in 55 characters or less if possible, to avoid truncation in search results.
The worst possible homepage title tag? “Home.”
A unicorn cries every time a web developer makes “Home” the homepage title tag.
30% of websites have descriptive navigation labels, as opposed to “services” “products” “about” and “contact.”
That means 70% of websites have generic navigation labels. Again, this is a missed opportunity to both indicate relevance to a search engine and to tell visitors they’re in the right place.
Compare the difference:
28% of homepages have testimonials, awards, or other evidence.
Most homepages contain no evidence whatsoever. That’s not good. Adding social proof and evidence isn’t a web design standard, but it’s definitely a best practice.
A page without evidence is really just a big pile of unsupported marketing claims.
Ideally, every marketing claim is supported with one of these forms of social proof or it’s backed with quantitative (data) evidence. Here’s a list of types of evidence you can add to any marketing website.
Recommendation: Back up every marketing claim with some form of evidence. Ideally, the evidence appears near the marketing claim it supports. Fill your pages with reasons to believe!
Obviously, not all design standards are standard after all. Except for the placement of the logo, the main navigation and the placement of the header, there really aren’t strong standards for website design.
The nice thing about standards is that you have so many to choose from. – Andy S. Tanenbaum, Computer Scientist
Web design conventions include contact in the top right, dropdown menus, value proposition high on the page and a search tool in the header.
Other common design features may still be considered best practices, but may not be used by the majority of websites. Custom web design, with wireframe designs specific to the business and its audience, rules the day.
Why make your site different?
If a design element is expected in a certain place, then that’s where it should go.
Note: Not all sites follow all conventions, even sites we design break conventions from time to time. However, there are strategic reasons behind breaking those conventions. A good design company will work with you on these strategic decisions throughout your project.
Beyond design elements (and your own brand guidelines) there are types of web design standards that all good designers understand:
Standard web conventions are shorthand for good design, same as any digital marketing best practice. If you break any of these rules, you should do so intentionally and with a very good reason. And you should plan on measuring the impact of being unexpected.
Does your site align with standards? Follow best practices? Or break the rules?
Note: This research was updated in November 2021
Point #12 Descriptive Navigation Titles
Great if you are are a single minded business or sell 2 or 3 specific products or services. If you have a lot of them a “Services” or similar works to uncover a mega menu. What would you recommend as an alternative?
Thanks for the great info! As a writer, I don’t know much about web design, but it is something I’ve been thinking about learning more about, so thanks for helping me get a head start on this goal.
Thank you very much Andy, another great research.
This is very well written and very informative. One question however, when was the date of the last revision of this blog? Need to know for my web design class research report. Thank you
I’m glad you liked this one, Nolan.
We first published on this URL on 8/26/2015
The research and all of the content was rewritten/updated on 11/4/2021 (yesterday)
I have honestly never read such overwhelmingly good content like this. I agree with your points and your ideas. This info is really great. Thanks.
Amazing post! Thanks for sharing.
Great article! Refreshing seeing a blog with original research.
While reading data on GA at the last place I used to work at, I found that our homepage was the main point of selling and we had around 36% of total sales that came from homepage. Also, you mention the point under Call to Action high up on the home page “78% of the websites had visually prominent calls to action.” whereas I was just reading an infographic that said “70% of small businesses dont have CTAs on their homepage” so that is still a bit confusing for me. I guess the IG only referred to small businesses and you are referring to the whole web.
Thank you so much for sharing a great article. Keep up the great work!
Wow, amazing I saw the article with execution models you had posted. It was such informative. Really it is a wonderful article. Thank you for sharing and Please keep update like this type of article because I want to learn more relevant to this topic.
This post was really helpful. I’m just starting to better understand snippets. What’s interesting is that I thought it was far more technical than that and that I’d have to do some coding. Nope, just structure content well and write good content.
Website is like the business card of today. Theya re the fastest way to reach your business and make your customers know about your services. Website is the new norm for making the business being branded good to everyone around you. Here are some of the reasons why have a website for being edgy in competition.
This was very helpful in my web design course. I found it very interesting how rare a search feature was- as well as a contact feature in the top right. Such things would seem a lot more important and much more common. The only thing I wish you would add to this blog post was a more easily accessible date, as well as providing the date in which the research was carried out.
Follow up question, how would you say standards develop, and do you have any predictions for future standards in the industry?
I noticed that 12% of the websites you surveyed didn’t include navigation in the header although that seems to be the most intuitive way to get back to the main page and is on just about every website i use consistently. Is this hard to implement or do some developers just not see the need to implement it?
Why is it that various website don’t include the search bar? Is it relatively hard to implement or is it not used as often in specific websites? The search bar makes website navigation much easier, and makes absolutely no sense as to why major marketing website don’t include them.
This is a topnotch research. I have learned a lot from this article alone and some insights too. Thank you so much for this Andy. Will absolutely follow these standards. Cheers!
I have read your blog and information on your blog is helpful for me. Thanks so much for providing such information for sharing.
Hire Web Development Services In USA
Digifutura.com is also a best company for app development and web development in usa
I am taking a Website Development course and the information here was very helpful and easy to understand so I can create my own website for class. I was just wondering why don’t many websites have the search feature at the top of the navigational heading? It would make more sense to put it up there because not many people (including me) would want to scroll down to find the search bar. Also, a search bar makes navigating a website easier, and I wonder why some websites don’t have one.
11. Prominently date your web article so your readers can tell how out of date the content is.
I am just learning about web design in my high school and I wonder if you have any tips or recommendations for best ways to keep up with best practices in design?
Why don’t most websites have a “sign up” in the footer? Only 24% do.
what are your thoughts on sites that use intentionally terrible design that still end up being massive hits?
How important do you feel having a mobile friendly site is? I know that most pages are mobile friendly, but if it is not, how much will it decrease your traffic? Having a conventional website designed for computer users can allow for more advanced features, but are those features worth the loss of mobile traffic?
I think your research was done well and that allowed your findings to come across as easy to understand by readers, so shouts out to you. I was wondering how you would determine what features to use on your own website that would help users navigate easily?
Unfortunately, many clients don not have the knowledge of what website should be and to give brief they need to know the basic functions and what are standards of a websites.
All they are concerned about the sells and revenue. But only looks can not bring sells !!
I found it very interesting that 54% of websites have a search feature in the header. About half of all marketing sites do not have a search feature which I found disappointing because I hve always loved that feature on a website. How come only about half use the search feature?
Enjoyed reading the information for best practices. I am interested in understanding more about a “call to action” that is prominently displayed on the home page. What kind of “call to action” is part of best practices?
This is very informative, especially for those who are new in the field–like me. I never realized that many websites had a contact link in the top right section of a website. It’s not standard yet but it’s almost 50% in that category. Is there a reason why many websites have the contact link there and is it highly recommended?
I really enjoyed your article. I had a question about what you meant or referred to when you spoke about the “call to action”?
Considering the fact that tablets are somewhere in the middle of mobile phones and computers, websites should also be able to cater to these viewers, correct?
Your findings are very interesting. I’m surprised so many web designers have chosen to go the same route and be like others. How have you been able to get all the data to prove these the top 10?
One thing concerned me about this page: I couldn’t find a date. This content might have been up to date in 2015; less so in 2019. I think it’s good practice to let visitors know when the article was published.
Great research, I must say. I totally agree with all your insights on these web site design practices. However, I see something’s missing. What’s your take with the pop-ups when visiting websites? Pop-ups like “Subscribe to my newsletter” or offering something else. I personally find that annoying especially if it always appear whenever I visit the website.
Totally agree with you . And its true there is a science to adventure.
heart eyes emoji.
Great reading, but your site displays almost nothing in Firefox. Not trying to be cheeky, but how many sites still even check cross-browser functionality? Have developers given up because of the proliferation of mobile devices?
Andy you have done a great job on keeping the language understandable for even non IT people. Great post thanks.
Excellent post as usual thank you too much Andy for the good work !
I’ve A/B Tested the Hell out of the SlideShow/Carousel . I’m not 100% confident in using it even for a product eCommerce page to swipe between views of the product. The use of it on landing pages, that I can vehemently oppose, because a full screen, no scroll landing page, has continuously out paced slideshows in conversion. It’s due large in part to catering to one target persona instead of three. If you’re catering to 2 or more personas, then your marketing funnel is in disarray. Try 2 or more landing pages instead of slideshow/carousels. Cheers!
What do you mean by “Value proposition high up on the Home page”?
Plenty of websites now present the Visitor with a HUGE photo and a few words (at the top of a long page requiring scrolling) – but mostly the pictures are just eye-candy and very few words about just one products or service amongst many.
If these are “value propositions” then they are mostly very fuzzy, fluffy and a tiny fraction of what the business does/offers.
There is nothing wrong with a strap line about “Value”, Quality” etc – but if is doesn’t provide context and content (e.g. list of products / services) then such a minimalist Home page has little value.
Thank you. I am just re-entering the world of design adding in web design. This is a wealth of information.
Loved reading this and found some great data that I will use for an online course we’re drafting (I’ll obviously link back to your article). I’m surprised that 32% of sites are still not mobile-optimized. I think you’re correct that it is most likely cost prohibitive for some. Thanks for the tid-bits!
Wow, great info. Now that I am redoing my website it will certainly be very helpful, thanks!
i will make this practices.. :0
Terrific insight, Andy – and I would agree that these are best practices. I do have a couple questions regarding your list. How do you define a call to action? Content marketing? Buy it now? What about a proactive live chat feature? I wouldn’t expect that 78% of websites are employing the necessary variety of CTA’s to effectively convert customers.
Good question, Jonathan. A call to action is a button or link that asks the visitors to do something. It has to have a verb and it should give some indication of the benefit to the visitor. “Learn more” is a call to action, but it’s the weakest.
I’m sure you’re right. 78% of websites aren’t doing it effectively. But some sites aren’t doing it at all!
This is an interesting post Andy, and great research! However, I might disagree with the term “Best Practices” in the headline. I definitely would not consider a carousel/slideshow on the Home page as a best practice–just a good practice for distracting the users and stop them from converting. You said that research is mixed, but I’ve only seen one study ever where conversions did not decrease through the use of a slideshow (but several where it did). I’ve also always leaned toward what Brian Massey is preaching these days about Responsive Design vs Adaptive Design. Generally, I think mobile users have different wants & needs than desktop users, and I think those needs can be met better and faster with a design that is tailored to them, with their most common actions being easiest to find.
Not trying to be a nay-sayer! In general, I usually endorse following the conventions that most of the big sites are using as it does tend to make the site easier to use, for the most part. But if such conventions make the site more difficult to use, then it’s time to test some alternatives (as it would appear a number of the top 50 are doing in different areas).
I appreciate the comment, Tom. It sounds like the research on slideshows isn’t that mixed. Is the verdict in on this? We actually just finished a test of our own homepage and the featured image got 195% more clicks than the links in the slideshow. Maybe this question is settled. I’d love to hear more of your thoughts on this. Maybe a guest post? 🙂
The design team here would probably disagree about responsive web design. Even though this “feature” didn’t meet the 80% threshold to call it a standard, they feel that standard is the right word. That doesn’t mean I disagree with Brian. It’s dangerous to argue with a man who has that much data.
Maybe we should get Brian’s input here…
As for the headline, you’re raising a good question. Standards and best practices aren’t necessarily the same. Something could be standard and still break all the rules for what’s good and right. The standard UX design for a cable TV interface are unbelievably bad. But they’re so common, who could argue that these design elements aren’t standard?
My rules of thumb are these: If you want a high-converting small-screen site, you’re probably going to have to hack up a responsive web design (RWD) to a degree that makes it difficult to maintain. Calls to action should be different. Load times need to be faster than desktop. Responsive templates make bad decisions that have to be fixed.
If all you want is a mobile-friendly site, for God’s sake, don’t redesign your desktop site. Optimize the desktop and build a separate adaptive web design (AWD) template.
If you’re redesigning due to backend issues or a rebranding, and you’re happy with a low-converting small-screen experience, go with a responsive template.
We have clients with better converting small-screen sites than their desktop site. Don’t write off your mobile visitors too quickly.
Rear Wheel Drive (RWD) is fast. All-wheel Drive (AWD) covers the most terrain. If you’re working with Andy’s team, he’ll help you make the right decision.
Tom, we know how to test our way to a carousel that beats a static hero shot. We’ve done it more than once, but it takes several tests. I’d place bets on a static hero shot if I was building a site today.
The question to ask is why the carousel is being used. The answer is usually something like, “We had too many departments asking for exposure.”
You don’t want to be copying “best practices” that are the result of politics and not performance.
This is fascinating research. I’d like to understand the “top 50 marketing websites” you surveyed a little better — all B2C? top 50 in online revenues? Broad cross-section of industries?
The “Top 50 Marketing Sites” were the sites from the Alexa list of the top sites in the Business > Marketing and Advertising category, without the media and news sites. If you browse through the list of sites from that link, you’ll see the ones we surveyed.
It’s a somewhat arbitrary group with quite a few survey companies in it, but we needed to get a list from somewhere! And those sites all had marketing goals, so we felt it was a relevant source. If you know of a better list of sites somewhere, please share!
What are your thoughts?