CIS 205 Web Design Development Dreamweaver Chapter 6

CIS 205—Web Design & Development Dreamweaver Chapter 6 Managing a Web Server and Files

Chapter 6: Managing a Web Server and Files • Introduction – When you are finished designing your Web site, you are ready to publish it to a remote server for the world to see – The first step is to set up a connection to the remote site – Next you will transfer all your Web site files to the remote site – You will learn how to check out and cloak a file for updating – Then you will learn how to export the site definition file so that other designers can import the site

Chapter 6: Managing a Web Server and Files (2) • Prepare to Publish a Site – Before publishing your site, use the Link Checker panel to check for broken links and orphaned files – All images should have alternate text – All pages should have titles – Remove all Non-Websafe colors – View pages in different browsers – All content must be original or obtained legally (do not violate the copyright of someone else’s work)

Lesson 1: Perform Web Site Maintenance • Maintaining a Web Site – Perform maintenance on your site frequently to make sure it is error-free • Using the Assets Panel – Remove unused images to a storage folder outside the Web site – Check the Colors list for Non-Websafe colors and remove or change them on the appropriate elements • Checking Links Sitewide – Use the Link Checker panel to display broken links and orphaned files; then correct the problems

Lesson 1: Perform Web Site Maintenance (2) • Using Site Reports – Use the Reports command in the Sites menu to generate reports, some containing Design Notes – Design Notes are separate files that contain additional information that designers can use • Using the Site Map – The site map shows the navigation structure—is it logical, organized, simple? • Validating Markup – Click File, Validate, Markup to correct syntax errors • Testing Pages – Test the site thoroughly, use the Check Page button

Lesson 1: Perform Web Site Maintenance (3) • Check for broken links 1. Open The Striped Umbrella Web site 2. Show the Files panel 3. Click Site on the menu bar, point to Advanced, click Recreate Site Cache 4. Click Site on the menu bar, click Check Links Sitewide (no broken links are listed) • Check for orphaned files 1. In the Link Checker panel, click the Show list arrow, click Orphaned Files 2. Close the Results panel group (click upper right icon)

