Materials for HTML in Blackboard

Table of contents: 
Very basic HTML | Blackboard's Basic HTML| Cheatsheet {simple} HTML| Barebones {complex} html | Internal Reference tag Blackboard Course

 

Basic HTML

The Text field under Content Information allows you to type text with basic HTML, which displays through a browser. You must add the basic HTML to your text within the TEXT field.

HTML: When you type HTML do not add these tags: <html>, <head>, <title>, or <body>.

Bold text: <b>text here</b>
Italic text: <i>text here</i>
Underline text: <u>text here</u>
Linked text: <a href="http://www.calpoly.edu">link text here</a>
Paragraph text: <p>text here</p>
Text break: <br> - place this after the last word that you want a return line
Add image: <img src="image file name here">

Type HTML

The Text field under Content Information allows you to type HTML, which displays through a browser.

HTML: When you type HTML do not add these tags; <html>, <head>, <title>, or <body>.

From the Control Panel:

1) Click on the Syllabus, Course Materials, Assignments, or Books link under the Content Areas section.
2) Click on the Add Item button.
3) Choose a Name (title of content) within the pull-down list or select Other: and type a title into the empty field.
4) Type text into the Text field.

Do you want to make the content visible? - Click Yes so that your students can view the content; click No if you do not want your students to view this content.
Do you want to add offline content? - This feature should be selected (Yes) only if you are creating a link to a file on a CD-ROM which is located on the students' personal computers.
Do you want to track number of views? - Click Yes so that you may view how often this content has been accessed.
Do you want to add Metadata? - Click Yes so that Blackboard can keep accurate metrics.
Select Date(s) of Availability - Click Yes and choose the Display After/Until dates/times so that your content is only viewable during those dates/times. If you do not select anything here, the content will be continuously visible.

5) Scroll down to the bottom of the page and click the Submit button.

More Information

Q: Why would I type HTML into the Text field?
A: By typing HTML into the Text field you have more control over the content format (bold, italic, tables, colors, fonts, etc.).

Q: Do I need to know HTML to add HTML to the Text Field?
A: No, you can use Dreamweaver to create your content and then copy/paste the HTML into the Text field.

Copy/Paste Text or HTML

The Text field under Content Information allows you to type HTML, which displays through a browser.

HTML: If you copy/paste HTML into this field, remember to only copy/paste between and not including the body tags (<body>This Only</body>).

HTML Copy/Paste screen image

Note: Do not copy/paste Word 2000/2001 HTML into Blackboard text fields. Microsoft adds style sheet tags into your HTML which will not work in Blackboard because the style sheet resides between the <head> and <body> tags. If you use Word 2000/2001 download the Microsoft Word 2000 HTML Filter(PC only).

From the Control Panel:

1) Click on the Syllabus, Course Materials, Assignments, or Books link under the Content Areas section.
2) Click on the Add Item button.
3) Choose a Name (title of content) within the pull-down list or select Other: and type a title into the empty field.
4) Type text into the Text field.

Do you want to make the content visible? - Click Yes so that your students can view the content; click No if you do not want your students to view this content.
Do you want to add offline content? - This feature should be selected (Yes) only if you are creating a link to a file on a CD-ROM which is located on the students' personal computers.
Do you want to track number of views? - Click Yes so that you may view how often this content has been accessed.
Do you want to add Metadata? - Click Yes so that Blackboard can keep accurate metrics.
Select Date(s) of Availability - Click Yes and choose the Display After/Until dates/times so that your content is only viewable during those dates/times. If you do not select anything here, the content will be continuously visible.

5) Scroll down to the bottom of the page and click the Submit button.

More Information

Q: Why would I copy/paste HTML into the Text field?
A: If you do not know how to write HTML, you can use Dreamweaver to create your content and then copy/paste the HTML into Blackboard. HTML will allow you to have more control over the content format (bold, italic, tables, colors, fonts, etc.).

____________________________________________________________________________________________________________

"Smart Text" isn't very smart, but it does recognize SPACES, TABS, LINE BREAKS, and some html, like <b> for bold , <u> for underline, <img src="mypicture.gif"> for inserting images, <i> for italics, <font face> for changing font faces, <font size> for changing the font size.

[top]

__________________________________________________________________________________________________________________

Blackboard Inc on BASIC HTML

 

Basic HTML & Blackboard:

By default, Blackboard 5 will format text to 12-point, left-justified Arial. Any other formatting must be done with HTML codes. The following will introduce you to some basic HTML codes you can use yourself to add simple formatting to Blackboard documents.


1. What is HTML?

The acronym HTML stands for HyperText Mark-up Language. It is the set of codes used to format (or "mark up") Web pages. A single piece of HTML code is called a "tag." HTML tags are surrounded by pointed brackets ("<" and ">"), also known as the greater-than and less-than symbols. Tags usually come in pairs. The tags will format the text between the beginning tag and the end tag of the pair.

For example the pair of HTML tags to create bold text looks like this:

<b>This text will be bold. </b>

The tag means "start bold here." The end tag, , means "end bold here." End tags always include the forward slash ("/").



2. Using HTML in Blackboard

