Post

SVG support in popular browsers

In Uncategorized on January 3, 2010 by

Scalable Vector Graphics (SVG) is a specification for describing two-dimensional vector graphics, static and animated (the latter with the help of SMIL), XML format.
SVG became a W3C recommendation in September 2001 on what has already been included natively in the W3C Amaya Web browser. Version 1.5 of Mozilla Firefox supports SVG and graphics made since version 8, the Opera browser also has implemented SVG 1.1 Tiny at its core. Other web browsers like Internet Explorer, you need a connector or plug-in, for which you can use the Adobe SVG Viewer.

Overview

SVG allows for three types of graphic objects:

Vector graphic shapes (eg paths consisting of straight lines and curves, and areas bounded by them)

Bitmap images / digital

Text

Graphical objects can be grouped, transformed and composed into previously rendered objects, and can receive a common style. The text can be in any XML namespace supported by the application, which improves the search ability and accessibility of the SVG graphics. The feature set includes nested transformations, the clipping paths, alpha masks, filter effects, template objects and extensibility.

The drawing of the SVG can be dynamic and interactive. The Document Object Model (DOM) for SVG, which includes the full XML DOM, allows vector graphics animation via ECMAScript simple and efficient or SMIL. A rich set of event handlers such as onmouseover and onclick “, can be assigned to any SVG object. Because of its compatibility and leveraging of other Web standards, features like scripting can be done on SVG elements and other XML elements from different XML namespaces simultaneously within the same website. An extreme example of this is a complete set of tetris performed as an SVG object, available here. (The link requires a browser with SVG support).

If storage space is a problem, SVG images can be saved gzipped, in which case they become svgz images. Due to the verbosity of XML, this tends to compress very well, and these files can be much smaller. Still, often the original vectorized file (SVG) is smaller than the bitmap version.

Impact on the Web

The widespread adoption of SVG clients, particularly those built natively in browsers like Firefox, Opera, Konqueror or Safari, you can bring a significant change of image on the Web. A current trend is to build dynamic websites that behave like desktop applications, using AJAX. SVG extends the capabilities of AJAX, providing a richer set of graphical page elements, beyond those specified by HTML / CSS. The SVG Terminal module for Firefox is an early example of this.

Browsers

Firefox: implements SVG natively since version 1.5. Over time he improved standard compliance, but the high consumption of processor. In the new version 3.5 of Firefox can be sure that the SVG renderer has changed and improved.

Opera: like Firefox also implements SVG natively, but with little consumption of processor. Beta Version 9.5 incorporates the ability to call in external form to an image in svg format. Using or .

MSIE: It does not implement SVG, so you should get an extension of the firm Adobe. This external module does not allow mixing SVG with HTML (XHTML) so that the functionality is less than with the browsers listed above. Microsoft sees no future in this standard for the bettor to VML which has much less functionality than the SVG.

Safari: Your version 3.1 (for computers running Windows or Mac OS X) implements SVG images to both advanced text.
Chrome: Since its first version implements SVG natively (since it uses WebKit).

Leave a Reply