web content managers handbook

8/8/2019 Web Content Managers Handbook

1/35

Information Technology

Web Content ManagersHandbook

Produced by

Montgomery Colleges

Web Application Group(WAG)

Last updated 5/4/2006

http://www.mcinfonet.org/webinfo/

Web ContentManagersHandbook


2/35

TABLE OF CONTENTS

The Web Content Managers Handbook... 2

Web Application Group 2

Handbook Overview ........ 3

Two Web Publishing Options: 1 or 2 4

How to Obtain An Account For Your Department or Yourself.. 6

Ipswitch WS_ FTP Home (software) enables users to transferfiles between the remote servers and local computer

..

7

Steps to Back-up and Update Web Pages ... 10

Microsoft FrontPage 2000 .... 14

A-Prompt (software) is a program designed to improve website accessibility for people with various disabilities

19

Contact Information........ 33

http://www.montgomerycollege.edu/webinfo/ 2


3/35

Web Content Managers Handbook

This handbook is updated and maintained by the Web Application Group. The topics covered in thishandbook are meant to help the user (you) design, publish and view your website.

Web Application Group (WAG)

The Web Application Group provides guidance and support to the College community for themaintenance and development of the Colleges web sites.

Our services include providing web page design, development, implementation and consulting users.

The Web Application Group has developed a website to help the user with their website. The websiteis located athttp://www.montgomerycollege.edu/webinfo/ . Please refer to this site for the followinginformation

Web Accounts Instructions on how to open an account, fill in the required form, and obtain apassword and user ID

Web Tools Information on Web Page Editors, File Transfer software, and Web Browsers .

Web Content Managers Handbook This document (that you are currently reading) is locatedat this site .

Web Training A schedule of Standard Software Training that is currently being offered is listed .

Web Standards The Web Standards document that all college web pages are required to

follow is located at this link . Also a template tohelp the user start a website is provided .

Web Statistics - Provides a detailed analysis of the colleges website traffic .

The Web Application Group currently manages four web sites for the College Community.

The Internet* site is located at: http://www.montgomerycollege.edu , and contains informationand services for the public which are also useful to College employees.

The Intranet* site is located at: http://www.mcinfonet.org (MCInfonet), and containsinformation and services for the operation of the College for internal College communications.

OurWebCT site is located at: http://webct.montgomerycollege.edu. WebCT is ane-Learning software platform, or course management system, for delivering Distance Learningcourses via the web. WebCT can also be used to support courses taught on campus.

Distance Learning Intranet:http://www.montgomerycollege.edu/distance/internal

WebCT Training:http://s45.mc.cc.md.us/cp/home/loginf Login to myMC andchoose the 'My Courses' tab. From there, choose the 'DL WebCT' link from theleft hand navigation menu.

http://www.mcinfonet.org/webinfo/
http://www.montgomerycollege.edu/webinfo/http://www.montgomerycollege.edu/webinfo/http://www.montgomerycollege.edu/webinfo/obtainaccounts.htmlhttp://www.montgomerycollege.edu/webinfo/webtools.htmlhttp://www.montgomerycollege.edu/webinfo/WebUsersHdbk.dochttp://www.mcinfonet.org/it/dat/http://www.montgomerycollege.edu/webinfo/standards/index.htmlhttp://www.montgomerycollege.edu/template.htmhttp://www.mcinfonet.org/statisticshttp://www.montgomerycollege.edu/http://www.mcinfonet.org/http://webct.montgomerycollege./http://webct.montgomerycollege./http://www.montgomerycollege.edu/distance/internalhttp://s45.mc.cc.md.us/cp/home/loginfhttp://s45.mc.cc.md.us/cp/home/loginfhttp://www.montgomerycollege.edu/webinfo/http://www.montgomerycollege.edu/webinfo/obtainaccounts.htmlhttp://www.montgomerycollege.edu/webinfo/webtools.htmlhttp://www.montgomerycollege.edu/webinfo/WebUsersHdbk.dochttp://www.mcinfonet.org/it/dat/http://www.montgomerycollege.edu/webinfo/standards/index.htmlhttp://www.montgomerycollege.edu/template.htmhttp://www.mcinfonet.org/statisticshttp://www.montgomerycollege.edu/http://www.mcinfonet.org/http://webct.montgomerycollege./http://www.montgomerycollege.edu/distance/internalhttp://s45.mc.cc.md.us/cp/home/loginf


4/35

The Web4students site is located at:http://web4students.montgomerycollege.edu. Web4students is Web space for students whoare taking courses, which require web development work.

Faculty Instructions:http://www.montgomerycollege.edu/webinfo/facultyinstructions.html

Students Instructions:http://web4students.montgomerycollege.edu/information/introduction.html

* The Internet site is forexternal business; the Intranet site is forinternal operations.

HANDBOOK OVERVIEW

In order to get started, the next few pages will guide the user through the necessary steps to developtheir website in the college environment.

If additional skills are needed to help develop a website, training is provide through the IT Department

and the link to the current training schedule is provided in this document.