For smaller formatting jobs, you might prefer to type the HTML tags in yourself as you type your content. Here are some basic HTML tags that you can use.

QUESTION: Do I Use the "Smart Text" or the "HTML" Option?

Most text entry boxes in Blackboard 5 have three options:

+ Smart Text

+ Plain Text

+ HTML

The default option is Smart Text, and most of the time you can leave it at that.
Here's a summary of their different behaviors:

a. HTML - Renders all HTML tags. Primarily used if you are cutting and pasting HTML from another source.

b. Plain Text - Accepts your text just as you enter it. Does not render HTML codes; any HTML codes will show as text.

c. Smart Text - Renders HTML tags, but does not require tags for line breaks or paragraph breaks. You can enter line and paragraph breaks as you desire by typing.Web addresses entered in the URL format are automatically converted to links. For this to function the URL must begin with "http://" and there must be a space before the "http://" to distinguish it from the previous word. If an image tag is entered in Smart Text, Blackboard will automatically prompt you to upload the image. NOTE: This only works when the Blackboard document is first created; it does not work when modifying an existing document.


Paragraph formatting:

NOTE: If you select the Smart Text option, you do not need to use HTML paragraph formatting.


In HTML, a paragraph break puts a single blank line between paragraphs. A line break inserts no blank line.

The tag can be used alone at the end of a paragraph, or as a pair. If you use it as a pair, you can include the "align=left|center|right" modifier in the beginning tag to control placement. For example, this:

><P align=right>Fourscore and seven years ago, our founding father set forth upon this continent a new nation.</P><BR><BR>



would create a right-aligned paragraph.

The FONT tag requires that you use at least one of the modifiers (FACE, COLOR, or SIZE), but you do not need to use all of them.

The FACE modifier can be set to any font, but the person viewing the page must also have that font installed on their computer. For that reason, it is best to stick to common fonts like Times New Roman, Arial, or Courier New.

The COLOR modifier will recognize basic colors, including black, white, gray, red, blue, yellow, green, purple, orange, cyan, magenta, etc.

The SIZE modifier does not refer to typical font point sizes. In HTML fonts can be sizes 1 through 7. The default font size is 3.

NOTE: Since each user can set the default font point at which their browser will display text, these font sizes can be relative. For example, one user might have their browser's default font set to 10-point Times while another has their browser's default font set to 12-point Times. The HTML tag would create 10-point Times text on the first computer, and 12-point on the latter, since 3 is the default size.

You can use plus or minus signs to indicate sizes relative to the default. For example:

<FONT><FONT size=3><BR><FONT size=+2>Bigger, Better, Faster!</FONT><BR><BR><FONT size=1>

would create text that is two steps larger than the default font size.

Creating Links with HTML:
Links are created using the "anchor" tag:<BR><FONT><BR></FONT><A href="URL">Clickable text</A><BR><BR><FONT size=2>where URL is the Web address and "clickable text" is the text that will become the link. 

For example:<BR></FONT><BR><A href="http://www.blackboard.com/">Blackboard, Inc.</A><BR><BR></FONT><FONT size=2>will take the words "Blackboard, Inc." and turn them into a link that will direct the user to the Blackboard home page.
will take the words "Blackboard, Inc." and turn them into a link that will direct the user to the Blackboard home page.


Creating HTML with Other Tools:

Course developers should not feel like the have to learn everything about HTML. It is possible to use Web authoring tools to generate the HTML for you.

There are many applications you could use for this. Some of the most popular are:

Word processors. Microsoft Word, Corel WordPerfect, Apple AppleWorks, Sun StarOffice, and almost every other contemporary word processor contains the ability to convert your word processing documents to a Web page coded in HTML. However, the conversion from a word processing document to an HTML Web page is often far from perfect, especially for documents with complex formatting.

WYSIWYG (What You See Is What You Get) Web-authoring tools. These tools provide an environment similar to a word processor for Web page Development and entire Web sites.

Again, there are many products you could choose from in this category. Some of the most popular are Macromedia Dreamweaver, Adobe GoLive, NetObjects Fusion, and Microsoft FrontPage. The major browses also come with free Web-authoring tools. Netscape Composer is part of Netscape Communicator, and Microsoft FrontPage Express (a scaled back version of FrontPage) can be bundled with Microsoft Internet Explorer.

Unlike word processors, Web-authoring tools offer you an authoring environment tailored specifically to create Web pages. The Web, however, poses different problems than a print medium. For example, a Web page might appear different depending on which browser the audience is using, whether they're on Windows or Macintosh, etc. When using a Web-authoring tool, you will not have the same level of control over the online medium that a word processor offers over the printed page, however creating well-formatted Web pages will be much simpler with a Web-authoring tool than if you relying upon a word processor's "Save as HTML" conversion.

HTML Editors. Applications like BareBones Software's BBEdit and Allaire HomeSite provide an editing environment for HTML documents. While they are not WYSIWYG, HTML editors usually have a "preview" mode that allows you to switch between viewing the raw HTML codes and previewing how those codes will look in the browser. These products will help you write HTML faster and easier, but they presume you already have knowledge of HTML.
Experiment with some of these tools. You probably already have access to a word processor that can save your documents as HTML. Some of the Web-authoring tools and HTML editors provide free trial downloads from their Websites, and the ones tied to browsers (Microsoft FrontPage Express and Netscape Composer) are entirely free.


