GUI Constraints

Introduction
This page should give a short overview on browser-related requirements. As a rough approach it was decided that eSciDoc solutions need to support browsers with respect to layout consistency only 3 years back. Older browsers like IE 5,5.5 or FF1.x should offer the functionality but may be limited regarding the GUI display. The GUI constraints are set up to develop all GUIs against a clear target. This doesn't mean, Solutions benefit from now on. As far as GUI V2 is implemented and tested, these constraints will be fulfilled.

Supported Desktop Browsers - non productive
-- standing: 2011/01 / update every 6 month

Functionality for older Browsers like Safari 2.x - 3.x, Opera 7.x, Firefox 1.x should be available but will not be evaluated.

Statistcs of awstats from edoc is falsified by 28.6% of unknown brosers, caused by the apache webserver itself. Functionality for older Browsers like Opera 7.x, Firefox 1.x should be available but will not be evaluated.

Change of the browser zoo
As at least 4 new browsers will appear in 2011, all with relevant market share, there is a strong need for focussing on testing and compatibility. Only a set of five browsers can be maintained properly by UIE. There is a urgent need of taking out old browsers and decide for new ones on short term.

Three browsers need to be supported any way:


 * 1) IE9
 * 2) FF4
 * 3) Safari 5
 * 4) Google Chrome

The following browsers will not be tested and developed on a regular base


 * 1) IE6
 * 2) IE7
 * 3) FF2
 * 4) Safari 3


 * 1) reasons for Safari / Webkit:
 * 2) more usage of safari browser
 * 3) more power on googles chrome
 * 4) safari & chrome has the same basic engine with a minimum of divergence


 * 1) a lot of mobile devices are apple devices with webkit engines


 * 1) reasons against IE Version 6 & 7:
 * 2) uncomfortable design / layout
 * 3) object-tag with automatic padding for images
 * 4) double margin bug
 * 5) ignore min width & min height
 * 6) non-alpha transparent PNG files
 * 7) general stagnancy of IE
 * 8) IE 6 decreased under 2.5% - January 2011 2.2%
 * 9) deprecate new web-based developments and new technologies


 * scientific projects & innovatioin
 * first productive scenarios minimum x+2 years

===Browser usage on edoc ===




 * global browser usage
 * relation to europe: http://gs.statcounter.com/#browser-eu-monthly-200912-201101
 * worldwide: http://gs.statcounter.com/#browser-ww-monthly-200912-201101

NEW BROWSER FEATURES
all about new features in new browser versions

IE 9

 * usage of GPU for faster browsing, video and gaming
 * global Active-X blocking with exception rules
 * HTML5 support http://msdn.microsoft.com/de-de/dd797413.aspx
 * CSS Corner
 * DOM Range
 * HTML5 Selection
 * Opacity & Alpha
 * Canvas & SVG
 * H.264 video support
 * Audio support
 * source: http://windows.microsoft.com/de-DE/internet-explorer/products/ie-9/compare-browsers

FF 4

 * New JS values: Changes to the C++ representation of JavaScript values allow Firefox to execute heavy, numeric code more efficiently, resulting in cleaner graphics and a better browsing experience.
 * 3D on the Web: WebGL brings 3D graphic
 * new / better HTML5 support
 * new parser and full support for web video, audio, drag & drop, and file handling
 * Audio API - - for developers to use JS to read and write audio data.
 * Stylin’ Pages with CSS3 - Support for new CSS3 features like Transitions and Transformations
 * SVG files can be used as images and backgrounds
 * Experience super-fast graphics acceleration with Direct2D and Direct3D on Windows, XRender on Linux and OpenGL on Mac, now enabled by default, on all supported hardware
 * source: http://www.mozilla.com/en-US/firefox/beta/features/

Safari (Google Chrome) - Webkit

 * CSS 2.1, CSS3 support:
 * border-image
 * border-radius
 * background-size
 * text stroke vs. fill
 * Styleable form controls ( demo 1, demo 2)
 * DOM web inspector
 * Drosera (JS debugger)
 * Enhanced Rich Text Editing ( demo)
 * XML techologies:
 * XPath
 * SVG (partial SVG 1.1 FULL)
 * XSLTProcessor JavaScript API for XSLT
 * Plugins:
 * Netscape-style (NPAPI) plugins and WebKit plugins (Mac OS X only).
 * The following plugins are known to work with the Gtk port, others may work but have not been tested:
 * mplayer
 * Adobe Flash Player
 * DiamondX
 * source: http://trac.webkit.org/wiki/WebKitFeatures

Progressive Enhancements (related to productive solutions only)
GUI components may make use of progressive enhancements. Standard conform and more modern browser benefit from new features. The result will be detail improvements that will give an advantage in usability and appearance in modern browsers. They do not affect older browser versions at all:

To preserve consistency of layout and behaviour components only make use of:


 * visual details (border appearance, additional background decoration)
 * details in interaction (typing, dragging, hover)

the following aspects should not be affected


 * 1) functionality (as described by use cases)
 * 2) application logic
 * 3) overall user experience

Supported Dialogs
standard dialog - clickable - support yes

overlay dialog - hover - support yes

elevated dialog - clickable - support yes

modal dialog - no

Layout Engines and Mobile Browsers
WebKit (Chrome, Safari) Also used for the mobile devices. Layout, and functional features may appear different.

Gecko (FF, Netscape) Also used for the mobile devices. Layout, and functional features may appear different.

Trident (IE) Also used for the mobile devices. Layout, and functional features may appear different.

Presto (Opera) Also used for the mobile devices. Layout, and functional features may appear different.

Screen Resolution Optimization

 * screen resolution
 * standard: 1024x768
 * for mobile: separate discussion
 * maybe: CSS Media Queries for different range's of resolutions

The situation has changed here. Mobile clients are advancing with very different resolutions and density:


 * iphone3: 480x320-pixel resolution at 163 ppi
 * iphone4: 960x640-pixel resolution at 326 ppi

Although the layout runs fine we still lack a mobile stylesheet here.



source:

Known Development Bugs
Please take care on Addons in Internet Explorer!

IE Bug - DivX Addon &amp; tagName
- relevant browser version: 8+

- Error: tagName is null or non object

- Fix: deactivate the addons for divx about extras -> manage addons

- Info: the addon breaks the basic javascript function getElementsByTagName