Web Application UI Checklist

By Anand Ramdeo on May 3, 2011 Comments

Testing user interface for web application is slightly different from testing user interface of traditional applications. Irrespective of the web application there are certain things which should be tested for every web application. Following checklist will give some information on items that should be tested to ensure quality of the user interface of your web application.

COLORS

  • Are hyperlink colors standard?
  • Are the field backgrounds the correct color?
  • Are the field prompts the correct color?
  • Are the screen and field colors adjusted correctly for non-editable mode?
  • Does the site use (approximately) standard link colors?
  • Are all the buttons are in standard format and size?
  • Is the general screen background the correct color?
  • Is the page background (color) distraction free?

CONTENT

  • All fonts to be the same
  • Are all the screen prompts specified in the correct screen font?
  • Does content remain if you need to go back to a previous page, or if you move forward to another new page?
  • Is all text properly aligned?
  • Is the text in all fields specified in the correct screen font?
  • Is all the heading are left aligned
  • Does the first letter of the second word appears in lowercase? Eg:

IMAGES

  • Are all graphics properly aligned?
  • Are graphics being used the most efficient use of file size?
  • Are graphics optimized for quick downloads?
  • Assure that command buttons are all of similar size and shape, and same font & font size.
  • Banner style & size & display exact same as existing windows
  • Does text wrap properly around pictures/graphics?
  • Is it visually consistent even without graphics?

INSTRUCTIONS

  • Is all the error message text spelt correctly on this screen?
  • Is all the micro-help text(i.e tool tip) spelt correctly on this screen?
  • Microhelp text(i.e tool tip) for every enabled field & button
  • Progress messages on load of tabbed(active screens) screens

NAVIGATION

  • Are all disabled fields avoided in the TAB sequence?
  • Are all read-only fields avoided in the TAB sequence?
  • Can all screens accessible via buttons on this screen be accessed correctly?
  • Does a scrollbar appear if required?
  • Does the Tab Order specified on the screen go in sequence from Top Left to bottom right? This is the default unless otherwise specified.
  • Is there a link to home on every single page?
  • On open of tab focus will be on first editable field
  • When an error message occurs does the focus return to the field in error when the user cancels it?

USABILITY

  • Are all the field prompts spelt correctly?
  • Are fonts too large or too small to read?
  • Are names in command button & option box names are not abbreviations.
  • Assure that option boxes, option buttons, and command buttons are logically grouped together in clearly demarcated areas "Group Box"
  • Can the typical user run the system without frustration?
  • Do pages print legibly without cutting off text?
  • Does the site convey a clear sense of its intended audience?
  • Does the site have a consistent, clearly recognizable "look-&-feel"?
  • Does User cab Login Member Area with both UserName/Email ID ?
  • Does the site look good on 640 x 480, 600x800 etc.?
  • Does the system provide or facilitate customer service? i.e. responsive, helpful, accurate?
  • Is all terminology understandable for all of the site’s intended users?
blog comments powered by Disqus
Finished reading? Browse all posts »