This section provides an overview on designing a course site using good pedagogical practices with technologies supported by the Office of Information Technology (OIT) and Learning Innovation.

A well-organized course site can improve a student’s experience, particularly if the course is delivered in a hybrid or online format. We will cover three supported technologies: Sakai, Sites@Duke and Kits

Regardless of what platform you choose, your course site is the hub of your course, a central location that students can go to for practical information, resources and the tools you are using for assessments, live class sessions, communication, discussion and other activities. Taking the time to organize and customize your course site up front will save you and your students time while providing a road map for students to follow.

Site design fundamentals

Put important information and frequently-used items higher up. On the web, readers scan pages, so put the most important content at the top. This is where students will look first, similar to the way newspapers put the biggest headlines “above the fold.”

Provide a road map. Consider how you want students to progress through your course. Are you organizing your course content by topic or by week? If you are organizing pages by topic, how many topics or pages need to be completed per week? Before setting up your site’s structure, you may find it helpful to sketch a course outline to work out how you will divide content into chunks by week and/or topic (or you may already have such an outline in your course syllabus).

Keep your home page simple. Include basic practical information and tell students how to get started with your course. 

Add a human element. To make your site more approachable, consider adding a picture of yourself or a link to your bio to the home page.

Use headings to break up content and make it easier to follow. If building a website, adding headings (Heading 1/h1, Heading 2/h2, etc.) makes your content easier to understand because you’re providing a framework for reading it. These headings make it easier for students to scan and find the relevant information they need. And these headings can provide valuable organizational information for students using assistive technology to interact with the course site. 

Incorporate images and media to improve engagement. Simple changes like adding a banner image to your course site, including a photo or video of yourself with your introduction or syllabus, or adding one topical image on each content page, can make a huge difference to how engaging your course site and pages will be to students. However, use images and videos judiciously in your course site to avoid overloading students. Also, make sure to follow appropriate copyright policies.

Use color and emphasis sparingly. Color can be a great accent when used as a supporting element of a page, but multiple colors or lots of color can look cluttered and confusing. Use color selectively for certain types of content. Similarly, bold text can be highly effective for emphasizing important content, but only if it’s used occasionally. (And avoid using italics and underline except in specialized cases.)

Leave some whitespace. Web pages look better and are easier to read when they include some empty space as a visual break and to keep the design balanced.

> Creating a Student-Centered User Experience in Your LMS Course (Temple University)
> WAVE Web Accessibility Evaluation Tool

Using Sakai

Sakai is Duke’s university-supported learning management system, intended specifically for the purpose of delivering a course and integrating with your class roster. Sakai has a wealth of tools and features to help you manage your course, and we recommend it as a natural choice for creating a holistic and versatile learning experience. Here are some ways to ensure that your course site is well-organized and welcoming.

Start off strong

Create an inviting home page. The Overview tool provides a homepage for your course site that automatically shows highlights from the Calendar tool, Announcements tool and Email tool, if those tools are enabled in your course.

Add practical information to the Welcome section of the Overview, such as the course title, the basic course description, your contact information and information about when the class will meet. Adding a photo of yourself and/or linking to your professional website/bio helps students connect with you.

Direct students to how they can get started with the course. This could include directing them to read the syllabus, navigate to a course introduction page or other tools and resources.

Organize your tools and delete unused tools from the left-hand menu. Use the Tool Order option within Site info to reorder tools if some are used more frequently and/or have more importance in your course. Additionally, you can use the Manage Tools option to add tools or Lessons pages to your site.

Make course materials easy to find

Upload your syllabus as a Word or PDF document using the Syllabus tool. You can also use the Lessons or Resources tools to add your Word or PDF syllabus to your Sakai site, if you prefer.

Add files to your course using the Resources tool. If you’re going to add a number of files, create folders for different types of files and use those folders consistently so that information is well-organized and easy to find. Give materials descriptive names. 

Link to external sites, such as a textbook companion site, or external tools such as Slack, WordPress or a Google Drive or Box folder can be added to the course menu with the Web Content tool.

Be clear about assignments and due dates

Call attention to due dates and include instructions for assignments and assessments. Include information about the assignments for each week, when they are due and how students should submit them. 