In the first section Web Publishing options are discussed. The Web Application Groupprovides the user two options for creating their website. The Web Application Group caneither assist the user with the initial design and implementation of their site or the user candesign and implement their site. The user is responsible in either option for maintaining theirweb site.

The second section discusses how to obtain a web account. Users will need to open a webaccount through the Web Application Group in order to receive a password and User ID fortheir website. Department accounts can be obtained for either Montgomerycollege.edu(Internet) or MCInfonet (Intranet) and Individual accounts can be obtained forMontgomerycollege.edu (Internet) only. The Web Application Group will provide the user with

a password and User ID after the proper form is completed.

The third section in this document has complete instructions on the WS_FTP software whichIT recommends for campus PC to log on to the remote server via the Internet, and transferfiles between a remote server and a local computer. This file transfer tool is necessary sothat the user can download files, work on files on your local computer, and then upload filesback again to the remote server, which makes those web pages live on the Web. The FTP

software recommended by IT to use for home PC isFileZilla. To install FileZilla software, go

tohttp://filezilla.sourceforge.net/and follow the procedures there. There is a FileZilla

Tutorial located at http://www.montgomerycollege.edu/webinfo/filezilla.html . (Pleaseenter www.montgomerycollege.edu for MC Internet or www.mcinfonet.org for MCIntranet as host.)

In the fourth section FrontPage 2000 is discussed. The editing features of the software aredescribed and items that should and should not be used when developing the website in thecollege environment are pointed out.

Finally, the contact information for the Web Application Group and the IT HelpDesk isprovided.

If you have questions, you can email the Web Application Group at:[email protected] or place a work order with the IT HelpDesk at (301) 251-7222.

http://web4students.montgomerycollege./http://web4students.montgomerycollege./http://www.mcinfonet.org/webinfo/Faculty4.pdfhttp://www.mcinfonet.org/webinfo/Student3.pdfhttp://filezilla.sourceforge.net/http://filezilla.sourceforge.net/http://www.montgomerycollege.edu/webinfo/filezilla.htmlhttp://www.montgomerycollege.edu/http://www.mcinfonet.org/mailto:[email protected]://web4students.montgomerycollege./http://www.mcinfonet.org/webinfo/Faculty4.pdfhttp://www.mcinfonet.org/webinfo/Student3.pdfhttp://filezilla.sourceforge.net/http://www.montgomerycollege.edu/webinfo/filezilla.htmlhttp://www.montgomerycollege.edu/http://www.mcinfonet.org/mailto:[email protected]


5/35

There Are Two Web Publishing options:

Option 1: The user provides the content and WAG will assist them with thedesign and implementation of the site. The user will maintain the

site once implemented.The skills required to maintain a web site can be obtained from IT training. The training schedule islocated at: http://www.mcinfonet.org/it/dat/signup/and the web training classes are listed underStandard Software Training. Listed below are the necessary steps needed to be taken for the designand implementation of a web site:

1. Get a Web Page Account for your site by following the instructions in the How To Get AnAccount For your Department or Yourself section of this handbook.

2. Microsoft FrontPage is the Colleges standard software web editor. Notify the IT Helpdesk (301-251-7222) for installation of Microsoft FrontPage and WS_FTP (a File Transfer Protocol

Software) software if it is not already installed on your PC. You can also download WS_FTP fromMCInfonet by following the instructions in the How to Install WS_FTP Software section of thishandbook.

3. The user then gathers information and data in electronic format to be included in the website.

4. When the Web Page Account form is received by the Web Application Group, anAnalyst/Programmer will be assigned to work with the user to determine their needs. (Statementof Requirements).

5. Base on the requirements, the WAG staff will determine the technical needs, a timeline, anddefine the scope of the project.

6. The WAG staff will develop a draft of the website.

7. The user will then review the draft, and sign off on it after the necessary changes are made.

8. WAG will link the new site from the Colleges website.For example, http://www.montgomerycollege.edu/Departments/index.html orhttp://www.montgomerycollege.edu/faculty/index.html and College directories, then notifiesthe user via email that their website has been linked from the Colleges site.

9. The WAG staff will consult with the user regarding training needs. The user can also check the ITtraining schedule at http://www.mcinfonet.org/it/dat/signup/, or contact Ed Palaszynski at 240-

314-3061, or by email: [email protected]

10. At this juncture, the user maintains the web site and contacts the IT Helpdesk at 301-251-7222when assistance is needed.

http://www.mcinfonet.org/it/dat/signup/http://www.mcinfonet.org/it/dat/signup/http://www.montgomerycollege.edu/Departments/index.htmlhttp://www.montgomerycollege.edu/faculty/index.htmlhttp://www.mcinfonet.org/it/dat/signup/mailto:[email protected]://www.mcinfonet.org/it/dat/signup/http://www.montgomerycollege.edu/Departments/index.htmlhttp://www.montgomerycollege.edu/faculty/index.htmlhttp://www.mcinfonet.org/it/dat/signup/mailto:[email protected]


6/35

OPTION 2: The user wants to design, implement, and maintain the site.

If the user needs WAG staff to assist with any database, form, script, and /or graphic designs, seebelow, the section labeled, Additional Needs.

1. Get a Web Page Account for your site by following the instructions in the How To Get An

