(630) 942-2490 learningtech@cod.edu

HTML Basics for Blackboard

by | Mar 16, 2022 | Blackboard, Featured

Blackboard’s content editor makes it easy to get the look and functionality you want for your courses without having to know much about HTML. However, it is possible to insert HTML directly into a Blackboard content area if that’s something that you want or need to do for your course. This ability  allows you to embed specialty items, add links, or utilize any of the functions of HTML to customize your content area. 

Here, we’ll discuss the basics of HTML and share which tags you can use in Blackboard itself. 

HTML Basics

HTML is an acronym for HyperText Mark-Up Language. This set of codes forms the foundation of the web pages you access on the Internet, even if other code is layered on top to create more sophisticated functionality or appearance. 

Each of the different parts of HTML code are called “tags”. Each tag is separated out by a set of pointed brackets “<>” and almost always be applied in pairs that “open” and “close” the function of the tag. The closing tag is designated by using a forward slash like this </tag>. 

For example, if you want to make something bold, you would format the tags like this: 

<strong>This is bolded!</strong> 

You can see that there are opening and closing tags designating when the bold should begin and end. 

Where Do You Add HTML in Blackboard? 

First, you will choose Build content and then Create Item. 

To add HTML tags to a content area in Blackboard, you will use the toolbar item that looks like two pointed brackets <> (see image below). This switches you to HTML view. 

From there, the HTML editor will come up. It’s there that you can use HTML tags. You will enter the tags and accordant information, save, and the HTML code will appear “live” in your content area. 

What Tags Can You Use? 

Here are the tags you may want to use in Blackboard: 

Text Formatting

  • <strong>text</strong> Makes text bold. 
  • <em>text</em> Makes text italic. 
  • <u>text</u> Makes text underlined. 
  • <blockquote>text</blockquote> Indents text. 
  • <font size=+1>text</font> Enlarges text from +1 to +7 
  • <font color=”#ff00ff”>text</font> Changes color of font between tags.
  • <font type=”helvetica”>text</font> Changes typeface. 
  • <a href=”mailto:email”></a> Creates an email link. 
  • <a href=”link”>text</a> Creates a link to a website. 
  • <h1></h1> Creates header text. Ranges from H1 to H6, with 1 as the biggest.  

Page Formatting 

Many of these tags are exceptions to the end tag rule– they only require one tag work and do not need to be “closed.” 

  • <hr/> Adds a horizontal line. 
  • <br/> Adds a line break. 
  • <ol><li></li></ol> Creates an ordered list where list items <li>…</li> are numbered. 
  • <ul><li></li></ul> Create an unordered, bulleted list. The <li>…</li> tags marks each bulleted item. 
  • <p>paragraph text</p> Paragraph break. 
  • <table> Creates a table. 
  • <th> Defines a header cell in a table. 
  • <tr> Defines a row in a table. 
  • <td> Defines a cell in a table. 

Images and Videos 

  • <img src=”link”> Inserts an image. Doesn’t need a closing tag. 
  • <embed> Allows you to embed a video or other multimedia from another source. You will usually get embed codes directly from the outside source. 

Resources

Want to learn more? These resources can help!