Ingeniux Tutorial

There are a lot of considerations when creating content for the web. Fortunately, we've taken care of a lot of them already for you when you create pages within Ingeniux, our content management system (CMS). This tutorial will explain all the things you need to do within Ingeniux to make sure your content is accessible.

HTML Fields

On your standard content page (which make up the vast majority of our pages), there are four HTML fields - HTML Abstract, Content, Lower Body Copy, and Contact Info. While they give you the greatest freedom to display your content exactly how you'd like, they also are the cause of the most accessibility problems. Here are a few tips:

  • Lists
    • Lists provide a clean and orderly look to your information. It can also make a lot of dense information more readable. See how clean and orderly this list looks?
  • Headings
    • Headings offer an easy to digest outline of the information on the page. Assistive technologies allow users to extract just the heading information and skip down to a particular section without having to read or listen to everything above it. It's essentially a means of providing a built in table of contents for the page. Plus, we've already styled all the heading levels, so your page will look that much snazzier.
  • Tables
    • When tables are used properly, they provide a great way to display data. They should not be used for layout purposes - it messes with both the accessibility and the responsiveness of the page. Unfortunately, tables can be a bit tricky to get right in Ingeniux. If you'd like a more in-depth understanding, we have a separate page on best practices for tables.
    • There are three main things to do with tables in Ingeniux.
      • Table summary. Each table should have a summary, with the goal "to provide a brief overview of how data has been organized into a table or a brief explanation of how to navigate the table" (WGAC 2.0). To add this in Ingeniux, when creating the table, click the Advanced tab in the creation dialog and add it to the summary field.
      • Table headings. This identifies a heading information with all the cells underneath it (or to the right of it). When navigating the table, assistive technologies will be able to associate the data with the information to give it context. To add headings, type your text in the heading cell and click the "Table Cell Properties" button (near the table creation button). Over on the right, you'll see "Cell Type" and below it, "Scope." Change "Cell Type" from "Data" to "Header." You can and should adjust the scope here as well.
      • Scope. Headings are great, but you also need to identify which direction that heading is applicable. If it's in the top row, the scope is likely "Column," since that heading describes the column below it. However, if the header is on the left, it can also be "Row," if it's contextualizing the data in the row to its right.

Images

People with vision-based disabilities cannot rely on images to convey information. If your feature image is communicating something and adds value to the page, it should include alternate text for those who cannot see it. Think of the alternate text as the way you would succinctly describe the gist of the image to someone over the phone. To add alternate text, simply type it into the "Alt Text" field in the feature image box. More information on Alternate Text.

If your image is purely decorative and adds nothing meaningful to the content, you should identify it as such. For example, if you're writing a story about a student and feature a picture of that student, that picture is decorative as it adds nothing to the article itself. In contrast, if you're writing a story about a new logo and feature an image of that logo, you should describe it in the alt text, as knowing what the logo looks like is probably important in the article.

Within Ingeniux, just put 'decorative' as the alt text. If you leave the alt text field empty, the image will not display at all.