Overview of components

Modules are part of page structure, which means that you can define them anywhere in the content hierarchy. Referring to the Content hierarchy diagram, most large-scale publications define page structure at the global, site, and section levels.

The following diagram illustrates a typical page structure for a blog site. Within the main section there are six modules: two above the blog post, two below, and two to the side.

../../../_images/modules.svg

Examples of module placement

Another use for modules is in section pages—pages that are media-rich tables of contents to items within the section. Good examples of section pages are at the web site Inspire Confidence, where there are sections dedicated to topics such as courage, happiness, and innovation. The following illustration is Inspire Confidence’s section page Most Inspiring.

../../../_images/inspire-confidence-sections.svg

This section page has four modules:

  • The top module is rich text containing a single graphic. This module serves as the section title.
  • The second module is a list of videos related to nature.
  • The third module is a list of videos related to the military.
  • The fourth module is a list of videos related to hope.

These modules are stacked on top of each other.

For examples of incorporating modules into common page layouts, see Recipes.