Changing the Look of your Blackboard Course
Have a question about a topic that isn't listed here?
For additional assistance, contact CTLT's Instructional Design Team at (212) 346-1722 or firstname.lastname@example.org
One of the first things we tell faculty regarding course design is - plan ... plan ... plan. Don't wait until the last minute to design your course. With so many factors to consider, course design needs to be given adequate time in order to develop and implement. Ideally, you want to start planning a semester ahead, in which time, you should sit down with a course designer in order to facilitate the process. The following elements are common to well-designed course sites. Although some are more important than others, they all serve as good techniques which can enhance your course content. Note that these concepts can be expanded upon, but due to time constraints we've tried to focus on key examples.
We have seen many online facilitators become victims of the "more is better" concept. This is not the case when developing a course site. Realize that students do not enroll in online courses to see all the "bells and whistles" you can put into a site. Improper use of fonts, colors, and graphics (to name a few) can serve as a distraction and hamper the effectiveness of your course. When confronted with too many moving and repeating objects, some students may become annoyed and distracted. If necessary, try to keep these animated features to a minimum. If you require the use of such animations, limit the number of times they loop and even limit the speed in which this is accomplished. Simplicity must also be applied in choosing the most visual aspect of your course, the background. When the background is busy and loud, text becomes distorted and users are once again distracted from the actual content of the page. We have found a white background to be the most effective. The use of fonts and colors are also extremely important. Keeping color and font variations to a minimum can help keep your site design "simple."
Consistency can greatly reduce the time initially required to master the use of your course site, particularly for faculty teaching online for the first time. This is important for both cognitive and motivational reasons. Consistency across pages can reduce the load on cognitive processing. If learning to use the site is a quick and painless process, learners are quickly motivated to continue. If they have trouble, they are much more likely to lose interest in the course. Consistencies should include: colors, backgrounds, fonts, headings, text layout, folder management, icons, placement of course materials.
On the other hand, if used correctly and infrequently, changing formats can quickly grab a learner's attention. These inconsistencies might include a highlighted button to indicate location, or an altered color scheme to indicate a change of topic.
Creating Identity/Personalizing your Course
Taking into consideration the fact that your course site is a physical place, you need to consider the purpose of your site. What is the general "look" you are trying to convey? The graphic design of a course site must not only be appropriate to the overall subject matter, it should also set the "tone" for the learner's experience. A quick review of publicly accessible courses will demonstrate the range of styles chosen by course designers. Personalizing your course site is also important. Remember it has to be Fun, Professional, Simple, High tech, and Slick. To accomplish this:
- Add a course banner
- Add a personal picture within "Staff Information"
- Add cartoons which express your personality (Remember not to over do it - Remain simple!)
- Add personal audio/video clips conveying reinforcement
Also remember to set proper "availabilities" within within your Blackboard's control panel. These course options allow you to customize your course by making only the features you will use "available" to students. For example - If you don't use Blackboard's online grade book feature, mark it "unavailable" in order to discard the access icon from the course site.
One of the most important elements of your course design is navigation! You need to take time to seriously map out your navigational scheme, remembering to remain consistent from page to page. Once set, you should also spend time navigating your site from the student prospective. It's also not a bad idea to have others test your site and its navigation.
Blackboard has already given you a head start when it comes to navigation. Every page on the course site can be easily reached. This structure was provided by Blackboard Inc. for students to readily find course information, documents, assignments, etc. But improvements can be made to further enhance the "user friendliness" of your course by creating and managing folders. Every page on your course site should be easily reached. Also, it's best if folders are arranged and labeled in a logical sequence. Some common "labels" used for folders - Module - Unit - Week (and number) - Topic - Lesson. Consistency in folder management, labeling and corresponding discussion forums will help students easily navigate throughout your course without aggravation.
It's also important to understand the difference between a folder and an item. Blackboard allows you to organize your material by placing different files/items into different folders. A folder is essentially a storage space in which you can submit any number of files/items. This allows you to sort files/items into certain subjects and then place them in a folder with the subject's name. You can create folders in most of the "Content Areas." Realize that you must first create the folder and then submit files/items within that folder. For instance, you can create a series of folders within the "Course Documents" section labeled "Module I", "Module II", "Module III." You can then upload file/items pertaining to any of these folders.
Be sure to consider "standards of compatibility" when creating your course site. Your site should be platform, resolution, and browser friendly. If your course site is not compatible for all viewers, you may need to consider creating additional resources to accommodate exceptions. What browsers are my students using? What's the common screen resolution my students are using? These are important questions. Realize that pleasing everyone is IMPOSSIBLE! It's understandable to set platform, browser, and resolution requirements at the beginning of the course. Even though this can alleviate some stress, you should still be aware of the issues. We have found that 90% of "technical" problems students have are related to their systems configuration. Realize that not all your students will adapt their systems around your course!
To take "compatibility" a step further, to make your course truly accessible from anywhere one must consider the use of applications when designing a course site. Within Blackboard, it's simple to upload almost any document created in one of many popular applications (i.e. Microsoft WORD, PowerPoint, Lotus etc...) But is this simple and fast method the most effective? Realize that by uploading any such document you are requiring your students to have the application on their system in order to view the material. For example, if you upload your syllabus which was created in MS Word your students will need MS WORD in order to view it! What if your student uses Corel Word Perfect?
We have adopted a Text Editor Web-authoring tool to provide an environment similar to a word processor for Web page Development. The Text Editor tool is a powerful editor for adding Blackboard content. You can now create vibrant documents using an editor with the same look and feel as a word processor. Creating and editing documents directly in Blackboard has never been so easy! This method permits easy access of course materials and requires no application on the student's computer ... only a browser is needed! This technique allows for "anywhere" access to your course documents. To access the Text Editor editor in Blackboard, please go into the location of your course where you would like to add a new document (i.e., Course Information, Course Documents, and Assignments). Instead of clicking on "Add Item," go to the dropdown menu to the right of the screen and scroll down to "AOI Text Editor Editor." Once you click "Go," you will see the editor open up. You can choose to copy and paste text from another document (i.e. in Word) or type from scratch. Just like in Microsoft Word, you can simply click to highlight, bold, underline, and italicize all of your text. You can even create tables. This Text Editor Editor converts all of your content into HTML and feeds it directly into Blackboard. Not only does the Text Editor Editor work great for text manipulation, but it also has support for images multimedia. Simply "Submit" the document as usual when you are done.
Course Design for Disabled Students
Special consideration is needed when designing web pages/sites which will be view by students with disabilities. Some tips include:
- Images & Animations - Use the alt tag attribute to describe the function of each visual.
- Multimedia - Provide captioning and transcripts of audio, and descriptions of video.
- Hypertext links - Use text that makes sense when read out of context. For example, avoid "click here."
- Scripts, applets, and plug-ins - Provide alternative content in case active features are inaccessible or unsupported.
Course design for disabled students is a vast topic! The following are some web sites with useful information. Please Note - making ALL the necessary alterations to your course site (especially within Blackboard) is impossible. Future releases of Blackboard promise to take all "special needs" into consideration.
- WAI- Web Content Accessibility Guidelines: http://www.w3.org/WAI
- Bobby 3.2: http://www.cast.org/bobby
- IBM Home Page Reader: http://www-3.ibm.com/able/solution_offerings/hpr.html
- WAI- Quick Tips: http://www.w3.org/WAI/References/QuickTips
Using tables within your documents can help you effectively organize information. You can create tables in Blackboard using the Text Editor editor and/or Word. It is easiest to use Word to create tables and then copy and paste them into the Text Editor editor and submit.Below, notice the difference in alignment and how much better a syllabus looks by incorporating a table. Also, notice that you can change the background color of individual cells. Tables not only look better, but give you much more flexibility in formatting. Tables may seem difficult at first, but once you understand the basics you can make some wonderful tables! Just play around with them. But remember to check how it looks with several different browsers. Sometimes the differences are surprising.
Tables v. No Tables:Notice the alignment in the syllabus below and then go back and compare it to the syllabus that uses a table. You will see how much better the syllabus looks with tables. Tables also give you a lot more freedom to format your syllabus or document, which we will go into. Notice the difference in alignment and how much better the syllabus looks with tables. Also, notice that you can change background colors in individual cells. Tables not only look better, but give you much more flexibility in formatting.
Color is a powerful component of design. It can affect mood and emotion. It can also evoke associations with time and place. In course design, it is also an important factor in defining a site's environment.
In a well-designed course site, there is a consistency of design that creates a placement scheme. That consistency should extend to the use of color throughout the site. Use consistent colors to visually create boundaries for the site - to make the site a place.
Choose Appropriate Colors
A course site should be considered a phyiscal place in the virtual world. Hospitals, banks, and corporate offices choose colors for their decor that soothe or inspire confidence because they are appropriate to their purpose. Therefore, shouldn't a course designer choose colors that reflect the purpose of the site and enhance the site design?
The Effects of Color
Colors make us feel. Sepia tones evoke memories of yesteryear. Psychedelic color combinations take us back to the '60s. Turquoise and yellow combinations or avocado green remind us of the '50s. Colors can make us feel frivolous or somber. Bright blues and yellows are reminiscent of sunny summer days; corporate grays speak of conservatism; black and white of elegance. We have all spoken of black moods, feeling blue, green with jealousy, red with rage. Some colors command our attention; others make us feel tranquil. Use this response to color to support the purpose of your course site.
Curious about how color influences mood? Here are some examples:
- Pink: soothes, acquiesces; promotes affability and affection.
- Yellow: expands, cheers; increases energy.
- Orange: cheers, commands; stimulates appetites, conversation, and charity.
- Red: empowers, stimulates, dramatizes, competes; symbolizes passion.
- Green: balances, normalizes, refreshes; encourages emotional growth.
- Purple: comforts, spiritualizes; creates mystery and draws out intuition.
- Blue: relaxes, refreshes, cools; produces tranquil feelings and peaceful moods.
- White: purifies, energizes, unifies; in combination, enlivens all other colors.
- Black: disciplines, authorizes, strengthens; encourages independence.
Even with carefully selected colors, remember that what you see may not be what your course site visitors see. To minimize problems caused by display inconsistencies, it is important to use browser-safe colors!! For a useful chart of web safe colors go to - http://www.web-source.net/216_color_chart.htm
In your lifetime, you have seen billions of letters and millions of words, yet you may never have consciously noticed the typefaces you read. Type provides an idea of the designer's personal style and preference when it comes to attracting the attention of users. Type can also have the most indirect impact within a course site. It can send the student unconscious messages about the feeling of your site, affecting how the student reads and interprets the impact of words. Type allows the designer to change his/her style at will and in turn, change the page's personality. You can alternate from casual to formal, silly to serious and old fashioned to modern just by adjusting type. Type is your image! Type reinforces the user's recognition of information that pertains to your course site. Remain consistent with your type and the student may think of you when viewing the same type in other situations, without knowing why.
Two Important Things to Remember:
Serve the Main Text: Type is used in course sites to serve the main text. It should enable the student to read more easily. Type should also conform to backgrounds and images within the perspective page. Type can be beautiful and decorative, however, if an attempt at beauty causes confusion within the text, it could become inconsistent and the user may avoid reading it. If the type brings undue attention to itself, what is the point of trying to maintain anonymity within the type?
Appropriateness: The key to understanding type is not to focus on good or bad typefaces. The main idea is to determine when it is appropriate to use these typefaces. You should consider what you are trying to convey to the student.
Type Psych 101
Type is emotional on a subliminal level because of the connotations it conveys. Here is an example that may best describe the kind of emotional attachments people have with type fonts. Helvetica is the typeface used on IRS forms. Now, if you are familiar with these forms, you may feel a certain anxiety when you see this font on official paperwork. You may not consciously realize that it's the same typeface the IRS uses, you may not even know it is Helvetica.