Review: Altova StyleVision

By Dave Gash

Bookmark and Share


Click a link below to jump to a particular section; click any "CONTENTS" image following a section heading to jump back here.

Introduction    Link to the review contents

Altova, the Vienna-based vendor of the popular XMLSpy editor, plus MapForce, DatabaseSpy, DiffDog, and more, has released StyleVision, a broad-spectrum WYSIWYG XSLT editor that may be their most ambitious undertaking to date. Altova calls StyleVision a "stylesheet designer," but that technically accurate designation doesn't really do the software justice. They could have called it a "schema-based WYSIWYG drag-and-drop XML / XBRL / database visual page editor and XSLT / XSL-FO / HTML / RTF / PDF / Word / e-forms generator," but I'm guessing that wouldn't have made it past the suits in Marketing.

Nevertheless, StyleVision is all that and more. With StyleVision, you draw your desired output page visually, much like you would draw an app form in Microsoft Visual Studio or a web page in Adobe Dreamweaver. In this page you include both static content (text, images, form elements) and dynamic content (XML nodes, database elements). When you're done, StyleVision generates the XSLT transforms needed to convert your data sources into one or more desired output formats that look like your original design. And all this without coding! (I know, right?)

In a nutshell, StyleVision generates standards-conformant XSLT and XSL-FO stylesheets based on your design, enabling true single-source, multi-output, dynamic-content publishing. Believe me, that's a neat trick if you can do it, and StyleVision can.

Altova StyleVision comes in Standard ($129), Professional ($319), and Enterprise ($629) editions. For this review, I used the free Enterprise 2010 30-day trial edition.

The Basic Idea    Link to the review contents

XSLT transforms are the "programs" that change structured, hard-to-read data in XML files and databases into formatted, visually pleasing online or print pages. If you've seen me speak on XSLT at WritersUA in recent years, you know that XSLT isn't rocket science, but it can be tricky. Plus, as you write the XSLT, you have to know your data sources, understand their schemas, and carefully code for the output format at all times. Frankly, if you aren't kind of a bit-flipper by nature, writing XSLT transforms can be a daunting and difficult task.

StyleVision's job is to write those transforms for you from your WYSIWYG design. It takes in schema-based content references and spits out transforms that process the content and produce the final output. Let's look at a graphic that may help clarify things.

The basic StyleVision workflow

This may all seem a bit confusing if you think you're designing an output page layout. But you aren't; what you're really designing is an XSLT stylesheet, only visually instead of with code. Hence the name Style...Vision, heh heh.

Design Methods    Link to the review contents

StyleVision is flexible and allows you to approach page design however you like. For example, you can focus on the page interface, specifying the visual design first and adding content later, or you can begin by importing data from an XML, XBRL (eXtensible Business Reporting Language), or HTML file or from a database (all major databases are natively supported) and then design the interface around the data.

Further, you can work in what StyleVision calls Free-flow or Form-based mode. Free-flow mode is used for designing reports, documentation, books, news articles, and the like. Here you can mix text, images, and tables on a page and let StyleVision wrap and fit elements according to their size. Free-flow mode is most useful where there is a significant amount of data and absolute positioning is not required. Form-based mode is used for creating forms that contain input elements, edit controls, and precisely-placed text and images. In Form-based mode, each page is designed independently of others and elements are placed exactly where you specify. Form-based mode is most useful where there is a small amount of data that must be precisely controlled by specific page elements.

In a "small stroke of genius" (which, in my opinion, is a serious oxymoron on the order of "Ed Hardy fashion"), Form-based mode also includes a blueprint capability. Blueprinting allows you to import an image of an existing form (paper or online) and then create a matching page design over the blueprint — an intuitive, elegant, and effective way to create a form. Clever rascals, those Viennese!

StyleVision analyzes your visual page layout, including text, images, controls, data, and data references, and saves the design in an XML file called a StyleVision Power Stylesheet, or SPS. We'll talk more about SPSs later.

User Interface    Link to the review contents

To its credit, there's nothing particularly remarkable about the StyleVision interface. Everything is where you expect it to be, and does what you expect it to do. Menus, toolbars, tabs, dockable panes, and central work area are all appropriately positioned, with high-level, general information panes (Project, Design Overview, Schema Tree) on the left and low-level, specific information panes (Styles, Properties) on the right. Users of any multi-pane tool like MadCap Flare or  Blue Sky   eHelp   Macromedia  Adobe RoboHelp will feel right at home.

The StyleVision interface

One interesting feature of the main document pane is a series of preview tabs along the bottom. As you design a stylesheet page, you can preview the results at any time in various output formats, including Altova Authentic (an included WYSIWYG XML editor), HTML, RTF, PDF, and Word 2007. This makes it convenient to quickly test small, simple changes as you work instead of waiting to test large, complex change blocks with infrequent builds.

The SPS    Link to the review contents

The SPS is your complete page design, rendered as StyleVision-specific XML. It begins with a schema — an XSD, DTD, database schema, or user-defined schema. You can even use multiple schema sources for the same page. Once selected, the schema is added as a schema source in the Design Overview and Schema Tree panes. From this point, you can add content as needed, either dynamic or static.

Let's talk about dynamic content first. Dynamic content comes from an XML data file or a database; but remember, it's really about content references rather than actual content. For example, to add an XML node from an input file to your page, just drag it from the Schema Tree pane to the central document pane. Of course, because the node's content may change later, its current content is always used at output generation time. You can also use this method to add XML element attributes, thereby obtaining data not present in the parent element's actual value.

