The World Wide Web (Web) is a visually complex, dynamic, multimedia system that can be inaccessible to people with visual impairments. SADIe uses semantic annotations of a Website's Cascading Style Sheet (CSS) to drive a transformation process that can improve access to content for visually impaired users. The original process of annotating the CSS involved the use of an upper ontology, extended by a site specific lower ontology. While this approach provided rich annotation of the CSS terms, experience suggests that components within the model were inappropriate for the interactive system we were developing. This experience has led to a more pragmatic approach that still provides the necessary semantics required to drive the SADIe transcoding tool, but in a more lightweight manner. This paper describes the lessons learnt from building the ontological models for the SADIe platform, highlighting pitfalls that developers of ontologies in interactive systems should be wary of.

1. Exposing Semantics To Drive Transcoding Darren Lunn, Sean Bechhofer and Simon Harper

2. 2/28 Summary Visual Rendering Can Provide Semantic Information Semantics Can Be Used to Drive a Transformation Process Poor Design Decisions Can Hinder Flexibility and Adoption A Well Defined Model and a Little Pragmatism Goes a Long Way

3. 3/28 The Web Focuses on Presenting Information in a Visual Manner Images Columns Chunks Some Knowledge is only Available Implicitly from the Page Rendering

4. 4/28 Implicit Knowledge Advertisement Banner Menu Main Content

5. 5/28 Assistive Technology Visually Impaired Users use Assistive technologies e.g. Screen Readers Render Pages Sequentially in Audio Achieved by Accessing the Underlying HTML Focus on Visual Presentation Rather than Content Hampers This Particularly if Attention is Not Paid to Coherent Design Subtleties of Visual Presentation Can be Lost

6. 6/28 Accessing CNN In Audio

7. 7/28 Screen Readers Traversal of Content is Serial Top-to-bottom Left-to-Right Important Information may not be Encountered Until Later On. Information Such as Menus may be Repeated for Every Page Tiresome if the User has to Wait for the Menu for Each Page

8. 8/28 SADIe Approach Main Story Heading Banner Menu Banner Story Overview Headline Story Overview Main Story Tabs Advertisement Image

9. 9/28 Original Annotation Solution Use an Ontology as an Abstraction to represent Basic Concepts Appearing in the Page Annotate the CSS Rather than the Page

10. 10/28 Proposed Solution Ontology Transformed Page HTML Rendered Page CSS

11. 11/28 Two-Part Ontology An Upper Ontology Provides Basic Information about Authoring Concepts This is Extended to Provide information about Particular Style Sheets The Definitions in these Ontologies Provide the Annotation of the CSS Elements

12. 12/28 Architecture Application Upper Ontology Site-Specific Extension HTML CSS

13. 13/28 Overarching Aim Describe Semantic Structure of Websites Use Inference Engines to Determine Relationships Between Elements of the Website Transcode Website Based on these Relationships

14. 14/28 Success? Transcoding was Successful on a Diverse Range of CSS-based Sites User Studies Demonstrated the Usefulness of the Transformations But the Model had Weakness that Limited The Approach

15. 15/28 Application Functionality vs. Semantic Structure SADIe Removable NonRemovable Menu Priority Low Medium High

16. 16/28 Application Functionality vs. Semantic Structure Menu High Priority Removable

17. 17/28 Separate Functionality From Domain Knowledge We Advocate Separation of Structure (HTML) from Presentation (CSS) Also Separate Knowledge from Application Functionality Split Ontology Into Two Push More Computation into the Application

18. 18/28 Why Separate Adds Flexibility to the Overall Application Adds Flexibility to the Overall Approach Easier For Designers to Construct

19. 19/28 General Relationships <pclass=“2ColumnFloat”> <divclass=“CNN_AdBox”>...</div> </p> CNN_AdBox is Contained Within a 2ColumnFloat 2ColumnFloat is Removable Therefore CNN_AdBox is Removable What If CNN_AdBox is Not Removable?

20. 20/28 Class Containment High Priority Removable hasPriority isRemovable CNN_AdBox 2ColumnFloat isContained Within

21. 21/28 Only Within That Instance CNN_AdBox is Contained Within a 2ColumnFloat Only Within this Instance CSS Properties Can Still be Applied Even If CNN_AdBox is Not Contained Within 2ColumnFloat

22. 22/28 A Little Testing Goes A Long Way Small Scale Testing Brings to Light Errors of Modelling Can not Expect To Know Everything Without Real World Case Studies Prevents Effort of Reengineering Prevents Loss of Faith in the Tool

23. 23/28 Be Pragmatic Designers are Not Ontology Engineers Significant Overhead Will Hinder Adoption Balance Between Minimal Effort but Enough Knowledge to not be Hindered

24. 24/28 New SADIe Architecture Application Structural Ontology HTML CSS

25. 25/28 CSS Role Property 2ColumnFloat{ -uom-structural-role:LinkedMenu; ... } Add a New Role to the CSS Still Validates Explicitly States What the Class Represents Values Based on WAfA Ontology Ontology of Accessibility and Web Authoring Concepts

26. 26/28 Benefits Less Overhead to Expose Semantics Non Destructive Still Provide Same Functionality New Transformations being Investigated Other Uses of the Exposed Semantics AiSC

27. 27/28 Conclusion Visual Rendering Can Provide Semantic Information Semantics Can Be Used to Drive a Transformation Process Poor Design Decisions Can Hinder Flexibility and Adoption A Well Defined Model and a Little Pragmatism Goes a Long Way

28. Questions http://hcw.cs.manchester.ac.uk