OVERVIEW

1
(No Transcript)
2
Project Objectives
OVERVIEW

• Publish to a remote server
• Download and upload files to and from a remote
  Web site
• Use the Dreamweaver Check In/Check Out system
• Run site reports in Dreamweaver

3
Project Objectives (continued)
OVERVIEW

• Check spelling on a Web page
• Add keywords to a page
• Check a site for broken links and orphaned files
• Move or rename a Web file

4
Overview
OVERVIEW

• Project focus is on an existing Web site
• Three chief tasks
• Run through a test plan
• Run site reports
• Review site structure
• Dreamweaver features utilized
• Check In/Check Out
• Managing a remote site

5
The Assignment
INTRODUCTION

• Café Townsend site inherited by team
• Test and update Café Townsend site
• Project tasks
• Create a site definition
• Connect to a remote site
• Check files into and out of a site
• Run reports on a site
• Organize files on a site

6
INTRODUCTION
FIGURE 1 Café Townsend Web Site
7
Web Site Review and Testing
INTRODUCTION

• Test plans list key site or page items
• Purpose of test plan
• Ensure site accommodates best practices
• Ensure site is technically sound
• Ensure that site is well organized
• Dreamweaver as a testing tool
• Assists, but does not replace, humans
• Dreamweaver can notify you of a broken link
• Dreamweaver cannot determine if link is correct

8
Project 3 Lessons


INTRODUCTION

• Lesson 1 Reviewing, Testing, and Publishing a
  Web Site
• Lesson 2 Managing a Site

9
Lesson 1 Objectives
LESSON 1

• Publish to a remote server
• Download and upload files to and from a remote
  Web site
• Use the Dreamweaver Check In/Check Out system
• Run site reports in Dreamweaver
• Check spelling on a Web page

10
Lesson 1 Introduction
LESSON 1

• Setting up the work environment
• Simulate remote site on local network
• Define site to connect to remote server
• Enable the Check In/Check Out system
• Run reports as specified by test plan
• Perform several assessments
• Check accessibility features
• Check for broken links and orphaned files
• Run a spelling check on a Web page

11
Publishing to a Remote Server
LESSON 1

• Simulations enable safe testing
• Simulate remote site on local server
• Copy Web site folders to desktop
• Top level folder café_townsend_remote
• Define local site
• Top level folder café_townsend_local
• Enable site to connect to remote server
• Choose attributes for remote site

12
Getting and Putting Files
LESSON 1

• Move files using FTP
• Get and Check Out functions
• Used to download a file
• Put and Check In functions
• Used to upload a file
• Get and Put do not change file status
• Task for Web development team
• Get files from simulated remote site

13
LESSON 1
FIGURE 1-1 Files Panel
14
LESSON 1
FIGURE 1-2 Expanded Files showing the Café
Townsend Web site
15
Checking Files In and Out
LESSON 1

• How Dreamweaver Checks Out a file
• Displays name of user in Files Panel
• Places check mark next to files icon
• How Dreamweaver Checks In a file
• Local version becomes read-only
• Lock symbol appears beside file
• Tasks for Web Development team
• Check out chef_ipsum.html, edit name
• Check in chef_ipsum.html after edits

16
Conducting Site Reviews
LESSON 1

• Test a site throughout construction
• Testing guidelines
• Ensure pages function in target browsers
• Preview pages in non-target browsers
• Ascertain differences in display
• Ensure pages work or fail gracefully
• Check and fix broken links
• Use a link test report

17
Conducting Site Reviews (continued)
LESSON 1

• Testing guidelines (continued)
• Reduce time to download a page
• Break up large tables or
• Add some content above large tables
• Run site reports against entire site
• Check for untitled documents, empty tags, and
  redundant nested tags
• Validate code to locate tag or syntax errors
• Update and maintain published Web site
• Define and implement a version-control system

18
Conducting Usability Tests
LESSON 1

• Consider whether your site is usable
• Questions emphasizing structural issues
• Is the site structure apparent?
• What are the elements of the visual layout?
• How do visual elements pass information?
• What kind of navigation elements are used?
• Buttons, hyperlinks, images, something else?

19
Conducting Usability Tests (continued)
LESSON 1

