
In this article, I’ll show you how you can design your own Quality Assurance Scoring System based on the criteria we used in my previous article Code Quality Assurance Checklist: 8/20 Rule.
For each criteria on our list, we will set a maximum amount of obtainable points. The maximum amount of points represents the criteria weight and is based on:
- How important the criteria is for the project’s success (Very important – 3 points, Important – 2 points, Less important – 1 point)
- How difficult is it to fulfill (Challenging – 3 points, Intermediate – 2 points, Easy – 1 point)
- How problematic is it for your projects (Problematic – 3 points, Partially problematic – 2 points, Not problematic – 1 point)
Maximum points represents the criteria weight
For example, it’s very important for any PSD to HTML project that the pages work without JavaScript errors (3 points). On the other hand, it’s easy to fulfill (1 point) and let’s assume it’s not problematic for your projects in general (1 point). In that case, a developer can get a maximum 5 points for meeting this criteria.
If JavaScript errors are found during QA, the developer gets less points: eg. 3 points, depending on the amount of errors.
The maximum points we use at XHTMLized for the each criteria are listed below:
- Are all required pages / states developed? – 5 points
- Are all requirements met? – 7 points
- Do pages work without JavaScript errors? – 5 points
- Is reasonable pixel precision achieved? – 8 points
- Do pages display and work correctly in supported browsers? – 9 points
- Are all pages valid? – 5 points
- Are the correct tags being used? – 6 points
- Are the pages using microformats where appropriate? – 4 points
- Do pages follow agreed HTML coding standards? – 4 points
- Do pages follow agreed CSS coding standards? – 4 points
- Do pages follow agreed JavaScript coding standards? – 4 points
- Are stylesheets merged? – 3 points
- Are image files sufficiently compressed? – 3 points
- Are CSS sprites being used for images? – 4 points
- Is usage of excessively specific CSS selectors and improper use of !important rule avoided? – 4 points
- Can page content be understood and easily be navigated with images turned off? – 5 points
- Do pages degrade gracefully with JavaScript turned off? – 4 points
- Are correct ALT attributes for images provided? – 4 points
- Is the proper heading structure in place? – 3 points
- Are labels associated with FORM elements? – 3 points
Then the QA Score, in percentages, is counted as Acquired points / Total Max points * 100.
In our case, the total maximum points a developer can get is 94. If developer gets 89 points, their score will be 95% (89 / 94 * 100).
If some of the criteria is not applicable, eg. there is no use for microformats on the site, the points for those criteria are subtracted from the Total Max Points, and the score is counted only from that amount of total points a developer can actually get.
The above system can be adapted for various needs, and a user friendly tool can be built for Quality Controllers to rate each criteria. Another advantage is that by changing the criteria weight, you can put more focus on the problematic areas in your development cycle.
Series Table of Contents:
- Code Quality Assurance Checklist: 8/20 Rule
- Can PSD to HTML quality be measured?
- How to hire a great front-end developer
About the author
Related blog posts

Code Quality Assurance Checklist: 8/20 Rule
In PSD to HTML conversion, what defines front-end code as being of top quality? We follow 8/20 Rule here at XHTMLized – 8 areas consisting of 20 criteria the code has to pass in the code quality assurance process. What are those?

How to Hire a Great Front-End Developer
In this article concluding the series about Quality Assurance on PSD to HTML projects, I’ll show you how to hire a great front-end developer using the knowledge from my previous two articles.
Would you like to add something?
All fields are required. Your email address will not be published.