go live 5 instructor manual - UITS
Contents
1. Each class member should be seated at a computer and should also be able to see the projector screen The class will stop periodically throughout to practice the lesson and perform the steps just learned In this Instructor Manual any Instructor notes or things that you should do during the lectures are noted in italics The Instructor Manual is set up so that you can see the corresponding User Manual page next to it To make copies of the User Manual for the participants of the work shop print out the PDF version from http mll arizona edu workshops shtmlI tutorialpdfs File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 15 07 Tnivercity af Arizana GO LIVE 5 Instructor Manual INTRODUCTION AND OVERVIEW Instructor Note At this time pass out the User Manual and to the students Also pass out the job aid and inform them that it contains information you will cover in the workshop and is meant to help them easily access frequently used information on the job At the beginning of the workshop welcome the class introduce yourself then continue with the rest of this Instructor Manual Adobe GoLive is a web development program that allows the user to create web pages or websites visually rather than using html code The code is written automatically as the user maneuvers text images QuickTime movies and any other component mostly by dragging and dropping onto their page In GoLive the user can2. to Favorites gt ftp If MacSSH has not been configured for FTPing to the u arizona server you will have to do so before you can upload any files Type in user name and password A black window will open Do NOT close window In GoLive open the Site Window Locate the two white arrows at the bottom right of the Site Window Click on the right arrow to open a second window to the right containing several tabs Click on the FTP tab Instructor Note Allow the users to repeat the previous 7 steps before continuing on File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 15 07 Tnivercity af Arizona GO LIVE 5 Instructor Manual Next we need to set our settings Steps In the Toolbar click on the FTP Server connect disconnect button Click OK on the box that appears asking to enter FTP settings An FTP menu will appear Type 127 0 0 1 in the Server window This is if you are using the u arizona server Type public_html in the Directory window Type in your User Name and Password Check the Passive box Make sure the port window reads 21 then click OK If a box appears asking if you want to add your password to a keychain click don t add The user s files will appear in the FTP side of the Site Window including public_html Instructor Note Allow the users to repeat the previous 10 steps before continuing on EXERCISE 11 UPLOAD DOWNLOAD DOCUMENTS Demo 3 min Practice
3. 4 min Final Practice 4 min Instructor Note Remember to go over the steps first then have the users follow along with you as you repeat the steps again for practice then finally allow the students to repeat the steps on their own as a final practice Steps Double click on the public_html folder to open it Drag and drop any or all files and pages from the left window to the folder on the right To download drag and drop files from the public_html folder back to the left side Once finished close the connection by clicking on FTP Server connect disconnect in the Menu Bar Close the left window by clicking on the left white arrow Close MacSSH File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 15 07 Tnivercity af Arizona GO LIVE 5 Instructor Manual CRITERION TEST 20 min Instructor Note Instruct the students to turn to the last page of their User s Manuals Inform the students they have 20 minutes to complete the Criterion Test which should be more than enough time At the end of the time allowed check the students final products to ensure they have passed successfully This is the criterion test for the Adobe GoLive 5 module It is going to test your comprehension of the module you just participated in or allow you to test out of the Adobe GoLive 5 module Open GoLive 5 Create a new site Import media to the Site Window find and import testmedia folder Open t
4. Multimedia Module GO LIVE 5 INSTRUCTOR MANUAL For information and permission to use these training modules please contact Limell Lawson limell u arizona edu 520 621 6576 or Joe Brabant jorabant u arizona edu 520 621 9490 Modules available online at http mll arizona edu workshops shtml tutorialpdfs GoLive_Instructor pmd Last modified 06 15 02 GO LIVE 5 Instructor Manual TABLE OF CONTENTS Instructor Setup Introduction and Overview Exercise 1 Creating a New Site Exercise 2 Import Media and Open Palettes Exercise 3 Open Index Page Exercise 4 Add Objects Exercise 5 Link Image Exercise 6 Link Image Exercise 7 Adding Color Exercise 8 Create a Second Page Exercise 9 Link Pages Exercise 10 Log in to Web Server Exercise 11 Upload Download Documents Criterion Test File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 15 07 TInivercity af Arizona GO LIVE 5 Instructor Manual INSTRUCTOR SETUP Materials GoLive 5 Instructor Manual with disk of accompanying files GoLive 5 User Manual 1 copy per student Job Aid 1 copy per student Equipment Electronic Classroom PC or Mac workstations 1 per student Adobe GoLive 5 Internet Explorer and Netscape installed on all workstations Instructor workstation with all of the above connected to overhead projector Check that all computers function and that the projector functions as well Copy
5. Quicktime to the page We will demonstrate the point and shoot method only Place the cursor on the point and shoot button to the left of the source window Drag the cursor to the Site Window but do not release yet Place the cursor on the folder that contains the QuickTime you would like to use The folder will open so find the QuickTime icon and release the cursor on it The Quicktime will appear on the page although as a very small box Drag the handles to enlarge to your desire By default the Quicktime we have linked will automatically play when the page is opened on a browser and the end user will have no control over it Locate the Attribs tab in the Inspector and click on it Two attributes will appear by default controller and autoplay Also by default controller will say false and autoplay will say true If you want your Quicktime to start automatically when the page comes up leave as is Otherwise 11 Select controller and type true in the window on the bottom in place of false continued File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 15 07 TInivercity af Arizona GO LIVE 5 Instructor Manual 12 Click in the window to affect change 13 Select autoplay and type false in the same manner 14 Click again in the window to affect change Instructor Note At this time allow the class to complete the previous 14 steps before continuing You will not see a change on y
6. ces are located in the Toolbox amp menu bar File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 1 5 07 TInivercity af Arizona GO LIVE 5 Instructor Manual Note When choosing your fonts keep in mind that the end user may not have a wide range of font styles loaded into their computers Three fonts that most end users are likely to have are Arial Times and Geneva EXERCISE 5 LINK IMAGE Demonstrate 2 min Practice 3 5 min Final Practice 3 5 min Instructor Note Remember to go over the steps first then have the users follow along with you as you repeat the steps again for practice then finally allow the students to repeat the steps on their own as a final practice For this Sub task we will be using both the Inspector and the Site Window Make sure the edge of the Site Window is visible behind the index html page and that the Inspector is up Steps Locate the Image icon in the Objects palette Drag and drop the icon onto the Layout Grid Locate the basic tab in the Inspector and find the source window The image icon that appears on the page represents an image it marks the location where the user would like to see the image on the page The actual image rests in the Site Window and links via the Inspector to the page The source window in the Inspector will read empty reference which indicates it is ready to refer to an image There are two ways to link an image fro
7. design the look of the page and can generate text but images movies music etc will need to be created in other programs and imported to GoLive The user should also know that the work created in GoLive can be opened exported in any other web development program i e Dreamweaver Front page Composer Note Frontpage is Windows specific and will require more steps to transfer files This workshop is intended to cover just the basics of the program It is necessary that all media such as Images and QuickTime Movies and Music are compressed and sized in before being imported to GoLive See the Job Aid for specifics It is advisable to have an idea about the structure of a website before jumping in GoLive does not design for you It s a tool to gather your ideas and construct them This can be achieved by a simple drawing on paper sketching out 2 or 3 pages and how they will be linked see User s Manual intro page The class will be taught with the following method Demonstrate You will watch the projector screen only as demonstrate the Tasks and Steps both visually and verbally Practice You will follow along on your computers as the again demonstrate the Tasks and Steps both visually and verbally Final Practice You will then perform the Tasks and Steps on your own as the look on You may have to delete or close your Practice work to do again for the Final Practice You may use your User Manual as a reference but to try th
8. digital media folders media1 media2 and testmedia from disk to all work stations Open GoLive on each of the stations including instructor station and close all palettes except the Toolbar Make sure that both Netscape amp Explorer are showing in the pop down menu in Show In Browser the world icon in the Toolbar If not go to Edit Preferences Browsers Check the browser s that are not listed in GoLive and click OK If the one needed is not in the window click add and search for the browser to open Once it shows in the in the Browsers window check it and click OK Instructor should be familiar with all aspects components of this training module Note If an untitled html page opens when the program is opened click it closed This page will possibly open by default so recommend that this preference be changed on all computers Go to edit preferences general at launch Change from create new document to do nothing Click OK The estimated time of the workshop is 2 hours There are time guidelines throughout this Instructor Manual but they are just meant to be guides Do not feel that you must follow them exactly Not all of the information in your Instructor Manual is in the User Manual so be sure to go through all items carefully Demonstrate all points on screen where appropriate When you get to the steps go through them so the users can see then allow them to complete the steps on their own
9. e steps without it This class is divided into three main Sections 1 Organize Material and Interface 2 Create Website 3 Export Website to Server Any questions before we begin with Organizing Material and the Interface File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 15 07 Tnivercity af Arizona GO LIVE 5 Instructor Manual EXERCISE 1 CREATING A NEW SITE Demonstrate 1 min Practice 2 min Final Practice 2 min Instructor Note Remember to go over the steps first then have the users follow along with you as you repeat the steps again for practice then finally allow the students to repeat the steps on their own as a final practice Steps Click on File gt New Site gt Blank The save window will open Choose site location usually hard drive or desktop Type desired site name Since you will perform this Task twice and given that GoLive will not let you name two sites the same you should save the name you want to use for this class for when you perform the final practice Save The Site Window is a storage and organizational area for all files pages and media that will be used for a given website The larger the site the easier the management if this window is utilized Also the site Folder is where the Site Window and all other components of the new site are stored The user will copy transfer or burn to removable media this folder not just the Site Window to
10. he index page Insert a Layout Grid and size it at 750 pixels by 550 pixels Color the background using 33CC99 Insert a Text box Type in My Neat O Site size to 6 and position top center Choose font style Arial Color the text using 3300CC Add image OurFamily jpg and position mid center Add another Text box type in Our Auntie size to 4 bold and position lower right Add another page and name it auntie htm Open the page and insert the same size Layout Grid Color the background using FF9966 Insert a Text box Type in Our Swell Auntie size to 6 and position top center Add image OurAuntie jpg and position mid center Add QuickTime icon below image and link to steprightup mov Select the QuickTime and change controller to true and autoplay to false Add another Text box type in home size to 4 bold and position lower right Link home to index html and on the index page link our auntie to auntie htm Check out the two pages on either both Netscape or Explorer Upload the site to the University server OANDARWDY gt File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 15 07 Tnivercity af Arizona
11. m your Site Window to the page We will demon strate both ways Method One Place the cursor on the point and shoot button to the left of the source window Drag the cursor to the Site Window but do not release yet Place the cursor on the Media 1 folder The folder will open so release the cursor on big_baby jpg The image will appear on the page Method Two a Click once on the folder to the right of the source window b The File Menu Box will appear File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 15 07 TInivercity af Arizona GO LIVE 5 Instructor Manual Find big_baby jpg located in your GoLive folder Double click on it or click on open The image will appear on the page EXERCISE 6 LINK QUICKTIME Demonstrate 3 min Practice 5 min Final Practice 5 min Instructor Note Remember to go over the steps first then have the users follow along with you as you repeat the steps again for practice then finally allow the students to repeat the steps on their own as a final practice Linking a QuickTime is very similar to how we linked an image and linking of the other basic Objects are also similar Steps Locate the Image icon in the Objects palette Locate the QuickTime icon in the Objects palette Drag and Drop onto the Layout Grid Use the source window as used with the still image in the Inspector Like linking an image there are two methods of linking the
12. our page when the QuickTime icon has been linked The controller will not be visible and the music in our case will not play The index html page has six tabs under the title bar We are working in Layout mode which is the default tab when we open our page to work on it However to preview the work we need to click on the Preview tab We will be able to see our page without the Layout Grid and other work boxes HOWEVER QuickTime will also not be seen or heard in Preview Mode Steps Locate the Show In Browser icon in the Toolbar Click and release on either Netscape or Explorer in the pop down menu Locate the controller on the temporary browser page and test by clicking on play Test again on the other browser It is a good idea to occasionally view your work in progress in both browsers to insure the work appears the way you intend it to look once on the web Instructor Note At this time allow the users a 5 minute break before continuing File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 15 07 TInivercity af Arizona GO LIVE 5 Instructor Manual EXERCISE 7 ADDING COLOR Demonstrate 2 min Practice 3 5 min Final Practice 3 5 min Instructor Note Remember to go over the steps first then have the users follow along with you as you repeat the steps again for practice then finally allow the students to repeat the steps on their own as a final practice Steps Click on the Color
13. palette tab to activate it Locate the nine icons below the tabs Click on the cube icon third from the right Choose desired color by 1 scrolling through the numbered menu and clicking on the color or the number with the cursor or 2 using the eye dropper in the Color field to the left the cursor will appear as an eyedropper when placed in the color field These colors represent the 216 websafe colors that can be viewed universally on all browsers Change text color by highlighting Select the text on the index html page that you want to edit Drag and drop from the color band on the far left side of the Color palette to the selected text Click outside of the text box to view the color change Repeat this process to change to a different color To add as a background on the index html page locate the page icon directly beneath the Layout tab Drag and drop the chosen color to this icon The entire background will reflect the color change File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 15 07 TInivercity af Arizona GO LIVE 5 Instructor Manual EXERCISE 8 CREATE A SECOND PAGE Demo 1 min Practice 2 min Final Practice 2 min Instructor Note Remember to go over the steps first then have the users follow along with you as you repeat the steps again for practice then finally allow the students to repeat the steps on their own as a final practice Steps In the Men
14. r own as a final practice There are eight tabs in the Objects palette We will be using the first one only which is the Basics tab There are twenty icons under the Basics tab and we will be concerning ourselves with four of these Layout Grid Layout Text Box Image and QuickTime The Layout Grid is a very useful tool in organizing the items on the page Steps With the Objects tab active locate the Layout Grid icon Drag and drop this icon to the index html page There are two ways to resize the layout grid The first method is Select the Layout Grid by clicking on it Using the Inspector Type in 750 for width and press return Type in 550 for height and press return Save The second method is a Drag the lower right handle on the Layout Grid to the desired size b Save Instructor Note At this time allow the users to complete the previous 4 steps before continuing on Steps Locate the Layout Text Box in the Objects palette Drag the icon onto the Layout Grid Resize the Layout Text Box by dragging any of the handles on the box for our purposes size the box about 4 wide X 1 high 288px X 72px Click inside the box and type in the words This is text to use as an example Click anywhere on the Layout Grid to deselect the Text Box Select the text to edit as you would in any word program highlight it Change the size of the text basic sizes in GoLive are 1 7 default is 3 Change the font of the text text editing choi
15. retain the entire site The user can click on File gt Open to create a single html page which would not necessarily be part of a site but a stand alone that can be imported to any web authoring program or uploaded as a single page EXERCISE 2 IMPORT MEDIA AND OPEN PALETTES Demonstrate 1 min Practice 2 min Final Practice 2 min Instructor Note Remember to go over the steps first then have the users follow along with you as you repeat the steps again for practice then finally allow the students to repeat the steps on their own as a final practice Steps Locate the Media folders titled mediai and media2 Drag and drop the folders into the Site Window Click on File gt Save In the Menu Bar click on Window gt Objects the color palette is also located here Click on Window gt Inspector continued File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 15 07 Tnivercity af Arizona GO LIVE 5 Instructor Manual Click on Window gt Toolbar to insure that it is open the Toolbar will usually open when GoLive is opened The Toolbar will be located directly under the Menu Bar Skip all other windows for this class Place the Objects and the Inspector palettes to the right side of the screen to make a work space in the center of the screen Tip All palettes can be folded off to the side by placing the cursor on the Title Bar and clicking while holding the Control key Simpl
16. rowse to yournewpage html in the Site Window The name of the page linked to will appear in the window in the Inspector Repeat from the second page back to the index html page File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 15 07 Tnivercity af Arizona GO LIVE 5 Instructor Manual To preview this click the Preview tab as discussed on page 7 with QuickTime The Grid will disappear and unlike with QuickTime the link will be active Test the links Try out the link Click on the Layout tab to return to edit mode The Grid will re appear Instructor Note At this time allow the users to complete the previous 7 steps before continuing on Steps To link with an image make sure the Inspector is open and a portion of the Site Window is in view Select the Image Click the Link tab in the Inspector Point and Shoot or Browse to the other page in the Site Window The name of the image will appear in the window in the Inspector Preview following the same procedure we did earlier EXERCISE 10 LOG IN TO WEB SERVER Demo 3 min Practice 4 min Final Practice 4 min Instructor Note Remember to go over the steps first then have the users follow along with you as you repeat the steps again for practice then finally allow the students to repeat the steps on their own as a final practice The first thing we will have to do is access FTP Steps Open MacSSH PPC In the Menu Bar go
17. u Bar go to Site gt New gt Page Untitled html will appear in the Site Window Rename the page notice that untitled is highlighted and ready to edit The page can be named any word or words you want but the html must remain Also It is recommended that you do not leave spaces between words or numbers For example if the page name is new games html type it as new_games html or newgames htm After the page is re named it is in pending mode This is indicated by the yellow icon to the right of the new page in the Site Window To take it out of this mode Double click on the page to open Retitle the page add image ritzdrive_in jpg add text save and close The pending symbol will have disappeared EXERCISE 9 LINK PAGES Demo 2 min Practice 3 5 min Final Practice 3 5 min Instructor Note Remember to go over the steps first then have the users follow along with you as you repeat the steps again for practice then finally allow the students to repeat the steps on their own as a final practice With the work that we have done so far in this class we can link the two pages in two ways Link with Text and Link with an Image Steps To link with text first Open both the Index html page and the new second page Make sure the Inspector is open and a portion of the Site Window is in view Highlight select the Text on the index html page Make sure the Link tab is active in the Inspector Point and Shoot or B
18. y click on the folded palette once to bring it back EXERCISE 3 OPEN INDEX PAGE Demonstrate 1 min Practice 2 min Final Practice 2 min Instructor Note Remember to go over the steps first then have the users follow along with you as you repeat the steps again for practice then finally allow the students to repeat the steps on their own as a final practice Now let s get started with creating a website The first thing we will go over is opening your index page Steps Locate the icon named index html in the Site Window Most web hosts require that the first page of a site be named index html so this page should not be renamed Double click on it to open Drag on the lower right handle to make the page fit the screen do not cover the palettes Locate Welcome to Adobe GoLive 5 next to the page icon in the upper left portion of the page This is the Page Title and can be renamed whatever the user would like After naming the page press return and save don t confuse index html with the Page Title File name GoLive_Instructor pmd Copyright Arizona Board of Regents 2002 T act modified N6 15 07 TInivercity af Arizona GO LIVE 5 Instructor Manual EXERCISE 4 ADD OBJECTS Demo 2 min Practice 3 min Final Practice 3 min Instructor Note Remember to go over the steps first then have the users follow along with you as you repeat the steps again for practice then finally allow the students to repeat the steps on thei
Download Pdf Manuals
Related Search