Incorporating HTML Generated with Other Applications into Your Blackboard Course

After developing your Web page, you have two options for including that content in Blackboard:

1. You can save it as an HTML file and upload the HTML file itself into Blackboard (using the "Create a link to this file" Special Action on the content-editing forms), or

2. You can copy and past the HTML codes themselves into the text-entry box in the Blackboard content-editing form.

For the former approach, just upload the HTML file as you would any other document. Blackboard will also automatically detect images in an HTML file and prompt you to upload the images as well.

For the latter, you will need to go through several steps:

1. View the HTML source. Most of the tools discussed above will have a mechanism (usually part of a View menu) to allow you to see the "HTML source" (which just means the HTML codes themselves).

2. Copy all of the HTML tags between but not including the and tags. Blackboard itself dynamically generates the HTML above and below the BODY tags, so you should not copy that portion of your HTML source.

3. Paste the copied HTML into the Blackboard content-editing forms text entry box.

4. Choose the HTML text-formatting option.

5. Submit the form.

If there are <IMG> tags in the HTML, Blackboard will automatically detect them after you submit the form. You'll receive a second form prompting you to upload the appropriate images. However, if you have other media (video, audio, Flash, Shockwave Director, Authorware, etc.) embedded in your HTML page or if you have included JavaScript scripts in the portion of your document, then you will need to package the file(s) before uploading.


Other Resources:

If you are interested in learning more about HTML, here are some online resources.

Introduction to HTML - http://www.cwru.edu/help/introHTML/toc.html

This tutorial from Case Western Reserve University is an excellent starting point for beginners.

The Beginner's Guide to HTML -
http://www.ncsa.uiuc.edu/General/Internet/WWW/HTMLPrimer.html

Even though HTML isn't a supercomputing application, the National Center for Supercomputing Applications has a great HTML tutorial. And they should know -- they're the people who created Mosaic, the first graphical Web browser.

Web Mastery -
http://www.devry-phx.edu/Webresrc/Webmstry/mastery.htm

The Web Mastery site has a lot of good information. More importantly, the "Learning HTML" section of this site links to dozens of other good tutorials.

The Yale C/AIM Web Style Guide -
http://info.med.yale.edu/caim/manual/contents.html

Not an HTML tutorial per se, but if you want to become skilled at HTML, you're going to have to start thinking about interface design and page design. The Yale Center for Advanced Interactive Media's Web Style Guide is an excellent introduction to those topics.

The World Wide Web Consortium -
http://www.w3.org

The World Wide Web Consortium (or W3C, for short) is a non-profit group that is responsible for maintaining the official HTML standards. This is the end-all, be-all for official HTML information, though it is probably too technical for beginners.

[top]

___________________________________________________________________________________________________________________________

Reference HTML Cheatsheet


Basic Tags
<html></html>
Creates an HTML document
<head></head>
Sets off the title and other information that isn't displayed on the Web page itself
<body></body>
Sets off the visible portion of the document

Header Tags
<title></title>
Puts the name of the document in the title bar

Body Attributes
<body bgcolor=?>
Sets the background color, using name or hex value
<body text=?>
Sets the text color, using name or hex value
<body link=?>
Sets the color of links, using name or hex value
<body vlink=?>
Sets the color of followed links, using name or hex value
<body alink=?>
Sets the color of links on click

Text Tags</ font>
<pre></pre>
Creates preformatted text
<hl></hl>
Creates the largest headline
<h6></h6>
Creates the smallest headline
<b></b>
Creates bold text
<i></i>
Creates italic text
<tt></tt>
Creates teletype, or typewriter-style text
<cite></cite>
Creates a citation, usually italic
<em></em>
Emphasizes a word (with italic or bold)
<strong></strong>
Emphasizes a word (with italic or bold)
<font size=?></font>
Sets size of font, from 1 to 7)
<font color=?></font>
Sets font color, using name or hex value

Links</ font>
<a href="URL"></a>
Creates a hyperlink
<a href="mailto:EMAIL"></a>
Creates a mailto link
<a name="NAME"></a>
Creates a target location within a document
<a href="#NAME"></a>
Links to that target location from elsewhere in the document

Formatting</ font>
<p></p>
Creates a new paragraph
<p align=?>
Aligns a paragraph to the left, right, or center
<br>
Inserts a line break
<blockquote>
</blockquote>
ndents text from both sides
<dl></dl>
Creates a definition list
<dt>
Precedes each definition term
<dd>
Precedes each definition
<ol></ol>
Creates a numbered list
<li></li>
Precedes each list item, and adds a number
<ul></ul>
Creates a bulleted list
<div align=?>
A generic tag used to format large blocks of HTML, also used for stylesheets

Graphical Elements
<img src="name">
Adds an image
<img src="name" align=?>
Aligns an image: left, right, center; bottom, top, middle
<img src="name" border=?>
Sets size of border around an image

Inserts a horizontal rule
<hr size=?>
Sets size (height) of rule
<hr width=?>
Sets width of rule, in percentage or absolute value
<hr noshade>
Creates a rule without a shadow

