Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

1

Using FrontPage to Enhance Blackboard

1. Introduction2. Starting FrontPage3. Creating Documents in FrontPage4. Using Word Documents in

FrontPage5. Dealing with HTML in Blackboard

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

2

FrontPage is a web page development software tool. It allows you to create web pages without having to know HTML programming. The tools in FrontPage are very similar to the tools in Word. FrontPage lets you save all of your documents to a web folder on your computer.

FrontPage will create web pages out of all of your work. These web pages have the HTML coding needed to enhance your Blackboard course site.

Introduction

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

3

Introduction - cont.

You can bold, underline, italicize, color your text, change fonts and font sizes, make tables, and change text to left, right or center justification.

You can also create hyperlinks to other websites and insert images into the body of the page.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

4

FrontPage also allows you to copy and paste from pre-existing Word documents to build from content you already have.

After you have created your page in FrontPage, you can copy the code that FrontPage has created for you into your Blackboard course.

Introduction - cont.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

5

Starting FrontPage

This section covers opening FrontPage and initially creating a web folder to work out of. All FrontPage documents will be stored in this web folder which will reside on your hard drive. The next time you open FrontPage, you can simply open the web folder that you created.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

6

Starting FrontPage

1. Open FrontPage2. Go the the File

menu and choose New Web.

3. Make note of the folder name (My Webs, or My Webs2)

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

7

Starting FrontPage

4. Double-click on the index.htm page.

5. You are now ready to start creating or modifying web pages in FrontPage

Note: Next time you open FrontPage, go to file and choose “Open Web.” You can pick up where you left off.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

8

Creating Documents in FrontPage

This section covers creating a blank document and some of the common tools in FrontPage. You can also use these tools on a Word document that has been copied into FrontPage

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

9

Creating Documents in FrontPage – Bold & Center

1. Type a sentence, select it and click bold and center.

2. Use the Font Color button to change the font color.

Note: The Underline, Italics, left and right justify buttons work just like the bold and center buttons

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

10

Creating Documents in FrontPage - Tables

3. Use the table button to insert a table.

4. Enter text in your new table.5. You can use the TAB key to

move from cell to cell in the table.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

11

Creating Documents in FrontPage - Tables

6. Select the entire table7. Change the font size of the text in

the table8. Change the font type of the text in

the table

Note: Many options in Word to modify text can also be found in FrontPage.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

12

Creating Documents in FrontPage - Hyperlinks

8. Type in a web address as shown, and FrontPage will automatically create a link for you.

9. Right click on the new link, and choose “Properties.”

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

13

Creating Documents in FrontPage - Hyperlinks

10. The URL box lets you change the destination

11. The “Target Frame” button lets you choose to open the link in a new browser window.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

14

Creating Documents in FrontPage – Inserting Images

12. NOTE: You must have the image file saved before you do this step!

13. Go to the Insert Menu

14. Choose Picture From File

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

15

Creating Documents in FrontPage – Inserting Images

15. You can select the image you want by clicking this button:

16. Browse to where your picture is saved, and double click the picture that you want to insert.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

16

Creating Documents in FrontPage – Inserting Images

17. Now that your image is on your web page, you can select it, move it, cut, copy and paste it, and put it in a table.

18. You can also change options for the picture using the picture toolbar

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

17

Creating Documents in FrontPage – Saving

19. Click the Save button.20. FrontPage will save your

work to the web folder you created.

21. It will also save a copy of the image you inserted into the web folder on your computer.

22. Click OK.23. Make sure that you have

saved before you continue.

Note: You can save images in the images folder by clicking the “Change Folder Button.”

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

18

Using Word Documents in FrontPage

FrontPage lets you create documents from scratch, but it also lets you work from content you already have. FrontPage can create HTML coding out of Word Documents. You can use copy/paste to go from Word to FrontPage. Let FrontPage do the dirty work!

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

19

Using Word Documents in FrontPage – Opening Word

1. Leaving FrontPage open, open a Word document that you have created.

2. In Word, go to the Edit menu, and choose “Select All.”

Note: You can Minimize FrontPage – but don’t close it!

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

20

Using Word Documents in FrontPage – Copy3. Go to the Edit

menu again and choose, “Copy.”

4. You can now minimize or close Word

5. Go back to the document that you were working on in FrontPage.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

21

Using Word Documents in FrontPage – Paste

6. In FrontPage, Go to the Edit menu and choose “Paste.”

7. Now that your content is in FrontPage you can edit and modify it as you wish.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

22

Dealing with HTML in Blackboard

After your work is done in FrontPage, you need to look at the HTML coding, copy and paste that code into your Blackboard course site.You will also need to upload any images used to the Blackboard Server.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

23

Dealing with HTML in Blackboard – Copy

1. With your document open in FrontPage, click the “HTML” tab at the bottom of the screen.

2. Go to the Edit menu and choose “Select All.”

3. Go to the Edit menu again, and choose “Copy.”

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

24

Dealing with HTML in Blackboard – Paste

4. Leave FrontPage open.5. Open Internet Explorer,

and login to Blackboard6. Go to the area in your

course where you would like to paste your work from FrontPage.

7. You may want to add a new item, or add to an existing item.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

25

Dealing with HTML in Blackboard – Paste

8. Place your cursor in the text area.

9. Go to the Edit menu and choose “Paste.”

10. Your HTML code is now in the text box

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

26

Dealing with HTML in Blackboard11. Activate the HTML

option in Blackboard.

12. You can opt to attach files if desired.

13. Set any desired options

14. Click “Submit.”

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

27

Dealing with HTML in Blackboard-Images

15. Here, you can tell Blackboard where your image files are.

16. Click the “Browse” button and navigate to the “My Webs” folder – if this is where you saved your image files.

17. Double-click the image file that corresponds to the broken link.

18. Do this for each image.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady

28

Dealing with HTML in Blackboard-Submit and Check

19. After all your image links are fixed, click “Submit.”

20. You should now see your HTML content within your Blackboard course site.

21. Congratulations! You have created HTML content in Blackboard!