W3C

WICD Core 1.0

W3C Working Group Note 19 August 2010

This version:
http://www.w3.org/TR/2010/NOTE-WICD-20100819/
Latest version:
http://www.w3.org/TR/WICD/
Previous version:
http://www.w3.org/TR/2007/CR-WICD-20070718/
Editors:
Timur Mehrvarz, Vodafone Group Services Limited
Lasse Pajunen, Nokia
Julien Quint, DAISY Consortium
Daniel Appelquist, Vodafone Group Services Limited

Abstract

This document specifies WICD Core 1.0, a device independent Compound Document profile based on XHTML, CSS and SVG.

Compound Document is the W3C term for a document that combines multiple formats.

WICD stands for Web Integration Compound Document and is based on the idea of integrating existing markup language formats in preference to inventing new markup.

Status of this Document

This document has been discontinued as part of the closure of the Compound Document Formats Working Group.

Table of Contents

1 Introduction
    1.1 Scope of this Specification
    1.2 Related Specifications
    1.3 Relationship to Referenced Specifications
2 Root, Parent and Child Documents
    2.1 Referencing Child Documents
3 Scalable Child Content
    3.1 Scalable Child Content Formats
    3.2 Scalable Child Content Use Cases
    3.3 Scalable Child Content Layout
4 Other Child Content Formats
    4.1 Raster formats
    4.2 Audio formats
    4.3 Video formats
    4.4 Child content accessibility guidelines
5 Hyperlinking
    5.1 Link Activation
6 Focus Handling
    6.1 Focus Modes
    6.2 Focus Navigation
    6.3 Focus Event triggered Child Content Animations
7 Font Support
    7.1 System Fonts
    7.2 Font Naming
    7.3 Font Sharing
8 Content Encoding
9 Synchronization Support
    9.1 Temporal Synchronization of Media
    9.2 Timeline Initialization
    9.3 Play Animations while Document is loading
10 Intended Layout
    10.1 Media Queries
    10.2 Style sheet being provided for specific agent classes
    10.3 No style sheet being provided to handheld agents

Appendices

A Definitions
B Object attributes defined in WICD Core
C Conformance
D References
    D.1 Normative
    D.2 Informative
E Acknowledgements (Non-Normative)
F Changes Log (Non-Normative)


1 Introduction

1.1 Scope of this Specification

(This section is informative)

This Web Integration Compound Document (WICD) Core specification describes rules for combining Extensible Hypertext Markup Language (XHTML), Cascading Style Sheets (CSS), and Scalable Child Content formats, such as Scalable Vector Graphics (SVG), in a device independent manner. WICD Core 1.0 is based upon the Compound Document by Reference Framework 1.0 (CDRF) and serves as a foundation for the creation of rich multimedia content profiles.

1.2 Related Specifications

(This section is informative)

The image below shows the relation between CDF and WICD specifications.

Shows the relation between CDF and WICD specifications
CDRF - Compound Document by Reference Framework

CDRF describes generic rules and behavior for combining sets of standalone XML formats.

NOTE: The Compound Document Framework is language-independent. While it is clearly meant to serve as the basis for integrating W3C's family of XML formats within its Interaction Domain (e.g., CSS, MathML, SMIL, SVG, VoiceXML, XForms, XHTML, XSL) with each other, it can also be used to integrate non-W3C formats with W3C formats or integrate non-W3C formats with other non-W3C formats.

WICD Mobile 1.0

The WICD Mobile 1.0 profile is designed to enable rich multimedia content on mobile handset devices. It may also be appropriate for other handheld devices. However, WICD Mobile addresses the special requirements of mass-market, single-handed operated devices and enables publishers to target these type of devices without having to evaluate the user agent identification string. In this profile, child documents are embedded by reference (CDRF).

WICD Mobile 1.0 builds upon WICD Core 1.0.

WICD Full 1.0

The WICD Full 1.0 profile is designed to enable rich multimedia content on desktop-type agents. It may also be appropriate for high capability handheld devices with a pointing device. In this profile, child documents are embedded by reference (CDRF).

WICD Full 1.0 builds upon WICD Mobile 1.0.

1.3 Relationship to Referenced Specifications

