Advanced Word/Information Processing - CCC - 2015

1. Contents

2. © Paradigm Publishing, Inc. 2 Contents
Chapter 11
Creating Web Pages and Forms
 Understanding and
Accessing Web Pages
 Planning and Designing a
Web Page
 Creating a Web Page
 CHECKPOINT 1
 Creating a Form Using Content
Controls and Legacy Tools
 CHECKPOINT 2
 Desktop Publishing Terms and
Definitions
Quick Links to Slide Contents

3. © Paradigm Publishing, Inc. 3 Contents
Understanding and Accessing Web Pages
 A web page is a computer file containing information in the
form of text or graphics along with commands written in
Hypertext Markup Language (HTML).
 A collection of web pages creates a website.
 Word 2013 can save a document as a web page by converting it
to an HTML file, which is a type of file that can be published on
the Internet.
 A web browser such as Microsoft Internet Explorer, Mozilla
Firefox, or Google Chrome can read the HTML code and display
the text and graphics in the web page.

4. © Paradigm Publishing, Inc. 4 Contents
Understanding and Accessing Web Pages - continued
Understanding Internet and Intranet Terminology
 The Internet is a worldwide network of commercial, educational,
governmental, and personal computers connected together for
the purpose of sharing information.
 The World Wide Web (often called the Web) is the most
commonly used application on the Internet and is a set of
standards and protocols used to access information available on
the Internet.
 An intranet is an “internal Internet” within an organization that
uses the same web technology and tools as the Internet and is
also used to share information.

5. © Paradigm Publishing, Inc. 5 Contents
Understanding and Accessing Web Pages - continued
Accessing Web Pages Using URLs
 A Uniform Resource Locator (URL) is used to identify a location
on the Internet.
 A URL is the address that you enter to access a web page or
website.
 An example of a URL is http://www.microsoft.com.
 The first part of the URL, http://, identifies the protocol.
 The letters http stand for Hypertext Transfer Protocol, which is
one of the protocols or languages used to transfer data.
 The colon and slashes separate the protocol from the server
name.

6. © Paradigm Publishing, Inc. 6 Contents
Understanding and Accessing Web Pages - continued
 If you know the URL for a specific website and want to visit that
site, type the URL in the Address bar in your browser.
 The home page is the starting point for viewing any website.
 From the home page, you can click hyperlinks to access other
pages within the website or to jump to other websites.
 A hyperlink is text or a graphic that you click to go to a file, a
location in a file, a web page on the Internet, or a web page on
an intranet.

7. © Paradigm Publishing, Inc. 7 Contents
Understanding and Accessing Web Pages - continued
Accessing Web Pages Using the Document Location Text Box
 Besides accessing websites from your browser, you can also
access websites from within Word by using the Document
Location text box.
 If the Document Location text box does not appear on the Quick
Access toolbar, you can easily add it.

8. © Paradigm Publishing, Inc. 8 Contents
Understanding and Accessing Web Pages - continued
 To use the Document Location text box, type a URL in the text
box or click the down-pointing arrow next to it and then click an
option at the drop-down list. Press Enter to connect to the
desired destination.

9. © Paradigm Publishing, Inc. 9 Contents
Planning and Designing a Web Page
Using Design Tips When Creating Web Pages
 As you plan your web page, consider the following design tips:
 Determine the goal of your website and continually evaluate your page.
 Identify and focus on your intended audience.
 Review and critique specific aspects of other web pages.
 Determine an appropriate horizontal width for the web page so that
users don’t have to scroll horizontally.
 Do not overuse italics or bold.
 Determine the elements to be emphasized. Keep the design simple. Use
white space effectively.
 Be consistent with hyperlinks so that visitors know where they are, where
they came from, and where they can go.
continues on next slide…

10. © Paradigm Publishing, Inc. 10 Contents
Planning and Designing a Web Page - continued
 Create a storyboard, which is a diagram or blueprint that defines the
elements that appear on each web page and shows how pages are
interrelated.
 If using animated graphics, keep them simple.
 Make sure your page fits within a standard browser window
