Testing & Validation

Overview

This section contains details to double-check prior to launch, and a few items of what to test during the ideation phase.

Guidelines

Check for broken links

Use one of the following broken link tools

Lint your CSS and JS to check for problems

A tool like http://csslint.net can help point out problems with your CSS code. It does basic syntax checking as well as applying a set of rules to the code that look for problematic patterns or signs of inefficiency. The rules are all pluggable, so you can easily write your own or omit ones you don't want.

For JS linting, you can choose http://www.jslint.com/

Test for cross browser compliance

Use http://www.browserstack.com/screenshots

All applications to be tested against user browsers, and screen resolutions

Browsers
- Chrome (v. 38 and above) – for public sites and student applications
- Internet Explorer (v. 7 and above) for faculty and staff applications
- Safari (v. 8 and above)
- Firefox (v. 35 and above)

Screen Resolutions
- 1280px x 700px for desktop applications
- 360px x 640px for mobile applications

different browsers

Test your site for responsiveness

Make your site work with different screen sizes. Use tools like http://responsivepx.com/ which has controls to adjust the width and height of the viewport to find exact breakpoint widths in pixels. Then use that information in your media queries to create a responsive design.

different devices

Validate your HTML, RSS, CSS

Use validators like http://validator.w3.org/ to check the markup validity of Web documents in HTML, XHTML, SMIL, MathML, etc.  Do validate specific content such as RSS/Atom feeds or CSS stylesheets