Account For your Department or Yourself section of this handbook.

2. Microsoft FrontPage is the Colleges standard web editor software. Call IT Helpdesk (301-251-7222) for installation of Microsoft FrontPage and WS_FTP (a File Transfer ProtocolSoftware) software. You can also download WS_FTP from MCInfonet by following theinstructions in How to Install WS_FTP Software section in this handbook.

3. The user proceeds to develop his/her website. The user will contact the IT Helpdesk at 301-251-7222 when help is needed.

4. The user uploads their web files to the web server following the instructions in the How toUse FTP section of this handbook.

5. Users will test and review the websites and correct any problems including spelling, andbroken links.

6. The user notifies WAG via email ([email protected]) when the website hasbeen completed, so the new site can be linked from the Colleges web pages. WAG will linkthe site to http://www.montgomerycollege.edu/Departments/index.html orhttp://www.montgomerycollege.edu/faculty/index.html and College directories and thennotify the user via email that their website has been linked from the Colleges websites.

7. The user maintains the web site and contacts IT Helpdesk at 301-251-7222 when assistanceis needed.

Additional Needs: If the user requests the use of a database, form, script, and/orgraphic design. The user with the assigned WAG staff member will determine the needs

of the site. (Statement of Requirement).

For graphic design, this will include a Graphic Designer, and an initialreview of any content/art drafts, to be provided by the user.

1. Based on the requirements, the WAG staff will define the technical needs, scope of the project

and develop a time line.2. The WAG staff develops the initial database, form, script, and/or graphic design. For graphicdesign, the Graphic Designer will work with the user to clarify graphic content and initial design.

3. The user reviews the draft for any final changes, and then signs off on it.4. The WAG staff finalizes the database, form, script, graphics or artwork.5. The WAG staff will link and upload files to the appropriate location of the web server

and notifies the user via email.6. The user maintains the web site and contacts IT Helpdesk at 301-251-7222 when assistance is

needed.

http://www.montgomerycollege.edu/Departments/index.htmlhttp://www.montgomerycollege.edu/faculty/index.htmlhttp://www.montgomerycollege.edu/Departments/index.htmlhttp://www.montgomerycollege.edu/faculty/index.html


7/35

How to Obtain an Account for Your Department or Yourself

To obtain one of the following web accounts:

EDU Departmental http://www.montgomerycollege.edu/Departments/ EDU Individual http://www.montgomerycollege.edu/faculty/

MC Infonet Departmental http://www.mcinfonet.org/

Web4Students Individual http://web4students.montgomerycollege.edu

Please fill out the WEB ACCOUNTS REQUEST FORM athttp://www.montgomerycollege.edu/webinfo/webaccountapp.html , print the form, get your CollegeAdministrator (Dept. Dean or Director) to sign the form, and send it to the IT Web Application Group(WAG). When WAG receives the form, WAG will contact you by email or telephone to provideassistance and instructions tailored to your specific requirements within a two-week period. Your user IDand password will be forwarded to you via regular MC interoffice mail.

http://www.montgomerycollege.edu/Departments/http://www.montgomerycollege.edu/faculty/http://www.montgomerycollege.edu/faculty/http://www.mcinfonet.org/http://web4students.montgomerycollege.edu/http://web4students.montgomerycollege.edu/http://www.montgomerycollege.edu/webinfo/webaccountapp.htmlhttp://www.montgomerycollege.edu/Departments/http://www.montgomerycollege.edu/faculty/http://www.mcinfonet.org/http://web4students.montgomerycollege.edu/http://www.montgomerycollege.edu/webinfo/webaccountapp.html


8/35

Ipswitch WS_FTP Home

Description

File Transfer Protocol (FTP) software enables users to log on to the remote server via the Internet, andtransfer files between the remote servers and local storage areas.

Common uses are: upload, download, create and delete LOCAL (your computer) and REMOTE (thewebserver) files and subdirectories.

How to Install Ipswitch WS_FTP Home Software

To install Ipswitch WS_FTP Home software, perform the following steps or call the IT Helpdesk at 301-251-7222 to place a work order to have it installed on your PC.

1. Click on the Web Tools page link:http://www.montgomerycollege.edu/webinfo/webtools.html .

2. Click the File Transfer Protocol link.

3. A File Download box appears. Choose Open.

4. The installation program will begin to download. This process should take about one minute.When its finished, the blue Install Shield Wizard screen will appear.

5. Choose Next to begin the installation process.

6. The License Agreement screen will appear. Choose I accept the terms of the licenseagreement and click next.

7. The Choose Destination Location screen will appear. Click Next.

8. The Select Program Folder will appear. Click Next.

9. The Start Copying Files screen will appear. Click Next

10. The Install Shield Wizard Complete screen will appear. Click Finish and the FTP program willopen.

http://www.montgomerycollege.edu/webinfo/webtools.htmlhttp://www.montgomerycollege.edu/webinfo/webtools.html


9/35

Connecting to your website

*At this point, you will need your login information which was provided to you by the WebApplications Group:

Host Name (Server Address)

User ID (User Name)

Password

