Transcript Publishing Microsoft Word file to the Web

Publishing Microsoft
Office to the Web
Christy Blew, M.S.
University of Illinois at Urbana/Champaign
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
Follow the directions for installing that are on
the website. You will need to close all Office
programs to install the program.
PowerPoint and Word 2003
Illinois Center for Instructional Technology Accessibility (iCITA)
Web History 101
Why was the Web Invented?
Share information between scientists
Interoperation with computer systems
Public standards
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?
Illinois Center for Instructional Technology Accessibility (iCITA)
Do You Remember?
 Do we still see this today?
Illinois Center for Instructional Technology Accessibility (iCITA)
Best Viewed With - An Opinion
"Anyone who slaps a 'this page is best viewed with
Browser X' label on a Web page appears to be yearning
for the bad old days, before the Web, when you had very
little chance of reading a document written on another
computer, another word processor, or another network."
-- Tim Berners-Lee in Technology Review, July 1996
Illinois Center for Instructional Technology Accessibility (iCITA)
Publishing to the Web
What are some common formats:
 we publish information to the web?
Which of these formats meet the
Interoperability test?
Illinois Center for Instructional Technology Accessibility (iCITA)
Publishing Office to the Web
 What saving formats does Office offer?
 Look under the FILE menu in PPT or Word
 What might be limitations to using each of these
formats to publish a Office to the web?
 Of the formats available, which would be the
most effective?
Illinois Center for Instructional Technology Accessibility (iCITA)
Best Practices for Office
 What are Best Practices?
 Collection of application functions including what to
avoid when preparing Microsoft Office files.
Illinois Center for Instructional Technology Accessibility (iCITA)
Best Practices for…
 PPT include:
 Word includes:
 Slide Layout
 Headers
 Slide Titles
 Images
 Images
 Grouping Objects
 Grouping Objects
 Charts
 Charts
 Lists
Illinois Center for Instructional Technology Accessibility (iCITA)
Why Worry About Best Practices?
Limited “formal” training in PPT and Word
Benefits of Best Practices
 Creates a better structure.
 Improves conversion.
 Save time while preparing a more quality
output.
Illinois Center for Instructional Technology Accessibility (iCITA)
Best Practices for Word
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.
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
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.
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
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.
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.
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.
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.
Illinois Center for Instructional Technology Accessibility (iCITA)
Inserting Images
 Insert,
 Picture,
 From File.
 Four Types:
 Decorative
 Decorative – No description
 Informative
 Chart
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.
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.
Illinois Center for Instructional Technology Accessibility (iCITA)
Charts (Images)
 Used to represent a set of data, charts are a type of image.
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).
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
Illinois Center for Instructional Technology Accessibility (iCITA)
Morning Break
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)
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.
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.
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
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.
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.
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
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.
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
Illinois Center for Instructional Technology Accessibility (iCITA)
Final Touches
 Presentation
Properties
 Save Presentation
Illinois Center for Instructional Technology Accessibility (iCITA)
Final Touches Activity
Open the PROPERTIES for the document
Insert your information
Save your document
Illinois Center for Instructional Technology Accessibility (iCITA)
Best Practices for Word Review
 Styling and Format
 Images
 Lists
 Charts
 Properties
Illinois Center for Instructional Technology Accessibility (iCITA)
Best Practices for PowerPoint
Illinois Center for Instructional Technology Accessibility (iCITA)
Slide Layout Templates
 Use:
 Allows for consistency with spacing, font sizes, etc.
 Avoids the chance of random objects “hiding” on the
page.
 Help you to avoid the “cut and paste” temptation.
 Best Practice:
 Select Slide Layout templates from sidebar
Illinois Center for Instructional Technology Accessibility (iCITA)
Slide Layout Template - Location
 The Slide Layout is a
sidebar generally located
on the right side of the
PPT screen.
 Access from the Format
menu item on the main
menu.
Illinois Center for Instructional Technology Accessibility (iCITA)
Slide Layout Location Activity
Locate the Slide Layout template in PPT
Close the template (select the X in the top
right corner)
Open the template from the FORMAT
menu.
Illinois Center for Instructional Technology Accessibility (iCITA)
Applying Slide Layout Templates
 Select a template from the
Slide Layout library to apply to
your slide.
 Change the template by
selecting a different Slide
Layout.
 Submenu options.
 You can change the layout of a
slide at any time in your
presentation creation.
Illinois Center for Instructional Technology Accessibility (iCITA)
Slide Layout Template: Am I Using?
 Select your slide. If you are using a layout
template, it will highlight in the Slide Layout
sidebar.
Illinois Center for Instructional Technology Accessibility (iCITA)
Slide Layout: Results
Illinois Center for Instructional Technology Accessibility (iCITA)
Slide Layout Activity - Creation
Start a new PPT presentation
Use the Title Slide template and create a
starting page
Using different layouts, create 3 new
slides and add content
Save your PPT
Illinois Center for Instructional Technology Accessibility (iCITA)
Slide Layout Activity - Changing
 Switch between your slides, notice how the
template is highlighted in the Slide Layout
sidebar.
 Change the layout of your slide using the Slide
Layout sidebar.
 What happened when you selected a different
template?
Illinois Center for Instructional Technology Accessibility (iCITA)
Slide Layout Template - Review
 Why would you use the Slide Layout templates
instead of just inserting text boxes?
 How can using the Slide Layouts benefit your
presentation?
 How can you update an old PPT that maybe is