Tables
<table></table>
Creates a table
<tr></tr>
Sets off each row in a table
<td></td>
Sets off each cell in a row
<th></th>
Sets off the table header (a normal cell with bold, centered text)

Table Attributes
<table border=#>
Sets width of border around table cells
<table cellspacing=#>
Sets amount of space between table cells
<table cellpadding=#>
Sets amount of space between a cell's border and its contents
<table width=# or %>
Sets width of table - in pixels or as a percentage of document width
<tr align=?> or <td align=?>
Sets alignment for cell(s) (left, center, or right)
<tr valign=?> or <td valign=?>
Sets vertical alignment for cell(s) (top, middle, or bottom)
<td colspan=#>
Sets number of columns a cell should span
><td rowspan=#>
Sets number of rows a cell should span (default=1)
<td nowrap>
Prevents the lines within a cell from being broken to fit

Frames
<frameset></frameset>
tag in a frames document; can also be nested in other framesets
<frameset rows="value,value">
Defines the rows within a frameset, using number in pixels, or percentage of w idth
<frameset cols="value,value">
Defines the columns within a frameset, using number in pixels, or percentage of width
<frame>
Defines a single frame - or region - within a frameset
<noframes></noframes>
Defines what will appear on browsers that don't support frames

Frames Attributes
<frame src="URL">
Specifies which HTML document should be displayed
<frame name="name">
Names the frame, or region, so it may be targeted by other frames
<frame marginwidth=#>
Defines the left and right margins for the frame; must be equal to or greater than 1
<frame marginheight=#>
Defines the top and bottom margins for the frame; must be equal to or greater than 1
<frame scrolling=VALUE>
Sets whether the frame has a scrollbar; value may equal "yes," "no," or "auto. " The default, as in ordinary documents, is auto.
<frame noresize>
Prevents the user from resizing a frame

Web Safe Colors
(Note that FFFFFF, which is the code for white, is in the last row right position, and will not show up on the white background.) 
000000 000033 000066 000099 0000CC 0000FF 
003300 003333 003366 003399 0033CC 0033FF 
006600 006633 006666 006699 0066CC 0066FF 
009900 009933 009966 009999 0099CC 0099FF 
00CC00 00CC33 00CC66 00CC99 00CCCC 00CCFF 
00FF00 00FF33 00FF66 00FF99 00FFCC 00FFFF 
330000 330033 330066 330099 3300CC 3300FF 
333300 333333 333366 333399 3333CC 3333FF 
336600 336633 336666 336699 3366CC 3366FF 
339900 339933 339966 339999 3399CC 3399FF 
33CC00 33CC33 33CC66 33CC99 33CCCC 33CCFF 
33FF00 33FF33 33FF66 33FF99 33FFCC 33FFFF 
660000 660033 660066 660099 6600CC 6600FF 
663300 663333 663366 663399 6633CC 6633FF 
666600 666633 666666 666699 6666CC 6666FF 
669900 669933 669966 669999 6699CC 6699FF 
66CC00 66CC33 66CC66 66CC99 66CCCC 66CCFF 
66FF00 66FF33 66FF66 66FF99 66FFCC 66FFFF 
990000 990033 990066 990099 9900CC 9900FF 
993300 993333 993366 993399 9933CC 9933FF 
996600 996633 996666 996699 9966CC 9966FF 
999900 999933 999966 999999 9999CC 9999FF 
99CC00 99CC33 99CC66 99CC99 99CCCC 99CCFF 
99FF00 99FF33 99FF66 99FF99 99FFCC 99FFFF 
CC0000 CC0033 CC0066 CC0099 CC00CC CC00FF 
CC3300 CC3333 CC3366 CC3399 CC33CC CC33FF 
CC6600 CC6633 CC6666 CC6699 CC66CC CC66FF 
CC9900 CC9933 CC9966 CC9999 CC99CC CC99FF 
CCCC00 CCCC33 CCCC66 CCCC99 CCCCCC CCCCFF 
CCFF00 CCFF33 CCFF66 CCFF99 CCFFCC CCFFFF 
FF0000 FF0033 FF0066 FF0099 FF00CC FF00FF 
FF3300 FF3333 FF3366 FF3399 FF33CC FF33FF 
FF6600 FF6633 FF6666 FF6699 FF66CC FF66FF 
FF9900 FF9933 FF9966 FF9999 FF99CC FF99FF 
FFCC00 FFCC33 FFCC66 FFCC99 FFCCCC FFCCFF 
FFFF00 FFFF33 FFFF66 FFFF99 FFFFCC FFFFFF

____________________________________________________________________________________________________________________________

BAREBONES GUIDE

Version 4.0 Formatted -- February 1999

The latest version of this document is available at http://werbach.com/barebones/, where you will also find the text version, translations, and background materials.

The Bare Bones Guide to HTML lists all the tags that current browsers are likely to recognize. I have included all the elements in the official HTML 4.0 recommendation with common attributes, as well as Netscape and Microsoft extensions. This document is a quick reference, not a complete specification; for official information about HTML and its development, see the World Wide Web Consortium site at http://www.w3.org/MarkUp/.