(1024 × 768 pixels).
 Do not use large graphics that take forever to download.
 Use graphics that relate to the content and do not distract from the
message.
 Use clean and clear navigation.
 Maintain a consistent color scheme.
 Keep the background simple, making sure the text can be seen clearly.
continues on next slide…

11. © Paradigm Publishing, Inc. 11 Contents
Planning and Designing a Web Page - continued
 Avoid small text and all caps.
 If you include bulleted lists, make sure each one includes at least two
items.
 Keep charts and graphs simple.
 Design your site so that it is accessible by individuals who may have
hearing or visual impairments.
 Remember that a web page is often the first impression you are giving
the world about your product or yourself. Offering a poorly designed web
page can be worse for your business than having none at all.
 Include a plan for maintaining your website and keeping it current.

12. © Paradigm Publishing, Inc. 12 Contents
Planning and Designing a Web Page - continued
Planning Your Web Page
 Consider using a thumbnail sketch to organize your web page
layout before actually creating it.
 Include space for text, photographs, graphics, headlines, ruled
lines, and so on.
 Instead of including everything on the home page, include
hyperlinks to other pages. This strategy promotes organization
and reduces clutter.
 Remember that the front door of a website is its home page.
This page should contain elements to achieve the goals an
organization (or individual) has set for the website.

13. © Paradigm Publishing, Inc. 13 Contents
Planning and Designing a Web Page - continued
 You may want to create a nameplate or banner to display the
company name in an interesting way.
 Include the company logo to reinforce the company’s identity.
 The site should include a variety of ways to contact the
company, such as the address, telephone number, email
address, and fax number.
 Graphics are the simplest way to make your web page look
interesting and appealing.
 Be sure to choose graphics that are appropriate to the subject of
the page, and use them sparingly to increase their impact.

14. © Paradigm Publishing, Inc. 14 Contents
Planning and Designing a Web Page - continued
Previewing in Web Layout View and Web Page Preview
 To begin building a web page in Word, open a new document
and then switch to Web Layout view.
 To do this, click the VIEW tab and then click the Web Layout
button in the Views group, or click the Web Layout button in the
view area on the Status bar.
 In Web Layout view, you can view the page in a similar manner
to how it will display in a browser window.

15. © Paradigm Publishing, Inc. 15 Contents
Planning and Designing a Web Page - continued
Using Tables in Web Page
Design
 Tables provide a good
framework for a web page.
 You can use the cells to
control where text and
pictures display.
 You can also use empty cells
to create white space
between sections of
content.

16. © Paradigm Publishing, Inc. 16 Contents
Planning and Designing a Web Page - continued
Using Other Office Applications to Create Web Pages
 Web pages can be created using each of the applications in
Office 2013.
 Excel web pages are useful when you want to use the worksheet
formatting, calculation, and data analysis capabilities in creating
electronic order forms, demographic information, testing or
survey information, or a cost comparison.
 In the Excel Save As dialog box, you will have an option to save
the worksheet in HTML or in the XML format, which is a flexible
format recommended if the page will be published and if the
data will be manipulated or acted on by other programs and
scripts.

17. © Paradigm Publishing, Inc. 17 Contents
Creating a Web Page
Saving a Word Document as a Web Page
 To save a Word document as a web page, follow the steps you
normally would, but at the Save As dialog box, click the down-
pointing arrow at the right of the Save as type option box and
then select one of the following Web formats:
 Click the Single File Web Page (*.mht;*mhtml) option when
you are planning to send the web page via email.
 Click the Web Page (*.htm;*.html) option when you are
planning to round-trip the page between Word and a web
browser.
 Click the Web Page, Filtered (*.htm;*.html) format option
when you want the resulting saved file to be plain HTML.

18. © Paradigm Publishing, Inc. 18 Contents
Creating a Web Page - continued
 If you want your page to be available on the Internet, you must
have an Internet Service Provider (ISP) to place it on a server.
 These Web hosting services usually charge a monthly or annual
fee, but they can be relatively inexpensive depending on your
needs.
 Some schools or colleges will host student-created web pages
for free.

