Modern JavaScript is a powerful language, and we can do so much with it these days, from simple content and UI updates to fully-fledged 2D and 3D games. At the same time, you need to ensure that your page and script are accessible.

A web page containing JavaScript will typically be fully accessible if the functionality of the script is device independent (does not require only a mouse or only a keyboard) and the information (content) is available to assistive technologies. Unfortunately, there is no easy fix that can be applied to solve all accessibility problems associated with JavaScript. The only way to ensure JavaScript accessibility is by evaluating each pages that utilizes scripting and devising a unique solution to any accessibility problem found.

Definitions

JavaScript (JS) is a client-side scripting language. You can use it to validate forms, detect user actions (such as individual keystrokes), or retrieve data from the server without interfering with the display or behavior of the open web page. JavaScript can also power entire applications, like Gmail.

Accessibility: It is a common misconception that people with disabilities don't have or 'do' JavaScript, and thus, that it's acceptable to have inaccessible scripted interfaces, so long as it is accessible with JavaScript disabled. A 2012 survey by WebAIM of screen reader users found that 98.6% of respondents had JavaScript enabled Exit. Accessibility guidelines also require scripted interfaces to be accessible. WCAG 2.0 and all other modern guidelines allow you to require JavaScript, but the scripted content or interactions must be compliant with the guidelines.

EPA uses jQuery as its main JS library. This library "sits" on top of JS and makes common tasks easier. When you write in jQuery, you're still writing JS, but what used to be 50 lines may now be one or two. All Drupal WebCMS content include the master jQuery file. You need not include it separately.

We provide a standard suite of JS files for everyone at the Agency to use. Linking to the EPA master JS files will improve your site performance, as users will cache a copy of the files. All JS, in content managed by the Drupal WebCMS, is output at the bottom of the HTML, just before the closing </body> tag. Placing scripts here speeds up epa.gov for our readers. Area webmasters in the Drupal WebCMS can write JS, per page, as needed.

Content Requirements

• Do not use too much JavaScript.
  • Sometimes you'll see a website where everything has been done with JS: the HTML has been generated by JS, the CSS styling has been generated by JS, etc. This has all kinds of accessibility and other issues associated with it, so it is not advised.
• You should not use JS to create or modify styles for your content.
• All JS must go into the Page JavaScript field in Drupal WebCMS; JS in any other field is stripped out.
  • JS for your application can go anywhere in the HTML; we recommend you output it at the bottom of the page or that you defer its loading.
• Web pages should not be dependent on JavaScript to work.
  • Functions first check to see if an object is available. If not, then fail silently
  • HTML and JavaScript are separated: no inline event handlers
  • With JavaScript off, nothing happens; thus, <noscript> is unnecessary
• If you offer advanced functionality and your pages cannot work the same way without JS:
  • Ensure that you account for users without JavaScript.
    • While this does not necessarily mean that all functionality must work without scripting (though this would clearly be optimal), if it does not work without scripting, you must avoid a confusing or non-functional presentation that may appear to function, but does not because of lack of JavaScript support.
  • At a minimum, provide text equivalents.
  • Provide a phone number or email address to get help.

About this Standard

All EPA public web content must adhere to the EPA Web Standards, the U.S. Web Design System guidelines, and the 21st Century Integrated Digital Experience Act.

Original effective date September 28, 2005
Last approved on: 02/12/2020
Web Council review by: 02/12/2023 (or earlier if deemed necessary by the Web Council)