Browser Support Martrix

Fen Labalme's picture

(note that this is a copy of BrowserMatrix - auto-added to all new Trac wikis - from 2010-04-29. There should be a shared source - ideally a publicly available copy on this site.)


Contents

  1. CivicActions Minimal Browser Support Testing
    1. Rationale
    2. Sources and Links
    3. From Owen (2008-04-08)
  2. Design Hints for Cross Browser Compatibility

CivicActions Minimal Browser Support Testing

Notes:

  • The goal is to test on the minimum number of browsers that cover the majority of issues
  • If the page being tested uses Flash, it should be tested both with and without Flash installed, at least on Win XP
    • So with 6 browser/resolution/OS combinations and with/without Flash testing on Win XP platforms (1024 only), we have 10 combinations in all
  • Numbers refer to resolutions to test: 800 => 800x600; 1024 => 1024x768
    • Note: we are not yet testing for larger displays
  Win 2K Win XP Vista Win 7 Mac 10.4 Mac 10.5 Mac 10.6 Linux
IE 6   sevenup            
IE 7   yes(F)            
IE 8     yes          
Firefox 2                
Firefox 3                
Firefox 3.5   yes(F)       yes    
Safari 3                
Safari 4           yes    
Opera 9                
Chrome   yes            

Notes

Flash

  • If the site uses Flash, it should be tested on Win XP both with and without Flash installed using IE7 and FF3.5 browsers (marked with "(F)" above)
    • Flash used? [] Yes [] No
    • If Yes, but not on all pages, list Flash enabled pages here:

IE6

  • Given that Microsoft released IE 8 (Final) in March 2009 and IE 6 causes huge problems due to its lack of adherence to web standards:
  • We recommend testing only for basic functionality on IE 6 but not necessarily proper look-and-feel
    • Drupal can auto-detect IE 6 and provide a useful upgrade message (install, enable and configure Seven Up).

Resolution

  • Testing is performed at the most common 1024x768 resolution
    • If 800x600 testing is needed, please indicate the browser/OS combination for which you want that. (Note that all but the first generation Netbooks have displays that are 1024 pixels wide).
    • We are not by default testing on larger displays.

Rationale

  • IE 7, IE 8, Firefox and Chrome combine to represent about 90% of browser usage
  • WinXP has about 50% of the desktops, Vista and Windows 7 combine for about 25%, Mac about 10%
    • Windows 7's IE8 is expected to work the same as on Vista
  • Over 90% of user displays are 1024 pixels wide or larger

Browser-specific Notes

  • IE 6 is the least standards compliant and causes the most issues - it's quickly losing "market share" but still accounts for nearly 10% of users
  • Firefox 3 automatically upgrades to Firefox 3.5
  • Safari 3 automatically upgrades to Safari 4
  • Opera usage remains about 1%

Specialized Browsers Not in Testing Plan

These browsers are not being tested:

  • XHTML MP (mobile devices)
  • screen readers (see AccessibilityTesting)
  • Lynx, Links and other text mode browsers

Sources and Links

Browser Testing Tools, Emulators, and Standalone Internet Explorer

From Owen (2008-04-08)

I think those resolutions are appropriate, although I would encourage the 'window resizing test' when doing interactive testing to check how small and big you can go without breakages (yes, things can break on high res too!). Another test worth doing is font zoom - I think we should support that the site should be usable (some visual degradation appropriate) at at least 1 or even 2 zoom bumps - this is important for accessibility, but can also detect instabilities in the layout that would best be fixed (because they could also be triggered by a long line, or an slightly bigger image etc). Note that some browsers (e.g. FF3) zoom images too, which can also produce interesting bugs ;)

When doing automated screenshot checks, I would expand this list to include IE7 on Vista, and Safari on both OSX 10.4 and 10.5 (producing normal priority bugs) also FF1.5 and Opera (which would probably get low priority bugs only), because it takes almost no extra time or effort to review.

migrated to http://civicactions.net/delivery/notebook/browser-cam

Design Hints for Cross Browser Compatibility

see also: DesignHints

Floats

Simply, this is just when something is layed out left to right. When you have columns and columns inside of columns, and image floats inside them, you're asking for more work.

Static width designs

When columns have static widths it often becomes more difficult to manage the difference between browsers in font rendering sizes (among other things).

Use of javascript

Especially things like animations, fades, etc.

Tags: 

Groups audience: 

- Private group -

Openness: 

Public - accessible to all