arnabroychowdhuryWhether you are developing a website for your personal use, for a customer or your organization, it is very important that the site is bug-free. A bug in your application will not only ruin the usability of your website but will also affect your reputation as a developer. In this article, we shall discuss some basic checklist that will enable you to deploy a bug-free web application in production.
Mobile Ready Test
Since most people nowadays use mobile devices to access websites, for expanding the number of the target audience, your website must be fully responsive and compatible with mobile devices and browsers.
Set up a list of devices on which your application should run perfectly by researching through Google Analytics.
You can use mobile device emulator extensions in browsers to test your application.
If the budget of the project is large, you can provide your testing team few handheld devices of the different operating systems so that real time testing is possible. Since certain bugs are often missed by emulators.
Make sure there is no horizontal scrolling, fonts and buttons are readable and touch-friendly, content and images are large enough to understand on small screen.
Hey, are you looking for CSS Crisp edges — The counter-increment and counter-reset properties are used to control the value of a counter () in generated content.
Cross Browser Testing
Gone are the days when internet explorer was the only browser available in the market. Many new browsers are being introduced almost daily and often, web applications that run perfectly in Google Chrome fail in Opera, Safari or other browsers
Instead of testing compatibility with all browsers, target the major browsers and test your app on them.
Perform the test using a cross browser compatibility tool during the early stages of development. Unit testing should be initiated as soon as the design is ready.
Execute the test cases once again the entire development is completed.
Accessibility Testing
W3C has set up a series of guidelines and standards that organizations or individuals must comply with before launching their web application. The guidelines state that the application should be accessible by everyone, especially people with disabilities.
Test whether your website complies by section 508, ADA and other guidelines.
Run scalability testing to ensure that the website is readable when images or fonts are zoomed in.
Screen reader test should be executed to ensure that people with poor vision can navigate through the page using a screen reader.
The site should be completely navigable with the use of keyboard only
Captions should be included in media content to ensure people with hearing disability can understand the audio and video content.
Also check out CSS deafult pseudo — The :default pseudo-class matches default checkboxes, default radio buttons, and selected options. It can also be used to modify the default submit button of a form.
General HTML and CSS Checking
Ensure that your HTML or XHTML code is error-free by validating it using W3C Markup Validation, the official validator tool of the World Wide Web Consortium.
There are other tools like HTML Tidy, Google Webmaster tools, etc. that can search the code for duplicate meta tags, broken links, missing titles or other bugs.
CSS Validation Service provided by W3C can be used to find out any error or compliance violation in your CSS.
After the code has been checked, a suggested tool that can be used is CSS Compressor. It minifies the file by shrinking the entire code into a single line. For a large page with thousands of lines of CSS, this tool can speed up the loading time.
Security Testing for Website Login
If your website is dealing with online shopping, banking or any activities where user data should be kept private, security testing is very important.
Make sure the account locks out after multiple entry of incorrect password or user ID.
Ensure automated login is prevented through techniques like OTP verification or CAPTCHA while logging in.
Check encryption of cookies and cache.
Once the user logs out, press the back button to make sure that the browsing session has expired.
Don’t forget to check about CSS Deviceadaptation — This is a CSS framework that overrides the viewport meta tag to allow websites to take advantage of responsive design. It also adds some cool new features including extend-to-zoom, which will set the viewport width to fit the content when you hold two fingers on the screen.
Performance Testing of The Application
Apart from usability and security, your web application must be able to withstand the load. Often, websites are observed to crash when internet traffic increases all of a sudden.
Execute stress testing to find out how the site behaves when workload increases.
Simulate login sessions of multiple users and execute concurrency testing to find out whether the site behaves normally or not.
Execute Endurance testing to check the performance of the website when it faces workload beyond limit.
Check the loading time of the application under low network coverage.
Beta Testing by Real Users
This is the final phase of testing when the site is launched on a platform where the end users test it for errors.
Beta testing is highly important since users navigate the site and tend to discover any weak points from their perspective.
Your testing team follows a set of rules to perform unit testing. Real users often think out of the box and may spot an error that may have been missed by the testing team.
Apart from all the above-mentioned testing scenarios, documentation testing should also be performed to check whether the website follows all the requirement specifications and business logic as mentioned by the client. Once your application has passed all the test case scenarios with all the high priority bugs fixed, it can be deployed into production.
