1. Illinois Center for Instructional Technology Accessibility (iCITA) Publishing Microsoft Word files to the Web Christy Blew, M.S. University of Illinois at Urbana/Champaign

2. Illinois Center for Instructional Technology Accessibility (iCITA) What you will need Illinois Accessible Web Publishing Wizard  Download the demo version of the Wizard from http://www.accessiblewizards.uiuc.edu http://www.accessiblewizards.uiuc.edu  Follow the directions for installing that are on the website. You will need to close PPT to install the program. Microsoft Word 2000 - 2003

3. Illinois Center for Instructional Technology Accessibility (iCITA) Web History 101 Why was the Web Invented?

4. Illinois Center for Instructional Technology Accessibility (iCITA) Web History 101 Answer Share information between scientists Interoperation with computer systems Public standards

5. Illinois Center for Instructional Technology Accessibility (iCITA) Interoperability Compatible Communications Paths  Information can be retrieved without having to have certain programs, browsers, or system platforms. Is the Web Interoperable today?  Why or why not?

6. Illinois Center for Instructional Technology Accessibility (iCITA) Do You Remember? Do we still see this today?

7. Illinois Center for Instructional Technology Accessibility (iCITA) Publishing to the Web What are some common formats:  we publish information to the web?  we publish documents to the web? Which of these formats meet the Interoperability test?

8. Illinois Center for Instructional Technology Accessibility (iCITA) Publishing Microsoft Word What saving formats does Word offer?  Look under the FILE menu in Word. What might be limitations to using each of these formats to publish a Word document to the web? Which format would be the most effective?

9. Illinois Center for Instructional Technology Accessibility (iCITA) Best Practices for MS Word What are Best Practices?  Collection of application functions including what to avoid when preparing Microsoft Office files. Best Practices for Word includes:  Headers  Images  Charts  Lists

10. Illinois Center for Instructional Technology Accessibility (iCITA) Why Worry About Best Practices? Limited “formal” training in Word Benefits of Best Practices  Creates a more structured document.  Improves conversion of document.  Save time while preparing a more quality document.

11. Illinois Center for Instructional Technology Accessibility (iCITA) Styles and Formatting User-defined formats that control the look and feel of paragraphs, characters, tables and lists. Best Practice:  Format your document using the Styling and Format functions.

12. Illinois Center for Instructional Technology Accessibility (iCITA) Styles and Formatting Location Open Microsoft Word  Locate the Styling and Format Toolbar  Locate the Styling and Format Sidebar

13. Illinois Center for Instructional Technology Accessibility (iCITA) Applying Styles and Formatting Prior to typing text:  Place the cursor at the spot where the Header will be inserted. Select the Header style, then type the text. Reformatting text:  Highlight the text that will be changed then select the style from the style choices.

14. Illinois Center for Instructional Technology Accessibility (iCITA) Styling and Format Activity Create a new document Open the Styling and Formatting as a sidebar Insert a few lines of text. Change text from normal to Heading 1 by using the Styling and Formatting toolbar. Change text to other styles. Notice how the current style is highlighted in the sidebar. Select a style then insert new text on a line

15. Illinois Center for Instructional Technology Accessibility (iCITA) Modifying Styles and Formatting The formatting style can be changed by selecting the arrow at the right of the style you are wanting to change. This will bring up the submenu. Select Modify and the Modify Style window opens. Make changes as desired and select OK to continue. Any text in the document with that style will change to the new format.

16. Illinois Center for Instructional Technology Accessibility (iCITA) Modifying Styling and Format Activity Change the “normal” style to Arial, 9 point. Notice how all text that uses this style has changed. Change the style of the different Headings. Use different fonts and sizes. Notice how all change. All formatting features can be changed including thing like indentation and line spacing.

17. Illinois Center for Instructional Technology Accessibility (iCITA) Styling and Format Thoughts Headers:  Separates sections of the document.  Creates an outline or table of contents for the document.  Headers are used in a heirarchy manner. H1 is generally the main point, H2 are the subpoints of H1, H3 are the subpoints of the H2, etc. Think of an oultline.

18. Illinois Center for Instructional Technology Accessibility (iCITA) Images Use:  Reference, emphasis, explanation, or aesthetics  Imported data objects Best Practice:  Use the “Insert” feature, not cut/paste from other source.  Use images that are representative of the content of the document.

