Skip Navigation | Groups

This site uses cookies- for more information see the Cookie Policy | Continue



2007100201 Email to Ronx


Reasons not to use VML Graphics

VML graphics can only be seen in IE5.5 and later (up to IE9) running on Windows PCs. Note that IE10, IE11 and later versions, along with Firefox, Safari, Opera, Chrome etc. cannot display VML graphics; those browsers render a down-level poor quality image if you have allowed that option, or nothing at all. A large number of users (between 20% and 45% [at end November 2009] depending on which statistics you look at) do not use IE.

VML graphics are produced by using text-boxes, WordArt, and any other object produced using the FrontPage drawing toolbar. Due to the restrictions outlined above VML should never be used in a publically accessible web site.

WordArt and ShapeArt

You can make the WordArt or Shapes in Word, then copy and paste into a graphics program (Paint is suitable if you are using Windows XP). Crop and optimise the image, then save for the web as a .jpg or .gif (use a .gif if there are less than 256 colours in the image). Import the image into FrontPage and insert where required.

Note that ShapeArt uses Absolute Positioning, which will result in the objects "moving" as the browser is resized or the browser font-size changed. The shapes may also "move" if the page is edited.

VML Text boxes

Hyperlinks placed in VML text boxes may not work at all in some browsers, particularly non-IE, and probably the older (version 5.2 and earlier) and later (v10+) versions of IE.

Sometimes the down-level image is saved without the text (if a style sheet is used that effects the text), or with a different style of text - a blank rectangle or a box with half the txt missing may be displayed in non-IE browsers.

Text Boxes are also Absolutely Positioned. The problems exist for text-boxes as for ShapeArt, but additionally there can be display problems if there is any text in the text box and the browser font-size setting is changed, or if the browser viewport size is changed.

The table below shows how VML graphics appear when placed in a table. Resizing the browser, and/or adjusting the browser setting for font-size, will show some of the problems associated with using VML.

This page has been designed for Internet Explorer 6 running in Quirks mode, with viewport set to 800x600, and Normal text size. The preferred font face is set to Tamoha, size x-small (roughly equivalent to 10pt text in Microsoft Word with 100% zoom - but points do not apply to screen sizes). Other browsers (Netscape, FireFox, Opera etc.) may display the VML objects out of place initially - this is the number one problem with VML graphics: Display in other browsers. Adjusting the text-size and browser viewport will usually, but not always, bring things back into shape. In FireFox 3 (and later versions) be sure to set "Zoom text only" from the View menu.

The WordArt will remain where it should be as the browser window changes size, and as the font size is changed (using View->Text-size from the browser's menu). But the text box appears to move around the page, or rather, the page moves around the text box.

Similarly, the arrow and heart autoshapes also appear to move around as the browser and font are resized.

In browsers other than IE5.5 and later (up to IE9) the graphics are replaced (if that option is chosen) by low quality .gif images. The Text Box, and it's contents, is replaced by a single image, which means that any links in the text box will fail in browsers like IE10, IE11, Firefox, Netscape, Konqueror, Safari, Chrome etc.

Text Box The text box is shown left, the WordArt and other shapes below.

Sometimes the text box is saved with no text, as in this example saved from VML-graphicsOK.aspx. VML-graphicsOK.aspx has been removed because the fix only works in early versions of Internet Explorer (IE7 and earlier)


heart shapeRight pointing arrow WordArt representation

Also note, if validation is important, WordArt will not display in Internet Explorer if a valid XHTML doctype is used, though the other forms of VML graphics will.