19. © Paradigm Publishing, Inc. 19 Contents
Creating a Web Page - continued
Creating and Editing Hyperlinks
 Even if you are not saving a Word document as a web page, you
can still create hyperlinks within it that a reader can click to
jump to a web page, a different location in the document, a
different Word document, or a file created in a different
application, such as an Excel workbook.
 A hyperlink’s destination document or file can be saved on your
hard drive, on your organization’s network (intranet), or on the
Internet.
 You can create hyperlinks from selected text or graphic objects
such as buttons and pictures.
 By default, hyperlink text displays in blue and is underlined.

20. © Paradigm Publishing, Inc. 20 Contents
Creating a Web Page - continued
 To create a hyperlink from text in a Word document, select the
text, click the INSERT tab, and then click the Hyperlink button in
the Links group.

21. © Paradigm Publishing, Inc. 21 Contents
Creating a Web Page - continued
 If you include an email address anywhere on your web page,
Word will automatically create a hyperlink that opens a new,
blank email message in the user’s default email program when
he or she clicks it.
 To edit an existing hyperlink, right-click the hyperlink and then
click Edit Hyperlink at the shortcut menu.

22. © Paradigm Publishing, Inc. 22 Contents
Creating a Web Page - continued
Creating Bookmarks
 Bookmarks save locations that you want to easily be able to
return to.

23. © Paradigm Publishing, Inc. 23 Contents
Creating a Web Page - continued
Adding Bullets and Horizontal Lines to a Web Page
 You can add bullets to a web page by clicking the Bullets button
on the HOME tab.
 You can also change regular bullets to special graphical bullets.
 You can use horizontal or vertical ruled lines to separate the
sections of a web page.

24. © Paradigm Publishing, Inc. 24 Contents
Creating a Web Page - continued
Adding Background Color to a Web Page
 Consider adding background colors and other effects to make
your documents more visually appealing to read online.

25. © Paradigm Publishing, Inc. 25 Contents
Creating a Web Page - continued
Printing a Background from Your Browser
 To print a web page background from Microsoft Internet
Explorer, click the Print button arrow on the Command bar and
then click Page setup.

26. Contents© Paradigm Publishing, Inc. 26
CHECKPOINT 1
1) This is an “internal Internet”
within an organization.
a. intirnet
b. intralnet
c. internalnet
d. intranet
3) By default, hyperlinked text
displays in this color and is
underlined.
a. green
b. blue
c. red
d. black
2) These provide a framework for a
web page.
a. text boxes
b. tables
c. frames
d. shapes
4) This can be used to move your
cursor to another location within
the same document.
a. bookmark
b. text box
c. table
d. frame
Next Question
Next Question
Next Question
Next Slide
Answer
Answer
Answer
Answer

27. © Paradigm Publishing, Inc. 27 Contents
Creating a Form Using Content Controls and Legacy Tools
 A form is a protected document that includes designated areas
into which users enter specific data.
 Forms can be filled out electronically, or they can be printed and
completed using a hard copy.
 Two kinds of fields can be entered into forms created in Word—
the Word 2013 content controls and the legacy tools that have
been carried over from earlier versions of Word.
 To insert content controls or legacy tools, you must first turn on
design mode.
 Click the DEVELOPER tab and then click the Design Mode button
to make it active.
 Click the Design Mode button again to turn off design mode.

28. © Paradigm Publishing, Inc. 28 Contents
Creating a Form Using Content Controls and Legacy Tools - continued
Using Content Controls and Legacy Tools
 Content controls in Word 2013 have great capabilities, but they
also have a few drawbacks.
 For one, content controls do not work in versions of Word
earlier than 2007.
 You can combine content controls and legacy form fields in a
single form, but be aware that the content controls and legacy
fields work very differently.
 For instance, you can use the Tab key to advance from one
legacy field to the next, but you must use the mouse to select
the next content control.

29. © Paradigm Publishing, Inc. 29 Contents
Creating a Form Using Content Controls and Legacy Tools - continued
 Advantages of using content controls include the following:
 More types of content controls are available than types of
legacy tools.
 The document does not have to be protected for the form to
