Like most industries, web design/development has a number of established conventions and standards. They assist in making websites more functional and user-friendly. In this article, we will define web conventions and standards, as well as discuss why and how you should follow them to make your own website more usable for your visitors and search engine robots. We will also examine the benefits of utilizing certain conventions. Let’s get started!
Define Common “Web Conventions” and Standards
When we talk about common “web conventions” in web design and development, we mean the standards the majority of designers and developers follow to make their websites more intuitive and user-friendly. They have become common conventions simply because they work and, as they say, “if it ain’t broke, don’t try to fix it.” Users have grown accustomed to seeing specific web page elements in certain areas on a website. Though it can be tempting for a designer to challenge some conventions and flex their creativity, there are certain standards that can help improve user experience on your site.
Why should you follow web conventions and standards?
It is a good practice to follow some common web conventions and standards when building a website so your visitors will have an easier time navigating it. The main reason for following any established convention is that it works. After all, they cannot become conventions if users do not find them useful. When a number of sites find success using a specific type of navigation, for instance, others will follow suit and adopt a similar system. More websites adopting a certain convention means that users will learn to navigate them more efficiently. Furthermore, using conventions and standards can even help the user understand how to maneuver around a website that is not written in their native language.
Are there any web conventions that should never be broken?
There are a few web conventions and standards that probably should not be broken, unless you have a very good reason for doing so, and/or you really know what you are doing. It’s generally best to only break conventions when you have come up with a better way of doing something; thus, creating a new convention, are a large and already established brand, or you offer something that no one else offers. Here are a few web conventions most websites should really consider following:
- Logos – generally positioned at the top left-hand corner of each web page so users have a reference point that will always remind them what site they are currently visiting.
- Naming Conventions – help users intuitively know where they can find the information they need.
- Global Navigation (main navigation bar) – should be located within the top 25% of your web pages (or occasionally on the left sidebar, although, I prefer to place secondary navigation there).
- Link Styles – need to show users which text is clickable and most expect links to be underlined and/or a different color than the rest of the text, so avoid underlining words and using different colors on non-links.
- Icons – should require little to no textual explanation, so be sure to use standard icon conventions that users are already familiar with (i.e. a shopping cart for a checkout page).
- Visual Hierarchy – lets users know what content is most important with headings, bullet points, images, and other visual cues.
It’s also a good idea to make your content more “scanable” for human visitors. The vast majority of users will scan a webpage in an F pattern, and many others scan in a Z pattern. That is why it is important to put your main content and navigation in certain regions of your web page. Following are some tips for creating more “scanable” content:
- The most important information should be presented within the first two paragraphs.
- Use succinct sentences and concise paragraphs that are approximately 6-8 sentences in length maximum.
- H1 headings should be short and make a strong first impression.
- Use subheadings (i.e. H2, H3, etc.), images, and bullet points to break up text.
- Make good use of white space to break up content in a visually pleasing manner.
- Bold text is a great way to highlight areas of importance.
What are the benefits of following web conventions and standards?
There are two major benefits to using common web conventions in your website design: users and search engines. Both user and search engine friendliness are central to the overall success of your website. First and foremost, a website should be created with its users in mind. Then it should be optimized for the best possible search engine results. When you design your site utilizing the tips above, you are sure to create a familiar user experience, even for those who are first time visitors, and you are bound to convert some into repeat visitors, subscribers, paying customers, etc.
It is pretty simple to apply some common web conventions and standards that will increase your website’s usability without compromising its creativity. When you use techniques with which your users are already accustomed, it allows them to navigate your site with ease, while instilling a certain level of trust and boosting your own credibility. Only break tried-and-true conventions when you have a new way of doing things that actually works better than the old conventions do. Following these simple conventions will automatically improve user experience and help establish your website as an authoritative resource for users and search engine robots.
By: Danielle Dandridge
Pragmatic dreamer & founder of d6Collab, web designer & front-end developer, WordPress expert, search engine optimization specialist, social media consultant, writer, & general hurricane known as elle. I help creative entrepreneurs develop their brand voice and digital presence through the use of WordPress websites with unique & highly specialized features, SEO copywriting, and social media campaigns. When I’m not doing all that, I’m working on d6Collab & chillin’ with my daughter.