1 / 43

Exploring FrontPage 2003 - Grauer and Barber

Exploring FrontPage 2003 - Grauer and Barber. 2. Objectives. Use FrontPage to:Create a web pageOpen a web pageRename a web pageDefine HTML - View and modify source codeFormat text and paragraphs - Add visual elements to a pageAdd hyperlinks that reference Internal and External Links. Explori

celine
Download Presentation

Exploring FrontPage 2003 - Grauer and Barber

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

    1. Exploring FrontPage 2003 - Grauer and Barber 1 Exploring FrontPage 2003

    2. Exploring FrontPage 2003 - Grauer and Barber 2 Objectives Use FrontPage to: Create a web page Open a web page Rename a web page Define HTML - View and modify source code Format text and paragraphs - Add visual elements to a page Add hyperlinks that reference Internal and External Links

    3. Exploring FrontPage 2003 - Grauer and Barber 3 Objectives (continued) Create a web page using: Templates Themes Layout Tables Add active elements to a web page Understand FrontPage Views Print a website from Navigation View Publish the website to floppy disk

    4. Exploring FrontPage 2003 - Grauer and Barber 4 Case Study: The Better Signs Company The opening case study focuses on the creation of a website for the Better Signs company. College roommates, Jane Olsen and Beth Reilly, started the company with a goal of raising enough money to send their business school entrepreneurship team to national competition. They have realized that a website will help promote their cause, and sell their goods. Students will create a website for the Better Sign Company by completing a series of three exercises.

    5. Exploring FrontPage 2003 - Grauer and Barber 5 Introduction to FrontPage FrontPage is a website creation and management software that: Creates HTML (Hypertext Markup Language) Allows a user to format documents in a manner similar to a web processor Provides different views for accomplishing different tasks

    6. Exploring FrontPage 2003 - Grauer and Barber 6 Introduction to FrontPage (continued) Allows a user to add active elements, such as marquees, to his or her web page Helps a user publish his or her website to a server Helps a user to manage and maintain his or her published website

    7. Exploring FrontPage 2003 - Grauer and Barber 7 Hypertext Markup Language HTML consists of tags that are placed around plain text. The browser follows the instruction of the tags < and > symbols are used to enclose the tags Tags can be viewed in Code View

    8. Exploring FrontPage 2003 - Grauer and Barber 8 Hypertext Markup Language (continued) Users may enter or modify HTML Tags in Code View Some tags come in pairs: An Opening Tag A Closing Tag Some tags do not need to be closed. Closing Tags are denoted by a slash, i.e., </b>

    9. Exploring FrontPage 2003 - Grauer and Barber 9 FrontPage allows a user to view, enter or modify code in Code View Hypertext Markup Language

    10. Exploring FrontPage 2003 - Grauer and Barber 10 Hypertext Markup Language (continued) Examples of HTML Tags <b>This is bold text</b> <h1> This is a level one heading</h1> <ul>This begins a list <li>This is an item in the list </li> <li>This is another item</li> </ul>This ends the list <p> The tag at the end of a line indicating the next line will begin a new paragraph

    11. Exploring FrontPage 2003 - Grauer and Barber 11 FrontPage Toolbars There are many similarities to other Office Application Toolbars There are subtle differences between the FrontPage Toolbars and other Office Application Toolbars

    12. Exploring FrontPage 2003 - Grauer and Barber 12 Hyperlinks The power of the web is in the ability to jump from one page or site to another page or site This ability comes in the form of hyperlinks

    13. Exploring FrontPage 2003 - Grauer and Barber 13 Hyperlinks (continued) The code behind a hyperlink Internal link - <a href = “faq.htm” >Click here to go the FAQ page</a> External Link - <a href = “http://www.google.com” >Click here to go to Google</a>

    14. Exploring FrontPage 2003 - Grauer and Barber 14 Themes Create consistency in style Speed up page design Can be customized Can be created from scratch

    15. Exploring FrontPage 2003 - Grauer and Barber 15 Hands On Exercise 1 Introduction to HTML - Objective: To use FrontPage to: Create a simple home page Insert a marquee Use formatting commands. Input File: None Output File: None

    16. Exploring FrontPage 2003 - Grauer and Barber 16 Hands On Exercise 1 (continued) In this exercise: Create a one page web using the One Page Website Command from the Task Pane Create a bulleted list Use the align Left, Center, and Bold Buttons on the Formatting Toolbar

    17. Exploring FrontPage 2003 - Grauer and Barber 17 Hands On Exercise 1 (continued) Create hyperlinks using the Insert Menu Test hyperlinks In Design View - Links can be tested by holding down Ctrl and clicking the link Preview web page Click File Preview in Browser Choose from the browsers installed on the computer Choose from the choices of resolution Insert a Horizontal Rule - Horizontal rules can be used: To add space in a web page As a section divider As a graphical element

    18. Exploring FrontPage 2003 - Grauer and Barber 18 Hands On Exercise 1 (continued) Format the web page using the Standard Toolbar and the Format Menu Bold Clicking the Bold Button on the Formatting Toolbar Click Format, Font, Font Style, then Bold Insert a Marquee using the Web Component Button Click Insert, then Web Component, Select Marquee Enter Text and change properties, if necessary

    19. Exploring FrontPage 2003 - Grauer and Barber 19 Hands On Exercise 1 (continued) View and modify the HTML code - Click the Code Button Add a theme using the Format Menu Click Format, then Theme to open the Theme Task Pane Select a Theme

    20. Exploring FrontPage 2003 - Grauer and Barber 20 Hands On Exercise 1 (continued) Completed exercise viewed in Internet Explorer

    21. Exploring FrontPage 2003 - Grauer and Barber 21 FrontPage Templates Templates simplify and speed up page creation by providing: Page settings Page formats Page elements Templates utilize multi-columned tables for layout Users can define their own templates Additional templates are available for download from Microsoft.com

    22. Exploring FrontPage 2003 - Grauer and Barber 22 FrontPage Templates To apply a template: Choose the Layout Tables and Cells Task Pane Choose the Table Layout desired

    23. Exploring FrontPage 2003 - Grauer and Barber 23 The Photo Gallery Uses thumbnail images to display pictures on a web Several layouts to choose from Thumbnail images save downloading time Pictures can be edited within the Photo Gallery

    24. Exploring FrontPage 2003 - Grauer and Barber 24 The Photo Gallery (continued) To use the Photo Gallery Click Insert Click Web Component Select Photo Gallery Select Layout Click Finish Insert images

    25. Exploring FrontPage 2003 - Grauer and Barber 25 Hands-On Exercise 2 Templates, Interactive Buttons, and the Photo Gallery - Objective: Create a web page using a FrontPage Template Add a Photo Gallery Add an Interactive Button. Input File: Web page from Exercise 1 File from Prentice Hall Grauer series website Output File: Completed web page

    26. Exploring FrontPage 2003 - Grauer and Barber 26 Hands On Exercise 2 (continued) In this exercise: Open Templates Apply Templates Modify a Template Use the Header, Body Footer, and Left Layout Set the Page Title Click Save Click Change Title Button Enter Title

    27. Exploring FrontPage 2003 - Grauer and Barber 27 Hands On Exercise 2 (continued) Download photos for the web page - Go to www,prenhall.com/grauer Create the Photo Gallery Click Insert, Picture and New Photo Gallery Choose the layout desired Click the Picture Tab Click the Add Button Add pictures

    28. Exploring FrontPage 2003 - Grauer and Barber 28 Hands On Exercise 2 (continued) Insert an Interactive Button Click Insert, Interactive Button Choose the Button Style Click OK To link the button Right click the button Select Hyperlink from the Shortcut Menu

    29. Exploring FrontPage 2003 - Grauer and Barber 29 Hands On Exercise 2 (continued) Check the Hyperlinks by either: Switching to Hyperlink View to verify hyperlinks Click Ctrl + click in Design View

    30. Exploring FrontPage 2003 - Grauer and Barber 30 Designing a Corporate Website Page Design Basics - Plan before beginning Top Down Design Define the overall website – Develop the overall structure first Break it down into smaller, more manageable pieces - Develop individual pages.

    31. Exploring FrontPage 2003 - Grauer and Barber 31 Page Design FrontPage provides Shared Borders that are used to display banners and link bars. Shared borders add consistency - They can be shared among all pages in a site. The Corporate Presence Wizard includes Shared Borders automatically

    32. Exploring FrontPage 2003 - Grauer and Barber 32 Publishing a Website The Publish Web Command allows a user to publish a web page to a web server. A user cannot simply copy his or her files to a server A user may also publish a web page to: A floppy drive A hard drive Jump drive (space permitting)

    33. Exploring FrontPage 2003 - Grauer and Barber 33 Hands On Exercise 3 Designing a Corporate Website - Objective: Use a FrontPage Web Wizard to create a simple website. Input File: Web page from Exercise 2 Output File: Published website

    34. Exploring FrontPage 2003 - Grauer and Barber 34 Hands On Exercise 3 (continued) In this exercise: Use the New Task Pane to display the Website Templates Dialog Box Use the Corporate Presence Wizard Icon to begin the wizard

    35. Exploring FrontPage 2003 - Grauer and Barber 35 Hands On Exercise 3 Use the Corporate Presence Wizard to: Select pages for the website Setup a Feedback Form Setup a Table of Contents Define navigation

    36. Exploring FrontPage 2003 - Grauer and Barber 36 Hands On Exercise 3 (continued) Work with Task View Click View Click Task View This view allows a user to create a “to do” list Tasks may be prioritized and sorted Edit the Page Banner Page Banners can display: Pictures Text Double click on a page banner to bring up the Page Banner Properties Dialog Box

    37. Exploring FrontPage 2003 - Grauer and Barber 37 Hands On Exercise 3 (continued) Work in Navigation View Click View, Click Navigation or Click the Navigation Button at the bottom of the page Navigation View presents a Hierarchical View of the website A user may move pages around (from one level to another) and all links will be updated. Rename pages in Navigation View and all related links will be updated

    38. Exploring FrontPage 2003 - Grauer and Barber 38 Hands On Exercise 3 (continued) Modify page content Add product information Insert graphics Insert graphics using the Clip Art Task Pane Right-click an image Select Auto Thumbnail to make the image a thumbnail

    39. Exploring FrontPage 2003 - Grauer and Barber 39 Hands On Exercise 3 Publish the website Click File Click Publish Website Click Remote Website Properties Enter location where site is to be stored Click OK Click the Publish Website Button Keep in mind when publishing a site to a web server: Changes can be made locally Republish the changed pages

    40. Exploring FrontPage 2003 - Grauer and Barber 40 Summary Lessons learned in this chapter: About HTML Created a one page website Added, modified and formatted text in a website Created hyperlinks to both Internal and External sites Inserted a marquee into a website

    41. Exploring FrontPage 2003 - Grauer and Barber 41 Summary (continued) Used Templates and Themes Used the Photo Gallery Feature Inserted Interactive Buttons Worked in different FrontPage Views Used a Web Wizard Published a website

    42. Exploring FrontPage 2003 - Grauer and Barber 42 End-of-chapter Exercises Multiple Choice Practice Exercises Exercise 1 – Create Your Own Website Exercise 2 – View FrontPage Reports Exercise 3 – Insert a Time Stamp and E-mail Link Exercise 4 – Create a Page Transition Exercise 5 – Create and Test a Hotspot

    43. Exploring FrontPage 2003 - Grauer and Barber 43 End-of-chapter Exercises (continued) Mini Cases Designer Home Pages Employment Opportunities Forms in HTML Documents Publishing Your Web Page Add Your Home Page to the Yahoo Catalog Experiment with the Photo Gallery

    44. Exploring FrontPage 2003 - Grauer and Barber 44 Questions?

More Related