Learning Modules

Follow the requirements and guidelines below when developing an interactive learning module for the Early Childhood Learning and Knowledge Center (ECLKC).

Submission

Submit content prior to developing or building the learning module. Module content must conform to all applicable guidelines in the standards. This includes compliance with the editorial guidelines for any text and 508 requirements for videos, PDFs, and other media inside the module. Submit content to the Head Start Information and Communications Center (HSICC) team as soon as possible to detect any issues early and review for adherence to the ECLKC web standards. Follow Smartsheet forecast and submission, as described for the Submission Form.

We recognize that National Centers may contract with third-party vendors to develop products for the Office of Head Start that are published on the ECLKC website. National Centers are strongly encouraged to refer to the ECLKC Web and Communication Standards and to include all relevant requirements in any vendor contracts. The HSICC team is required to enforce these standards, and failure to include them in vendor contracts may result in unforeseen development costs for the National Centers.

All content must be submitted in a Word document or set of Word documents clearly identified within the product Word subfolder in Box. The revised Word documents will be uploaded to the same subfolder (on top of the previous version) to start the development of the module.

It is recommended that National Centers conduct monthly check-in calls with their vendors and HSICC to clarify questions that may come up during development.

Technical Requirements

Before uploading the module, ensure it meets the following technical guidelines:

  • Is no more than 300 MB when unzipped
  • Operates in current versions of all browsers (e.g., Internet Explorer, Microsoft Edge, Firefox, Chrome, Safari)
  • Operates on all operating systems and platforms (e.g., Windows, Macintosh, iOS, Android)
  • Does not:
    • Require third-party plugins or applications to run, such as Flash, Unity, or Silverlight
    • Intend to change the web server configuration in any form (don’t include .htaccess files or nginx directives)
    • Include dynamic files intended to be executed in the server (php, java, py, sh, cpp…)
    • Automatically load content or make HTTP requests to third-party websites, CDNs, or APIs. Links are allowed.
    • Track user behavior or collect analytics other than the Google Tag Manager snippet described in the Submission section
  • JavaScript libraries included in the module (like jQuery) are in the latest stable version and don’t contain any known vulnerabilities.
  • Does not display errors or debug information on the browser console
  • Contains a manifest file that includes a list of all the files used by the module. All other files not listed in the manifest shouldn’t be included in the final zip file.
  • Follows Web Content Accessibility Guidelines (WCAG) 2.1
  • Passes the accessibility compliance checklist template
    • Some examples of these guidelines include:
      • Keyboard accessibility (screen reader capabilities)
      • Color contrast guidelines
  • Contains text alternatives for any non-text content
  • Is resizable text up to 200% without loss of content or functionality
    • Includes a PDF or Word document with all relevant and up-to-date information contained in the module
      • This may be required to make the module accessible to all users.
  • Must be responsive, like everything posted on the ECLKC
  • Loaded in a 900px max width iFrame. The content should adapt to the iFrame container even if the browser window is resized.

Using Storyline

If using Articulate Storyline to develop a module:

  • Be sure to "Publish for Web"
  • Select "Include HTML5 output"

Review step-by-step instructions for how to publish a Storyline module.

Analytics

The Google Tag Manager code below must be included in your submission. Modules submitted without the required code will be rejected.

Add the following Google Tag Manager scripts to the top-level page, typically called index.html or story_html5.html. Paste this code as high in the <head> of the page as possible:

<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-WPDR83');</script>
<!-- End Google Tag Manager -->

Also, paste this code immediately after the opening <body> tag:

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-WPDR83"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

Uploading the Zip File to Box

When the module is finalized, it must be uploaded to the product subfolder Learning Module in Box as a .zip file.

It should contain everything required for the module to run, including an index.html file or equivalent. The index.html file is what will be placed in the inline frame (iFrame) on the ECLKC to display the module.

The module will be reviewed by the HSICC team to verify compliance with all requirements and guidelines described above. If any changes are required after the module has been posted to the ECLKC, it will need to go back to the vendor for edits.