11. The Connection Wizard Welcome screen will appear. Click Next.

12. The Site Name screen will appear. Enter whatever name you wish. Click Next.

13. The Connection Type screen will appear. Choose FTP. Click Next.

14. The Server Address screen will appear. Enter the Server Address (Host Name), which isusually eitherwww.montgomerycollege.edu orwww.mcinfonet.org. Click Next.

15. The User Name and Password screen will appear. Enter your User Name (User ID). Enteryour Password. Click Next.

16. The Finish screen will appear. Click Finish and it will connect to your web account.

http://www.montgomerycollege.edu/http://www.mcinfonet.org/http://www.montgomerycollege.edu/http://www.mcinfonet.org/


10/35

FTP Dos and Donts

In the screenshot above, the left screen is LOCAL (your computer) and the right screen isREMOTE (your website). The green arrows in the center indicate the direction of file transfer.

When selecting or clicking on a file, be sure to click only ONCEon the file. Do NotDOUBLE CLICK when selecting files. Double clicking will initiate file transfer and cause thefile to be overwritten without the users knowledge.

When making any changes to your web page -1. Download a copy from the server, using FTP2. Make any needed modifications3. Upload the modified copy to the web server, using FTP

DO NOTmodify the copy of your web page that exists on a desktop computer and thenupload it to the server. Since the IT Web Application Group often assists users to updatetheir web site, copying the current version from the server insures you are modifying the mostrecent copy of the web page.

When transferring files remember to RENAME the file so that the original file will still exist (in

case you need it in the future) and the file you create does not override the existing file. When renaming a file it is recommended that you use the following format:

filename.yymmdd.YourInitials. For example, if you are renaming index.html the new filename would become index.html.020711.abc



11/35

Steps to Back-up and Update Web Pages

This procedure helps you properly retrieve, edit and upload web pages. It also gives tips onsafeguarding your edits from errors and finally describes important general information concerning webpage updating at the College.

1. Find the name of the HTML file you want to update using your web browser (ie. Netscape orInternet Explorer).

2. Use Ipswitch WS_FTP Home to download the file from your website to your computer.

3. Make a backup copy of the file in your computer in case you make mistakes when editing.

4. Edit the HTML file you downloaded in step 3 to make the updates to the web page.

5. Use Ipswitch WS_FTP Home to upload the updated file from your computer to your website.

6. Check the updated file using your web browser to make sure your changes look OK.

Please remember to follow the steps listed above each time you update your web pages.



12/35

Process for creating the "backup files" folder

Your website folder will look similar to the image below:

(Note: Internet Explorer is shown here, but there are other options)

1. To make a "back-up" folder, start by creating a backup folder under your computer directory andname the folder "backup files". You will only have to create the backup folder once.

Use this folder to keep all the back-up files of your work. Its important to have backups in case youmake mistakes while editing the files. You will always have access to these files since you have savedthem.



13/35

Next, copy and paste the HTML file (index.html) into the newly created "backup files" folder.

Rename the file (index.html) by adding the current date to the end of .html.Example: index.html.09302002



14/35

Over time, you could have several renamed copies - index.html.04112002, index.html.07052002, andindex.html.09302002 - in your "back-up files" folder. There will always be only one file labeled index.htmland this is the file that is actively seen on the browser.