This document may contain clarifications, refinements, or specific implementation examples of content specified in referenced documents. Should there be a conflict with any text in this document and the referenced document, then the referenced document is the normative reference.

2 Root, Parent and Child Documents

A document that references other documents is a parent document. A root document is the topmost parent document. A document is a child document, if it is referenced by other documents. A child document can be a parent document at the same time.

Any profile, conforming to WICD Core 1.0, must support XHTML as root document.

2.1 Referencing Child Documents

In XHTML, there are many elements (like object, img, iframe) that are used to reference child documents. In a similar way, child documents can be referenced from CSS declarations.

Any profile, conforming to WICD Core 1.0, must support the XHTML element as a means of referencing Scalable Child Content.

3 Scalable Child Content

Scalable Child Content appears as rectangular objects, which in their normal presentation, can always fit the screen or destination box, because they are scalable and usually meant to be viewed as a whole. Scalable Child Content can have a Document object model (e.g. SVG). It can also be native content (have a binary format or be applications).

3.1 Scalable Child Content Formats

Any profile, conforming to WICD Core 1.0, must support SVG documents as a Scalable Child Content format.

Later versions of WICD Core may mandate additional formats. Different WICD profiles may support different versions of SVG.

3.1.1 SVG

Multiple SVG child documents may be referenced from the same parent document.

Multiple SVG child documents may animate in parallel.

3.2 Scalable Child Content Use Cases

Scalable Child Content can be referenced from a parent document as foreground objects, as background images or as overlay objects.

Any Scalable Child Content format must support these three use cases: Scalable Foreground Child Content, Scalable Background Image and Scalable Overlay Objects (Sprites).

3.2.1 Scalable Foreground Child Content

Scalable Foreground Child Content is referenced using the XHTML element. It appears on the main XHTML layer, just like raster images.

User agents must support Scalable Foreground Child Content, which may be animating, interactive and may have embedded links.

The following example shows how a SVG document is referenced from a XHTML document:



  
    static render example
  
  
     
      
    
  
3.2.1.1 Still-Image Rendering

Using a XHTML 1.1 [XHTML™ 1.1 - Module-based XHTML] param element with name="render", the document author can specify whether a frozen, static, or dynamic rendering is desired. The terms static and dynamic have the same meaning as in SVG. The term frozen implies a single conversion to a raster image. Dynamic rendering is the default behavior. The value of the param element is case sensitive. Unrecognized param values shall be treated as default values. If more than one "render" parameter is provided for an element, then only the last one shall be used.

Authors are encouraged to set the render param whenever referencing multiple non-animating child objects. This may allow user agents to implement performance and memory optimizations. For example, a grid of icons can be rendered as frozen with a script setting the focused icon to dynamic.

An element child element with name="render" and value="dynamic" shall result in a dynamic rendering. Links shall be activatable. Animations shall play, if the timeline has started. Modifications made by script shall update the rendering. The rendering shall also update, if the size of the rendering area changes.

An element child element with name="render" and value="static" shall result in a static rendering. Links shall be activatable. Animations shall not play. Modifications made by script shall update the rendering. The rendering shall also update, if the size of the rendering area changes.

An element child element with name="render" and value="frozen" shall result in a static rendering to a raster image. Links shall not be activatable. Animations shall not play. Scripts in the SVG are disabled, but scripts outside of the SVG may still affect the DOM tree and must result in the SVG being updated. The rendering shall also update, if the size of the rendering area changes.

If not specified in the content, the behavior is as if had been specified.

The terms "static" and "dynamic" are defined in the Conformance section of the [Scalable Vector Graphics (SVG) Tiny 1.2 Specification].

Example:

 
  
  

For accessibility, a conformant WICD user agent must, at user option, provide a means to override author settings of this parameter. This ensures that users can a) mask unwanted distractions or b) interact with SVG interactive elements that would be masked by a 'frozen' rendering. See 5 Hyperlinking and 6 Focus Handling.

For SVG child objects, the document time used for rendering a frozen or static image shall be that given by the SVG 'snapshotTime' attribute. If no 'snapshotTime' is present in the animation, a document time of zero (0) must be used. Other Scalable Child Content formats may use a similar mechanism. Scalable Child Content lacking such capability should use a time of zero (0) for still-image rendering.