Lesson 1: Perform Web Site Maintenance (4) • Verify that all colors are Websafe 1. Click the Assets tab in the Files panel, click the Colors button 2. If Non-Websafe colors exist 1. Click Edit on the menu bar, click Find and Replace 2. In the dialog box, click the Find in list arrow, click Entire Current Local Site 3. Click the Search list arrow, click Text 4. Type the hexadecimal color code for the Non-Websafe color (such as #6 a 6756) in the Find text area, click Find All 5. Double-click each occurrence of the Non-Websafe color in the Results panel and make necessary corrections on that page

Lesson 1: Perform Web Site Maintenance (5) • Check for untitled documents 1. Click Site on the menu bar, click Reports 2. Click the Untitled Documents check box, click the Reports list arrow, click Entire Current Local Site, click Run • Check for missing alternate text 1. Click Site on the menu bar, click Reports 2. Click the Missing Alt Text check box, click the Reports list arrow, click Entire Current Local Site, click Run 3. Double-click each occurrence in the Site Reports panel, switch to Design view, add Alt text in the PI

Lesson 2: Publish a Web Site and Transfer Files • Defining a Remote Site – A Web server is a computer that is connected to the Internet – To publish a Web site you must first have a valid account on a Web server; for example: 1. 2. 3. 4. 5. 6. Go to http: //www. tripod. lycos. com/ and click the Start Now button For the free web site, click the Sign Up button under Tripod Free Carefully select a username and complete the registration information Click Skip for Special Offers You do not need to select any upgrades on the Tripodplan Options page Your new URL (web address) is now http: //username. tripod. com (substitute the username you selected in Step 3 for ‘username’ in the URL) – Then define a remote site by clicking Site on the menu bar, clicking Manage Sites, clicking Edit, and performing additional tasks (to be described later)

Lesson 2: Publish a Web Site and Transfer Files (2) • Viewing a Remote Site – After defining a remote site, you can view it in the Files panel by choosing Remote view from the View list • Transferring Files to and from a Remote Site – You can upload Web site files from your local computer to the remote host by selecting the files in Local view and clicking the Put File(s) button on the Files panel – A dialog box will ask you if you want to upload dependent files (such as graphics) • An entire site can be uploaded by selecting the root folder – To download files from the remote host to your local computer, select the files in Remote view, and click Get File(s)

Lesson 2: Publish a Web Site and Transfer Files (3) • Set up Web server access on an FTP site 1. Click Site on the menu bar, click Manage Sites 2. Click you Web site in the dialog box, click Edit 3. Click the Advanced tab, click Remote Info in the Category list, click the Access list arrow, click FTP 4. If you are using Tripod as your Web server, type ftp. tripod. com in the FTP host textbox, type your username in the Login textbox, type your password in the Password textbox 5. Click the Test button to test the connection 6. If the test is successful, click OK 7. Click OK, click OK again

Lesson 2: Publish a Web Site and Transfer Files (4) • Set up Web server access on a local or network folder 1. See p. 6 -18 in the text if you are unable to create a Tripod account (or an account on another Web server) • View a Web site on a remote server 1. Click the View list arrow in the Files panel, click Remote view 2. Click the Expand button on the Files panel toolbar (far right) to view both Remote Site and Local Files panes 3. Click the Collapse button (far right) to return to Design view

Lesson 2: Publish a Web Site and Transfer Files (5) • Upload files to a remote server 1. To upload your entire Web site, click the View list arrow in the Files panel, click Local view 2. Click the root folder of the local site (first item under Local Files) 3. Click the Put File(s) button in the Files panel toolbar (the blue arrow that points up) • You can select individual files in the Files panel to upload 4. Click OK (this process may take several minutes) • You can perform many other Dreamweaver tasks while waiting for file uploads to be completed 5. Check with your facilitator if you are having difficulty setting up a remote Web site

Lesson 3: Check Files Out and In • Maintaining a Web Site with a Team – Different people may be working with a large web site – If one person is making changes to a page, others should not have access to it until he/she is finished • Checking Out and Checking In Files – Dreamweaver’s Check In/Check Out feature allows only one person to work on a page at a time – Use the Check Out File(s) button in the Files panel to check out a file, the Check In button to check in a file • Enabling the Check In/Check Out Feature – You must enable this feature using the Remote Info settings of the Site Definition dialog box

Lesson 3: Check Files Out and In (2) • Enable the Check In/Check Out feature 1. Click Site on the menu bar, click Manage Sites, click The Striped Umbrella in the list, click Edit 2. Click Remote Info in the Category list, click the Enable file check in and check out check box 3. Click the Check out files when opening check box to select it 4. Type your name using lower case letters, no spaces in the Check out name text box 5. Type your email address in the Email address text box 6. Click OK, click Done

Lesson 3: Check Files Out and In (3) • Check out a file 1. Click café. html in the Local Files list in the Files panel 2. Click the Check Out File(s) button on the Files panel toolbar, click Yes to include all dependent files • Check in a file 1. Open the café page, change the closing time for The Cabana to 7: 00 p. m. , save the page, then close it 2. Click café. html in the Files panel 3. Click the Check In button on the Files panel toolbar 4. Click Yes to include dependent files • A padlock icon appears since these files must be checked out to be modified in the future

Lesson 4: Cloak Files • Understanding Cloaking Files – Some files in a Web site may be works in progress or seasonal in nature – You may cloak some files in your site excluding them from many operations in Dreamweaver • Cloaking a Folder – You can cloak an entire folder, such as assets, which can save time when synchronizing files • Cloaking Selected File Types – Certain types of files, such as. swf, can be cloaked using the Cloaking category of the Site Definition dialog box

Lesson 4: Cloak Files (2) • Cloak and uncloak a folder 1. Click Site on the menu bar, click Manage Sites, click The Striped Umbrella in the list, click Edit 2. Click Cloaking in the Category list, verify that the Enable cloaking check box is checked, click OK, click Done 3. Click the assets folder in the Files panel, click the Options icon (upper right corner of the Files panel), point to Site, point to Cloaking, click Cloak 4. Right-click the assets folder, point to Cloaking, then click Uncloak

Lesson 4: Cloak Files (3) • Cloak selected file types 1. Right-click the assets folder in the Files panel, point to Cloaking, click Settings 2. Click the Cloak files ending with check box, select the text in the text box, type. gif in the text box 3. Click OK, click OK again 4. Open the assets folder in the Files panel and note that only the. gif files are cloaked

Lesson 5: Import and Export a Site Definition • Exporting a Site Definition – You may want to share a Web site with others who may be responsible for maintaining it – A site definition file (extension. ste) contains important information about the site, such as the URL, login, and password information – Export a site definition file to an external location (not in the site itself) for security reasons – Use the Manage Sites dialog box to export a. ste file • Importing a Site Definition – Use the Manage Sites dialog box to import a. ste file

Lesson 5: Import and Export a Site Definition (2) • Export a site definition 1. Create a new folder on your hard drive or an external drive named su_site_definition 2. In Dreamweaver, click Site on the menu bar, click Manage Sites, click The Striped Umbrella, click Export 3. Click Back up my settings, click OK 4. Navigate to the su_site_definition folder, select it, click Open, click Save, click Done

Lesson 5: Import and Export a Site Definition (3) • Import a site definition 1. Click Site on the menu bar, click Manage Sites, click The Striped Umbrella, click Import 2. Navigate to the su_site_definition folder, open this folder, select The Striped Umbrella. ste, click Open 3. Click OK (the new site is The Striped Umbrella 2) 4. Click The Striped Umbrella 2, click Edit 5. Click OK, click Done • View and delete the imported site 1. In the Files panel, click the Site list arrow, click The Striped Umbrella 2 (s/b identical to the original site) 2. Click Site on the menu bar, click Manage Sites, click Remove, click Yes, click Done (deletes the new site)

Lesson 6: Evaluate Web Content for Legal Use • Can You Use Downloaded Media? – Copyright laws determine whether you can use graphics, animations, sounds, and text off the Internet • Understanding Intellectual Property – Intellectual property is the product of human creativity • Understanding Copyright Law – Copyright laws promote progress in society – Copyright protects the tangible expression of an idea – Trademark protects a design used to identify a good or service

Lesson 6: Evaluate Web Content for Legal Use (2) • What Exactly Does the Copyright Owner Own? – The Copyright Act of 1976 gives the owner the right to reproduce, create derivative works, and distribute • Understanding Fair Use – Fair use allows for limited use of copyrighted works • How Do I Use Work Properly? – A student does not automatically have full use – Public domain material is not protected by copyrights • Understanding Licensing Agreements – A licensing agreement is permission given by the copyright holder

Lesson 6: Evaluate Web Content for Legal Use (3) • Obtaining Permission or a License – The permission process is very specific to what you want to use and how you want to use it – A request for using copyrighted material should include • • Your name, address, and contact information A specific description of your intended use A signature line for the copyright holder A target date when you need a response • Posting a Copyright Notice – The copyright symbol © is not required to indicate copyright, but it does make a clear statement to others – Add something like © Richard Johnson to your work