not using Slide Layout Templates?
Illinois Center for Instructional Technology Accessibility (iCITA)
Thinking Cap
PowerPoint can automatically
create an outline of your
presentation.
True/False?
Illinois Center for Instructional Technology Accessibility (iCITA)
Thinking Cap - Slide Titles
TRUE!
Use Slide Titles to define the information on the
slide as well as create a navigational outline for
the presentation
and/or
Enter your Slide Titles directly into the
Outline pane
Illinois Center for Instructional Technology Accessibility (iCITA)
Lunch!
Illinois Center for Instructional Technology Accessibility (iCITA)
Slide Titles
 Use:
 Define the information on
the slide
 Create a navigational
outline for the
presentation
 Best Practice:
 Use Slide Titles instead of
Text Boxes for Slide
Headers in order to create
an outline or index of your
presentation
Illinois Center for Instructional Technology Accessibility (iCITA)
Slide Titles vs. Text Box
 Slide Title or Text Box?
 Check the Outline View. Empty spaces generally mean text box.
 Green Dot Test
 If a standard bounding box (dotted line box with markers on the adjustable points) appears,
then you are using a Slide Title.
If a bounding box with an extension at the top with a green dot appears, then you are using a
text box.
Illinois Center for Instructional Technology Accessibility (iCITA)
Q and A
Why would you want to use Slide Titles
instead of text boxes for your slides?
What if you have a slide that is a text box
instead of a Slide Title? How can you fix
it?
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.
Illinois Center for Instructional Technology Accessibility (iCITA)
Inserting Images
 Insert, Picture, From File.
 From the template icon
 Four Types of Images:
 Decorative
 Decorative – No description
 Informative
 Chart
Illinois Center for Instructional Technology Accessibility (iCITA)
Images Activity
 Create a new slide using a template with at
least a 2 images holder
 Insert one image from the icon on the slide
template
 Insert one image from the INSERT menus
 Save your PPT
Illinois Center for Instructional Technology Accessibility (iCITA)
Grouping Images/Objects
 Use:
 Select several images (or
objects) and convert into a single
image.
 Best Practice:
 Group images or objects that
have the same meaning or make
up a larger item (ex: flowchart)
Illinois Center for Instructional Technology Accessibility (iCITA)
Grouping Images/Objects - How To
 Select all images 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).
Illinois Center for Instructional Technology Accessibility (iCITA)
Grouping Activity
 Create a new slide with the blank template
 Locate the DRAWING toolbar
 Insert various drawing items onto a slide
 Group/ungroup different objects
 Resize a grouped and an ungrouped image
 Save your PPT
Illinois Center for Instructional Technology Accessibility (iCITA)
Grouping Images/Objects - Q and A
What kinds of images might you group
together?
What would be some advantages of
grouping objects?
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.
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.
Illinois Center for Instructional Technology Accessibility (iCITA)
Charts - Other Ways to Insert
 Slide Template Icon
 Slide Layout Template
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.
Illinois Center for Instructional Technology Accessibility (iCITA)
Chart Activity - Inserting
 Insert 2 new slides
 Insert a chart using the INSERT CHART menu
 Insert a chart using the Slide Layout template
 Change the type of chart for one of the charts
 Change the formatting (color, text, etc) of one of
the charts
 On a new slide, insert an image (to represent a
chart imported as a graphic)
 Save your document
Illinois Center for Instructional Technology Accessibility (iCITA)
Converting to HTML
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.
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
Illinois Center for Instructional Technology Accessibility (iCITA)
Splash Screen
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.
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.
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.
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.
Illinois Center for Instructional Technology Accessibility (iCITA)
Exporting
Select a background color based on your
presentation
Illinois Center for Instructional Technology Accessibility (iCITA)
Output Options - Word
Illinois Center for Instructional Technology Accessibility (iCITA)
Output Options - PPT
Output Format:





Text Only
Text Mostly
Graphical
Outline
Handout
GRAPHICAL FORMATS
 Size of the graphic output for the
presentation. If more than one
graphical size output is selected,
the user will have the option to
"zoom in" and "zoom out".
DEFAULT GRAPHICS
 Initial size of graphics in the
presentation.
Illinois Center for Instructional Technology Accessibility (iCITA)
Saving
Select Save Output:
Save to disk
Save to ZIP file
Save to WebDAV
Illinois Center for Instructional Technology Accessibility (iCITA)
Need a Break?
Illinois Center for Instructional Technology Accessibility (iCITA)
PPT to HTML With the Wizard
Using the Accessible Web Publishing Wizard, convert your
PPT to HTML format.
 Designate at least one image as:




decorative image
informative image
chart (created from using the Insert Chart feature)
chart (an imported image/graphic)
 Select a all 5 output options an at least two graphical
formats to save
 Save to the desktop
 Open the new HTML document
Illinois Center for Instructional Technology Accessibility (iCITA)
PPT to HTML - Views
 Compare the different output views of your HTML
PowerPoint
 Who might benefit from each of the different views?
 How could converting PPT to HTML help individuals:
 with disabilities?
 without disabilities?
Illinois Center for Instructional Technology Accessibility (iCITA)
Why the Wizard?
 There are several Office to HTML programs out
there, why use the Wizard?
 Generating as much as possible – multiple output views
(PPT)
 Build in accessibility without having to have a knowledge
of accessibility or HTML
 Creates an output usable by everyone including those
with disabilities
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
Illinois Center for Instructional Technology Accessibility (iCITA)
More information
Thank you for your interest. Comment or
questions can be sent to Christy Blew,
[email protected]
Other Office to Web Training Information:
 http://www.cita.uiuc.edu/presentations/office2web/index.php
Illinois Center for Instructional Technology Accessibility (iCITA)