How To Edit Your HTML Code
While Contribute gives you many easy-to-use editing features, sometimes you may need
to do something that requires manually editing the HTML code.
Assigning your text editor
Your first step is to make sure that Contribute will use the right text editing software to
edit the HTML code. By default, Contribute will use Notepad. If you want to use
something different, go to "Preferences..." under the "Edit" menu.
Once you're in the "Preferences" window, select the "File Editors" category. From there,
highlight 'Web Page Source' in the list of extensions. Now, if you wish to use a different
text editor than the program marked '(Primary)' in the 'Editors' list, click the plus sign
button above the 'Editors' list.
Once you click the plus sign button, you will be prompted to navigate through your
computer to find the program you wish to use as your text editor.
Editing the HTML code
Now that you have established the program that Contribute will use to edit the HTML
code, either navigate to the web page you wish to edit in Browser mode or bring up a web
page draft in Edit mode. Once the page has loaded in the main window, go to the
"Actions" sub-menu under the "File" menu. Under "Actions," choose the "Edit Page
Source in External Application" option.
Once the option is selected, the designated text editor will start with the web page's
HTML code ready for editing.
After you are done editing the HTML code, simply save the HTML file and close the text
editor. When you return to Contribute, you will see the following message in the editing
To resume editing the webpage in Contribute, click the link at the bottom labeled "Edit
with Contribute." When you click the link, the webpage will appear with the changes
you made with the text editor.
How To Unlock A “Locked” File
Whenever you bring a web page into Edit mode, Contribute will create an LCK or
"Lock" file on the server that is associated with that web page. This file is meant to
prevent two or more people from using Contribute to edit the same webpage at the same
time. When Contribute sees the LCK file, it knows that another instance of Contribute is
currently editing that web page and will prevent you from editing it. Once you have
published the webpage, the LCK file is removed. Unfortunately, sometimes the LCK
files are not deleted and will remain on the server, thus, preventing you from editing.
This can occur for several reasons, but the most common case is where a user is
accessing Contribute over a wireless network and the wireless network begins having
signal difficulties. Contribute's connection to the webpage is severed and the LCK file is
not deleted. When the LCK file has not been deleted, Contribute will give you an error
message when you load the page in Browser mode.
The easiest way to remove a LCK file is to use the LCK removal feature found in the
Contribute 3.11 upgrade. If you have not upgraded Contribute 3 to version 3.11, go to
the Macromedia website and download the upgrade patch. To find out if you need the
upgrade patch, simply click the "About" option under the "Help" drop-down menu, then
left-click on the "About" window once to see which version you are currently operating.
Left-click the "About" window again to go back to Contribute.
In version 3.11, you should get an error message similar to the graphic posted above. The
error message should include the statement "Click here to make this page editable". Click
the blue link on the word "here" to remove the lck file and make the page editable.
Changing Your Language Encoding
Some professors, especially those in the Department of Foreign Languages, require their
websites to contain non-Latin alphabetic characters such as Greek, Arabic, Cyrillic,
Japanese, etc. Because the webpage contains non-Latin characters, the webpage must use
a different encoding standard. The encoding allows web browsers to recognize and
correctly display non-Latin characters. Therefore, if your webpage will contain non-
Latin characters, you must load the encoding standard associated with the language you
intend to use in the webpage.
First, you need to select "Page Properties..." located in the "Format" menu.
At the "Page Properties" window under the "Title/Encoding" category, you will see a
drop-down menu labeled "Encoding." Now, expand the drop-down menu and select the
encoding standard that correlates to the language used in the webpage. Once you have
selected the encoding standard, click the 'Reload' button and, then, the 'OK' button.
Section anchors can be very useful when you need to direct people to a specific part of a
webpage. They're inserted as part of a webpage and are invisible when loaded in a web
browser. Section anchors act as markers that can be used to link directly to a specific
portion of a webpage. For example, assume you have a single webpage that consists of
an article you've written. The article is divided into four major parts. You decide that
you'd like to link to this article from your home page (i.e. your "index" page or the first
page in your website), but in addition, you would prefer to link directly to the third part
of the article. With a conventional link, you would have to split the article up into four
webpages (one for each major part) and link to the third of those pages to accomplish
this. However, using anchors allows you to keep the article as a single page and simply
link to an anchor that marks the third part of the article. When you link to this article, the
web browser will load the entire page and then automatically position the scroll bar to the
portion of the document you've linked to. In this section, you will learn how to insert
section anchors and how to link to them.
Inserting a section anchor
To insert a section anchor, start by moving your cursor to the position where you want
the anchor to direct links to. Then, choose the "Section Anchor..." option under the
You will be prompted to give the anchor a name. This name will be used as a reference
for links. It's good practice to keep anchor names simple by using only letters or numbers
(no spaces, ampersands, pound signs, punctuation marks, etc.). However, underscores
Once you have given it a name, click 'OK.' A flag symbol will appear beside your
cursor. This means that the section anchor has now been sucessfully inserted.
To go back and change the anchor's name, just right-click the flag, choose "Anchor
Properties...," and type the new name in the anchor name field. To delete an anchor, just
highlight the flag and hit the delete key.
Inserting links to section anchors
First, you need to select the linking text or image and insert a link. If you need a
refresher on how to insert a link, you can refer to Section Six: Inserting Links on the
Contribute Introductory Tutorial website. At the "Insert Link" window, you will click the
'Advanced' button at the bottom. This will expand the "Insert Link" window to reveal
more link options. If the window contracted instead of expanding, just click the button
again to reveal the options.
Choose the page you wish to link to. If the page you're linking to contains section
anchors, they will be listed in the 'Section anchor:' drop-down menu. Choose the anchor
that you want the link to direct to and click 'OK.' The link you have just inserted will not
only go to the requested webpage, but it will also go to the specified anchor in that
Complying With ADA Standards
The "Americans with Disabilities" Act, or ADA for short, was signed into legislation in
1990. Section 508 of this bill ensurses that resources and information be made available
to people with disabilities involving movement, sight, hearing, etc. This section will
show you a checklist of ways to use Contribute to make your website ADA compliant.
Graphics (images, graphs, and charts)
Whenever you insert an image in your web page, you must make sure to include an ALT
text description. An ALT text description is text that remains hidden from plain view,
but is read aloud by screen reading software. That way, if a visually impaired student
loads your web page, the screen reading software will read out the ALT text description
so he or she will have a spoken description of the image.
To enter an image's ALT text, right-click the inserted image and choose "Image
Properties..." Remember, you must be in Edit mode to change an image's properties. At
the "Image Properties" window, go down to the bottom and you will find the text field to
enter the ALT text description.
Keep in mind that the ALT text description cannot be too long. However, it should be as
descriptive as possible. If you can't be descriptive enough, provide a good description in
the web page's regular text.
Multimedia & Applets (audio and video content)
It goes without saying that any multimedia content, such as audio and video, must be
made accessible. There are no tools within Contribute to make multimedia content
accessible, but this website can give you the guidelines regarding audio and video
content. At least one of the guidelines must be followed:
For audio content:
• Provide a text transcript
• Provide a text description. (A description is different from a transcript in that
descriptions can include your own commentary or summary. Transcripts only
include the spoken lines without commentary.)
• Include a link to a summary or transcript web page
• Provide closed captioning
For video content:
• Provide a summary (audio or written)
• Integrate a synchronized audio track in the video
• Provide closed captioning
To include closed captioning in an audio or video track, you can use MAGpie to integrate
the captions. MAGpie is free to download from the WGBH website. Follow this link to
These guidelines also apply to applets (java, flash, etc.).
Skip to Main Content
Skip to Content, or Skip Navigation, as it is commonly referred to states that there should
be an anchor link before the navigational links that skips to the main contents of the page.
Doing this will allow a user with a screen reader to skip often lengthy lists of links, and
go directly to the actual contents of the page - which is what they came there for. This
guideline also states that if you have a multimedia introduction to your website, you
should include a link which takes the reader directly to the main website.
This guideline states that, whenever you create a table for the purpose of organizing data
or displaying a timetable, you must include table headers. If you need a refresher on how
to create tables with headers, please refer to Section Three: Inserting Tables from the
Contribute Introduction tutorial website.
Color & Contrast
Dealing with color on a webpage can present some unexpected problems. One potential
problem lies in the background color. It is very easy to pick a background color and a
foreground text color that blends together making the text hard to read. To change the
background color, choose "Page Properties..." under the "Format" menu.
Now, go to the "Appearance" category and click on the 'Background color:' box. This
will pop out a color palette. Just click on the color you want your background to have.
After you have chosen your background color, choose your text by clicking on the box
next to 'Text color' and selecting the color from the palette.
Make sure that the text color does not blend in with the background color. People with
visual disabilities will find your website hard to read.
Another potential problem with color occurs when color is used to emphasize text. Take
the example of top three race winners. I'll have them listed by the order they finished in
but I'll emphasize the second place winner because he happens to be my friend.
• Elanor Rigby
• Leroy Brown
• Bobby McGee
The problem with this emphasis technique is that the emphasis is lost to someone who is
colorblind. Also, screen reading software will not pick up my emphasis and read it out
just like the rest of the text on the web page. To correct this, we can add something that
describes each winner. We can also use the "Emphasis" text feature. Simply highlight
the text you wish to emphasize, right-click on the text, and go to the "Emphasis" option
under the "Other" sub-menu. Depending on the starting template you use, the "Other"
sub-menu could be found in the "Text Options" sub-menu. Screen readers will pick up
on the "Emphasis" effect and make the viewer aware that the text is emphasized.
• First place: Elanor Rigby
• Second place: Leroy Brown (my friend)
• Third place: Bobby McGee
Now, the screen reader will convey the emphasis of the second place winner to the
Blinking, Moving, or Flickering Content
If you include any flashing text, images, or multimedia, you must make sure that the
content does not flicker at a rate between 2 to 55 times per second. This range of flicker
has been known to induce seizures in people with photosensitive epilepsy. Overall,
however, flickering or moving content should be avoided completely as it represents poor
design and does not conform with the latest web design standards.
If you are using a server that includes a time-out clock (a clock that, when it runs out, the
web page will refuse to refresh), make sure that you have the time-out length written
somewhere on the web page.
If your website contains frames, animated features, etc. that cannot be read by screen
reading software, be sure to include a link to a text-only version of the web page. Again,
it is best to design your web page so that this is not an issue.
If you wish to read more about website ADA compliance, please visit IBM's
Accessibility Center website or the Georgia Tech Research on Accessible Distance
Education website. Links to these sites are provided at the bottom of this section.