19. Illinois Center for Instructional Technology Accessibility (iCITA) Inserting Images Insert, Picture, From File. Four Types:  Decorative  Decorative – No description  Informative  Chart

20. Illinois Center for Instructional Technology Accessibility (iCITA) Decorative Images A Decorative Image would be one that is placed in a document such as a logo or snapshot. The image does not convey any information about a process or action. A Decorative Image that would not use a description would be an image object with no value to the document. This may be a transparent image used as a spacer or an image that is used in conjunction with another aspect of the page, but does not convey any information.

21. Illinois Center for Instructional Technology Accessibility (iCITA) Informative Images An Informative Image is one that supports the context of the document and/or conveys information to the user. This may be an image that has been grouped together to form on single image or an Organizational Chart.

22. Illinois Center for Instructional Technology Accessibility (iCITA) Charts (Images) Used to represent a set of data, charts are a type of image.

23. Illinois Center for Instructional Technology Accessibility (iCITA) Images - Grouping Several images are selected and connected to create a single image. Select all image to be grouped (each will have a bounding box). Select GROUP from the DRAWING Toolbar (you can also right click to get the GROUP option).

24. Illinois Center for Instructional Technology Accessibility (iCITA) Images Activity Locate the DRAWING toolbar Insert various drawing items into your document Group/ungroup different objects Resize a grouped and an ungrouped image Save your document

25. Illinois Center for Instructional Technology Accessibility (iCITA) Lists Use:  Emphasize information, group information, or represent information in a certain order. Best Practice:  Create lists by using the Bullets and Numbering feature Two Types:  Ordered (1,2,3)  Unordered (bulleted)

26. Illinois Center for Instructional Technology Accessibility (iCITA) Lists - Ordered Ordered lists are a sequence of items followed in a particular order. Ordered lists are used with directions, such as the steps in a recipe. This type of list would include two or more list elements.

27. Illinois Center for Instructional Technology Accessibility (iCITA) Lists - Unordered Unordered lists can also be referred to as bulleted items. This type of list would include one or more list elements. Use the icon on the toolbar or open the Bullets and Numbering box from the format menu.

28. Illinois Center for Instructional Technology Accessibility (iCITA) List Activity When would you use:  An UNORDERED LIST?  An ORDERED LIST? Create an ORDERED LIST with 5 items Change the bullets on the UNORDERED LIST Change the bullets on the ORDERED LIST Save your document

29. Illinois Center for Instructional Technology Accessibility (iCITA) Charts Use:  Charts: Visual way of representing a group of data Best Practice:  Create charts within the program – datatable info is automatic.

30. Illinois Center for Instructional Technology Accessibility (iCITA) Charts - Inserting Open the DATASHEET window.  (INSERT then PICTURE then CHART) Enter your chart data into the table cells.  (Change the value by highlighting the value and typing in a new value or use the up and down arrows to select a value.) Close the datasheet window to return to chart. Select the chart to activate the datasheet window again.

31. Illinois Center for Instructional Technology Accessibility (iCITA) Chart Activity - Inserting Insert chart using the INSERT function Change the information in the data table Exit the chart editing mode Save your document

32. Illinois Center for Instructional Technology Accessibility (iCITA) Charts - Format chart Select chart to activate.  (Active chart has diagonal-lined box around it) Select option from CHART menu item.  (This is only visible when chart is active) Make format changes to chart type, colors, font, etc.

33. Illinois Center for Instructional Technology Accessibility (iCITA) Chart Activity - Formatting Insert a new chart or use an existing one Change the chart styling Change one of the formatting options Save your document

34. Illinois Center for Instructional Technology Accessibility (iCITA) Final Touches Presentation Properties Save Presentation

35. Illinois Center for Instructional Technology Accessibility (iCITA) Final Touches Activity Open the PROPERTIES for the document Insert your information Save your document

36. Illinois Center for Instructional Technology Accessibility (iCITA) Best Practices for Word Review Styling and Format Images Lists Charts Properties

37. Illinois Center for Instructional Technology Accessibility (iCITA) Publishing to the Web - Review What are some common formats:  we publish information to the web?  we publish documents to the web? Which of these formats meet the Interoperability test?

