The Web has been an important part of our daily life since Tim Burners Lee came up with the idea of the World Wide Web, back in 1989. With the number of websites that began to appear online, it quickly became apparent that there needed to be a governing body that overlooked the standardisation of websites, ensuring that they all met specific development guidelines.

Following this, Tim founded the World Wide Web Consortium (W3C) in 1994, with a key mission to “lead the World Wide Web to it’s full potential by developing protocols and guidelines that ensure long-term growth for the Web”. These standards promote consistency between the design and code that makes up a website. This post looks at why they are so important to the Web.

What are Web Standards?

Web Standards are a specification for Web Designers and Developers to follow which ensures that the websites they build are usable and accessible to all, regardless of the device they use to access the Internet. The Standards specification covers over 90 topics such as Web Design Applications, Web Architecture, and Web Semantics.

Building websites so that they comply with Web Standards not only makes them more accessible, but also future proofs them for all versions of web browsers. Some new Web Technologies that have made an appearance in the last couple of years have been developed without Web Standards in mind, and very often break best coding practices. These sites inherit badly formatted code as the technology requires the code to be created a certain way. Some of these technologies can harm the SEO of a website due to the non-semantic nature of the code.

With so many Web Standards, and so many best practices, it is possible that many important aspects are overlooked. Many Designers and Developers are not aware of many of the Standards, and build what they think is best, but ultimately damages the reputation of the website.

Why are Web Standards Important?

The Web is a free and open source of information, anybody can create content and post it publicly for the world to see. It is therefore extremely important that all information is accessible to all users regardless of their way of accessing the Web. There are so many ways in which Web Standards are important, a sample of them are listed below.

Easier to Maintain

It is important that Designers and Developers make websites that are easy to maintain. Writing code in a clean and semantic way will make it more readable. With all major Web browsers now supporting HTML5, it is easier to be more descriptive with the elements used in a page by making use of the new tags including header, footer, and nav.

The code must also be understandable which allows it to be easily edited by other Designers or Developers. Building the pages semantically ensures another Designer or Developer can pick up on how the website was built, allowing them to incorporate new features in the same way as the site was originally built.

Commenting the code ensures other Designers and Developers understand what certain sections of the code are doing, as well as documenting what has been created when re-visiting the code at a later date. Indenting the code also makes it easier to read, and ensures elements are closed in the correct places, as it makes it easier to sport when elements are not closed.

Ensure Backwards Browser Compatibility

Websites should be built in a way that ensures they will still work in older browsers. The best practice for browser compatibility is to ensure websites function correctly in the current version of a Web browser, and two versions behind. A website should still be accessible in older versions of Web browsers, but may lack some of the functionality that is available in newer browsers, and the styling may not be totally compatible due to updates in CSS.

In January 2016, Microsoft stopped support for Internet Explorer versions below IE11. As well as this, all major Web browsers are now ‘evergreen’, meaning that they are updated when the user restarts their browser. Users are less likely to be left behind with browser updates, allowing more features to be built into a website using native browser technologies.

Increase Search Engine Rankings

Building a website using semantically correct HTML will allow the site to appear higher in search results. Following Web Standards when building websites ensures that the code created will be indexed more accurately by search engine bots.

CSS class names on HTML elements can also go a long way to informing search engines what the content of that element will most likely be. It is therefore important to use descriptive class names which describe the content, rather than defining the styling that is applied to the element.

Create a more Stable Web

Building websites so that they meet the Web Standards  specification will ensure that they are stable, and function correctly on all devices. With the sudden increase of mobile devices, more users than ever are accessing the Web using their mobile phone as their primary device. These devices often connect to the Internet over a 3G or 4G connection, and phone contracts often have data caps which limit the amount of content that can be downloaded. Websites must therefore be optimised to ensure they load quickly on any device and do not use too much bandwidth when loading.

Coding Practices

The web is made up of three main coding languages, which are HTML, CSS, and JavaScript (JS). Separating these languages into different files allows the page to load quicker, as they can be loaded in the background while the rest of the page is loading. CSS links are included at the top of a web page, in the head section, which ensures they are loaded and style the page as the rest of the content is loaded.

JS files are included in a script tag. This tag is a blocking tag, meaning that any content after one of these tags is not loaded until the JS file has loaded. If the file cannot be found, the rest of the page stops loading. It is therefore important that these tags are added at the bottom of an HTML file to ensure all of the page content is loaded before loading JS files.

Class names on elements should also be kept to a minimum, to avoid creating overly complex code. The class names used must also not refer to presentational items, and should instead refer to the content that is within the element.

Web Accessibility and the Equality Act 2010 (UK)

Web Accessibility is a very important part of Web Standards. It ensures all websites are accessible by all users, regardless of the device they are using. It also takes into account users with various disabilities. In some countries, including the UK, it is law under the Equality Act 2010. Under the law, website owners are legally obliged to ensure that their website is accessible to disabled users.

Websites must have sufficient contrast between text and the background, this makes the content easier to read for users. Certain colours (such as red and blue, and yellow and white) must also not be used together, as this can become hard to read for some users. The text in links must also describe the content of the link rather than simply saying ‘click here’. These are just a few of the vast list of Web Accessibility Standards. I will be writing a post dedicated to it Web Accessibility, due to the importance of it.

This is the first in a multi-part series on Web Standards, so be sure to look out for more posts.