Creating Accessible NYU Sites

Following these best practices will help you make your NYU Sites (powered by Google Sites) more accessible.

Note: Due to the limitations of the Google Sites framework, there is no way to make pages on the NYU Sites platform fully accessible. Therefore, as NYU websites are required to conform to the university's accessibility standards, we do not recommend that NYU Sites are used for official university business or public-facing content.

Best Practices for NYU Sites

Headings

Organizing web pages by headings will help users get a sense of the page's organization and structure.

HTML headings are indicated using <h1>, <h2>, <h3>, etc. However, the Text component within NYU Sites refers to headings as Titles. There are three levels of titles in Sites which correspond to the HTML heading mark-up:

  • Title (e.g. - <h1>)
  • Heading (e.g. - <h2>)
  • Subheading (e.g - <h3>)

Add text and create headings

  1. To add text, double-click on the page where you want to add content. This will bring up the content selection tool. Choose the Text option. Or, click Insert and choose the content you want to add.
  2. To assign a heading to the text, from the toolbar above the text box, select the appropriate option.
  3. By default, when you create a site, you can edit Your Page Title and that will become your <h1>.
  4. Headings should be hierarchical. Therefore, the next topic text should be marked up as a Heading (e.g. <h2>).
  5. When you begin adding subtopics, you can use the Subheading option (e.g. <h3>).

Color Contrast

If you're planning to change your theme's default text colors, make sure you're using color combinations with a high contrast between the text color and the background color. There are color contrast tools that can help you test color pairs for contrast and adjust the values as necessary.

Color contrast tools

Images

Images add great value to the web browsing experience. But, unless a text equivalent for the image is provided (alternative text), information in images cannot be accessed or understood by users who cannot see them. This can result in screen reader users not being able to understand content or understand how to interact with content. This is important for infographics and especially for images of text which cannot be accessed by a screen reader user.

Add alternative text to an image

When you upload images to your NYU Site, set the alt text by doing the following:

  1. Click on the image. A panel will appear with various options.
  2. In the panel, select the 3 vertical dots to open up additional settings.
  3. In the menu that appears, select Add alt text.
  4. If your image is required to understand the content, you must create a text alternative. Add that information into the Description text box.
  5. If your image is purely decorative, put a checkmark next to the option for This is a decorative image.
  6. Select the Apply button to set the alt text.

Links

When adding links to your site, it is important that the links are descriptive and provide informative context for the site visitor. This allows the site visitor to have a better understanding of the link's destination. Links should make sense out of context.

Avoid adding links that use ambiguous terms such as "click here" or "read more." Screen readers are able to navigate content by links and skip the content in between. Therefore, screen readers are unable to provide context to a link beyond the linked text. This means multiple "click here" links on a page all appear to be the same.

Add a link

  1. Highlight the text that you want to link.
  2. From the formatting bar, select the Insert link button. Click Insert and then Link.
  3. Under Text, enter the text you want to be linked.
  4. Under Link, enter a URL or email address.
  5. Click Apply.

Lists

It is important that lists are created using the default/built-in styles of the NYU Sites platform. Avoid creating lists manually by inserting numbers, characters, images or other symbols before list items. Assistive technologies, such as screen readers, will have difficulty identifying the presence of a list if it is created in this manner.

Add a list

  1. From within the text box, highlight the text where you want to insert the list.
  2. From the menu at the top, choose one of the two list options (numbered or bulleted).

Recommendations

Avoid the Embed option

The Embed option within NYU Sites is handy, but we recommend that you instead use a link to the document, slide presentation, website, video, or other Google-based artifact. When embedding the resource in the site itself, screen reader users and keyboard-only users may have difficulty navigating.

Resources

Google Support