Skip to main content

Website Testing - Tools and Best Practices

Introduction

This white paper contains information related to tool and fire-fox add-ins that are freely available for usage when doing testing for websites.

Website testing tool:

Pixel Ruler v3.1 – Measure Vertical and Horizontal distance (in pixels) between various section of a website or your desktop.

Firefox add-ins:

TAW-it – Helpful in doing Accessibility testing
Web Developer

Website testing tool and add-ins

Pixel Ruler Functionality

Know the exact size and position of any element with this screen ruler.
Free and easy to use virtual screen ruler.
Float over your screen.
Work with all applications.
Show measurements in Pixels.
Rotate to horizontal or vertical position.
Maximum of 1300 pixels.
Choose between several skins.

How to install the application

Run the Setup
Start using Pixel Ruler
The supported Operating systems are Windows 98, ME, NT4, 2000, XP, Vista.

How to use the Pixel Ruler

1. Open Pixel Ruler
2. Open the website for which you want to measure the pixel distance between the sections, images or various other objects of your interest.
3. Set the initial point and move your mouse horizontally or vertically to the destination point.
4. Check the value displayed at the destination position of mouse cursor

TAW - it

TAW-it allows to verify, with just a click, the accessibility of the Web sites that you are visiting, by means of the TAW3 online service (www.tawdis.net) and making use of the W3C Web Content Accessibility Guidelines (WCAG 1.0).
Its goal is to analyze the level of accessibility in the design and development of Web pages to allow access for all, regardless of their specific characteristics
TAW is based on rules developed by the W3C WAI (Web Accessibility Initiative). These rules, known as Web Content Accessibility Guidelines 1.0, include fourteen guidelines that describe the principles of accessible design. Each of these guidelines is divided into one or more checkpoints.
For more information, visit Web Content Accessibility Guidelines 1.0.

How to install the TAW-it Add-Ins

Pre-requisites:
Firefox: 1.0 – 2.0.0
OS – Supported where Firefox works.
Open Firefox browser
Open link http://www.tawdis.net/taw3/descargas/ext/tawclic.0.9.6.xpi
Follow the instructions and restart your browser
Once TAW-it has been successfully installed, its icon will appear in the browser status bar, and you will be able to make an accessibility analysis of the Web page you are visiting simply by clicking on that icon.

How to use TAW-it

1.Open the Website under test in Firefox browser
2. Check the TAW-it icon in the status bar
3. Change the settings based on your requirement of WCAG 1.0 Level AAA, AA, A
4. Click the TAW-it icon in the status bar
5. TAW-it generates an accessibility report
6. Analyze the report and share with your web developer for necessary fixation.
Note: The website that is under test must be hosted on a public domain, then only TAW-it will be able to do the analysis. This cannot be used on local hosted website.

Web Developer

Web developer tool help you in doing a complete analysis of web pages with respect to various parameters that are available with this addins.
The Web Developer extension adds a menu and a toolbar to the browser with various web developer tools. It is designed for Firefox, Flock, Mozilla and Seamonkey, and will run on any platform that these browsers support including Windows, Mac OS X and Linux

How to install the Web Developer Addins

Pre-requisites:
Firefox: 1.0 – 2.0.0
OS – Supported where Firefox works Windows, Mac OS X and Linux
Open Firefox browser
Open link https://addons.mozilla.org/en-US/firefox/addon/60
Follow the instructions and restart your browser
Once Web Developer has been successfully installed, you will find various menu and toolbar with various web developer tools on the browser standard tool bar. A 'Web Developer' menu under the 'Tools' and context menu of the browser, as well as a new toolbar.

How to use Web Developer

This tool is very helpful for doing Website Testing. A tester can use this tool for verifying mentioned below functionalities of web pages: Click here to download the document.
Steps to Use
1. Open the web page to test
2. Suppose there is requirement to test “All images must have ALT TAGS”.
3. Choose Images->Display ALT attributes
4. All the ALT attributes on the page will get highlighted and one can easily verify the ALT tags
5. Similarly you can test other functionality as per your requirement.
The above article is based on my learning (may or may not apply to your case) and in case you want to share your thoughts, then please do it and assist others.
Labels:

Comments

Post a Comment

Popular posts from this blog

Why to do Software Testing?

Regardless of the limitations, testing is an integral part in software development. It is broadly deployed in every phase in the software development cycle. Typically, more than 50% percent of the development time is spent in testing. Testing is usually performed for the following purposes: To improve quality. As computers and software are used in critical applications, the outcome of a bug can be severe. Bugs can cause huge losses. Bugs in critical systems have caused airplane crashes, allowed space shuttle missions to go awry, halted trading on the stock market, and worse. Bugs can kill. Bugs can cause disasters. The so-called year 2000 (Y2K) bug has given birth to a cottage industry of consultants and programming tools dedicated to making sure the modern world doesn't come to a screeching halt on the first day of the next century. [Bugs] In a computerized embedded world, the quality and reliability of software is a matter of life and death. Quality means the conformance to the ...
1 comment
Read more

HP Quality Center - Best Practices

1.Introduction Quality Center is a test management tool which provides very good features for managing both your manual and automated test cases. This paper highlights the best practices for managing your test cases. When you open Quality center, depending on your rights it display the below mentioned option in the sidebar: 1. Requirements 2. Test Plan 3. Test Lab 4. Defects 5. Dashboard 2.Requirements When you have assigned with the responsibility of developing your test cases in the quality center then you must be wondering where to start with. I am going to share my experience to overcome such a situation. You need to find the solution of some question before you start writing your test cases. 1. Is your requirement developed and available? 2. Is your requirement organized in a logical sequence? If answer to both of the above question is Yes, then you can start with Requirement option in the side bar. In case your requirement is under development, then you keep your...
3 comments
Read more

HP QTP Tutorial - Chapter 10

1 Debug In my previous chapter, I discussed about the features available in Resources Menu such as Object Repository, OR Manager, and Associate Repositories etc. This chapter covers the features available under Debug Menu option. This chapter explains the following features available under Debug Menu : The features under Debug menu are very useful and also frequently used. Although in most of the cases you use Short Keys. We will cover all these features in detail in this chapter. 1.1 Pause  There could be case when are you running your script and want to pause (remember Pause and Stop are different things), then you can navigate to Debug ->Pause. The script will be paused at the current execution step. You can then do your analysis and then continue with your run by clicking on Automation-> Run. Alternatively you can also Press F5 or Run button from the tool bar.  1.2 Step Into  There are situation in a script which makes call to other Action or Funct...
2 comments
Read more