The Guide is designed to be as concise as possible, and therefore it doesn't go into any detail about how to use the various tags. A few tags link to notes that address frequently-asked questions. If you're looking for more detailed step-by-step information, see my WWW Help Page.

 

Table of Contents

  1. INTRODUCTORY MATERIAL
  2. HTML TAGS

    Important: If you are not clear about the differences between the various versions of HTML, I suggest that you read my discussion of the development of HTML, or the World Wide Web Consortium HTML activity statement.

BASIC ELEMENTS
Document Type <HTML></HTML> (beginning and end of file)
Title <TITLE></TITLE> (must be in header)
Header <HEAD></HEAD> (descriptive info, such as title)
Body <BODY></BODY> (bulk of the page)

STRUCTURAL DEFINITION
Heading <H?></H?> (the spec. defines 6 levels)
Align Heading <H? ALIGN=LEFT|CENTER|RIGHT></H?>
Division <DIV></DIV>
Align Division <DIV ALIGN=LEFT|RIGHT|CENTER|JUSTIFY></DIV>
4.0 Defined Content <SPAN></SPAN>
Block Quote <BLOCKQUOTE></BLOCKQUOTE> (usually indented)
4.0 Quote <Q></Q> (for short quotations)
4.0 Citation <Q CITE="URL"></Q>
Emphasis <EM></EM> (usually displayed as italic)
Strong Emphasis ><STRONG></STRONG> (usually displayed as bold)
Citation <CITE></CITE> (usually italics)
Code <CODE></CODE> (for source code listings)
Sample Output <SAMP></SAMP>
Keyboard Input <KBD></KBD>
Variable <VAR></VAR>
Definition <DFN></DFN> (not widely implemented)
Author's Address <ADDRESS></ADDRESS>
Large Font Size <BIG></BIG>
Small Font Size <SMALL></SMALL>
4.0 Insert <INS></INS> (marks additions in a new version)
4.0 Time of Change <INS DATETIME=":::"></INS>
4.0 Comments <INS CITE="URL"></INS>
4.0 Delete <DEL></DEL> (marks deletions in a new version)
4.0 Time of Change <DEL DATETIME=":::"></DEL>
4.0 Comments <DEL CITE="URL"></DEL>
4.0 Acronym <ACRONYM></ACRONYM>
4.0 Abbreviation <ABBR></ABBR>

PRESENTATION FORMATTING
Bold <B></B>
Italic <I></I>
4.0* Underline <U></U> (not widely implemented)
Strikeout <STRIKE></STRIKE> (not widely implemented)
4.0* Strikeout <S></S> (not widely implemented)
Subscript <SUB></SUB>
Superscript <SUP></SUP>
Typewriter <TT></TT> (displays in a monospaced font)
Preformatted <PRE></PRE> (display text spacing as-is)
Width <PRE WIDTH=?></PRE> (in characters)
Center <CENTER></CENTER> (for both text and images)
N1 Blinking <BLINK></BLINK> (the most derided tag ever)
Font Size <FONT SIZE=?></FONT> (ranges from 1-7)
Change Font Size <FONT SIZE="+|-?"></FONT>
Font Color <FONT COLOR="#$$$$$$"></FONT>
4.0* Select Font <FONT FACE="***"></FONT>
N4 Point size <FONT POINT-SIZE=?></FONT>
N4 Weight <FONT WEIGHT=?></FONT>
4.0* Base Font Size <BASEFONT SIZE=?> (from 1-7; default is 3)
MS Marquee <MARQUEE></MARQUEE>

POSITIONING
N3 Multi-Column <MULTICOL COLS=?></MULTICOL>
N3 Column Gutter <MULTICOL GUTTER=?></MULTICOL>
N3 Column Width <MULTICOL WIDTH=?></MULTICOL>
N3 Spacer <SPACER>
N3 Spacer Type <SPACER TYPE=HORIZONTAL|VERTICAL|BLOCK>
N3 Size <SPACER SIZE=?>
N3 Dimensions <SPACER WIDTH=? HEIGHT=?>
N3 Alignment <SPACER ALIGN=LEFT|RIGHT|CENTER>
N4 Layer <LAYER></LAYER>
N4 Name <LAYER ID="***"></LAYER>
N4 Location <LAYER LEFT=? TOP=?></LAYER>
N4 Rel. Position <LAYER PAGEX=? PAGEY=?></LAYER>
N4 Source File <LAYER SRC="***"></LAYER>
N4 Stacking <LAYER Z-INDEX=?></LAYER>
N4 Stack Position <LAYER ABOVE="***" BELOW="***"></LAYER>
N4 Dimensions <LAYER HEIGHT=? WIDTH=?></LAYER>
N4 Clipping Path <LAYER CLIP=,,,></LAYER>
N4 Visible? <LAYER VISIBILITY=SHOW|HIDDEN|INHERIT></LAYER>
N4 Background <LAYER BACKGROUND="$$$$$$"></LAYER>
N4 Color <LAYER BGCOLOR="$$$$$$"></LAYER>
N4 vInline Layer <ILAYER></ILAYER> (takes same attributes as LAYER)
N4 Alt. Content <NOLAYER></NOLAYER>

