Upload
blaze-porter
View
215
Download
0
Tags:
Embed Size (px)
Citation preview
Technical CommunicationA Practical Approach
Chapter 14: Web Pages and Writing for the Web
William Sanborn Pfeiffer Kaye Adkins
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.2
Web Pages and Writing for the Web
Your Role in Developing Web Sites and Content
Planning Structure Content Development Guidelines for Writing Web Content Design Usability and Publication
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.3
Web Pages and Writing for the Web
Guidelines for Writing Web Content
Design Usability Testing Publication
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.4
Your Role in Developing Web Sites and Content
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.5
Your Role in Developing Web Sites and Content
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.6
Planning
Accessibility Guidelines Scripting Languages and Software
Authoring Tools
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.7
Planning
Planning Phase Define the site’s purpose Analyze your audience Outline the scope of the site with clear goals Identify constraints Identify methods to incorporate user-centered
design
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.8
Accessibility Guidelines
Users may have trouble accessing Web sites because of Computer system limitations or settings Physical disabilities
Commonly used accessibility guidelines U.S. Government Section 508 Accessibility
Guidelines World Wide Web Consortium (W3C) Web
Content Accessibility Guidelines
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.9
Government Section 508 Accessibility Guidelines Ensure that users using assistive technology can complete
and submit online forms. Ensure that all information conveyed with color is also
available without color. Provide a means for users to skip repetitive navigation
links. Provide a text equivalent for every non-text element that
conveys information. Ensure that all information on Web pages can be used by
assistive technologies
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.10
Government Section 508 Accessibility Guidelines
Provide text-only pages with equivalent information and functionality.
Provide client-side image maps instead of server-side image maps.
Provide equivalent alternatives for multimedia elements that are synchronized.
Organize documents so they are readable without requiring an associated style sheet.
Provide frame titles that facilitate frame identification and navigation.
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.11
Planning
Scripting Language and Software-Authoring Tools HTML XHTML CSS PHP
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.12
Structure
Site Structures and Types Process of Developing a Structure Labeling Strategies Guidelines for Navigational Design
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.13
Structure
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.14
Structure
Site Structures and Types Consider these two factors when choosing a
site structure Breadth
The number of choices or content areas at any given level in the site’s structure
Depth The number of levels deep in a site structure
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.15
Process of Developing a Structure
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.16
Structure
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.17
Structure
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.18
Structure
Labeling Strategies Alphabetical Chronological Geographical By task By function By topic By question
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.19
Structure
Navigation Design Hyperlinks Toolbar menus Site maps Search fields
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.20
Structure
Guidelines for Navigation Use navigation element consistently
throughout the Web site Group main site navigation links Place appropriate navigation tools in each
new window or frame Place navigation links where they are clearly
visible
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.21
Content Development
Content Chunking Adapting Content for the Web Document Conversion Issues and
Common File Formats
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.22
Content Development
Content Chunking Stand-alone unit of text and graphics often
separated from other content chunks by spacing on a page
Size depends on purpose, screen layout, or specific project style guidelines
Use five to seven wrapping lines of text Use graphics as large as what fits on screen
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.23
Content Development
Adapting Content for the Web Check for internal consistency Decide which electronic formats to use
Hypertext markup language (HTML) Adobe portable document format (.pdf) Microsoft Word (.doc) Rich text format (.rtf)
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.24
Content Development
Document Conversion Issues and Common File Formats Select file formats that are commonly used Provide documents in multiple formats
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.25
Guidelines for Writing Web Content
Guidelines for Writing Web Content Use a general-to-specific organization in individual
content chunks Keep Web site structure in mind when creating
chunks Format text for easy reading Identify text to be hyperlinked Develop a style sheet for consistency Edit carefully
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.26
Design
Design Conventions and Principles Finding a Theme and Developing Graphic
Content File Formats and Graphics Interface Layouts Web Site Design Guidelines
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.27
Design
Design Conventions and Principles Place a hyperlink on the title banner or logo to
the home page Place the site’s main navigation in the left or
top margin Use consistent font faces, sizes, and colors Use descriptive titles and headers for each
graphic and on every page
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.28
Design
Design Conventions and Principles Provide contextual cues Maintain a consistent graphic identity Provide redundant navigation links Provide alternate descriptions of graphic
content Use no more than three font faces Use colors that contrast well
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.29
Design
Design Conventions and Principles Gestalt design principles
Create consistency in the use of elements in repetitive and similar ways on a page
Contrast visual elements, such as colors, lines, or shaded regions
Group elements together through space, color, or other graphic elements
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.30
Design
Finding a Theme and Developing Graphic Content Establish a graphic identity or design theme
for your site Consider the site’s tone and impression Select an appropriate theme for your users,
purpose, content, and tone
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.31
Design
Interface Layouts Header Navigation Content window Graphic identity Contextual clues
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.32
Design
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.33
Design
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.34
Design
Web Site Design Guidelines Make site structure recognizable Focus readers’ attention on the information they
want Indicate Web page active areas Associate text and graphics
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.35
Usability Testing
Testing Your Site for Your User Base Performing Usability Reviews Quick Usability Checks and System
Settings
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.36
Usability Testing
Testing Your Site for Your User Base Ensure the site is organized and functioning
properly Set goals Select criteria Develop test materials Solicit participants Set up the testing environment Conduct the test Write a results report
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.37
Web Usability Checklist
Technical Communication: A Practical Approach, Eighth EditionW. S. Pfeiffer and K. Adkins
Copyright © 2013, 2010, 2006 Pearson Education, Inc., All Rights Reserved.38
Publication
Publishing Your Site Obtain dedicated storage space on a Web
server and check for the following Amount of storage space available Process for logging in to the server Address of the host server Uniform Resource Locator (URL) or Web address