3.2.2 Scalable Background Image

User agents must support Scalable Child Content (e.g. SVG) to be used as CSS background images.

Agents may support declarative animated background images. Scalable Child Content, used as a background image, will not provide support for scripting and interaction, such as zooming, panning, linking and user interaction events. Authors should only provide non-animating or non-interactive animating content for use as a background image. For SVG content, a snapshotTime should be provided if the optimal time for a static rendering is not zero seconds. For other formats, if there is a similar feature, it should be used. Agents that do not support animated background images, may generate a still-image presentation of the provided object. A still-image presentation of an animating object may be generated per description in 3.2.1.1 Still-Image Rendering, by using name="render" value="frozen".

The following example shows how a SVG document is placed on the XHTML background, using the CSS background-image attribute:

Use of background-image:


  
    

This in foreground

The following example will set an SVG image background.svg as a fixed, non-repeating (i.e. not tiled) non-scrolling ('pinned') background, using the individual properties:

Pinned background:

body {
  background-color: white;
  background-image: url(background.svg);
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center center 
}

or using the shorthand:

Pinned background, shorthand:

body { background: white url(background.svg) no-repeat fixed center center }

If background.svg has its width and height set in px, then this is well-defined. If the default is declared (width="100%" height="100%"), then it will display as large as possible, where the background area to be be covered is treated as a viewport.

3.2.3 Scalable Overlay Objects (Sprites)

WICD user agents must support content layering using CSS absolute positioning in x, y and z order. This will detach a child element from the main XHTML layer and create a new transparent layer.

WICD user agents must make all visible and focusable points in the XHTML layer and the positioned Overlay Object reachable and activatable.

WICD user agents must support transparency for Overlay Objects.

Scalable Overlay Objects, referred to from the XHTML, page may be put in front of, or behind, the default XHTML layer.

Any transparent areas in the Overlay Object and in the XHTML root document must allow the layer behind to be visible.

A detailed description of the stacking level for different layers can be found in Appendix E in the [Cascading Style Sheets, level 2 revision 1 CSS 2.1 Specification] specification.

Example:

.svg-sprite
{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    border: 0px;
}


  

Hello 1

Hello 2

User agents must support interactivity in overlay elements.

User agents must support overlay images with embedded links.

3.3 Scalable Child Content Layout

3.3.1 Rightsizing

Scalable Child Content is referenced by using width and/or height attributes with values relative to the destination box (which may be the full available rendering area (canvas) of the user agent or maybe a table cell). In case the Scalable Child Content has its own fixed aspect ratio, it is enough to provide only one size attribute value (width -or- height) of the object element (through CSS or directly in XHTML), when referencing it.

[Cascading Style Sheets, level 2 revision 1 CSS 2.1 Specification] contains a detailed description of the required Visual formatting model - Inline, replaced elements.

3.3.1.1 Rightsizing Behavior

(This section is informative)

If only one size attribute value is provided, a fixed aspect ratio child element will get 'rightsized' proportionally, by being scaled to fit into the destination box.

Rightsizing example:


The following illustration shows how a square, scalable element with a fixed aspect ratio, has been scaled into an available area with a requested width of 100%.

Shows how an SVG diagram is scaled into an available area

The following illustration shows, how two scalable elements with fixed aspect ratio, have been scaled into an available area, both with a requested width of 100%.

Shows how two SVG diagrams are scaled into an available area

When an embedded child document fragment (such as SVG) specifies its horizontal width and omits a height specification, then the actual extent of the image is defined by the content within it. On placing such an image into a user agent, the viewport is usually a window on a 'galley' view of the entire document. In such cases, the element should float to the top of the available galley as no height is specified. This is shown in the illustrations above. Where the aspect ratio rules for the embedded graphic force the width to be less than the user agents window width, then the image should be centered horizontally (see 'Leftover Margins' below). If the dominant text layout direction is vertical text, the aforementioned rules should be adapted to the different layout flow direction in the case of 'height' being the only sizing specification.

3.3.2 Leftover Margins

Rendering scalable, but fixed aspect-ratio content into a fixed-sized destination area will often result in leftover margins. In case of SVG child documents: When the viewbox and the resulting viewport do not have the same aspect ratio, and preserveAspectRatio is not set to 'none' (the default being 'xMidyMid') some space is left in between the borders of the viewbox and that of the viewport.