38. Illinois Center for Instructional Technology Accessibility (iCITA) Convert to HTML Why convert to HTML??  Reach a larger audience  Offer current audience more efficient way to get information  No secondary program needed to view  No worry about converting from.doc to other format  Better usability for all, including those with disabilities

39. Illinois Center for Instructional Technology Accessibility (iCITA) Word to HTML Publish your Word Document to the Web in Accessible HTML Format: Accessible Web Publishing Wizard for Microsoft ® Office

40. Illinois Center for Instructional Technology Accessibility (iCITA) Accessible Web Publishing Wizard for Microsoft ® Office Provides a simple way to create highly accessible and standards compliant web versions of Office documents More accessible and usable by everyone, including people with disabilities. Supports everyone from legacy browsers and slow Internet connections to the needs of blind users with screen readers. Documents created with the Wizard can be put on the web, e-mailed to colleagues, shared on intranets and read with a wide variety of web browsers.

41. Illinois Center for Instructional Technology Accessibility (iCITA) Starting the Wizard Review document and Best Practices Start Wizard by selecting “Save as Accessible Web page” from FILE menu

42. Illinois Center for Instructional Technology Accessibility (iCITA) Splash Screen

43. Illinois Center for Instructional Technology Accessibility (iCITA) Document Info If you have entered information into the properties box, the Wizard will extract the information automatically.

44. Illinois Center for Instructional Technology Accessibility (iCITA) Images The Wizard will promt you for the type of image an object represents and ask for the appropriate descriptions based on your choice.

45. Illinois Center for Instructional Technology Accessibility (iCITA) Charts When a chart is created in the document, the Wizard automatically exports the datatable information. You only need to enter description information.

46. Illinois Center for Instructional Technology Accessibility (iCITA) Charts that are images When a chart is an imported object, the Wizard will prompt you for datatable variables.

47. Illinois Center for Instructional Technology Accessibility (iCITA) Exporting Select a background color based on your presentation

48. Illinois Center for Instructional Technology Accessibility (iCITA) Output Options

49. Illinois Center for Instructional Technology Accessibility (iCITA) Saving Select Save Output: Save to disk Save to ZIP file Save to WebDAV

50. Illinois Center for Instructional Technology Accessibility (iCITA) Using the Demo Version of the Wizard The demo version of the Wizard will only convert the first 1200 – 1500 visible character of your document To experience the Wizard to its full extent, include the following in the first part of your document:  Text that incorporates at least 3 headings  At least one decorative image  At least one informative image  At least one chart created by using the Insert Chart function  At least one “chart” that is an imported image

51. Illinois Center for Instructional Technology Accessibility (iCITA) Conversion Activity Using the Accessible Web Publishing Wizard, convert the document “styling.doc” to HTML format. Designate images:  decorative image  informative image  chart (created from using the Insert Chart feature)  chart (an imported image/graphic) Open the new HTML document

52. Illinois Center for Instructional Technology Accessibility (iCITA) Word to HTML - Views How did the Wizard utilize your Heading structure? How did the charts output? How can saving Word documents as HTML benefit individuals?  with disabilities?  without disabilities?

53. Illinois Center for Instructional Technology Accessibility (iCITA) Why the Wizard? There are several ways to export Word to HTML out there, why use the Wizard?  CSS based output with clean code  Build in accessibility without having to have a knowledge of accessibility or HTML  Creates an output usable by everyone including those with disabilities

54. Illinois Center for Instructional Technology Accessibility (iCITA) Accessible Web Publishing Wizard for Microsoft ® Office Free demo version available at www.accessiblewizards.uiuc.edu License Options: Standard Licenses starting at $39.95 and discounts with the more you buy (bundled purchase) Site Licenses (annually renewed) starting at $10.00 per computer for 100 computers and discounts with the more you buy. Special Offers for Illinois Institutions

55. Illinois Center for Instructional Technology Accessibility (iCITA) More information Thank you for your interest. Comment or questions can be sent to Christy Blew, clblew@uiuc.edu clblew@uiuc.edu Other Office to Web Training Information:  http://www.cita.uiuc.edu/presentations/office2web/index.php http://www.cita.uiuc.edu/presentations/office2web/index.php