Static content, on the other hand, is content you enter directly into the page, content that never changes. Text and images that introduce or clarify the data are good examples of static content. For example, in the page design pane, you can type text or insert graphics in or between XML nodes; these items will appear in the output stream just where you put them in relation to the data. This allows you to place both single- and multiple-appearance static elements into the page design, so the final product looks just the way you want.

To help illustrate this distinction, here are two screen shots from the StyleVision tutorial showing dynamic and static content. The first is the design pane in native mode, showing dynamic XML elements (which I've boxed in blue) and static elements (boxed in red, both inside and outside the dynamic elements).

Dynamic and Static elements in Design mode

The second is the HTML preview mode; as you can see, the blue-boxed dynamic elements (headline, date, city, and country) deliver recurring data from the XML file, while the red-boxed static elements (main graphic, press release header, and comma/space separating city and country) appear either once or repeatedly, depending on their placement.

Dynamic and Static elements in HTML Preview mode

By adding dynamic and static content in this way, you can design your page to contain exactly what you want, where you want it. And by the way, just in case you feel like the Design mode shot above doesn't look much like WYSIWYG (sniffle) because (boo hoo) you can see (whimper) the XML markers (oh wah), I offer for comparison a tiny little snippet of the actual SPS file wherein your design actually resides. You know, the one you don't have to write from scratch. Say, "Thank you, StyleVision."

StyleVision says, "You're welcome."

Seriously, don't be put off by the tag markers in Design mode. They're there to let you see what will appear in the output stream, and where. The term WYSIWYG as used here really applies to the XSLT templates you're creating, not to the final page appearance. As the Eagles sang, "Are ya with me so far?"

Formatting    Link to the review contents

Up to now we've just put dynamic and static data into our page design, and left the rendering to the output medium. The HTML preview above, for example, is definitely in default mode: Times Roman font, left justified, black on white. The only even remotely interesting formatting is the bolded "For Immediate Release." Yawn.

Fortunately, StyleVision provides several ways to format your output. First, there's (ugh) local formatting — certainly not the recommended method, but there when you need it. Alternately, you can insert any of various convenient predefined formats, and you can assign any page component to a class attribute to make it easier to style across the board. The Styles pane makes it easy to visually select and edit virtually any style property you need.

Apart from individual styles, you can also create global style rules to control the entire output or chunks of it. And of course you can easily attach an external CSS stylesheet (yes, I know that's redundant; get over it) of your choice to ensure style compatibility and consistency. Here's a just slightly spiffed-up version of the above page, with some local formatting and style classes added.

Tutorial page with some styles applied

Finally, you can even create global templates containing formatting, layout, and processing rules to be reused throughout your design, or applied only when certain conditions exist in the source data. Global templates let you define rules for presenting specific elements wherever they appear in the output, without having to treat each occurrence separately.

Output    Link to the review contents

When you're ready to see the actual results of your design, StyleVision analyzes your SPS file and generates XSLT and/or XSL-FO stylesheets. From one SPS, you can generate stylesheets for HTML, RTF, PDF, and Word 2007 output, depending on which version of StyleVision you have. Standard Edition supports HTML only; Professional and Enterprise Editions also support RTF; Enterprise Edition adds PDF and Word 2007. The resulting stylesheets will transform your content from one format to another faster than Ru Paul on a hot date.

Typically, the stylesheet team (you) would then deliver the XSLT and XSL-FO stylesheets to the publication team (also you), and use them to process the input XML files or database content into the required output formats for the distribution team (yup, still you). The beauty of this process is that once the XSLT stylesheets are written, they can repeatedly process any number of content files as long as they conform to the original schema.

But you aren't locked in to that process. There's one more terrific feature called Direct Output, where StyleVision skips saving the XSLT transforms and just generates the final output. Simply choose File > Save Generated Files and write the freshly minted HTML, RTF, PDF, or Word file straight to disk. Naturally, the above output restrictions by edition apply here as well.

Summary    Link to the review contents

StyleVision is one of the most interesting software applications I've seen in years. Without question, it offers a new and unique approach to XSLT transform authoring, a skill formerly reserved for beanie-wearing, pocket-protector using, syntax-obsessing code jockeys such as your humble reviewer. It allows more of the tech pubs workforce than ever to transform raw data into aesthetic, useful pages.

While some coders might lament the loss of a previously proprietary skill set to non-programmers, the fact is that spreading knowledge around is a good thing. Make no mistake: as more people use a technology, the better that technology becomes, and StyleVision's application of the WYSIWYG concept to XSLT is a shining example.

Thank You...    Link to the review contents

...for reading this review! Here are some links to more StyleVision info (each opens in a new window):


   HyperTrain dot Com


Dave Gash

Dave Gash owns HyperTrain dot ComExternal link, a California firm specializing in training and consulting for hypertext developers. A veteran software professional with over thirty years of programming, documentation, and training experience, Dave holds degrees in Business and Computer Science, and is well known in the tech pubs community as an interesting and animated technical instructor. Dave is a frequent speaker at User Assistance seminars and conferences in the US and around the world.


Copyright © WinWriters, Inc. All Rights Reserved.
shannonm *at* writersua *dot* com
Last modified on