function properly (if the form is completed in Word).
 Content controls can be set so that they cannot be deleted.
 Content controls are useful when connecting to XML data
sources.

30. © Paradigm Publishing, Inc. 30 Contents
Creating a Form Using Content Controls and Legacy Tools - continued
Protecting the Form
 If you want users to be able
to enter information in the
form template but not edit
the template itself, then
protecting the form
template is important.

31. © Paradigm Publishing, Inc. 31 Contents
Creating a Form Using Content Controls and Legacy Tools - continued
 With or without a password, a legacy form will not work
properly unless it is protected.
 When unprotected, the form treats the fields as static text, and
will not allow the user to enter anything into them.
 In a legacy form that as been protected, you can click in a field
to make it active, press the Tab key to move from field to field,
or use Shift + Tab to move to a previous field.

32. © Paradigm Publishing, Inc. 32 Contents
Creating a Form Using Content Controls and Legacy Tools - continued
Designing the Form
 When designing a form, consider first where the fixed text
should be placed on the page.

33. © Paradigm Publishing, Inc. 33 Contents
Creating a Form Using Content Controls and Legacy Tools - continued
Determining Which Form Fields or Content Controls to Use

34. © Paradigm Publishing, Inc. 34 Contents
Creating a Form Using Content Controls and Legacy Tools - continued

35. © Paradigm Publishing, Inc. 35 Contents
Creating a Form Using Content Controls and Legacy Tools - continued
Filling in a Form
 To fill in a form containing legacy form fields, use File Explorer to
open a document based on the template containing the legacy
form fields.
 Type the information in the first form field and then press the
Tab key to move to the next field. You can press Shift + Tab to
move to the previous field, if necessary.
 To insert a check mark in a check box field, press the spacebar or
click in the field with the mouse.

36. © Paradigm Publishing, Inc. 36 Contents
Creating a Form Using Content Controls and Legacy Tools - continued
Editing a Protected Form

37. © Paradigm Publishing, Inc. 37 Contents
Creating a Form Using Content Controls and Legacy Tools - continued
Printing a Form
 After filling in a form, you can print the form in the normal
manner.
 However, you also have the option to print just the data (not the
entire form) or print the form and not the fill-in data.

38. Contents© Paradigm Publishing, Inc. 38
CHECKPOINT 2
1) This is a protected document that
includes user-defined areas.
a. table
b. form
c. web page
d. template
3) This legacy form field displays a
list of values from which the user
can choose.
a. Drop-Down
b. Text
c. Option
d. Check Box
2) The DEVELOPER tab can be
displayed at this dialog box.
a. Word Options
b. Develop Options
c. Form Options
d. Tool Options
4) To insert content controls or
legacy fields, you must first turn
on this.
a. edit mode
b. design mode
c. form mode
d. field mode
Next Question
Next Question
Next Question
Next Slide
Answer
Answer
Answer
Answer

39. © Paradigm Publishing, Inc. 39 Contents
Desktop Publishing Terms and Definitions
continues on next slide…
Term Definition
hyperlink Text or a graphic in a web page that will connect you to
other pages or websites in different locations
Hypertext Transfer
Protocol (HTTP)
One of the languages used to transfer data within the
World Wide Web
Internet Worldwide network of computers connected together to
share information
Internet Service
Provider (ISP)
A hosting service that places web pages on a server so
they are viewable from the Internet
intranet An “internal Internet” within an organization that uses
Internet technology and tools
round-trip To convert an HTML file back to a Word document

40. © Paradigm Publishing, Inc. 40 Contents
Desktop Publishing Terms and Definitions - continued
Term Definition
storyboard A diagram or blueprint that defines the elements that
appear on each web page and shows how pages are
interrelated
Uniform Resource
Locator (URL)
The address used to identify locations on the Internet
web page A computer file created in HTML and viewed with a web
browser
website A collection of web pages
World Wide Web A set of standards and protocols used to access information
on the Internet, often called the Web
XML A language format that marks and organizes content to
allow it to be easily read on different computer platforms;
short for Extensible Markup Language