HTML to XML/XSL: Lessons Learned

Jay KnapeSenior Manager of Web Content Services

University Information & Technology ServicesColumbus State University

Topics:

• Introduction• Definitions• Migration• Future Plans• Lessons Learned• Q & A

Introduction

University

• Columbus State University• Columbus, Georgia • 100 miles southeast of Atlanta• 8,298 students (fall 2010)• 72 undergrad and 52 grad degrees• 4 colleges

Web Team

• Report to CIO• 4 Full-time Staff• 3 Part-time Student Assistants

Definition

XML is

• eXtensible Markup Language.• XML is designed to transport and store

data.

Benefits of XML

• Separates Data from Layout/Design• Simplifies Data Sharing• Simplifies Data Transport• Simplifies Platform Changes• Makes Your Data More Available for

Repurposing

XML Format

<?xml version="1.0" encoding="ISO-8859-1"?>

<bookstore>    <book category="WEB">    <title lang="en">Learning XML</title>    <author>Erik T. Ray</author>    <year>2003</year>    <price>39.95</price>  </book></bookstore>

<?xml version="1.0" encoding="ISO-8859-1"?>

<csu>

<!-- ACCT 2101 Principles of Accounting 1 (3-0-3) -->

<ACCT>

<scbcrse_subj_code>ACCT</scbcrse_subj_code>

<scbcrse_subj_name>Accounting</scbcrse_subj_name>

<scbcrse_crse_numb>2101</scbcrse_crse_numb>

<scbcrse_lec_hr_low>3</scbcrse_lec_hr_low>

<scbcrse_lab_hr_low>0</scbcrse_lab_hr_low>

<scbcrse_credit_hr_low>3</scbcrse_credit_hr_low>

<scrsyln_long_course_title>Principles of Accounting 1 </scrsyln_long_course_title>

<scbdesc_text_narrative>

A study of the underlying theory and application of financial accounting concepts. It introduces accounting as a decision making tool. Financial accounting principles, methods, and procedures, including assets, liabilities, equity, and financial statements are examined. (Course fee required.)

</scbdesc_text_narrative>

</ACCT>

</csu>

XML is like:

Syntax Rules

• All XML Elements Must Have a Closing Tag

• XML Tags are Case Sensitive• XML Elements Must be Properly Nested• XML Documents Must Have a Root

Element• XML Attribute Values Must be Quoted

Syntax Rules

• Entity References

• Comments in XML<!-- This is a comment -->

&lt; < less than

&gt; > greater than

&amp; & ampersand 

&apos; ‘ apostrophe

&quot; “ quotation mark

XSL is

• eXtensible Stylesheet Language • Components:

– XSL-FO– XSLT– XPath

XSL-FO is

• eXtensible Stylesheet Language Formatting Objects

• language for formatting XML data for output to screen, print or other media

XPath is

• a language for finding information in an XML document

• a syntax for defining parts of an XML document

• uses path expressions to navigate in XML documents

• contains a library of standard functions• a major component of XSLT

XSLT is

• eXtensible Stylesheet Language Transformations

• a way to transform an XML document into HTML

• far more sophisticated than CSS

XSLT is

XSLT 2.0

XSLT 2.0

XSLT 1.0

Velocity

EXSLT

Template-Based Publishing

XSLXSLT

2.0

Page

Page

XSLPage

Multi-File Output

Page XSLXSLT

2.0

XSL

XSL

Mobile Page

Web Page

PDF File

Migration

Process

• 2007 – RFP for Web Content Management System

• Selected OmniUpdate OUCampus• 2007 – 2010 – manually migrated sites

into CMS– Table designed HTML pages; CSS; PHP– CSS designed HTML pages; CSS PHP

Process

• 2010 – University Branding effort– Changed domain from colstate.edu to

ColumbusState.edu– New Logos– New Web Page designs

Page Layouts

Templates

Site Importing

XML Structure

• Let’s take a look at our XML file format

<?xml version="1.0" encoding="UTF-8"?>

<?pcf-stylesheet path="/z-omniupdate/xsl/default.xsl" extension="php"?>

<!DOCTYPE document SYSTEM "http://commons.omniupdate.com/dtd/standard.dtd">

<document>

<title></title>

<config>

<pageType></pageType>

<scripts></scripts>

<onLoad></onLoad>

</config>

<metadata>

<meta name="description" content="" />

<meta name="keywords" content="" />

</metadata>

<content>

<rightcontent></rightcontent>

<sidebox_title></sidebox_title>

<LeftInclude></LeftInclude>

<breadcrumb></breadcrumb>

<content></content>

</content>

</document>

XSL Structure

• default.xsl • Imports in additional files

– <xsl:import href="plain-w-nobox.xsl" />– <xsl:import href="plain-w-box.xsl" />– <xsl:import href="photos-w-nobox.xsl" />– <xsl:import href="photos-w-box.xsl" />– <xsl:import href="photos-w-redbox.xsl" />

Future Plans

Plans

• Transformation – With and Without CMS• Opportunity with XML/XSL is unlimited• XML storage for reusable content

– Course Descriptions– Degree Description/Requirements– Faculty Profiles/CV

Lessons Learned

Lessons Learned

• White-space is Preserved in XML• XML Naming Rules

– Names can contain letters, numbers, and other characters

– Names cannot start with a number or punctuation character

– Names cannot start with the letters xml (or XML, or Xml, etc)

– Names cannot contain spaces– Any name can be used, no words are reserved.

Lessons Learned

• Naming Practices– Avoid "-" characters. – Avoid "." characters.– Avoid ":" characters.– Non-English letters like éòá are perfectly legal

• XML elements are Case Sensitive

Lesson Learned

• Weak error reporting with vague messages

• No room for small typos and mistakes• Bell shaped learning curve• Invest in training and/or personnel• Database vs XML arguments

Q & A

HTML to XML/XSL: Lessons Learned

Jay KnapeSenior Manager of Web Content Services

University Information & Technology ServicesColumbus State University

knape_jay@ColumbusState.edu

Twitter: @knape_jay

References

• http://www.w3schools.com/xml• http://www.w3schools.com/xsl• http://www.w3schools.com/xslt