You can either direct students to a tool in the menu, such as, “Submit your paper using the Assignments tool in the left-hand menu,” or alternatively, you can add a direct link to the assignment in a Lessons page. (You can add these direct links for other tools in Sakai, including Forums, Tests & Quizzes and Resources.)

Of course, if you’re directing students to use the tools for Assignments, Tests & Quizzes and/or Forums, make sure to also spend some time correctly setting up those tools in your site. 

Provide key information for each course unit

Create interactive web pages with the Lessons tool. These pages could have any sort of content but are most often used to provide more information about each unit (or “lesson”) of the course to create a more guided experience for the student. 

Organize your Lessons pages by week or unit in a dropdown menu by adding subpages to a Lessons page. This allows you to have a top-level Lessons page that appears in the left-hand menu and then subpages that are visible once you select the top-level page. For example, you can call your Lessons page “Weeks” and then add a subpage for each week (Week 1, Week 2, and so on); or alternatively, call your Lessons page “Units” and then add a subpage for each unit. This structure makes it easy for your students to navigate your course site and stay on track.

Include all of the relevant information for each unit or week of the course, including:

  • unit/week introductions
  • key topics and concepts
  • learning outcomes
  • assigned readings and resources
  • due dates for activities and assessments
  • direct links to learning activities and assessments
  • images and videos

Organize that information in the order in which you’d like for students to complete it. The more comprehensive you can be in the information you provide to students for each week or unit of the course, the more likely they are to succeed.

> Faculty Guide to Sakai (Duke)
> Nine Tips for Student-Centered Sakai Sites (University of Notre Dame)
> Save Time Setting Up Your Sakai Site with Templates (Duke)

Using Kits

If you’ve decided to use learning apps other than Sakai to teach your course, Kits makes it easy to set up and share those apps with your students. Kits also provides a single place for students to find and access all the tools being used in your course.

Organizing your course with Kits

Similar to Sakai, Kits provides students a single entry point to your course. When you log into Kits, you will see a kit for all of the courses you are teaching. The following tips will help you get started using Kits to organize your course.

Add an App to your kit. Many apps are available in Kits including WordPress, Box and Warpwire. Once an app is added to the kit it is automatically shared with students in your course. The kit will display an app icon for every app added to the kit.

Link to your syllabus or course welcome statement. Use the Custom Link option in the Kits App Store to add a link and an app icon for your syllabus, a course introduction document or course schedule. You can link to any app that can be shared via web link such as a Google Doc, a Box note or an existing web page.  

Link to an app not licensed by Duke. You can also use the Custom Link option to link to an app not licensed by Duke such as Slack or GitHub.

Add private resources or those shared just with instructors and TAs. Using a Google Sheet to track student participation or have another resource for keeping track of important data for your course? Apps and custom links can be shared privately (just with you) or only with instructors and TAs.

Tip: App icons cannot currently be rearranged. Add your apps in last to first order to control how the apps are displayed in the kit.

Can I use both Kits and Sakai?

Yes. If you have a course website but would like to use just the Assignments and Gradebook tools in your Sakai course site, Kits is a great option for organizing these resources in a single place for your students.

Please note that some apps (e.g., Zoom and Warpwire) are available in both Kits and Sakai and should be set up in only one place. Carefully consider how you would like students to access these apps when deciding whether you will set up a tool in Sakai or Kits.

Learn about apps in the Kits App Store

If you are still in the process of deciding which tools can best meet your teaching needs, the Kits App Store can help. The App Store provides a list of learning apps available at Duke and that can be set up through Kits. Information on how each app can be used for teaching can be found in the app details link.

To learn more about the benefits of Kits and how it can be used to organize your course, see the article “What is Kits?” To get started using Kits, access our Kits Quick Start Guide.

Using Sites@Duke (WordPress)

If you want to incorporate blogging into your course or are familiar with the WordPress platform, Sites@Duke might be a great tool for your course site.

Using Sites@Duke, instructors can create a website with a multimedia-rich experience that integrates many different tools. You can embed items such as YouTube or Warpwire videos, add RSS feeds and allow students to add their own blogs with audio, video and photos.

These steps show how to create a course site on Sites@Duke. Afterward, you can:

When creating and organizing your site, keep in mind the Site Design Fundamentals at the beginning of this article to ensure that your site is approachable and easy to follow.