LINKS, GRAPHICS, AND SOUNDS
Link Something <A HREF="URL"></A>
Link to Location <A HREF="URL#***"></A> (if in another document)
<A HREF="#***"></A> (if in current document)
4.0* Target Window <A HREF="URL" TARGET="***"></A>
4.0* Action on Click <A HREF="URL" ONCLICK="***"></A> (Javascript)
4.0* Mouseover Action <A HREF="URL" ONMOUSEOVER="***"></A> (Javascript)
4.0* Mouse out Action <A HREF="URL" ONMOUSEOUT="***"></A> (Javascript)
Link to Email <A HREF="mailto:@"></A>
N, MS Specify Subject <A HREF="mailto:@?SUBJECT=***"></A> (use a real question mark)
Define Location <A NAME="***"></A>
Display Image <IMG SRC="URL">
Alignment <IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE|LEFT|RIGHT>
N1 Alignment <IMG SRC="URL" ALIGN=TEXTTOP|ABSMIDDLE|BASELINE|ABSBOTTOM>
Alternate <IMG SRC="URL" ALT="***"> (if image not displayed)
Dimensions <IMG SRC="URL" WIDTH=? HEIGHT=?> (in pixels)
<IMG SRC="URL" WIDTH=% HEIGHT=%> (as percentage of page width/height)
Border <IMG SRC="URL" BORDER=?> (in pixels)
Runaround Space <IMG SRC="URL" HSPACE=? VSPACE=?> v(in pixels)
N1 Low-Res Proxy <IMG SRC="URL" LOWSRC="URL">
Imagemap <IMG SRC="URL" ISMAP> (requires a script)
Imagemap v<IMG SRC="URL" USEMAP="URL">
MS Movie Clip <IMG DYNSRC="***" START="***" LOOP=?>
MS Background Sound v<BGSOUND SRC="***" LOOP=?|INFINITE>
Client-Side Map <MAP NAME="***"></MAP> (describes the map)
Map Section <AREA SHAPE="DEFAULT|RECT|CIRCLE|POLY" COORDS=",,," HREF="URL"|NOHREF>
N1 Client Pull <META HTTP-EQUIV="Refresh" CONTENT="?; URL=URL">
N2 Embed Object <EMBED SRC="URL"> (insert object into page)
N2 Object Size <EMBED SRC="URL" WIDTH=? HEIGHT=?>
4.0 Object <OBJECT></OBJECT>
4.0 Parameters <PARAM>

[top]

DIVIDERS
Paragraph <P></P> (closing tag often unnecessary)
Align Text <P ALIGN=LEFT|CENTER|RIGHT></P>
N <b>Justify Text <P ALIGN=JUSTIFY></P>
Line Break <BR> (a single carriage return)
Clear Textwrap <BR CLEAR=LEFT|RIGHT|ALL>
Horizontal Rule <HR>
Alignment <HR ALIGN=LEFT|RIGHT|CENTER>
Thickness <HR SIZE=?> (in pixels)
Width <HR WIDTH=?> (in pixels)
Width Percent <HR WIDTH="%"> (as a percentage of page width)
Solid Line <HR NOSHADE> (without the 3D cutout look)
N1 No Break <NOBR></NOBR> (prevents line breaks)
N1 Word Break <WBR> (where to break a line if needed)

LISTS
Unordered List <UL><LI></UL> (before each list item)
Compact <UL COMPACT></UL>
Bullet Type <UL TYPE=DISC|CIRCLE|SQUARE> (for the whole list)
Bullet Type <LI TYPE=DISC|CIRCLE|SQUARE> (this & subsequent)
Ordered List <OL><LI></OL> (before each list item)
Compact <OL COMPACT></OL>
Numbering Type <OL TYPE=A|a|I|i|1> (for the whole list)
Numbering Type <LI TYPE=A|a|I|i|1> (this & subsequent)
Starting Number v<OL START=?> (for the whole list)
Starting Number <LI VALUE=?> (this & subsequent)
Definition List <DL><DT><DD></DL> (<DT>=term, <DD>=definition)
Compact <DL COMPACT></DL>
Menu List <MENU><LI></MENU> (before each list item)
Compact <MENU COMPACT></MENU>
Directory List <DIR><LI></DIR> (before each list item)
Compact <DIR COMPACT></DIR>

