Web Testing with METS

1 Presented by Greg Paskal

METS Physical Test Grid

Pages Complete Loading

Verify complete page loading by observing the browser action icon.
Internet Explorer

Netscape

Pages Complete Loading

Look for broken image icons or images that never seem to get loaded

This image indicates the item is still loading but after two minutes it never loaded.

IE Tip: When reporting this defect, right click and select Properties on the image that is not loading. This will provide a dialog box containing the path to the broken image.

Pages Complete Loading

Look for broken image icons or images that never seem to get loaded

This image indicates the image was not found.

Pages Complete Loading

Other things to consider
Is the page loading in a reasonable timeframe Is the page loading consistently between browser versions How quickly does the page load under load testing

Pages Continuity
Do all your pages feel like they are part of the same site?

Look for things such as Logo differences, paragraph formatting, colors, fonts, etc.
7

Graphics - Image Quality

The majority of graphics used on a web page will be either in .GIF or .JPG format. Each of these formats have there own advantages and disadvantages.
Typical .GIF Images Typical .JPG Images

Graphics - Image Quality

GIF images are best for solid colors or very monotone images. GIF uses a very effective compression algorithm that depends on large areas of the same color
What happens when you apply GIF formatting to the wrong type of image Original Image Saved as a GIF

Very Pixilated and loss of color transition

Graphics - Image Quality

Other GIF problems such as banding come from limited color pallets. Unpredictable color issues can also happen on lower bit depth video cards.
What happens when you apply GIF formatting to the wrong type of image Original Image Banding Issue

10

Graphics - Image Quality

JPG images are best for photographs and images that contain complex colors and gradients.
What happens when you apply JPG formatting to the wrong type of image Original Image Saved as a JPG

Color approximations problems, blotchy, color shifts (Background)

11

Graphics - Image Quality

Other JPG issues such as being over artifacted are very common. This happens when to much compression is applied.
This is what happens when to much compression is applied to a JPG Original Image Artifact Issue

12

Links - Correct Results

Links (Hyperlinks) have a very simple purpose, performing an action such a loading a new page or instantiating and email client. Understanding how links work will give you insight to where problems may occur.
Typical Hyperlink http://www.google.com www.yahoo.com msn.com Typical email Link greg.paskal@kinkos.com webmaster@kinkos.com SalesSupport@kinkos.com

13

Links - Correct Results

There are actually two aspects of a typical web page hyperlink.

1) What the end user sees on the webpage

(New Customer?)

2) The code to perform when the link is clicked

<a href="http://www.fedex.com/newcustomer.html">New Customer?</a> Obviously all links should be checked to see if they work and go to the correct, logical location.

14

Links - Correct Results

Problems can arise when a page contains a large quantity of links in a similar format Developers are tempted to cut a paste repetitive links such as these and then go back through the code and actually code the link go to the correct locations.
A simple phone call is all the distraction that is needed for our developer to skip over one of these links that needs coding. A bug is born.
15

Links - Correct Results

Email link defects are easy to overlook. From the web page, the email address may look valid.
This is what shows up on the webpage

Behind the link in the HTML code you would see this <a href="mailto:info@gregpaskal.com">greg@gregpaskal.com</a> It would be easy to assume that the link the user sees on the webpage is the same link that is used in the email client. This is not necessarily the case. Always click email links and verify they are the same on the webpage and email client.

16

Links - Correct Results

Some last thoughts pertaining to email links. It's a good idea to send a confirmation email to the address provided.

You should verify

1) The recipient address is correct 2) The recipient of the email is the correct contact person for the area of the website where the link came from. 3) The recipient of the email still works for your company and is in the same position as when the link was originally created.

17

Tools - What to use when

Software testers, much like automotive mechanics, have a host of tools available to assist in effective testing. Most testers consider the web browser as their only real tool. We will now look at some additional tools that can really enhance your software testing.
18

Tools - What to use when

Browsers are the obvious tools but have you considered this.
Internet Explorer is one of the worst tools to test website with. 1) Much like other Microsoft products, IE will try to help you out by fixing coding issues. 2) IE Supports many proprietary coding tags and scripting languages not supported by Netscape and other browsers 3) IE does not provide a reliable way to flush the cache ensuring fresh page views upon each page load. Testing with IE will be necessary but not the final authority (Pass/Fail)
19

Tools - What to use when

Netscape Tricks
Netscape Navigator version 4.78 is a great tool to discover many web issues. Netscape will render special characters such as " &, @, _ " differently depending on how your developer inserted them into the HTML code. These characters along with many others can be created in a variety of ways, some that will be more cross browser friendly. Consider picking up this HTML handbook, it contains many helpful tables of alternatives for generating special characters.

ISBN: 0596002963
20

Tools - What to use when

Netscape & Internet Explorer
The format you get in Netscape should not be much different than what you see in IE. If you see a huge difference, it's likely the HTML is missing important closing tags such as </p>, </td>, </tr> or </table>.

Closing tags such as these are even more critical than just a few years ago with greater adoption of Cascading Style Sheets (CSS).
21

Tools - What to use when

Other Browsers
Mozilla - http://www.mozilla.org/products/mozilla1.x

Firefox - http://www.mozilla.org/products/firefox

Opera - http://www.opera.com

Safari - http://www.apple.com/safari
22

Tools - What to use when

CURL - http://curl.haxx.se

23

Tools - What to use when

Knoppix - http://www.knoppix.org

Ethereal: Packet Sniffer

24

On the Web

www.GregPaskal.com/METS

25

Recommended Reading

ISBN 0-201-79619-8

ISBN 0-321-19433-0
26

Contact Information

Please feel free to contact me regarding your usage of METS and any suggestions you may have for improving its usefulness.

www.GregPaskal.com/METS
Greg Paskal (214)550-7315 greg.paskal@fedexkinkos.com www.GregPaskal.com Greg@GregPaskal.com
27