Best Practises - Website Auditing Guide #4

In the last two articles of the Website Auditing Guide, we have written about how you can interpret and understand the Performance and Accessibility score which are outputted as a result of the Website Audit. For more information on the Website Audit tool used, please refer to the first part of the Website Auditing Guide which can be found here.

In this article, we have written about how you can best interpret the results of the Best Practices category. This category is essential to improve the overall code health of your website.

Best Practises

Scoring high in the Best Practices category is based upon multiple factors such as how well you display images on your website, making sure that they have the correct aspect ratio, ensuring that your browser is error free and that all errors found are correctly logged. Furthermore, having a HTML doctype, which makes sure that your website content is rendered properly by web browsers, is also necessary in performing well in this category.

The Score

The Best Practices score ranges between 0 and 100. This score is determined based on how well you have designed and structured the website. There are a number of audits your website will undergo. Your score will be determined by how many you have passed.

Making Your Website Fast & Secure

One of the ways you can make your page and resources load faster is to ensure that you are using a HTTP/2 protocol for all resources. Lighthouse, the tool used to perform the Website Audit, does not check resources from third-party hosts because you have no control over how these resources are served. It will also flag document.write() if it is used. This is because it is generally used to test your code in a debugging and developing environment. Including it when the website is deployed will slow down your website.

Security of your website should always be held with high regard. All websites should be protected with HTTPS, even the ones that don't handle any sensitive data. Hypertext transfer protocol secure (HTTPS) is the secure version of HTTP, which is the web server communication protocol used to send data between a web browser and a website.

HTTPS encrypts the data in order to increase security of the transfer. This is particularly important when users transmit sensitive data. For example, when logging into a bank account, an email service provider or a cloud storage account. HTTPS uses TLS (SSL) to encrypt normal HTTP requests and responses. We will cover more details on HTTPS, TLS and SSL in a future article.

Browsers are starting to take action against non-secure websites. For example, Google is marking non-HTTPS sites as 'Not Secure' in its Chrome Web Browsers. More information on this can be found here. This means that visitors who will access your website will notice if you are using a non-secure connection. HTTPS prevents intruders from tampering with or passively listening in on the communications between your site and your users.

Making sure that links to cross-origin destinations are safely implemented should also be a priority when developing your website. Assuming you are using links that take the user from your website to another website, you may be using the target="_blank" attribute. Using this can cause security issues. For example, the host of the website you are linking to can exploit the use of window object, which represents an open window in a browser, to redirect your page to a malicious URL. Add rel="noopener" or rel="noreferrer" to your target="_blank" links to avoid this security issue. A demonstration on seeing how this exploit works and more information on this issue can be found here.

Implementing these safe measures improves your overall Best Practices score. If they are not correctly implemented, or simply not implemented at all then the Lighthouse Audit tool will tell you precisely where the changes must be made.

Providing a Great User Experience

There are many things that can deter users from proceeding to navigate further on your website. We will now be covering the main ones that affect your score.

To begin with, if your website is asking for the user's location upon loading the first page, it will give a malicious impression to the visitor. Also, the same applies for asking permission notifications right from the start.

One often overlooked implementation is related with the password field. Not allowing users to paste in the password field can cause inconvenience. Password pasting is convenient because it enables the use of password managers. Password managers typically generate strong passwords, store them securely, and then automatically paste them into password fields whenever users are required to log in. This approach is generally more secure than forcing users to type in passwords that are short enough to remember, which can be problematic as they are generally easier to guess.

Having a great user experience isn't always about the design of your website. It also has to do with tweaks and feature implementations that are overlooked. Making sure you react accordingly to your Website Audit Best Practices feedback is important for creating a great user experience.

To Summarise

Following the Best Practices feedback provided by the Audit Test and making changes accordingly is important to improving your website security, performance and even your visitor user experience.

We hope that you have understood the importance of implementing certain features to better improve your Best Practices score which also improves your website security and performance. This is why it's a necessity to follow and improve your website based upon the Best Practices Audit feedback.

Please feel free to reach out to contact@zedsoft.co.uk, we can help you explain your website audit scores, perform audit tests and help you find out exactly how your website can be improved. In case you haven't read the previous articles on the Website Auditing Guide, they can be found here: Part 1 - Part 2 - Part 3

Follow us on our company page for more updates from ZedSoft: https://www.dhirubhai.net/company/zedsoft