• Questions emphasizing content issues
• How clearly are links labeled?
• Do the images have alternative text?
• Is the text readable?
• Is the text uniquely styled?
• If so, does the styling add value to the message?
• Do elements other than color convey emphasis?

20
Using Validation Reports
LESSON 1

• Features that help test your site
• Preview pages
• Check for browser compatibility
• Run variety of reports
• Test for broken links, workflow, or HTML
  attributes
• HTML attributes tested in HTML reports
• Accessibility, missing Alt text
• Nested tags, removable empty tags
• Untitled documents

21
LESSON 1
FIGURE 1- 3 Reports dialog box
22
Using Validation Reports (continued)
LESSON 1

• WCAG Web Content Accessibility Guidelines
• Tasks for development team
• Run accessibility report for Café Townsend
• Check site compliance with WCAG Priority 1
  checkpoints
• Review results in Site Reports panel
• Accessibility error marked by a red X against
  file
• Use report to go to problem source
• Fix problems in index.html and menu.html

23
LESSON 1
FIGURE 1- 5 Site Reports Panel
24
LESSON 1
FIGURE 1- 6 Index.html open in split view
25
Checking Spelling
LESSON 1

• Accessing the Check Spelling command
• Go to Text menu for open document
• Open Check Spelling dialog box
• Scope of Check Spelling command
• Focuses on text only
• Ignores HTML tags and other source code
• Task for Web development team
• Check and correct spelling in location.html

26
Lesson 2 Objectives
LESSON 2

• Add keywords to a page
• Check a site for broken links and orphaned files
• Move or rename a Web file

27
Lesson 2 Introduction
LESSON 2

• Inherited sites should be scrutinized
• Some small details not to be overlooked
• Whether the file system is well organized
• Whether all the links work
• Tasks for Café Townsend site review
• Ensure the use of well-chosen keywords
• Review and repair broken links in the site
• Ensure that the file system is well organized

28
Adding Meta Tags
LESSON 2

• Keywords help search engines index sites
• Keywords are contained in meta tags
• Format can be read by search engine robots
• Keywords should be well chosen
• Limit the number of keywords
• Ensure that keywords are meaningful
• Task for Web development team
• Insert well chosen keywords into all pages

29
LESSON 2
FIGURE 2-1 HTML category on the Insert bar
30
Managing Broken Links
LESSON 2

• Scope of Dreamweaver link verification
• Only verifies links internal to site
• External links are compiled, but not verified
• Check Links searches for broken links
• Scope open file, portion of site, entire site
• Tasks for Web development team
• Use Check Links Sitewide to find broken link
• Fix broken link in chef_ipsum.html

31
LESSON 2
FIGURE 2-2 Link Checker panel showing broken
links
32
Managing Orphaned Links
LESSON 2

• Use the Link Checker panel
• Orphaned file not referred to by site links
• Example image that is no longer used
• Be careful when deleting orphaned files
• Some Flash files post to Orphaned Files List
• Source files may appear orphaned
• Task for Web development team
• Locate and delete orphaned file, untitled.html

33
LESSON 2
FIGURE 2-3 Link Checker panel showing orphaned
files
34
Renaming and Moving Files
LESSON 2

• Change a files name on the Files panel
• Link information is preserved
• All pages linking to file are updated
• Renaming task for development team
• Change sign.jpg to townsend_street_sign.jpg
• townsend_street_sign.jpg is more descriptive
• A second problem image out of place
• Other images in images or flashContent

35
LESSON 2
FIGURE 2-5 Files panel showing sign.jpg
36
Renaming and Moving Files (continued)
LESSON 2

• Moving files within the Files panel
• Preserves link information
• Moving task for development team
• Drag townsend_street_sign.jpg to images
• Drop image file into target folder
• Check in new file
• Delete old file (sign.jpg) at remote site

37
LESSON 2
FIGURE 2-9 Files in the images folder
38
LESSON 2
FIGURE 2-10 Files in the images folder
39
Summarizing Project 3
SUMMARY

• Café Townsend Web site reviewed and cleaned up
• Defined site to connect to remote site
• Checked files into and out of site
• Site reports were run
• Site files were organized