The following illustration shows, how a square, scalable element, with a fixed aspect ratio, has been scaled into an available area (destination box) with a requested width of 100%. Because the viewport has a wider aspect ratio than the child object's viewBox, the viewport and viewBox cannot align exactly. Assuming the SVG content's root 'svg' element has 'preserveAspectRatio' of 'xMidYMid meet' (the default value), the child element's viewport will gain the width and height of the destination box, but the width and height of the resulting viewbox will be equal to the height of the available area.

Leftover margins will appear to the left and right of the child element's viewbox.

Shows how an SVG diagram is scaled into an available area with leftover margins

The following illustration shows, how a square, scalable element, with a fixed aspect ratio, is being scaled into an available area with a requested height of 100%. Because the viewport has a taller aspect ratio than the child object's viewBox, the viewport and viewBox cannot align exactly. Assuming the SVG content's root 'svg' element has 'preserveAspectRatio' of 'xMidYMid meet' (the default value), the child element's viewport will gain the width and height of the destination box, but the width and height of the resulting viewbox will be equal to the width of the available area.

Leftover margins will appear above and below the child element's viewbox.

Shows how an SVG diagram is scaled into an available area with leftover margins

When rendering scalable, but fixed aspect-ratio content into a fixed-sized destination box, the child content must render the entire viewport, including any leftover margins.

In the absence of a background color or image on the element that established the viewport (for example html:object or svg:svg) its background is transparent. In order to maximize the visual quality of the content, the parent document must be visible through the leftovers (as well as through the child content itself where it is transparent).

A defined background applies to the entire viewport (including the leftovers) so that content that spills outside of the viewbox into the leftovers is still on the correct background.

Any UI event, such as a mouse click, that hits the leftover areas, is dispatched in the same manner as UI events over non-leftover areas (i.e., to the child document)

3.3.3 Transparency

3.3.3.1 Introduction

(This section is informative)

The rendering of a WICD document may result in an overlap of content, originating from different namespaces, for example, an SVG graphic on top of some XHTML. Some user agents may provide monolithic implementations for all namespaces, whilst others may render each namespace by a separate block of executable code. For example, by providing a so-called 'plug-in' interface for each renderer.

In the case where an existing XHTML implementation is to be extended via the addition of a namespace supporting transparency (such as SVG) it is possible to provide a combined output using alpha-compositing by allowing the SVG implementation access to the output of the XHTML rendering. This would assume the XHTML base layer is opaque and the SVG layer on top would be responsible for retrieving the rendered output pixel data from the XHTML renderer and combining it with the SVG to support SVG layering on top of the XHTML. Such an approach removes the need to add any transparency support to an existing XHTML implementation whilst adding support for transparency support when new namespaces are added.

Such an approach to supporting a foreground transparency layer can be easily implemented given access to the result of rendering output of an existing implementation. In order to support such a feature, the XHTML implementation would need to notify a plugin that its rendering is complete.

3.3.3.2 Transparency requirements

Transparency must be supported.

4 Other Child Content Formats

4.1 Raster formats

The viewer must support JPEG/JFIF [Scalable Vector Graphics (SVG) Tiny 1.2 Specification], PNG [Portable Network Graphics (PNG) Specification (Second Edition)] and GIF 89a (non-interlaced, non-transparent, non-animated) raster image formats. Other image formats may be supported in addition. For PNG, all color types and bit depths shall be supported, gamma correction shall be supported, and any alpha or transparency information shall be used to composite the image onto the background.

4.2 Audio formats

Audio may be incorporated into WICD 1.0 content in several ways. It may be pointed to from an XHTML object element, or an SVG audio element, or indirectly from an SVG video element where the video includes audio.

In XHTML, there are no timing elements. Thus, audio will play from the time the document is loaded until the time the document is unloaded (eg, replaced by another document as a result of following a link).

In conforming WICD 1.0 content, audio referenced from an XHTML object element must have a width and height of zero.

In SVG, starting, stopping or changing the volume may be triggered by user interaction or animations.

No audio format is mandated in WICD profiles.

Any audio format supported by the device must also be supported for use with the