Request a meeting room reservation at Northside Learning Center
CMS Outreach: Tips & Tricks

Introduction

CMS Outreach websites do not have to look bad! An Outreach page can look almost any way you want it to look. Read on, for a few ideas. You can also refer to a previous Webbie Support session on CMS Outreach pages:

• Developing an Attractive Outreach Site

Some Basic Ideas

Remember the intent of your Web page!

  • Gateway page - If you have a Northside blog or wiki, why not use it as your main Web site and just link to it from CMS Outreach? Put some basic information on Outreach -- such as your name, the subject(s) and/or grade level(s) you teach, your classroom phone number, etc. -- and make a prominent link to your blog page. Now you use your easy-to-update blog page for current information, and just update your Outreach page at the beginning of the school year.
  • For students - keep the page focused on assignments, class notes and other information for the students. Keep any biographical information short.
  • For parents - introduce yourself and provide information useful to parents, such as daily schedule, contact info, course content info, etc.
  • A department page - keep it short! The department name, a group photo, and a list of the members is plenty.

Simple Layout Approach:

An attactive CMS page can be created using just an HTML Module in the Main Content Pane for the main part of the page. This has several advantages, such as allowing you to control the width of the main content area of the page. It also makes it easier to add background images or colors later. Further modules can be added below the HTML Module.

Creating a table:

  1. Single-cell table
    Creating a
    single-cell table
    Click the Insert Table icon in the tools at the top of the CMS Outreach edit window.
  2. Click the upper-left box in the Table Wizard to make a 1 x 1 Table.
  3. Click inside the new table.
  4. At the bottom of the edit window, select the <table> button and choose Properties.
  5. In the TABLE window, click the Table button.
  6. Set the Cell spacing: to 0.
  7. Make sure Border: is set to 0.
  8. Set the table Width: to 500 px (pixels). Leave Height: blank.

Setting table width

Add Content

Your overall goal for the Web page will help determine content, as will the frequency of your updates. A few suggestions for page content:

  • Keep it short and professional. A lot of personal information is unnecessary and can pose a security risk. Focus on information about your class(es) and instruction.
  • Use bullet points and/or short paragraphs to break information into easy-to-read "chunks."
  • For pages that are not updated regularly, be careful to avoid information that will go out of date quickly, such as calendars of upcoming events, weekly newsletters, etc.

Pictures

Choose Great Pictures!

One
great picture on your page is better than a lot of crummy clipart images. Either pick one of the best pictures that you've taken, or select an excellent image from one of the sources below.

  • Wikipedia (en.wikipedia.org)
    Free or Fair Use images. Browse for any subject and click any image you see to find out if you can use that image. Many of the images are either Public Domain or are available for Fair Use by educators.
  • morgueFile (www.morguefile.com)
    Free images. The morgueFile database is quite extensive, and images are searchable by subject.

Marlo as a South Park character
South Park avatar
Shouldn't I post a picture of myself?

Group pictures are OK, but photos of individual staff or teachers should not be posted on the Web. Instead, you can use an image that is related to teaching, your subject area, etc., or else use an avatar or a cartoon character to represent you.

Resize Your Images

Maximum size
(width or height) in Outreach: 300 pixels.
Width is the most important dimension in Web images.

Software to use:

Consider Hosting Your Images at Photoshop.com

Photoshop.com
is a great site, not only for editing pictures, but also for hosting pictures that you use in CMS Outreach. Photoshop.com accepts JPG images, but not GIFs.

  1. In your Photoshop.com Library, put your cursor on the bottom edge of the picture to see the Photo Options link.
  2. Select Link or Embed Photo.
  3. Under Embed:, click the Copy button.
  4. Click Done.
  5. Copy Photoshop.com embed code

  6. In CMS Outreach, open the Edit window to add the picture to your page.
  7. Click the HTML button in the lower-left corner of the Edit window.
  8. Find the spot where you want the picture to appear.
  9. Press [Ctrl] [V] to paste the image code.

Wrap Text Around Images

Wrapping text is extremely easy:

  1. CMS Outreach justify buttonsClick the image.
  2. Click the Left Justify or the Right Justify buttons (circled in red, to the right) to wrap the text around the image.

Mistakes to Avoid!

Too Much Text
Keep it short and sweet! Long text essays belong on "child" pages. Keep the purpose of the page in mind and use that as a guideline for the content to be included.

Empty Space at Top of Page
Most people do not scroll down to view page contents. A large area of empty space at the top of the page pushes the page contents out of sight, where many people will never see them.

Design Hints

Important Content Should be in the Top-Left Part of the Page
The top-left corner is the part of the page that always displays when a page opens. If a visitor is using a device with a tiny screen -- such as a Blackberry or a cell phone -- most of the page will requre scrolling to view. The most important content in your pages should be as close to the top-left corner as possible.

Use Good Images, Not Clipart!
Clipart always looks like clipart, and much of it has been used before. Two of the better sites for free images are Wikipedia and morgueFile.


Printer-friendly version of this exercise (PDF)