BACKGROUNDS AND COLORS
Tiled Bkground <BODY BACKGROUND="URL">
MS Watermark <BODY BGPROPERTIES="FIXED">
Bkground Color <BODY BGCOLOR="#$$$$$$"> (order is red/green/blue)
Text Color <BODY TEXT="#$$$$$$">
Link Color <BODY LINK="#$$$$$$">
Visited Link <BODY VLINK="#$$$$$$">
Active Link <BODY ALINK="#$$$$$$">
(More info at http://werbach.com/web/wwwhelp.html#color)

SPECIAL CHARACTERS
Special Character &#?; (where ? is the ISO 8859-1 code)
< &lt;
> &gt;
& &amp;
" &quot;
Registered TM &#174;
Registered TM &reg;
Copyright &#169;
Copyright &copy;
Non-Breaking Space &nbsp;
(Complete list at http://www.htmlhelp.com/reference/charset)

FORMS
Define Form <FORM ACTION="URL" METHOD=GET|POST></FORM>
4.0* File Upload <FORM ENCTYPE="multipart/form-data"></FORM>
Input Field <INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO|
FILE|BUTTON|IMAGE|HIDDEN|SUBMIT|RESET">
Field Name <INPUT NAME="***">
Field Value <INPUT VALUE="***">
Checked? <INPUT CHECKED> (checkboxes and radio boxes)
Field Size <INPUT SIZE=?> (in characters)
Max Length <INPUT MAXLENGTH=?> (in characters)
4.0 Button <BUTTON></BUTTON>
4.0 Button Name <BUTTON NAME="***"></BUTTON>
4.0 Button Type <BUTTON TYPE="SUBMIT|RESET|BUTTON"></BUTTON>
4.0 Default Value <BUTTON VALUE="***"></BUTTON>
4.0 Label <LABEL></LABEL>
4.0 Item Labelled <LABEL FOR="***"></LABEL>
Selection List <SELECT></SELECT>
Name of List <SELECT NAME="***"></SELECT>
# of Options <SELECT SIZE=?></SELECT>
Multiple Choice <SELECT MULTIPLE> (can select more than one)
Option <OPTION> (items that can be selected)
Default Option <OPTION SELECTED>
Option Value <OPTION VALUE="***">
4.0 Option Group <OPTGROUP LABEL="***"></OPTGROUP>
Input Box Size <TEXTAREA ROWS=? COLS=?></TEXTAREA>
Name of Box <TEXTAREA NAME="***"></TEXTAREA>
N2 Wrap Text <TEXTAREA WRAP=OFF|HARD|SOFT></TEXTAREA>
4.0 Group elements <FIELDSET></FIELDSET>
4.0 Legend <LEGEND></LEGEND> (caption for fieldsets)
4.0 Alignment <LEGEND ALIGN="TOP|BOTTOM|LEFT|RIGHT"></LEGEND>

[top]

TABLES
Define Table <TABLE></TABLE>
4.0* Table Alignment <TABLE ALIGN=LEFT|RIGHT|CENTER>
Table Border <TABLE BORDER></TABLE> (either on or off)
Table Border <TABLE BORDER=?></TABLE> (you can set the value)
Cell Spacing <TABLE CELLSPACING=?>
Cell Padding <TABLE CELLPADDING=?>
Desired Width <TABLE WIDTH=?> (in pixels)
Width Percent <TABLE WIDTH=%> (percentage of page)
4.0* Table Color <TABLE BGCOLOR="$$$$$$"></TABLE>
4.0 Table Frame <TABLE FRAME=VOID|ABOVE|BELOW|HSIDES|LHS|RHS|
VSIDES|BOX|BORDER></TABLE>
4.0 Table Rules <TABLE RULES=NONE|GROUPS|ROWS|COLS|ALL></TABLE>
MS Border Color <TABLE BORDERCOLOR="$$$$$$"></TABLE>
MS Dark Border <TABLE BORDERCOLORDARK="$$$$$$"></TABLE>
MS Light Border <TABLE BORDERCOLORLIGHT="$$$$$$"></TABLE>
Table Row <TR></TR>
Alignment <TR ALIGN=LEFT|RIGHT|CENTER|MIDDLE|BOTTOM>
Table Cell <TD></TD> (must appear within table rows)
Alignment <TD ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>
No linebreaks <TD NOWRAP>
Columns to Span <TD COLSPAN=?>
Rows to Span <TD ROWSPAN=?>
4.0* Desired Width <TD WIDTH=?> (in pixels)
N3 Width Percent <TD WIDTH="%"> (percentage of table)
4.0* Cell Color <TD BGCOLOR="#$$$$$$">
Header Cell <TH></TH> (same as data, except bold centered)
Alignment <TH ALIGN=LEFT|RIGHT|CENTER|MIDDLE|BOTTOM>
No Linebreaks <TH NOWRAP>
Columns to Span <TH COLSPAN=?>
Rows to Span <TH ROWSPAN=?>
4.0* Desired Width <TH WIDTH=?> (in pixels)
N3 Width Percent <TH WIDTH="%"> (percentage of table)
4.0* Cell Color <TH BGCOLOR="#$$$$$$">
4.0 Table Body <TBODY>
4.0 >Table Footer <TFOOT></TFOOT> (must come before THEAD>
4.0 Table Header <THEAD></THEAD>
Table Caption <CAPTION></CAPTION>
Alignment <CAPTION ALIGN=TOP|BOTTOM|LEFT|RIGHT>
4.0 Column <COL></COL> (groups column attributes)
v4.0 vColumns Spanned <COL SPAN=?></COL>
4.0 Column Width v<COL WIDTH=?></COL>
v4.0 Width Percent <COL WIDTH="%"></COL>
4.0 Group columns <COLGROUP></COLGROUP> (groups column structure)
4.0 Columns Spanned <COLGROUP SPAN=?></COLGROUP>
4.0 Group Width <COLGROUP WIDTH=?></COLGROUP>
4.0 Width Percent <COLGROUP WIDTH="%"></COLGROUP>

FRAMES
4.0* Frame Document <tt><FRAMESET></FRAMESET> (instead of <BODY>)
4.0* Row Heights <FRAMESET ROWS=,,,></FRAMESET> (pixels or %)
4.0* Row Heights <FRAMESET ROWS=*></FRAMESET> (* = relative size)
4.0* Column Widths <FRAMESET COLS=,,,></FRAMESET> (pixels or %)
4.0* Column Widths <FRAMESET COLS=*></FRAMESET> (* = relative size)
4.0* <b>Borders <FRAMESET FRAMEBORDER="yes|no"></FRAMESET>
4.0* Border Width <FRAMESET BORDER=?></FRAMESET>
4.0* Border Color <FRAMESET BORDERCOLOR="#$$$$$$"></FRAMESET>
N3 Frame Spacing <FRAMESET FRAMESPACING=?></FRAMESET>
4.0* Define Frame <FRAME> (contents of an individual frame)
4.0* Display Document <FRAME SRC="URL">
4.0* Frame Name <FRAME NAME="***"|_blank|_self|_parent|_top>
4.0* Margin Width <FRAME MARGINWIDTH=?> (left and right margins)
4.0* Margin Height <FRAME MARGINHEIGHT=?> (top and bottom margins)
4.0* Scrollbar? <FRAME SCROLLING="YES|NO|AUTO">
4.0* Not Resizable <FRAME NORESIZE>
4.0* Borders <FRAME FRAMEBORDER="yes|no">
4.0* Border Color <FRAME BORDERCOLOR="#$$$$$$">
4.0* Unframed Content <NOFRAMES></NOFRAMES> (for non-frames browsers)
4.0 Inline Frame <IFRAME></IFRAME> (takes same attributes as FRAME)
4.0 Dimensions <IFRAME WIDTH=? HEIGHT=?></IFRAME>
4.0 Dimensions <IFRAME WIDTH="%" HEIGHT="%"></IFRAME>

[top]

SCRIPTS AND JAVA
Script <SCRIPT></SCRIPT>
Location <SCRIPT SRC="URL"></SCRIPT>
Type <SCRIPT TYPE="***"></SCRIPT>
Language <SCRIPT LANGUAGE="***"></SCRIPT>
4.0* Other Content v<NOSCRIPT></NOSCRIPT> (if scripts not supported)
Applet <APPLET></APPLET>
File Name <APPLET CODE="***">
Parameters <APPLET PARAM NAME="***">
Location <APPLET CODEBASE="URL">
Identifier <APPLET NAME="***"> (for references)
Alt Text <APPLET ALT="***"> (for non-Java browsers)
Alignment <APPLET ALIGN="LEFT|RIGHT|CENTER">
Size <APPLET WIDTH=? HEIGHT=?> (in pixels)
Spacing <APPLET HSPACE=? VSPACE=?> (in pixels)
N4 Server Script <SERVER></SERVER>

[top]

MISCELLANEOUS
Comment <!-- *** --> (not displayed by the browser)
Prologue <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
Searchable <ISINDEX> (indicates a searchable index)
Prompt <ISINDEX PROMPT="***"> (text to prompt input)
Send Search <A HREF="URL?***"></a> (use a real question mark)
URL of This File <BASE HREF="URL"> (must be in header)
4.0* Base Window Name <BASE TARGET="***"> (must be in header)
Relationship <LINK REV="***" REL="***" HREF="URL"> (in header)
N4 Linked File <LINK TYPE="***" SRC="***"></LINK>
Meta Information <META> (must be in header)
Style Sheets <STYLE></STYLE> (implementations vary)
4.0 Bidirect Off <BDO DIR=LTR|RTL></BDO> (for certain character sets) 
 [top]

 

Copyright ©1995-2001 Kevin Werbach. Redistribution is permitted, so long as there is no charge and this document is included without alteration in its entirety. This Guide is not a product of Bare Bones Software. More information is available at http://werbach.com/barebones.

HTML for INTERNAL REFERENCES within a Blackboard Course:  

Internal link in Blackboard:

1. Open a blank notepad file or word file, and paste the following tag: <a href="paste the contents of the shortcut here between the quotation marks" target="newwindow"> Click here</a>

2. Right click on any button that will call up a document or file or a forum or whatever within your Blackboard course.

3. Copy the shortcut (a choice on the right-click menu)

4. Paste the shortcut (Ctrl-v or Paste) into the tag in your notepad or word file between the first pair of quotation marks:

<a href="paste the contents of the shortcut here between the quotation marks" target="newwindow"> Click here</a>

It will look something like this

<a href="http://blackboard.lehman.cuny.edu/bin/common/content.pl?action=LINK&render_type=DEFAULT&file_id=_19506_1" target="newwindow"> Click here</a>

5. Copy the entire tag, and paste it in the text box for an Announcement, Assignment, Course Information, Discussion Board - anywhere where you have the option to use Smart Text/HTML  (click the HTML).

6. Preview will show Click here -- you can put this in a sentence (change the "C" to a "c" in the tag text, #4 above).  The document or location will appear in a new window.

  [top]