In summary, every time you need to make changes to the index page of your website you will edit theindex.html file by downloading it from the server (it's the latest version), copying it toyour "backup-files" folder, renaming the file by adding the date to the end, then editing theindex.html file and uploading it back to the server.

Common Errors and Solutions:

ERROR: SOLUTION:

You assume youre the only one who makeschanges to your website pages.

The reality is that other groups such as the WebApplication Group (WAG), after receiving yourpermission, can periodically go in and update yourweb pages.

You make edits to and upload from a local copy ofyour file without first downloading the original fromthe web server.

Always start by downloading an original file fromthe server in order to preserve the most recentedits. Otherwise you risk overwriting recentchanges.

You edit the file locally, fail to upload it to the webserver yet expect that the local edits will be

reflected on the web server.

Unless you upload your file to the web server, noneof the changes will be seen on the website.

You dont make a backup copy of the page filebefore editing it.

Remember to always make a back-up copy firstand then perform the editing.

Multiple users concurrently edit the file so thatsomeone ends up overwriting another's changes.

WAG will always notify you when we are workingon your site after receiving your permission.Always coordinate with others whom you permit toupdate your site.



15/35

Microsoft FrontPage 2000

The Web Application Group recommends Microsoft FrontPage 2000 as the standard web pagedevelopment software tool for Montgomery College users. Microsoft FrontPage 2000 softwareshould not be used with the Personal Web Serverin order for users to participate successfullyin the Colleges website environment.

Setting Up Local Web Folders ToContain Data

The following is a recommendation for Montgomery College users on how to configure MicrosoftFrontPage 2000 web in order to participate successfully in the Colleges website environment.

After FrontPage 2000 has been installed on your computer, you can set up personal webs tocontain data locally on your PC. A personal web is a local web folder(a place or location) on

your computer where you save files. Personal Webs (local web folders) serves a functionsimilar to the folder My Documents.

To Create A Microsoft FrontPage 2000 Local Web Folder

1. Start Windows.

2. Click the Start button in the lower-left corner of the screen, select Programs,and then select MS FrontPage.

3. Click on File -> New -> Web.

4. In the New FrontPage Web dialog box: (See illustration below)

a. Select the Empty Web icon.

b. Then enter the location of your FrontPage web, for example: C:\MyDocuments\My Webs\WebAppGroup, then click the OK button.

http://www.montgomerycollege.edu/webinfo/15


16/35

Note: If your folder has not previously been defined as a FrontPage Web, the programwill ask whether you want to turn it into a FrontPage Web folder, selectYes.

Tips:

Use the same name for your LOCAL (your computer) and REMOTE (the webserver)subdirectories and documents!

The FrontPage Editor window opens, displaying the folders and files in your web.

To Open An Existing Microsoft FrontPage 2000 Local Web Folder

1. Start Windows.

2. Click the Start button in the lower-left corner of the screen, select Programs,and then select MS FrontPage.

3. Click File -> Open Web.

4. From the list, (see illustration below), select an existing FrontPage web to open.

5. Click Open to open an existing FrontPage Web folder.



17/35

MS FrontPage Dos and Donts

I. Features Recommended For Use In The MC Website Environment

The Web Application Groups recommendations describe specific Microsoft FrontPage 2000features that should be used in the Montgomery College website environment. Procedures andexamples are listed below.

1. Relative Hyperlinks

A relative link points to a page according to its relation to your current directory.Relative links are easily recognized because they do NOT include the domain name ofthe server. Using relative links will make your site more portable if there is ever a needto change the domain name, and also ensures smooth testing of more complexcollections of pages as long as the identical structure of folder and file names ismaintained on both the server and on your computer.

To build a relative link, you only need to specify where a file is located in relation to thefile you are link from.

For example, if you are creating a link on any page located in the folderhttp://www.montgomercollege.edu/Departments/mydept/ -

will link tohttp://www.montgomerycollege.edu/Departments/mydept/button.html

will link tohttp://www.montgomerycollege.edu/Departments/mydept/images/button.html

http://www.montgomercollege.edu/Departments/mydept/http://www.montgomerycollege.edu/Departments/mydept/button.htmlhttp://www.montgomerycollege.edu/Departments/mydept/images/button.htmlhttp://www.montgomerycollege.edu/Departments/mydept/images/button.htmlhttp://www.montgomercollege.edu/Departments/mydept/http://www.montgomerycollege.edu/Departments/mydept/button.htmlhttp://www.montgomerycollege.edu/Departments/mydept/images/button.htmlhttp://www.montgomerycollege.edu/Departments/mydept/images/button.html


18/35

in these first to cases, the URL inside the href tag is simply appended onto thename ofthe folder that contains the file you are editing.

will link to

http://www.montgomerycollege.edu/Departments/images/button.html will link tohttp://www.montgomerycollege.edu/images/button.html

in these two cases, each occurrence of the combination ../ pushes thereference pointone step earlier on the chain of nested folder. A single ../ drops the current folder(/mydept) from the link URL and looks in the parent folder (/Departments)instead. Two of them (../../) also drops the parent folder name from the URL,taking the user back to the root.

will link to

http://www.montgomerycollege.edu/images/button.html

the final example is a powerful special case. The leading / (without any dots)is shorthand for the server root directory, in this case,www.montgomerycollege.edu. Compare the first example , which looks for button.html in the current folder, with , which looks for it directly off the root.

A. The Correct Method To Insert A Hyperlink Using MS FrontPage 2000

1. Open the MS FrontPage 2000 web where your document islocated.

2. In the MS FrontPage 2000 Folder List window, double-click onthe file to open your document.

3. From the MS FrontPage 2000 Editor, place your cursor in front ofthe text where you want to create a hyperlink, click ONCE and holddown the left mouse button, dragging across the text until the area ishighlighted.

4. From the main menu bar at the top of the page, select Insert, andthenselect Hyperlink. In the Create Hyperlink window,

To Link to local document:

Click on the file to link to and then click OK.

To Link to another URL:

In the URL box, type in your address (i.e.http://www.cnn.com/)and then

click OK.

Tips:

http://www.montgomerycollege.edu/Departments/images/button.htmlhttp://www.montgomerycollege.edu/images/button.htmlhttp://www.montgomerycollege.edu/images/button.htmlhttp://www.cnn.com/http://www.cnn.com/http://www.montgomerycollege.edu/Departments/images/button.htmlhttp://www.montgomerycollege.edu/images/button.htmlhttp://www.montgomerycollege.edu/images/button.htmlhttp://www.cnn.com/


19/35

1. Make sure you use the correct URL in your links: check the base href startingpoint, directory name and actual filename!

2. Check your documents for spelling errors, extra spaces and incorrect URLsBEFORE and AFTER posting!

II. Features That Should NOT Be Used In The MC Website Environment

Because of our web server environment, the Web Application Group recommends that thefollowing three Microsoft FrontPage 2000 features should NOT be used in the MontgomeryCollege website environment.

1. Publish

Montgomery College Department and Individual account holders that develop web pages mustnot use the Microsoft FrontPage 2000 Publish feature to transfer documents to theMontgomery College website. The Web Application Group recommends that the freeware File

Transfer Protocol program WS-FTP be used instead. The WS-FTP software is easy to use, andallows users the ability to view what files or folders are being transferred to or from the remotelocation. WS-FTP is available online for downloading from: www.ipswitch.com orhttp://www.mcinfonet.org/download/. Detailed procedures for using WS-FTP software aredescribed in the section Using FTP.

2. Recalculate Hyperlinks

Microsoft FrontPage 2000 automatically recalculates the webs hyperlinks whenever a page isupdated, moved, renamed or deleted. If the user initiates a manual Recalculate Hyperlinksfrom Microsoft FrontPage 2000 Explorer, it will cause Microsoft FrontPage 2000 to insertHTML code indicating the datas actual location on their computer (c://file:library) to be insertedinto all of their HTML documents.=If these documents are copied to the Montgomery College website, all of the hyperlinks willincorrectly point to the local origin on the users machine.

3. Long Filenames

The Microsoft Windows Operating System permits long filenames (more then 8 characters).However, we recommend the following:

1. Users should name their files with the standard MS-DOS format of less than 8 characters inthe filename, and 3 characters in the extension.

2. Recommended samples of filenames:

index.html(your home page) abcd.htm orabcd.html(regular pages)

abcd.gif(image file) abcd.jpg(image file)



20/35

Tips:

1. We recommend that you use all lowercase, with no spaces and no special characters inyour LOCAL (your computer) and REMOTE (the webserver) filenames. The REMOTEwebserver that you are transferring your files to is case-sensitive and does not work well withspecial characters.

Examples of non-special characters: A-Z, a-z, 0-9, _(underscore), . (period)

Abcd.htmland abcd.htmlare different files!

2. Filenames should not start with a . (period).

3. Another reason we recommend less than 8 characters naming convention is that it will beeasier to remember the name of the pages of your documents!

MS FrontPage Advanced Components

In the FrontPage Editor, the following advanced components are NOT recommended for

use: ActiveX control, Java applet, Plug-in, Script, and Design-Time control.

A-Prompt (Accessibility-Prompt) Overview(Information from the A-Prompt websitehttp://aprompt.snow.utoronto.ca/overview.htmand A-Prompt Help.)

Adding accessibility awareness to web authoring tools

A-Prompt (Accessibility Prompt) version 1.0.6 is a software program designed to improve website accessibility for people with various disabilities. By evaluating web pages for accessibilitybarriers and making repairs to correct those problems, A-Prompt helps web developers and

content authors create sites that are accessible to the widest possible audience.

A-Prompt is based on accessibility guidelines developed and maintained by the"http://www.w3.org/WAI/" , (WAI - Web Accessibility Initiative) a branch of the"http://www.w3.org".

This software tool is made available through the collaborative efforts of the University ofToronto's "http://www.utoronto.ca//atrc/" and the "http://trace.wisc.edu/" at the University ofWisconsin. Both research groups are dedicated to improving the availability and accessibility ofinformation technologies for people with disabilities.

The issue of accessibility on the World Wide Web is becoming increasingly important especially

in light of legislation (Section 508) in the United States. Section 508 of the Rehabilitation Act willrequire all U.S. federal agencies to make electronic information fully accessible to people withdisabilities by July 1, 2001.

A-Prompt affords web builders an opportunity to test fully functional sites and those underconstruction for accessibility problems in a comprehensive and efficient manner. The software iseasy to use and offers extensive Help files to guide the user step-by-step through each repairprocess.

http://aprompt.snow.utoronto.ca/overview.htmhttp://aprompt.snow.utoronto.ca/overview.htmhttp://aprompt.snow.utoronto.ca/overview.htm


21/35



22/35

Types of repairs

1. Adding descriptive text to adocument

2. Alternate text is suspicious

3. Alternate text may be too long4. APPLET missing alternate

content5. ASCII art missing description6. ASCII art missing skipover link7. Auto-redirect must be removed8. Auto-refresh must be removed9. BLINK/MARQUEE invalid markup10.Color Contrast Low11. Color usage [manual check]12.DOCTYPE missing

13.Flicker should be avoided[manual check]

14.FRAME missing title15.FRAMESET missing

NOFRAMES section16.FRAMES may require descriptive

text17.FRAME source invalid18.Header may be invalid19.Headers may require markup20.Headers not nested

21.Image (button) missing alternatetext22.Image map AREA missing

alternate text23.Image map (client-side) missing

text links24.Image map (server-side) missing

text links25.Image map (server-side) requires

conversion26.Image missing alternate text

27.Image missing descriptive text28.Image missing d-link29.INPUT missing default text30.LABEL missing INPUT31.LABEL needs repositioning

32.Language changes not indicated[manual check]

33.Language not identified

34.Link text may not be meaningful35.List usage invalid36.Metadata missing37.Multimedia requires synchronized

text [manual check]38.Multiple links missing skipover39.New windows require warning40.OBJECT missing alternate

content41.Programmatic object may not be

accessible [manual check]

42.Programmatic objects requiretesting [manual check]

43.SCRIPT missing NOSCRIPTsection

44.Script not keyboard accessible45.Sound file missing text transcript46.Stylesheets missing [manual

check]47.Stylesheets require testing

[manual check]48.TABLE (data) may require

header abbreviations49.TABLE (data) may requiremarkup

50.TABLE (data) missing headers51.Table (layout) headers are invalid52.TABLE (layout) may not linearize

properly53.TABLE missing caption54.TABLE missing summary55.TABLE purpose unknown56.Text equivalents require updating

[manual check]



23/35

Overview

Upon launching the A-Prompt program, content developers are presented withA-Prompt's "File Selector" dialog box. A-Prompt's "File Selector" dialog box enables webcontent developers to locate specific files and ensure they conform to Web AccessibilityInitiative (WAI) guidelines.

The "File Selector" dialog box allows users to locate a directory on the computer hard drivethrough the "Select Files To Repair" dropdown menu. When a selection is made, a data treeappears in the directory window displaying all available folders and files enabling contentauthors to quickly locate web document(s) that require testing.

Once the type(s) of files have been selected for evaluation, the "File Selector" lists them in thedirectory window and provides such information as the file's name, size, when it was lastmodified, and file type.

When a file is selected for testing, A-Prompt launches the "Accessibility Problems" repair dialogbox. The "Accessibility Problems" dialog box identifies and lists all accessibility problems foundwithin selected documents.

If a user returns to the "File Selector" dialog without making the recommended repairs, A-Prompt places a black "X" beside the filename indicating the accessibility problems have notbeen addressed. If only some of the repairs are completed, the "File Selector" places a black "?"beside the filename to indicate accessibility issues remain in the document. When allaccessibility repairs have been addressed, the "File Selector" places a green checkmark besidethe filename.

Once repairs to selected documents have been completed the "Quit" button is selected and A-Prompt automatically saves all changes made to files within the site. This also automaticallycloses the program. A-Prompt stores all changes made to a document so that if a contentdeveloper accesses the file at a later date the program indicates whether the document was

repaired, partially repaired, or not repaired.


24/35

Quick Start

1. Upon launching the A-Prompt program, the A-PROMPT - FILE SELECTORscreen will be displayed.

2.

In the SELECT FILES TO REPAIR section click on the arrow that will display adropdown list. Click on the file that needs testing for accessibility.

3. UnderSHOW THESE TYPES OF FILES section click on any one of the threecheckboxes: "HTML Files", "Text Files" or or "All Files".

4. In the FILE SELECTOR screen, under the NAME section, click on the fileyou want to repair. Click the REPAIR button.

5. The next screen will be labeled A-PROMPT TABLE PURPOSE. Click onone of two radio buttons: "Data Table" or "Layout Table". Continue to click theNEXT button as you move through the TABLE PURPOSE screens until youget to the FINISH button. Click on the FINISH button.

6. You will now be at the ACCESSIBILITY PROBLEMS screen. Click theREPAIR button at the bottom of the screen.

7. Below are some of the examples of the screens you will see when makingrepairs:

Image missing alternate text screen

Image missing descriptive text screen

Manual Checks screen

Multiple links missing skipover screen SCRIPT missing NOSCRIPT section section

FRAME missing title section

TABLE (data) missing headers sectionSelect the REPAIR button to return to the ACCESSIBILITY PROBLEMSscreen.

8. When accessibility issues have been repaired, select the DONE button. TheSAVE VALIDATED FILE AS screen is shown, click on the SAVE button.

9. In the A-PROMPT - FILE SELECTOR screen, under the NAME section,

click on another file to repair and repeat steps 6 through 12.

10. When all repairs are completed select the QUIT button at the bottom of theFILE SELECTOR screen to save all repairs and exit A-Prompt.


25/35

Getting Started

The following four steps are designed to provide users with the basics for getting started in A-Prompt. The program itself is very intuitive and includes extensive help files to guide users step-by-step through each repair.

STEP 1: A-Prompt File Selector Dialog Box

Upon launching the program, content developers are presented with A-Prompt's"File Selector" dialog box. The "File Selector" allows users to choose specific files foraccessibility testing through the "Select Files To Repair" dropdown menu.

Select Files To Repair:This menu lists the full name of all drives found on the user's system. When a drive is selected,a data tree appears in the directory window displaying all available folders and files allowingcontent authors to quickly locate web document(s) that require testing. The "Up One Level"button enables users to retrace their steps through each file folder hierarchy.


26/35

Show these types of files:The "File Selector" also features three checkbox options under the heading "Showthese types of files" at the bottom of the dialog. Content developers can choose to have A-Prompt display "HTML Files", "Text Files", or "All Files". (Note: If the "All Files" checkbox ischosen, the other two selections become disabled.) In addition, the "Refresh" buttonautomatically updates the directory. If, for example, a new file has been added to the site but isnot currently being displayed, select "Refresh" and the new document will appear in thedirectory listing.

If a file other than an HTML or text file is selected, A-Prompt launches an alert message askingthe user to confirm that they want to attempt to repair the file. Attempts to repair files that do notcontain either HTML source code or text (such as a program file, for example) results in asecond alert message being launched that indicates the file cannot be validated.


27/35

STEP 2: Accessibility Problems Repair Dialog Box

Accessibility Problems:

The "Accessibility Problems" repair dialog box lists the problem groups found within adocument in the left-hand column and the name, repair status, priority level, and auto-repairstate of specific accessibility problems on the right. Select the problem name(s) in the right-handcolumn and then choose the "Repair" button. A-Prompt automatically launches a separate

repair dialog for each accessibility problem identified in a document.Users are returned to the"Accessibility Problems" dialog box after repairs have been made to a particular document.

Progress Status Bar:The Progress status bar keeps track of the number of repairs completed and an icon at theend of the status bar indicates whether the document meets the conformance level pre-set bythe user.

Completed Repairs Not Selectable checkbox:Above the status bar is a checkbox entitled "Completed Repairs Not Selectable". Enabling thischeckbox prevents the user from selecting files that have already been repaired.


28/35

Examples of Repairs

Example 1: Image Missing Alternate TextProviding alternate or "alt" text for images is the first checkpoint listed in the Web AccessibilityInitiative (WAI) guidelines. All images, including those used for decorative purposes, graphicalrepresentations of text, bullets, symbols, and spacers, require a text equivalent.

A-Prompt Repair:

The repair process for adding missing "alt" text is straightforward. Simply enter a text descriptionfor the image in the text field provided. A-Prompt's repair dialog offers general guidelines forwriting appropriate "alt" text for specific images.

The repair for "Image missing alternate text" is now complete. Select the "Repair" button toreturn to A-Prompt's "Accessibility Problems" dialog box.


29/35

Example 2: Frame Missing Title

According to Web Accessibility Initiative (WAI), content developers are required to provide a titlefor each FRAME or IFRAME within a document. Web authors must identify the content and/orthe navigational links within a FRAME through the "title" attribute.

A-Prompt Repair:The correct FRAME title for the example below might appear in the HTML source code as

follows:

If the title attribute has not been included, A-Prompt will present a dialogue box providinginformation about the the frame source file, and the name, if available.

Note that the "FRAME missing title" repair dialog box includes a text entry field enablingcontent developers to add an appropriate title for each FRAME or IFRAME.

A-Prompt will automatically add the description entered to the document's HTML source codeby inserting a "title" attribute in each FRAME element.The repair is complete after a title has been added to each FRAME or IFRAME. Select the"Repair" button to return to A-Prompt's "Accessibility Problems" dialog box.


30/35

Example 3: TABLE (data) missing headers

According to the Web Accessibility Initiative (WAI), web authors must include row and columnheadings for all data TABLES to ensure text-only browsers render the information containedwithin the TABLE correctly.

Table for Age and Income

Level Statistics

Age Income Level

0 0

10 0

20 1000

30 20000

40 40000

50 60000

60 50000

70 30000


31/35

A-Prompt Repair:Before the repair can take place, A-Prompt must first determine whether the TABLE has beencreated to present data or for layout purposes. The "Table Purpose" dialog box displays thecontents of the table and presents two radio buttons: "Data Table" and "Layout Table". For thisrepair, select "Data Table".


32/35

A-Prompt Repair (cont):

If a data TABLE requires headings, A-Prompt offers content authors the option of adding column and/orrow headers via two checkboxes. The "Add column headers" checkbox features two radio buttons:"Convert top cells to headers" and "Add new headers". Selecting the first radio button changes each datacell in the top row into a heading. In the example below, A-Prompt would convert the data cells for "Age"

and "Income Level" into TABLE header elements.

If the top row of the data TABLE contains actual statistical information that cannot be used as headings,select the second radio button and A-Prompt creates text fields above each column. After typing in anappropriate heading for each column, select the "Repair" button to return to the "Accessibility Problems"dialog box.

A-Prompt Repair (cont):


33/35

This process can be repeated for rows within the TABLE as well.The repair is complete after headers have been added to the data TABLE. Select the "Repair" button toreturn to A-Prompt's "Accessibility Problems" dialog.


34/35

STEP 3: Saving Files

When all accessibility issues have been addressed, select the "Done" button to return to the "File Selector"dialog box. The file will be saved according to the "File Saving" selection made in the "Settings" dialogbox.

If all accessibility issues have been addressed, a green checkmark appears beside the names of allrepaired files in the directory. If repairs are incomplete, A-Prompt places a question mark beside thefilename. If no repairs have been made to the document or the user fails to complete any repairs for aparticular document, a black "X" is placed beside the filename.

STEP 4: Finished

Select the "Quit" button at the bottom of the "File Selector" dialog box to save all repairs and exit A-Prompt.

Contact Information

The Web Application Group is responsible for the Internet, Intranet, Web4students web, andWebCT server(s) administration at Montgomery College.Submit your comments via email to the Web Application Group at:[email protected].
mailto:[email protected]:[email protected]


35/35

Requests for support should go through the IT Help Desk,[email protected] or call(301) 251-7222.
mailto:[email protected]:[email protected]:[email protected]