RawXml for /wsg_presentation/Part1_using_xslt.xf?slideNum=2

This website produced with XsltFilter. The Page.Response buffer output is shown below.

Return to normal view of page  

<? xml-stylesheet type="text/xsl" href="presentation.xsl" ?>
<presentation  title="Using XSLT to make websites" comment="Part 1 of the XSLT presentation I gave at WSG">
<!--   *************** new slide ************************************* -->
<slide caption="Overview">
<section> XSLT is a powerful W3C standard for transforming documents from XML into some other format. <br/>
<br/>
When using XSLT in websites, the XML data is obviously transformed into HTML. <br/>
<br/>
The benefit of this process is that the design of the website, that is the HTML, CSS and image files, are managed entirely seperately from the content of the site, which is pure XML based content. <br/>
<br/>
This presentation will discuss how this separation can help with large websites, and will give some examples on using XSLT to generate the HTML on a website. Lastly, a discussion of using XLST for a XML based CMS system will be discussed. </section>
<section heading="Who is this presentation aimed at?"> This presentation provides WSG members with an broad overview of XSLT technology. It does not try to teach anyone XSLT, and I am not suggesting that everyone should change to XSLT. The presentation simply explains what XSLT is and how it may be relevant to WSG members. </section>
<!--   and show the index -->
<index/>
<a href="Part2_CMS_XSLT.xf"/>Part 2/</a> contains the CMS stuff. </slide>
<!--   *************** new slide ************************************* -->
<slide caption="Frequently Asked Questions">
<question>Why use XSLT?</question>
<answer> XSLT allows a website developer to separate the website content from the design of the website. </answer>
<question>Does XSLT replace CSS or HTML?</question>
<answer> Not at all. It works with HTML and CSS. </answer>
<question>Is it well supported?</question>
<answer> Yes, XSLT is very widely supported in the software industry. Almost every major software vendor has one or more XSLT related poducts, and there are products for all major platforms. </answer>
<question>Why not use other template based systems?</question>
<answer> Let me preface this answer by saying... if it aint broke then dont fix it.<br/>
<br/>
Here are the reasons to choose XSLT for a template language:
<ul>
<li>XSLT is the official W3C standard that is relevant to templating websites</li>
<li>XSLT is is very widely supported by both major software vendors and the open source community</li>
<li>The skills required for XSLT can easily be applied to non web based projects</li>
<li>All modern computer science courses teach XSLT</li>
</ul>
And reasons for not using a proprietary templating engine...
<ul>
<li>they are rarely supported by multiple vendors across multiple platforms.</li>
<li>the skills are are not transferrable to other projects</li>
</ul>
</answer>
<question>Are there XSLT editors?</question>
<answer> Many of them, both stand-alone, web based and and then there are those that come bundled as part of a larger suite or integrate into an existing editor. eg: Visual Studio, Homesite, Eclipse, EMACS. </answer>
<question>Which sites are best suited to XSLT?</question>
<answer> Large database driven websites are prime candidates for XSLT. Sites with a XML based CMS system are probably already using XSLT. </answer>
<question>Should I convert my site to XSLT?</question>
<answer> No. If it aint broken, then dont touch it. </answer>
</slide>
<!--   *************** new slide ************************************* -->
<slide caption="Separating content from design"> Using XSLT separates the content from the design. This has many benefits which should be well known to WSG members.
<ul>
<li>it encourages consistent design</li>
<li>it simplifies site development and maintenance</li>
</ul>
<section heading="CSS does not separate content from design"> Contrary to popular belief, CSS does not separate content from design; it does remove the formatting and positioning elements of the design from the HTML code, but the webpages still contain layout instructions.<br/>
<br/>
Worse still, even well written HTML often contains redundant code for a specific purpose; an obvious example is menus that use a <ul>, <li>, <a> tag structure to accomodate screen readers.<br/>
<br/>
True separation requires the webpages contain content and only content. All layout and formatting elements must be kept in the design layer. </section>
<section heading="XSLT allows true separation of content from design"> When using XSLT to generate the HTML, the webpages are pure XML data containing no layout or formatting code. All design related markup is kept in the XSLT files. <br/>
<br/>
This is true separation of the content from the design and it carries with it some additonal benefits which cannot be achieved with CSS alone:
<ul>
<li>every page has consistent layout code</li>
<li>every page has consistent design elements</li>
<li>it is much easier to write valid HTML</li>
<li>multiple site designs are possible</li>
<li>site redesigns are easier</li>
</ul>
As an added benefit, the webpages containing the content are concise and clear. </section>
</slide>
<!--   *************** new slide ************************************* -->
<slide caption="Sample XSLT Transformation"> XSLT uses 'template rules' to transform the original XML data into HTML.
<ul>
<li>a template rule defines the HTML which is sent to the brower</li>
<li>the xml data determines which template rule is executed </li>
</ul>
Shown below is a short example of how the transformation process works.
<section heading="A book entry with 2 authors"> Four our simplified example we will use XML data that describes a book entry with a title, two authors and a message about one of the authors.
<code type="xml">
<book title="Winemakers Guide to Success">
<author>Peter Bovine</author>
<message>Peter will be instore this Friday</message>
<author>Wilfred Cunningham</author>
</book>
</code>
Look closely at the tags and attributes in the XML above. They describe the content in a clear and concise manner. </section>
<section heading="The XSLT"> XSLT uses 'template rules' to produce the HTML. In this example there are 3 rules: one for the book, one for the author and one for the message.
<code type="xml">
<xsl:template match="book">
<div class="book">
<span class="title">
<xsl:value-of select="@title"/>
</span>
<xsl:apply-templates/>
</div>
</xsl:template>
<xsl:template match="author"> Author:
<xsl:value-of select="."/>
<br/>
</xsl:template>
<xsl:template match="message">
<strong>
<xsl:value-of select="."/>
</strong>
<br/>
</xsl:template>
</code>
</section>
<section heading="The HTML that will be produced"> And the result would be the followng HTML. It has the book title, an author, a message and the second author as it appears in the XML data, but with the layout code supplied by the matching template rules.
<code type="xml">
<div class="book">
<span class="title">Winemakers Guide to Success</span>
Author: Peter Bovine<br/>
<strong>Peter will be instore this Friday</strong>
<br/>
Author: Wilfed Cunningham<br/>
</div>
</code>
</section>
</slide>
<!--   *************** new slide ************************************* -->
<slide caption="XSLT Candidates"> The following type of websites are prime candidates for using XSLT.
<ul>
<li>Large sites</li>
<li>Database driven sites</li>
<li>Sites that use XML based CMS</li>
<li>Sites where development team is separate from design team</li>
</ul>
The bigger the site, and the more dynamic the site, the bigger the benefits. <br/>
<br/>
Static sites of less than 20 pages may not get much benefit from using XSLT. </slide>
<!--   *************** new slide ************************************* -->
<slide caption="Obstacles to using XSLT">
<section> The first and major obstacle to developing a site with XSLT is finding people with the skills to develop the site. <br/>
<br/>
The second obstacle is that hosting requires server side processing, which is more expensive than normal hosting. Fortunately, this obstace is easily overcome with money. </section>
<section heading="Advice for those wishing to learn XSLT"> Any experienced programmer who can navigate XML documents with ease and is extremely competent in hand-coding HTML can learn XSLT in a few days. <br/>
<br/>
But I cannot stress this next point strongly enough, those two skills are
<u>essential pre-requisites</u>
. <br/>
<br/>
Before using XSLT to make websites, you must have:
<ul>
<li>Extensive real world experience with HTML</li>
<li>Thorough understanding of using XPATH with XML documents</li>
</ul>
If you do not know XML, or cannot easily hand code good HTML, then learning XSLT will probably be an insurmountable challenge. <br/>
<br/>
If you have a problem in either of the areas listed above, then my advice is brush up on your hand coding HTML skills and do a few projects that require extensive use of XPATH before even attempting to learn XSLT. I'm not kidding. If you cannot do both the HTML and the XPATH then go off and learn them thoroughly before trying to learn XSLT </section>
<section heading="What is the bext book for learning XSLT">
<strong>Just XSL</strong>
by John E. Simpson is the best book I've come across. Very in depth, well written and aimed at serious developers who want to use XSLT to make websites. </section>
</slide>
<!--   *************** new slide ************************************* -->
<slide caption="Which XSLT system do I use">
<section><br/>
<br/>
Warning: extreme geek talk follows!.<br/>
</section>
<section heading="XsltFilter - OpenSource"> I use <a href="http://xsltfilter.tigris.org"/>XsltFilter/</a>. Actually, I wrote XsltFilter. It is an ASP.NET filter that transforms the output of XML based pages into HTML. Once installed, it is very simple to use. This presentation (and my personal website) are built using static XML files that are transformed using XsltFilter. <br/>
<br/>
From a development perspective, any experienced ASP.NET developer with XSLT skills could learn how to develop for XsltFilter in approximately 30 seconds, and most of those 30 seconds will be spent convincing the person that they already know absolutely every single thing they need to know to use XsltFilter... it is that simple to use. </section>
<section heading="Maverick - OpenSource"> Maverick is a very mature Front Controller Design Pattern that provides true Model-View-Controller (aka. Model 2) separation of the design layer. <br/>
<br/>
There are 3 versions of Maverick:
<ul>
<li>Original Java version, called <a href="http://mav.sourceforge.net/"/>Maverick/</a></li>
<li>DotNet version, called <a href="http://mavnet.sourceforge.net/"/>Maverick.NET/</a></li>
<li>And finally, a PHP version of Maverick called <a href="http://amb.sourceforge.net/"/>Ambivalence/</a></li>
</ul>
I have used both the Java and DotNet versions of Maverick, and whilst the Java one is excellent, the DotNet version was easier to use because of DotNet's native support for Xml serialization and Xslt. The reason I don't use Maverick for my own work is that I prefer the Page Controller Design Pattern over the Front Controller Design Pattern, and the first person to prove to me they understand this last paragraph gets a chocolate. </section>
</slide>
<!--   *************** new slide ************************************* -->
<slide caption="Helpful links">
<ul>
<li><a href="http://www.w3c.org/Style/XSL/"/>W3C - XSL and XSLT/</a>: the offical W3C site for XSL</li>
<li><a href="http://www.marrowsoft.com/Products.htm"/>Xselerator/</a>: my preferred XSLT editor</li>
<li><a href="http://www.topxml.com/xslathome/"/>Xslt at home/</a>: Homesite XSLT extensionsx</li>
<li><a href="http://www.xfront.com/rescuing-xslt.html"/>Rescuing XSLT from Niche Status/</a>: the name says it all</li>
<li><a href="http://woric.net/xml_xsl.xf"/>XSL pages at Woric.net/</a>: my regular list of XSLT links</li>
</ul>
</slide>
</presentation>