diff --git a/packages/autocomplete/src/containers/AutocompleteContainer.js b/packages/autocomplete/src/containers/AutocompleteContainer.js
index 5594d8425de..04768d4510b 100644
--- a/packages/autocomplete/src/containers/AutocompleteContainer.js
+++ b/packages/autocomplete/src/containers/AutocompleteContainer.js
@@ -317,12 +317,10 @@ class AutocompleteContainer extends ControlledComponent {
   };
 
   getItemId = key =>
-    typeof key === 'undefined' ? '' : `${this.getControlledState().id}--item-${key}`;
+    typeof key === 'undefined' ? null : `${this.getControlledState().id}--item-${key}`;
 
   getTagId = key =>
-    typeof key === 'undefined' ? '' : `${this.getControlledState().id}--tag-${key}`;
-
-  getMenuId = () => `${this.getControlledState().id}--menu`;
+    typeof key === 'undefined' ? null : `${this.getControlledState().id}--tag-${key}`;
 
   getInputProps = ({
     tabIndex = 0,
@@ -340,7 +338,6 @@ class AutocompleteContainer extends ControlledComponent {
       role,
       'aria-autocomplete': 'list',
       'aria-haspopup': 'true',
-      'aria-owns': this.getMenuId(),
       'aria-expanded': isOpen,
       'aria-activedescendant': isOpen ? this.getItemId(focusedKey) : this.getTagId(tagFocusedKey),
       autoComplete: 'off',
@@ -387,15 +384,8 @@ class AutocompleteContainer extends ControlledComponent {
     };
   };
 
-  getMenuProps = ({
-    id = this.getMenuId(),
-    role = 'listbox',
-    onMouseDown,
-    onMouseUp,
-    ...other
-  } = {}) => {
+  getMenuProps = ({ role = 'listbox', onMouseDown, onMouseUp, ...other } = {}) => {
     return {
-      id,
       role,
       onMouseDown: composeEventHandlers(onMouseDown, () => {
         this.menuMousedDown = true;
diff --git a/packages/autocomplete/src/containers/AutocompleteContainer.spec.js b/packages/autocomplete/src/containers/AutocompleteContainer.spec.js
index 63ff6068f50..ddd63e12102 100644
--- a/packages/autocomplete/src/containers/AutocompleteContainer.spec.js
+++ b/packages/autocomplete/src/containers/AutocompleteContainer.spec.js
@@ -215,7 +215,6 @@ describe('AutocompleteContainer', () => {
       expect(input).toHaveProp('role', 'combobox');
       expect(input).toHaveProp('aria-autocomplete', 'list');
       expect(input).toHaveProp('aria-haspopup', 'true');
-      expect(input).toHaveProp('aria-owns', 'test--menu');
       expect(input).toHaveProp('autoComplete', 'off');
     });
 
@@ -492,7 +491,6 @@ describe('AutocompleteContainer', () => {
     it('applies accessibility attributes correctly', () => {
       const menu = findMenu(wrapper);
 
-      expect(menu).toHaveProp('id', 'test--menu');
       expect(menu).toHaveProp('role', 'listbox');
     });
 
diff --git a/packages/autocomplete/src/examples/autocomplete.md b/packages/autocomplete/src/examples/autocomplete.md
index 05fae7884ce..9fc1a36e6ca 100644
--- a/packages/autocomplete/src/examples/autocomplete.md
+++ b/packages/autocomplete/src/examples/autocomplete.md
@@ -115,24 +115,27 @@ initialState = {
               {!isOpen && <span>{state.value}</span>}
               <Input
                 {...getInputProps(
-                  getFieldInputProps({
-                    bare: true,
-                    innerRef: inputRef,
-                    value: state.inputValue,
-                    onChange: e => {
-                      setState({ inputValue: e.target.value });
+                  getFieldInputProps(
+                    {
+                      bare: true,
+                      innerRef: inputRef,
+                      value: state.inputValue,
+                      onChange: e => {
+                        setState({ inputValue: e.target.value });
+                      },
+                      placeholder: state.value,
+                      onFocus: () => {
+                        setState({ isFocused: true });
+                      },
+                      onBlur: () => {
+                        setState({ isFocused: false });
+                      },
+                      style: !isOpen
+                        ? { opacity: 0, height: 0, minHeight: 0, width: 0, minWidth: 0 }
+                        : {}
                     },
-                    placeholder: state.value,
-                    onFocus: () => {
-                      setState({ isFocused: true });
-                    },
-                    onBlur: () => {
-                      setState({ isFocused: false });
-                    },
-                    style: !isOpen
-                      ? { opacity: 0, height: 0, minHeight: 0, width: 0, minWidth: 0 }
-                      : {}
-                  })
+                    { isDescribed: false }
+                  )
                 )}
               />
             </FauxInput>
diff --git a/packages/autocomplete/src/examples/multiselect.md b/packages/autocomplete/src/examples/multiselect.md
index a24b99a65ec..1edb2cc2c41 100644
--- a/packages/autocomplete/src/examples/multiselect.md
+++ b/packages/autocomplete/src/examples/multiselect.md
@@ -5,7 +5,7 @@ the `input` and it's collection of tags.
 This example also includes an example of "copy-to-clipboard" functionality when
 a tag is selected.
 
-#### Accessibility Warning
+### Accessibility Warning
 
 When implementing a MultiSelect with the ability to delete Tags, be aware of
 users that navigate primarily with a keyboard and how your features may affect
@@ -228,54 +228,57 @@ const MoreAnchor = styled(Anchor)`
 
                     <Input
                       {...getInputProps(
-                        getFieldInputProps({
-                          bare: true,
-                          innerRef: inputRef,
-                          value: state.inputValue,
-                          onChange: e => {
-                            setState({ inputValue: e.target.value });
-                          },
-                          onKeyDown: e => {
-                            if (
-                              e.keyCode === KEY_CODES.DELETE ||
-                              e.keyCode === KEY_CODES.BACKSPACE
-                            ) {
-                              if (tagFocusedKey !== undefined) {
-                                deleteTag(tagFocusedKey);
-                              }
+                        getFieldInputProps(
+                          {
+                            bare: true,
+                            innerRef: inputRef,
+                            value: state.inputValue,
+                            onChange: e => {
+                              setState({ inputValue: e.target.value });
+                            },
+                            onKeyDown: e => {
+                              if (
+                                e.keyCode === KEY_CODES.DELETE ||
+                                e.keyCode === KEY_CODES.BACKSPACE
+                              ) {
+                                if (tagFocusedKey !== undefined) {
+                                  deleteTag(tagFocusedKey);
+                                }
 
-                              if (e.target.value === '') {
-                                const tags = Object.keys(state.selectedKeys);
-                                deleteTag(tags[tags.length - 1]);
+                                if (e.target.value === '') {
+                                  const tags = Object.keys(state.selectedKeys);
+                                  deleteTag(tags[tags.length - 1]);
+                                }
                               }
-                            }
 
-                            if (tagFocusedKey !== undefined) {
-                              // copy-to-clipboard functionality
-                              if (e.keyCode === 67 && e.metaKey) {
-                                alert(`"${tagFocusedKey}" copied`);
+                              if (tagFocusedKey !== undefined) {
+                                // copy-to-clipboard functionality
+                                if (e.keyCode === 67 && e.metaKey) {
+                                  alert(`"${tagFocusedKey}" copied`);
+                                }
                               }
-                            }
-                          },
-                          placeholder:
-                            Object.keys(state.selectedKeys).length === 0
-                              ? 'Enter some content'
-                              : undefined,
-                          onFocus: () => {
-                            setState({ isFocused: true });
-                          },
-                          onBlur: () => {
-                            setState({ isFocused: false });
+                            },
+                            placeholder:
+                              Object.keys(state.selectedKeys).length === 0
+                                ? 'Enter some content'
+                                : undefined,
+                            onFocus: () => {
+                              setState({ isFocused: true });
+                            },
+                            onBlur: () => {
+                              setState({ isFocused: false });
+                            },
+                            style: Object.assign(
+                              { margin: '0 2px', flexGrow: 1, width: 60 },
+                              Object.keys(state.selectedKeys).length !== 0 &&
+                              (!state.isFocused || tagFocusedKey !== undefined) &&
+                              !isOpen
+                                ? { opacity: 0, height: 0, minHeight: 0 }
+                                : {}
+                            )
                           },
-                          style: Object.assign(
-                            { margin: '0 2px', flexGrow: 1, width: 60 },
-                            Object.keys(state.selectedKeys).length !== 0 &&
-                            (!state.isFocused || tagFocusedKey !== undefined) &&
-                            !isOpen
-                              ? { opacity: 0, height: 0, minHeight: 0 }
-                              : {}
-                          )
-                        })
+                          { isDescribed: false }
+                        )
                       )}
                     />
                   </FauxInput>
diff --git a/packages/checkboxes/src/elements/Checkbox.js b/packages/checkboxes/src/elements/Checkbox.js
index 597213ee1e9..f284851214f 100644
--- a/packages/checkboxes/src/elements/Checkbox.js
+++ b/packages/checkboxes/src/elements/Checkbox.js
@@ -65,9 +65,17 @@ export default class Checkbox extends ControlledComponent {
      */
     const { onMouseDown: onFocusMouseDown, ...checkboxProps } = getFocusProps(checkboxInputProps);
 
+    let isDescribed = false;
+
+    Children.forEach(children, child => {
+      if (hasType(child, Hint)) {
+        isDescribed = true;
+      }
+    });
+
     return (
       <CheckboxView {...wrapperProps}>
-        <Input {...getInputProps(checkboxProps)} />
+        <Input {...getInputProps(checkboxProps, { isDescribed })} />
         {Children.map(children, child => {
           if (!isValidElement(child)) {
             return child;
diff --git a/packages/checkboxes/src/elements/Checkbox.spec.js b/packages/checkboxes/src/elements/Checkbox.spec.js
index 466c14e3b8e..6e8fe413a4f 100644
--- a/packages/checkboxes/src/elements/Checkbox.spec.js
+++ b/packages/checkboxes/src/elements/Checkbox.spec.js
@@ -40,7 +40,7 @@ describe('Checkbox', () => {
   });
 
   it('applies container props to Message', () => {
-    expect(wrapper.find(Message)).toHaveProp('id', `${CHECKBOX_ID}--message`);
+    expect(wrapper.find(Message)).toHaveProp('role', 'alert');
   });
 
   it('applies no props to any other element', () => {
diff --git a/packages/menus/src/containers/MenuContainer.js b/packages/menus/src/containers/MenuContainer.js
index 07f5578de5a..8835ed1a25d 100644
--- a/packages/menus/src/containers/MenuContainer.js
+++ b/packages/menus/src/containers/MenuContainer.js
@@ -212,8 +212,6 @@ class MenuContainer extends ControlledComponent {
     }
   };
 
-  getMenuId = () => `${this.getControlledState().id}--container`;
-
   toggleMenuVisibility = ({ defaultFocusedIndex, focusOnOpen, closedByBlur } = {}) => {
     const { isOpen } = this.getControlledState();
 
@@ -235,7 +233,6 @@ class MenuContainer extends ControlledComponent {
     return {
       tabIndex,
       'aria-haspopup': true,
-      'aria-controls': this.getMenuId(),
       'aria-expanded': isOpen,
       onClick: composeEventHandlers(onClick, () => this.toggleMenuVisibility()),
       onKeyDown: composeEventHandlers(onKeyDown, event => {
@@ -285,13 +282,12 @@ class MenuContainer extends ControlledComponent {
    * Props to be applied to the menu container
    */
   getMenuProps = (
-    { id = this.getMenuId(), tabIndex = -1, role = 'menu', onKeyDown, onFocus, ...other } = {},
+    { tabIndex = -1, role = 'menu', onKeyDown, onFocus, ...other } = {},
     focusSelectionModel
   ) => {
     const { focusOnOpen } = this.getControlledState();
 
     return {
-      id,
       role,
       tabIndex,
       onFocus: composeEventHandlers(onFocus, event => {
@@ -382,7 +378,7 @@ class MenuContainer extends ControlledComponent {
   /**
    * Props to be applied to each selectable menu item
    **/
-  getItemProps = ({ key, textValue, ...other }) => {
+  getItemProps = ({ key, role = 'menuitemcheckbox', textValue, ...other }) => {
     const { focusedKey } = this.getControlledState();
 
     if (typeof textValue === 'string' && textValue.length > 0) {
@@ -409,6 +405,7 @@ class MenuContainer extends ControlledComponent {
 
     return {
       key,
+      role,
       ...other
     };
   };
@@ -556,7 +553,9 @@ class MenuContainer extends ControlledComponent {
                                   getContainerProps(this.getMenuProps(props, focusSelectionModel))
                                 ),
                               getItemProps: props =>
-                                getSelectionItemProps(this.getItemProps(props)),
+                                getSelectionItemProps(this.getItemProps(props), {
+                                  selectedAriaKey: 'aria-checked'
+                                }),
                               getNextItemProps: props =>
                                 getSelectionItemProps(
                                   this.getItemProps(this.getNextItemProps(props))
diff --git a/packages/menus/src/containers/MenuContainer.spec.js b/packages/menus/src/containers/MenuContainer.spec.js
index 65580a37220..a539359e0e5 100644
--- a/packages/menus/src/containers/MenuContainer.spec.js
+++ b/packages/menus/src/containers/MenuContainer.spec.js
@@ -278,7 +278,6 @@ describe('MenuContainer', () => {
 
       expect(trigger).toHaveProp('tabIndex', 0);
       expect(trigger).toHaveProp('aria-haspopup', true);
-      expect(trigger).toHaveProp('aria-controls');
       expect(trigger).toHaveProp('aria-expanded', false);
     });
 
@@ -464,6 +463,12 @@ describe('MenuContainer', () => {
     });
   });
 
+  describe('getItemProps', () => {
+    it('applies correct accessibility role', () => {
+      expect(findMenuItems(wrapper).first()).toHaveProp('role', 'menuitemcheckbox');
+    });
+  });
+
   describe('getNextItemProps()', () => {
     beforeEach(() => {
       wrapper = mountWithTheme(basicExample({ onChange: onChangeSpy }));
diff --git a/packages/radios/src/elements/Radio.example.md b/packages/radios/src/elements/Radio.example.md
index b7c07985a6e..6142eea7ec9 100644
--- a/packages/radios/src/elements/Radio.example.md
+++ b/packages/radios/src/elements/Radio.example.md
@@ -6,18 +6,20 @@ mapped to that `input` element.
 
 ```jsx
 <form>
-  <Radio name="options" value="option-1">
-    <Label>Option 1</Label>
-    <Hint>Hinty Hint</Hint>
-  </Radio>
-  <Radio name="options" value="option-2" disabled>
-    <Label>Option 2</Label>
-    <Hint>Disabled option</Hint>
-  </Radio>
-  <Radio name="options" value="option-3">
-    <Label>Option 3</Label>
-    <Hint>Hinty Hint</Hint>
-  </Radio>
+  <div role="group" aria-label="Uncontrolled Usage Example">
+    <Radio name="options" value="option-1">
+      <Label>Option 1</Label>
+      <Hint>Hinty Hint</Hint>
+    </Radio>
+    <Radio name="options" value="option-2" disabled>
+      <Label>Option 2</Label>
+      <Hint>Disabled option</Hint>
+    </Radio>
+    <Radio name="options" value="option-3">
+      <Label>Option 3</Label>
+      <Hint>Hinty Hint</Hint>
+    </Radio>
+  </div>
 </form>
 ```
 
@@ -35,35 +37,37 @@ const CenteredText = styled.div`
 <Grid>
   <Row>
     <Col md>
-      <div>
-        <Radio
-          name="controlled-options"
-          value="option-1"
-          checked={state.selectedValue === 'option-1'}
-          onChange={event => setState({ selectedValue: event.target.value })}
-        >
-          <Label>Option 1</Label>
-          <Hint>Hinty Hint</Hint>
-        </Radio>
-        <Radio
-          name="controlled-options"
-          value="option-2"
-          checked={state.selectedValue === 'option-2'}
-          onChange={event => setState({ selectedValue: event.target.value })}
-        >
-          <Label>Option 2</Label>
-          <Hint>Hinty hint</Hint>
-        </Radio>
-        <Radio
-          name="controlled-options"
-          value="option-3"
-          checked={state.selectedValue === 'option-3'}
-          onChange={event => setState({ selectedValue: event.target.value })}
-        >
-          <Label>Option 3</Label>
-          <Hint>Hinty Hint</Hint>
-        </Radio>
-      </div>
+      <form>
+        <div role="group" aria-label="Controlled Usage Example">
+          <Radio
+            name="controlled-options"
+            value="option-1"
+            checked={state.selectedValue === 'option-1'}
+            onChange={event => setState({ selectedValue: event.target.value })}
+          >
+            <Label>Option 1</Label>
+            <Hint>Hinty Hint</Hint>
+          </Radio>
+          <Radio
+            name="controlled-options"
+            value="option-2"
+            checked={state.selectedValue === 'option-2'}
+            onChange={event => setState({ selectedValue: event.target.value })}
+          >
+            <Label>Option 2</Label>
+            <Hint>Hinty hint</Hint>
+          </Radio>
+          <Radio
+            name="controlled-options"
+            value="option-3"
+            checked={state.selectedValue === 'option-3'}
+            onChange={event => setState({ selectedValue: event.target.value })}
+          >
+            <Label>Option 3</Label>
+            <Hint>Hinty Hint</Hint>
+          </Radio>
+        </div>
+      </form>
     </Col>
     <Col md>
       <CenteredText>Selected value: {state.selectedValue}</CenteredText>
diff --git a/packages/radios/src/elements/Radio.js b/packages/radios/src/elements/Radio.js
index 19cfe44a295..73f4bb89fbd 100644
--- a/packages/radios/src/elements/Radio.js
+++ b/packages/radios/src/elements/Radio.js
@@ -65,9 +65,17 @@ export default class Radio extends ControlledComponent {
      */
     const { onMouseDown: onFocusMouseDown, ...checkboxProps } = getFocusProps(checkboxInputProps);
 
+    let isDescribed = false;
+
+    Children.forEach(children, child => {
+      if (hasType(child, Hint)) {
+        isDescribed = true;
+      }
+    });
+
     return (
       <RadioView {...wrapperProps}>
-        <Input {...getInputProps(checkboxProps)} />
+        <Input {...getInputProps(checkboxProps, { isDescribed })} />
         {Children.map(children, child => {
           if (!isValidElement(child)) {
             return child;
diff --git a/packages/radios/src/elements/Radio.spec.js b/packages/radios/src/elements/Radio.spec.js
index 19ee0f98fb8..4b60be6544f 100644
--- a/packages/radios/src/elements/Radio.spec.js
+++ b/packages/radios/src/elements/Radio.spec.js
@@ -40,7 +40,7 @@ describe('Radio', () => {
   });
 
   it('applies container props to Message', () => {
-    expect(wrapper.find(Message)).toHaveProp('id', `${RADIO_ID}--message`);
+    expect(wrapper.find(Message)).toHaveProp('role', 'alert');
   });
 
   it('applies no props to any other element', () => {
diff --git a/packages/radios/src/views/Label.example.md b/packages/radios/src/views/Label.example.md
index 2668b1d3a55..910a6ddf787 100644
--- a/packages/radios/src/views/Label.example.md
+++ b/packages/radios/src/views/Label.example.md
@@ -1,7 +1,7 @@
 ### States
 
 ```jsx
-<Grid>
+<Grid role="group" aria-label="State Usage Example">
   <Row>
     <Col md={4}>
       <Radio>
diff --git a/packages/radios/src/views/Message.example.md b/packages/radios/src/views/Message.example.md
index 4e5d769cd01..c8fc8442bb3 100644
--- a/packages/radios/src/views/Message.example.md
+++ b/packages/radios/src/views/Message.example.md
@@ -1,32 +1,34 @@
 ```jsx
 <form>
-  <Grid>
-    <Row>
-      <Col md>
-        <Radio name="options" value="default">
-          <Label>Default Radio</Label>
-          <Message>Default message</Message>
-        </Radio>
-      </Col>
-      <Col md>
-        <Radio name="options" value="success">
-          <Label>Success Radio</Label>
-          <Message validation="success">Success validation</Message>
-        </Radio>
-      </Col>
-      <Col md>
-        <Radio name="options" value="warning">
-          <Label>Warning Radio</Label>
-          <Message validation="warning">Warning validation</Message>
-        </Radio>
-      </Col>
-      <Col md>
-        <Radio name="options" value="error">
-          <Label>Error Radio</Label>
-          <Message validation="error">Error validation</Message>
-        </Radio>
-      </Col>
-    </Row>
-  </Grid>
+  <div role="group" aria-label="Message Usage Example">
+    <Grid>
+      <Row>
+        <Col md>
+          <Radio name="options" value="default">
+            <Label>Default Radio</Label>
+            <Message>Default message</Message>
+          </Radio>
+        </Col>
+        <Col md>
+          <Radio name="options" value="success">
+            <Label>Success Radio</Label>
+            <Message validation="success">Success validation</Message>
+          </Radio>
+        </Col>
+        <Col md>
+          <Radio name="options" value="warning">
+            <Label>Warning Radio</Label>
+            <Message validation="warning">Warning validation</Message>
+          </Radio>
+        </Col>
+        <Col md>
+          <Radio name="options" value="error">
+            <Label>Error Radio</Label>
+            <Message validation="error">Error validation</Message>
+          </Radio>
+        </Col>
+      </Row>
+    </Grid>
+  </div>
 </form>
 ```
diff --git a/packages/ranges/CHANGELOG.md b/packages/ranges/CHANGELOG.md
index adcecdf59b0..b85031fe90e 100644
--- a/packages/ranges/CHANGELOG.md
+++ b/packages/ranges/CHANGELOG.md
@@ -4,252 +4,189 @@ All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
 <a name="2.3.4"></a>
+
 ## [2.3.4](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.3.3...@zendeskgarden/react-ranges@2.3.4) (2018-08-23)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
-
-
-
-
 <a name="2.3.3"></a>
+
 ## [2.3.3](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.3.2...@zendeskgarden/react-ranges@2.3.3) (2018-08-22)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
-
-
-
-
 <a name="2.3.2"></a>
+
 ## [2.3.2](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.3.0...@zendeskgarden/react-ranges@2.3.2) (2018-08-17)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
-
-
-
-
 <a name="2.3.1"></a>
+
 ## [2.3.1](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.3.0...@zendeskgarden/react-ranges@2.3.1) (2018-08-17)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
-
-
-
-
 <a name="2.3.0"></a>
-# [2.3.0](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.14...@zendeskgarden/react-ranges@2.3.0) (2018-08-10)
 
+# [2.3.0](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.14...@zendeskgarden/react-ranges@2.3.0) (2018-08-10)
 
 ### Features
 
-* **checkboxes|radios|ranges|select|textfields|toggles:** Add new `none` option to support dynamic logic with the validation prop ([#99](https://github.com/zendeskgarden/react-components/issues/99)) ([3d670d8](https://github.com/zendeskgarden/react-components/commit/3d670d8))
-
-
-
+- **checkboxes|radios|ranges|select|textfields|toggles:** Add new `none` option to support dynamic logic with the validation prop ([#99](https://github.com/zendeskgarden/react-components/issues/99)) ([3d670d8](https://github.com/zendeskgarden/react-components/commit/3d670d8))
 
 <a name="2.2.14"></a>
-## [2.2.14](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.13...@zendeskgarden/react-ranges@2.2.14) (2018-08-08)
-
-
 
+## [2.2.14](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.13...@zendeskgarden/react-ranges@2.2.14) (2018-08-08)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
 <a name="2.2.13"></a>
-## [2.2.13](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.12...@zendeskgarden/react-ranges@2.2.13) (2018-08-07)
 
+## [2.2.13](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.12...@zendeskgarden/react-ranges@2.2.13) (2018-08-07)
 
 ### Bug Fixes
 
-* **buttons|ranges:** prettier formatting errors ([#94](https://github.com/zendeskgarden/react-components/issues/94)) ([69f17a1](https://github.com/zendeskgarden/react-components/commit/69f17a1))
-
-
-
+- **buttons|ranges:** prettier formatting errors ([#94](https://github.com/zendeskgarden/react-components/issues/94)) ([69f17a1](https://github.com/zendeskgarden/react-components/commit/69f17a1))
 
 <a name="2.2.12"></a>
-## [2.2.12](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.10...@zendeskgarden/react-ranges@2.2.12) (2018-08-07)
 
+## [2.2.12](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.10...@zendeskgarden/react-ranges@2.2.12) (2018-08-07)
 
 ### Bug Fixes
 
-* **ranges:** increase specificity to show selection fill color ([#69](https://github.com/zendeskgarden/react-components/issues/69)) ([8914ce3](https://github.com/zendeskgarden/react-components/commit/8914ce3))
-
-
-
+- **ranges:** increase specificity to show selection fill color ([#69](https://github.com/zendeskgarden/react-components/issues/69)) ([8914ce3](https://github.com/zendeskgarden/react-components/commit/8914ce3))
 
 <a name="2.2.11"></a>
-## [2.2.11](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.10...@zendeskgarden/react-ranges@2.2.11) (2018-07-27)
 
+## [2.2.11](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.10...@zendeskgarden/react-ranges@2.2.11) (2018-07-27)
 
 ### Bug Fixes
 
-* **ranges:** increase specificity to show selection fill color ([#69](https://github.com/zendeskgarden/react-components/issues/69)) ([8914ce3](https://github.com/zendeskgarden/react-components/commit/8914ce3))
-
-
-
+- **ranges:** increase specificity to show selection fill color ([#69](https://github.com/zendeskgarden/react-components/issues/69)) ([8914ce3](https://github.com/zendeskgarden/react-components/commit/8914ce3))
 
 <a name="2.2.10"></a>
-## [2.2.10](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.9...@zendeskgarden/react-ranges@2.2.10) (2018-07-25)
-
-
 
+## [2.2.10](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.9...@zendeskgarden/react-ranges@2.2.10) (2018-07-25)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
 <a name="2.2.9"></a>
-## [2.2.9](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.8...@zendeskgarden/react-ranges@2.2.9) (2018-07-25)
-
-
 
+## [2.2.9](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.8...@zendeskgarden/react-ranges@2.2.9) (2018-07-25)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
 <a name="2.2.8"></a>
-## [2.2.8](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.7...@zendeskgarden/react-ranges@2.2.8) (2018-07-17)
-
-
 
+## [2.2.8](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.7...@zendeskgarden/react-ranges@2.2.8) (2018-07-17)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
 <a name="2.2.7"></a>
-## [2.2.7](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.6...@zendeskgarden/react-ranges@2.2.7) (2018-07-06)
 
+## [2.2.7](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.6...@zendeskgarden/react-ranges@2.2.7) (2018-07-06)
 
 ### Bug Fixes
 
-* add isValidElement check for all children mapping within elements ([#52](https://github.com/zendeskgarden/react-components/issues/52)) ([895b873](https://github.com/zendeskgarden/react-components/commit/895b873))
-
-
-
+- add isValidElement check for all children mapping within elements ([#52](https://github.com/zendeskgarden/react-components/issues/52)) ([895b873](https://github.com/zendeskgarden/react-components/commit/895b873))
 
 <a name="2.2.6"></a>
-## [2.2.6](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.5...@zendeskgarden/react-ranges@2.2.6) (2018-07-05)
-
-
 
+## [2.2.6](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.5...@zendeskgarden/react-ranges@2.2.6) (2018-07-05)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
 <a name="2.2.5"></a>
-## [2.2.5](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.4...@zendeskgarden/react-ranges@2.2.5) (2018-07-04)
-
-
 
+## [2.2.5](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.4...@zendeskgarden/react-ranges@2.2.5) (2018-07-04)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
 <a name="2.2.4"></a>
-## [2.2.4](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.3...@zendeskgarden/react-ranges@2.2.4) (2018-06-26)
 
+## [2.2.4](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.3...@zendeskgarden/react-ranges@2.2.4) (2018-06-26)
 
 ### Bug Fixes
 
-* **dependencies:** update react-theming peerDependency for all packages ([#46](https://github.com/zendeskgarden/react-components/issues/46)) ([1d0a43b](https://github.com/zendeskgarden/react-components/commit/1d0a43b))
-
-
-
+- **dependencies:** update react-theming peerDependency for all packages ([#46](https://github.com/zendeskgarden/react-components/issues/46)) ([1d0a43b](https://github.com/zendeskgarden/react-components/commit/1d0a43b))
 
 <a name="2.2.3"></a>
-## [2.2.3](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.2...@zendeskgarden/react-ranges@2.2.3) (2018-06-25)
-
-
 
+## [2.2.3](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.2...@zendeskgarden/react-ranges@2.2.3) (2018-06-25)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
 <a name="2.2.2"></a>
-## [2.2.2](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.1...@zendeskgarden/react-ranges@2.2.2) (2018-06-14)
-
-
 
+## [2.2.2](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.1...@zendeskgarden/react-ranges@2.2.2) (2018-06-14)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
 <a name="2.2.1"></a>
-## [2.2.1](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.0...@zendeskgarden/react-ranges@2.2.1) (2018-06-14)
-
-
 
+## [2.2.1](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.2.0...@zendeskgarden/react-ranges@2.2.1) (2018-06-14)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
 <a name="2.2.0"></a>
-# [2.2.0](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.1.0...@zendeskgarden/react-ranges@2.2.0) (2018-06-11)
 
+# [2.2.0](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.1.0...@zendeskgarden/react-ranges@2.2.0) (2018-06-11)
 
 ### Features
 
-* **testing:** introduce [@zendeskgarden](https://github.com/zendeskgarden)/react-testing utilities package ([#34](https://github.com/zendeskgarden/react-components/issues/34)) ([678e3c4](https://github.com/zendeskgarden/react-components/commit/678e3c4))
-* **testing:** introduce the [@zendeskgarden](https://github.com/zendeskgarden)/react-testing package ([#36](https://github.com/zendeskgarden/react-components/issues/36)) ([ee884e0](https://github.com/zendeskgarden/react-components/commit/ee884e0))
-
-
-
+- **testing:** introduce [@zendeskgarden](https://github.com/zendeskgarden)/react-testing utilities package ([#34](https://github.com/zendeskgarden/react-components/issues/34)) ([678e3c4](https://github.com/zendeskgarden/react-components/commit/678e3c4))
+- **testing:** introduce the [@zendeskgarden](https://github.com/zendeskgarden)/react-testing package ([#36](https://github.com/zendeskgarden/react-components/issues/36)) ([ee884e0](https://github.com/zendeskgarden/react-components/commit/ee884e0))
 
 <a name="2.1.0"></a>
-# [2.1.0](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.0.3...@zendeskgarden/react-ranges@2.1.0) (2018-06-11)
 
+# [2.1.0](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.0.3...@zendeskgarden/react-ranges@2.1.0) (2018-06-11)
 
 ### Features
 
-* **utilities:** introduce new [@zendeskgarden](https://github.com/zendeskgarden)/react-utilities package ([#33](https://github.com/zendeskgarden/react-components/issues/33)) ([6ee0ce7](https://github.com/zendeskgarden/react-components/commit/6ee0ce7))
-
-
-
+- **utilities:** introduce new [@zendeskgarden](https://github.com/zendeskgarden)/react-utilities package ([#33](https://github.com/zendeskgarden/react-components/issues/33)) ([6ee0ce7](https://github.com/zendeskgarden/react-components/commit/6ee0ce7))
 
 <a name="2.0.3"></a>
-## [2.0.3](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.0.2...@zendeskgarden/react-ranges@2.0.3) (2018-06-06)
 
+## [2.0.3](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.0.2...@zendeskgarden/react-ranges@2.0.3) (2018-06-06)
 
 ### Bug Fixes
 
-* Add hasType util to safely check children of component ([#27](https://github.com/zendeskgarden/react-components/issues/27)) ([5436bbd](https://github.com/zendeskgarden/react-components/commit/5436bbd))
-
-
-
+- Add hasType util to safely check children of component ([#27](https://github.com/zendeskgarden/react-components/issues/27)) ([5436bbd](https://github.com/zendeskgarden/react-components/commit/5436bbd))
 
 <a name="2.0.2"></a>
-## [2.0.2](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.0.1...@zendeskgarden/react-ranges@2.0.2) (2018-06-05)
 
+## [2.0.2](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.0.1...@zendeskgarden/react-ranges@2.0.2) (2018-06-05)
 
 ### Bug Fixes
 
-* **dependencies:** add new allowed peerDependency for [@zendeskgarden](https://github.com/zendeskgarden)/react-theming ([#29](https://github.com/zendeskgarden/react-components/issues/29)) ([c5af0ce](https://github.com/zendeskgarden/react-components/commit/c5af0ce))
-
-
-
+- **dependencies:** add new allowed peerDependency for [@zendeskgarden](https://github.com/zendeskgarden)/react-theming ([#29](https://github.com/zendeskgarden/react-components/issues/29)) ([c5af0ce](https://github.com/zendeskgarden/react-components/commit/c5af0ce))
 
 <a name="2.0.1"></a>
-## [2.0.1](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.0.0...@zendeskgarden/react-ranges@2.0.1) (2018-06-04)
-
-
 
+## [2.0.1](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@2.0.0...@zendeskgarden/react-ranges@2.0.1) (2018-06-04)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
 <a name="2.0.0"></a>
-# [2.0.0](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@1.0.1...@zendeskgarden/react-ranges@2.0.0) (2018-06-02)
 
+# [2.0.0](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@1.0.1...@zendeskgarden/react-ranges@2.0.0) (2018-06-02)
 
 ### Features
 
-* **build:** move to webpack build and remove custom webpack dependency ([#21](https://github.com/zendeskgarden/react-components/issues/21)) ([5640a6e](https://github.com/zendeskgarden/react-components/commit/5640a6e))
-
+- **build:** move to webpack build and remove custom webpack dependency ([#21](https://github.com/zendeskgarden/react-components/issues/21)) ([5640a6e](https://github.com/zendeskgarden/react-components/commit/5640a6e))
 
 ### BREAKING CHANGES
 
-* **build:** All components no longer require custom webpack loaders for CSS-modules. Due to this build change the following breaking changes occurred:
+- **build:** All components no longer require custom webpack loaders for CSS-modules. Due to this build change the following breaking changes occurred:
 
-* Styles are no longer bundled within the components. You must import them separately:
+- Styles are no longer bundled within the components. You must import them separately:
 
 ```
 import ‘@zendeskgarden/react-buttons/dist/styles.css';
 ```
 
-* The relative, “flat-pack” import paths are no longer necessary. You can now use the standard import structures:
+- The relative, “flat-pack” import paths are no longer necessary. You can now use the standard import structures:
 
 ```
 // Old imports
@@ -261,37 +198,28 @@ import { Button } from ‘@zendeskgarden/react-buttons’;
 
 These changes also simplify the custom configurations needed to test with our components. You may be able to remove some custom jest/enzyme entries that you needed in the past.
 
-
-
-
 <a name="1.0.1"></a>
-## [1.0.1](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@1.0.0...@zendeskgarden/react-ranges@1.0.1) (2018-05-15)
-
-
 
+## [1.0.1](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@1.0.0...@zendeskgarden/react-ranges@1.0.1) (2018-05-15)
 
 **Note:** Version bump only for package @zendeskgarden/react-ranges
 
 <a name="1.0.0"></a>
-# [1.0.0](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@0.1.0...@zendeskgarden/react-ranges@1.0.0) (2018-05-10)
 
+# [1.0.0](https://github.com/zendeskgarden/react-components/compare/@zendeskgarden/react-ranges@0.1.0...@zendeskgarden/react-ranges@1.0.0) (2018-05-10)
 
 ### Features
 
-* **ranges:** add WCAG 2.0 AA compliant color palette ([#9](https://github.com/zendeskgarden/react-components/issues/9)) ([bd39a09](https://github.com/zendeskgarden/react-components/commit/bd39a09))
-
+- **ranges:** add WCAG 2.0 AA compliant color palette ([#9](https://github.com/zendeskgarden/react-components/issues/9)) ([bd39a09](https://github.com/zendeskgarden/react-components/commit/bd39a09))
 
 ### BREAKING CHANGES
 
-* **ranges:** This version includes the WCAG 2.0 AA compliant "blue" color palette. With this being a large visual change it is a major version.
-
-
-
+- **ranges:** This version includes the WCAG 2.0 AA compliant "blue" color palette. With this being a large visual change it is a major version.
 
 <a name="0.1.0"></a>
-# 0.1.0 (2018-05-10)
 
+# 0.1.0 (2018-05-10)
 
 ### Features
 
-* **ranges:** introduce [@zendeskgarden](https://github.com/zendeskgarden)/react-ranges package ([#3](https://github.com/zendeskgarden/react-components/issues/3)) ([3311e64](https://github.com/zendeskgarden/react-components/commit/3311e64))
+- **ranges:** introduce [@zendeskgarden](https://github.com/zendeskgarden)/react-ranges package ([#3](https://github.com/zendeskgarden/react-components/issues/3)) ([3311e64](https://github.com/zendeskgarden/react-components/commit/3311e64))
diff --git a/packages/ranges/src/elements/RangeField.js b/packages/ranges/src/elements/RangeField.js
index 541fc63a906..42b12c606a2 100644
--- a/packages/ranges/src/elements/RangeField.js
+++ b/packages/ranges/src/elements/RangeField.js
@@ -42,6 +42,14 @@ export default class RangeField extends ControlledComponent {
     const { id } = this.getControlledState();
     const { children, ...otherProps } = this.props;
 
+    let isDescribed = false;
+
+    Children.forEach(children, child => {
+      if (hasType(child, Hint)) {
+        isDescribed = true;
+      }
+    });
+
     return (
       <FieldContainer id={id}>
         {({ getLabelProps, getInputProps, getHintProps, getMessageProps }) => (
@@ -56,7 +64,7 @@ export default class RangeField extends ControlledComponent {
               }
 
               if (hasType(child, Range)) {
-                return cloneElement(child, getInputProps(child.props));
+                return cloneElement(child, getInputProps(child.props, { isDescribed }));
               }
 
               if (hasType(child, Hint)) {
diff --git a/packages/ranges/src/elements/RangeField.spec.js b/packages/ranges/src/elements/RangeField.spec.js
index 8b4dd6b05ed..61effdcf041 100644
--- a/packages/ranges/src/elements/RangeField.spec.js
+++ b/packages/ranges/src/elements/RangeField.spec.js
@@ -41,7 +41,7 @@ describe('RangeField', () => {
   });
 
   it('applies container props to Message', () => {
-    expect(wrapper.find(Message)).toHaveProp('id', `${RANGE_FIELD_ID}--message`);
+    expect(wrapper.find(Message)).toHaveProp('role', 'alert');
   });
 
   it('applies input props to Range', () => {
diff --git a/packages/select/src/containers/SelectContainer.js b/packages/select/src/containers/SelectContainer.js
index 3c0990aedd5..def874a13e7 100644
--- a/packages/select/src/containers/SelectContainer.js
+++ b/packages/select/src/containers/SelectContainer.js
@@ -119,20 +119,6 @@ export default class SelectContainer extends ControlledComponent {
     };
   }
 
-  getTriggerProps = ({ role = 'combobox', ...other } = {}) => {
-    return {
-      role,
-      ...other
-    };
-  };
-
-  getSelectProps = ({ role = 'listbox', ...other } = {}) => {
-    return {
-      role,
-      ...other
-    };
-  };
-
   render() {
     const {
       children,
@@ -163,7 +149,7 @@ export default class SelectContainer extends ControlledComponent {
         trigger={({ getTriggerProps: getMenuTriggerProps, triggerRef }) =>
           trigger &&
           trigger({
-            getTriggerProps: props => getMenuTriggerProps(this.getTriggerProps(props)),
+            getTriggerProps: getMenuTriggerProps,
             triggerRef,
             selectedKey,
             isOpen
@@ -183,7 +169,7 @@ export default class SelectContainer extends ControlledComponent {
           scheduleUpdate
         }) =>
           render({
-            getSelectProps: props => getMenuProps(this.getSelectProps(props)),
+            getSelectProps: getMenuProps,
             getItemProps,
             getNextItemProps,
             getPreviousItemProps,
diff --git a/packages/select/src/containers/SelectContainer.spec.js b/packages/select/src/containers/SelectContainer.spec.js
index 63650d10a8c..4eaee3e5374 100644
--- a/packages/select/src/containers/SelectContainer.spec.js
+++ b/packages/select/src/containers/SelectContainer.spec.js
@@ -59,23 +59,8 @@ describe('SelectContainer', () => {
   });
 
   const findTrigger = enzymeWrapper => enzymeWrapper.find('[data-test-id="trigger"]');
-  const findDropdown = enzymeWrapper => enzymeWrapper.find('[data-test-id="dropdown"]');
   const findItems = enzymeWrapper => enzymeWrapper.find('[data-test-id="item"]');
 
-  describe('getTriggerProps()', () => {
-    it('applies correct accessibility attributes', () => {
-      expect(findTrigger(wrapper)).toHaveProp('role', 'combobox');
-    });
-  });
-
-  describe('getSelectProps()', () => {
-    it('applies correct accessibility attributes', () => {
-      findTrigger(wrapper).simulate('click');
-      wrapper.update();
-      expect(findDropdown(wrapper)).toHaveProp('role', 'listbox');
-    });
-  });
-
   describe('onChange', () => {
     it('receives selected item key on select', () => {
       findTrigger(wrapper).simulate('click');
diff --git a/packages/select/src/elements/SelectField.js b/packages/select/src/elements/SelectField.js
index 901b91797f9..cc777f39def 100644
--- a/packages/select/src/elements/SelectField.js
+++ b/packages/select/src/elements/SelectField.js
@@ -57,6 +57,14 @@ export default class SelectField extends ControlledComponent {
 
     this.selectRef = undefined;
 
+    let isDescribed = false;
+
+    Children.forEach(children, child => {
+      if (hasType(child, Hint)) {
+        isDescribed = true;
+      }
+    });
+
     return (
       <SelectGroup {...otherProps}>
         <FieldContainer>
@@ -84,7 +92,10 @@ export default class SelectField extends ControlledComponent {
               }
 
               if (hasType(child, Select)) {
-                return cloneElement(child, getFieldInputProps(this.getInputProps(child.props)));
+                return cloneElement(
+                  child,
+                  getFieldInputProps(this.getInputProps(child.props), { isDescribed })
+                );
               }
 
               return child;
diff --git a/packages/selection/src/containers/FieldContainer.js b/packages/selection/src/containers/FieldContainer.js
index 698ac1c217f..934131a344f 100644
--- a/packages/selection/src/containers/FieldContainer.js
+++ b/packages/selection/src/containers/FieldContainer.js
@@ -43,8 +43,6 @@ export default class FieldContainer extends ControlledComponent {
 
   retrieveHintId = () => `${this.getControlledState().id}--hint`;
 
-  retrieveMessageId = () => `${this.getControlledState().id}--message`;
-
   getLabelProps = ({
     id = this.retrieveLabelId(),
     htmlFor = this.retrieveInputId(),
@@ -57,11 +55,11 @@ export default class FieldContainer extends ControlledComponent {
     };
   };
 
-  getInputProps = ({ id = this.retrieveInputId(), ...other } = {}) => {
+  getInputProps = ({ id = this.retrieveInputId(), ...other } = {}, { isDescribed = true } = {}) => {
     return {
       id,
       'aria-labelledby': this.retrieveLabelId(),
-      'aria-describedby': `${this.retrieveHintId()} ${this.retrieveMessageId()}`,
+      'aria-describedby': isDescribed ? this.retrieveHintId() : null,
       ...other
     };
   };
@@ -73,9 +71,9 @@ export default class FieldContainer extends ControlledComponent {
     };
   };
 
-  getMessageProps = ({ id = this.retrieveMessageId(), ...other } = {}) => {
+  getMessageProps = ({ role = 'alert', ...other } = {}) => {
     return {
-      id,
+      role,
       ...other
     };
   };
diff --git a/packages/selection/src/containers/FieldContainer.spec.js b/packages/selection/src/containers/FieldContainer.spec.js
index 706c6c86405..52f6f0d95f9 100644
--- a/packages/selection/src/containers/FieldContainer.spec.js
+++ b/packages/selection/src/containers/FieldContainer.spec.js
@@ -49,15 +49,26 @@ describe('FieldContainer', () => {
   });
 
   describe('getInputProps', () => {
-    it('applies correct accessibility role', () => {
+    it('applies correct accessibility attributes', () => {
       const input = findInput(wrapper);
 
       expect(input).toHaveProp('id', `${CONTAINER_ID}--input`);
       expect(input).toHaveProp('aria-labelledby', `${CONTAINER_ID}--label`);
-      expect(input).toHaveProp(
-        'aria-describedby',
-        `${CONTAINER_ID}--hint ${CONTAINER_ID}--message`
+      expect(input).toHaveProp('aria-describedby', `${CONTAINER_ID}--hint`);
+    });
+
+    it('excludes aria-describedby if option is not provided', () => {
+      wrapper = mountWithTheme(
+        <FieldContainer id={CONTAINER_ID}>
+          {({ getInputProps }) => (
+            <div>
+              <input {...getInputProps({ 'data-test-id': 'input' }, { isDescribed: false })} />
+            </div>
+          )}
+        </FieldContainer>
       );
+
+      expect(findInput(wrapper)).toHaveProp('aria-describedby', null);
     });
   });
 
@@ -69,7 +80,7 @@ describe('FieldContainer', () => {
 
   describe('getMessageProps', () => {
     it('applies correct accessibility role', () => {
-      expect(findMessage(wrapper)).toHaveProp('id', `${CONTAINER_ID}--message`);
+      expect(findMessage(wrapper)).toHaveProp('role', 'alert');
     });
   });
 });
diff --git a/packages/textfields/src/elements/TextField.js b/packages/textfields/src/elements/TextField.js
index 8f659e95669..3efe622599e 100644
--- a/packages/textfields/src/elements/TextField.js
+++ b/packages/textfields/src/elements/TextField.js
@@ -43,6 +43,14 @@ export default class TextField extends ControlledComponent {
     const { id } = this.getControlledState();
     const { children, ...otherProps } = this.props;
 
+    let isDescribed = false;
+
+    Children.forEach(children, child => {
+      if (hasType(child, Hint)) {
+        isDescribed = true;
+      }
+    });
+
     return (
       <FieldContainer id={id}>
         {({ getLabelProps, getInputProps, getHintProps, getMessageProps }) => (
@@ -57,7 +65,7 @@ export default class TextField extends ControlledComponent {
               }
 
               if (hasType(child, Input) || hasType(child, Textarea)) {
-                return cloneElement(child, getInputProps(child.props));
+                return cloneElement(child, getInputProps(child.props, { isDescribed }));
               }
 
               if (hasType(child, Hint)) {
diff --git a/packages/textfields/src/elements/TextField.spec.js b/packages/textfields/src/elements/TextField.spec.js
index c9e846bcae3..2f4d694d489 100644
--- a/packages/textfields/src/elements/TextField.spec.js
+++ b/packages/textfields/src/elements/TextField.spec.js
@@ -42,7 +42,7 @@ describe('TextField', () => {
   });
 
   it('applies container props to Message', () => {
-    expect(wrapper.find(Message)).toHaveProp('id', `${TEXT_FIELD_ID}--message`);
+    expect(wrapper.find(Message)).toHaveProp('role', 'alert');
   });
 
   it('applies no props to any other element', () => {
diff --git a/packages/textfields/src/views/Input.example.md b/packages/textfields/src/views/Input.example.md
index 8603a53ce6b..172a71ac27d 100644
--- a/packages/textfields/src/views/Input.example.md
+++ b/packages/textfields/src/views/Input.example.md
@@ -1,5 +1,5 @@
 ```jsx
-<Input placeholder="Default input" />
+<Input aria-label="Default Example" placeholder="Default input" />
 ```
 
 ### Validation Types
@@ -8,16 +8,16 @@
 <Grid>
   <Row>
     <Col lg>
-      <Input placeholder="Default" />
+      <Input aria-label="Default Example" placeholder="Default" />
     </Col>
     <Col lg>
-      <Input validation="success" placeholder="Success" />
+      <Input aria-label="Success Example" validation="success" placeholder="Success" />
     </Col>
     <Col lg>
-      <Input validation="warning" placeholder="Warning" />
+      <Input aria-label="Warning Example" validation="warning" placeholder="Warning" />
     </Col>
     <Col lg>
-      <Input validation="error" placeholder="Error" />
+      <Input aria-label="Error Example" validation="error" placeholder="Error" />
     </Col>
   </Row>
 </Grid>
@@ -29,10 +29,10 @@
 <Grid>
   <Row>
     <Col lg>
-      <Input placeholder="Default" />
+      <Input aria-label="Default Example" placeholder="Default" />
     </Col>
     <Col lg>
-      <Input placeholder="Small" small />
+      <Input aria-label="Small Example" placeholder="Small" small />
     </Col>
   </Row>
 </Grid>
@@ -44,13 +44,13 @@
 <Grid>
   <Row>
     <Col lg>
-      <Input placeholder="Disabled" disabled />
+      <Input aria-label="Disabled Example" placeholder="Disabled" disabled />
     </Col>
     <Col lg>
-      <Input placeholder="Focused" focused />
+      <Input aria-label="Focused Example" placeholder="Focused" focused />
     </Col>
     <Col lg>
-      <Input placeholder="Hovered" hovered />
+      <Input aria-label="Hovered Example" placeholder="Hovered" hovered />
     </Col>
   </Row>
 </Grid>
diff --git a/packages/textfields/src/views/Input.js b/packages/textfields/src/views/Input.js
index fafd3ccc6c7..d4050476c18 100644
--- a/packages/textfields/src/views/Input.js
+++ b/packages/textfields/src/views/Input.js
@@ -19,12 +19,17 @@ const VALIDATION = {
   NONE: 'none'
 };
 
+const isInvalid = validation => {
+  return validation === VALIDATION.WARNING || validation === VALIDATION.ERROR;
+};
+
 /**
  * Accepts all `<input>` props
  */
 const Input = styled.input.attrs({
   'data-garden-id': COMPONENT_ID,
   'data-garden-version': PACKAGE_VERSION,
+  'aria-invalid': props => isInvalid(props.validation),
   className: props =>
     classNames(TextStyles['c-txt__input'], {
       [TextStyles['c-txt__input--sm']]: props.small,
diff --git a/packages/textfields/src/views/MediaFigure.example.md b/packages/textfields/src/views/MediaFigure.example.md
index fa4775721b6..d57b621bc0b 100644
--- a/packages/textfields/src/views/MediaFigure.example.md
+++ b/packages/textfields/src/views/MediaFigure.example.md
@@ -9,7 +9,7 @@ const SettingsIcon = require('svg-react-loader?name=Attachment!@zendeskgarden/sv
   <MediaFigure>
     <SearchIcon />
   </MediaFigure>
-  <Input bare placeholder="Example media input" />
+  <Input aria-label="Media Input Example" placeholder="Example media input" bare />
   <MediaFigure>
     <SettingsIcon />
   </MediaFigure>
diff --git a/packages/textfields/src/views/Textarea.example.md b/packages/textfields/src/views/Textarea.example.md
index 43153a84b99..71315a34b56 100644
--- a/packages/textfields/src/views/Textarea.example.md
+++ b/packages/textfields/src/views/Textarea.example.md
@@ -1,5 +1,5 @@
 ```jsx
-<Textarea placeholder="Default Textarea" resizable />
+<Textarea aria-label="Default Example" placeholder="Default Textarea" resizable />
 ```
 
 ### Validation Types
@@ -8,16 +8,16 @@
 <Grid>
   <Row>
     <Col lg>
-      <Textarea placeholder="Default" />
+      <Textarea aria-label="Default Example" placeholder="Default" />
     </Col>
     <Col lg>
-      <Textarea validation="success" placeholder="Success" />
+      <Textarea aria-label="Success Example" validation="success" placeholder="Success" />
     </Col>
     <Col lg>
-      <Textarea validation="warning" placeholder="Warning" />
+      <Textarea aria-label="Warning Example" validation="warning" placeholder="Warning" />
     </Col>
     <Col lg>
-      <Textarea validation="error" placeholder="Error" />
+      <Textarea aria-label="Error Example" validation="error" placeholder="Error" />
     </Col>
   </Row>
 </Grid>
@@ -29,10 +29,10 @@
 <Grid>
   <Row>
     <Col lg>
-      <Textarea placeholder="Default" />
+      <Textarea aria-label="Default Example" placeholder="Default" />
     </Col>
     <Col lg>
-      <Textarea placeholder="Small" small />
+      <Textarea aria-label="Small Example" placeholder="Small" small />
     </Col>
   </Row>
 </Grid>
@@ -44,16 +44,16 @@
 <Grid>
   <Row>
     <Col lg>
-      <Textarea placeholder="Resizable" resizable />
+      <Textarea aria-label="Resizable Example" placeholder="Resizable" resizable />
     </Col>
     <Col lg>
-      <Textarea placeholder="Disabled" disabled />
+      <Textarea aria-label="Disabled Example" placeholder="Disabled" disabled />
     </Col>
     <Col lg>
-      <Textarea placeholder="Focused" focused />
+      <Textarea aria-label="Focused Example" placeholder="Focused" focused />
     </Col>
     <Col lg>
-      <Textarea placeholder="Hovered" hovered />
+      <Textarea aria-label="Hovered Example" placeholder="Hovered" hovered />
     </Col>
   </Row>
 </Grid>
diff --git a/packages/textfields/src/views/__snapshots__/Input.spec.js.snap b/packages/textfields/src/views/__snapshots__/Input.spec.js.snap
index 3692f090eb6..2dc0721206b 100644
--- a/packages/textfields/src/views/__snapshots__/Input.spec.js.snap
+++ b/packages/textfields/src/views/__snapshots__/Input.spec.js.snap
@@ -2,6 +2,7 @@
 
 exports[`Input renders RTL styling 1`] = `
 <input
+  aria-invalid={false}
   className="c-txt__input is-rtl "
   data-garden-id="textfields.input"
   data-garden-version="version"
@@ -10,6 +11,7 @@ exports[`Input renders RTL styling 1`] = `
 
 exports[`Input renders bare styling if provided 1`] = `
 <input
+  aria-invalid={false}
   className="c-txt__input c-txt__input--bare "
   data-garden-id="textfields.input"
   data-garden-version="version"
@@ -18,6 +20,7 @@ exports[`Input renders bare styling if provided 1`] = `
 
 exports[`Input renders default styling 1`] = `
 <input
+  aria-invalid={false}
   className="c-txt__input "
   data-garden-id="textfields.input"
   data-garden-version="version"
@@ -26,6 +29,7 @@ exports[`Input renders default styling 1`] = `
 
 exports[`Input renders disabled styling if provided 1`] = `
 <input
+  aria-invalid={false}
   className="c-txt__input is-disabled "
   data-garden-id="textfields.input"
   data-garden-version="version"
@@ -35,6 +39,7 @@ exports[`Input renders disabled styling if provided 1`] = `
 
 exports[`Input renders focused styling if provided 1`] = `
 <input
+  aria-invalid={false}
   className="c-txt__input is-focused "
   data-garden-id="textfields.input"
   data-garden-version="version"
@@ -43,6 +48,7 @@ exports[`Input renders focused styling if provided 1`] = `
 
 exports[`Input renders hovered styling if provided 1`] = `
 <input
+  aria-invalid={false}
   className="c-txt__input is-hovered "
   data-garden-id="textfields.input"
   data-garden-version="version"
@@ -51,6 +57,7 @@ exports[`Input renders hovered styling if provided 1`] = `
 
 exports[`Input renders media layout styling if provided 1`] = `
 <input
+  aria-invalid={false}
   className="c-txt__input c-txt__input--media "
   data-garden-id="textfields.input"
   data-garden-version="version"
@@ -59,6 +66,7 @@ exports[`Input renders media layout styling if provided 1`] = `
 
 exports[`Input renders open styling if provided 1`] = `
 <input
+  aria-invalid={false}
   className="c-txt__input is-open "
   data-garden-id="textfields.input"
   data-garden-version="version"
@@ -68,6 +76,7 @@ exports[`Input renders open styling if provided 1`] = `
 
 exports[`Input renders select styling if provided 1`] = `
 <input
+  aria-invalid={false}
   className="c-txt__input c-txt__input--select "
   data-garden-id="textfields.input"
   data-garden-version="version"
@@ -76,6 +85,7 @@ exports[`Input renders select styling if provided 1`] = `
 
 exports[`Input renders small styling if provided 1`] = `
 <input
+  aria-invalid={false}
   className="c-txt__input c-txt__input--sm "
   data-garden-id="textfields.input"
   data-garden-version="version"
@@ -84,6 +94,7 @@ exports[`Input renders small styling if provided 1`] = `
 
 exports[`Input renders tag layout styling if provided 1`] = `
 <input
+  aria-invalid={false}
   className="c-txt__input c-txt__input--tag "
   data-garden-id="textfields.input"
   data-garden-version="version"
@@ -92,6 +103,7 @@ exports[`Input renders tag layout styling if provided 1`] = `
 
 exports[`Input validation renders error styling if provided 1`] = `
 <input
+  aria-invalid={true}
   className="c-txt__input c-txt__input--error "
   data-garden-id="textfields.input"
   data-garden-version="version"
@@ -108,6 +120,7 @@ exports[`Input validation renders none styling if provided 1`] = `
 
 exports[`Input validation renders success styling if provided 1`] = `
 <input
+  aria-invalid={false}
   className="c-txt__input c-txt__input--success "
   data-garden-id="textfields.input"
   data-garden-version="version"
@@ -116,6 +129,7 @@ exports[`Input validation renders success styling if provided 1`] = `
 
 exports[`Input validation renders warning styling if provided 1`] = `
 <input
+  aria-invalid={true}
   className="c-txt__input c-txt__input--warning "
   data-garden-id="textfields.input"
   data-garden-version="version"
diff --git a/packages/textfields/src/views/__snapshots__/Textarea.spec.js.snap b/packages/textfields/src/views/__snapshots__/Textarea.spec.js.snap
index f49c45067fa..429f2196988 100644
--- a/packages/textfields/src/views/__snapshots__/Textarea.spec.js.snap
+++ b/packages/textfields/src/views/__snapshots__/Textarea.spec.js.snap
@@ -8,6 +8,7 @@ exports[`Textarea renders RTL styling 1`] = `
     data-garden-version="version"
   >
     <textarea
+      aria-invalid={false}
       className="c-txt__input--area is-rtl c-txt__input is-rtl "
       data-garden-id="textfields.textarea"
       data-garden-version="version"
@@ -27,6 +28,7 @@ exports[`Textarea renders bare styling if provided 1`] = `
     data-garden-version="version"
   >
     <textarea
+      aria-invalid={false}
       className="c-txt__input--area c-txt__input c-txt__input--bare "
       data-garden-id="textfields.textarea"
       data-garden-version="version"
@@ -43,6 +45,7 @@ exports[`Textarea renders default styling 1`] = `
     data-garden-version="version"
   >
     <textarea
+      aria-invalid={false}
       className="c-txt__input--area c-txt__input "
       data-garden-id="textfields.textarea"
       data-garden-version="version"
@@ -62,6 +65,7 @@ exports[`Textarea renders disabled styling if provided 1`] = `
     disabled={true}
   >
     <textarea
+      aria-invalid={false}
       className="c-txt__input--area c-txt__input is-disabled "
       data-garden-id="textfields.textarea"
       data-garden-version="version"
@@ -82,6 +86,7 @@ exports[`Textarea renders focused styling if provided 1`] = `
     focused={true}
   >
     <textarea
+      aria-invalid={false}
       className="c-txt__input--area c-txt__input is-focused "
       data-garden-id="textfields.textarea"
       data-garden-version="version"
@@ -101,6 +106,7 @@ exports[`Textarea renders hovered styling if provided 1`] = `
     hovered={true}
   >
     <textarea
+      aria-invalid={false}
       className="c-txt__input--area c-txt__input is-hovered "
       data-garden-id="textfields.textarea"
       data-garden-version="version"
@@ -120,6 +126,7 @@ exports[`Textarea renders resizable styling if provided 1`] = `
     resizable={true}
   >
     <textarea
+      aria-invalid={false}
       className="c-txt__input--area is-resizable c-txt__input "
       data-garden-id="textfields.textarea"
       data-garden-version="version"
@@ -139,6 +146,7 @@ exports[`Textarea renders small styling if provided 1`] = `
     small={true}
   >
     <textarea
+      aria-invalid={false}
       className="c-txt__input--area c-txt__input c-txt__input--sm "
       data-garden-id="textfields.textarea"
       data-garden-version="version"
@@ -158,6 +166,7 @@ exports[`Textarea validation renders error styling if provided 1`] = `
     validation="error"
   >
     <textarea
+      aria-invalid={true}
       className="c-txt__input--area c-txt__input c-txt__input--error "
       data-garden-id="textfields.textarea"
       data-garden-version="version"
@@ -196,6 +205,7 @@ exports[`Textarea validation renders success styling if provided 1`] = `
     validation="success"
   >
     <textarea
+      aria-invalid={false}
       className="c-txt__input--area c-txt__input c-txt__input--success "
       data-garden-id="textfields.textarea"
       data-garden-version="version"
@@ -215,6 +225,7 @@ exports[`Textarea validation renders warning styling if provided 1`] = `
     validation="warning"
   >
     <textarea
+      aria-invalid={true}
       className="c-txt__input--area c-txt__input c-txt__input--warning "
       data-garden-id="textfields.textarea"
       data-garden-version="version"
diff --git a/packages/toggles/src/elements/Toggle.js b/packages/toggles/src/elements/Toggle.js
index a4b5ee25114..b80c4f0382d 100644
--- a/packages/toggles/src/elements/Toggle.js
+++ b/packages/toggles/src/elements/Toggle.js
@@ -65,9 +65,17 @@ export default class Toggle extends ControlledComponent {
      */
     const { onMouseDown: onFocusMouseDown, ...checkboxProps } = getFocusProps(checkboxInputProps);
 
+    let isDescribed = false;
+
+    Children.forEach(children, child => {
+      if (hasType(child, Hint)) {
+        isDescribed = true;
+      }
+    });
+
     return (
       <ToggleView {...wrapperProps}>
-        <Input {...getInputProps(checkboxProps)} />
+        <Input {...getInputProps(checkboxProps, { isDescribed })} />
         {Children.map(children, child => {
           if (!isValidElement(child)) {
             return child;
diff --git a/packages/toggles/src/elements/Toggle.spec.js b/packages/toggles/src/elements/Toggle.spec.js
index fd8c9d6e321..8f1c47ee6ee 100644
--- a/packages/toggles/src/elements/Toggle.spec.js
+++ b/packages/toggles/src/elements/Toggle.spec.js
@@ -40,7 +40,7 @@ describe('Toggle', () => {
   });
 
   it('applies container props to Message', () => {
-    expect(wrapper.find(Message)).toHaveProp('id', `${TOGGLE_ID}--message`);
+    expect(wrapper.find(Message)).toHaveProp('role', 'alert');
   });
 
   it('applies no props to any other element', () => {
diff --git a/packages/toggles/src/views/Input.js b/packages/toggles/src/views/Input.js
index d6e15e47005..9fc3b44271a 100644
--- a/packages/toggles/src/views/Input.js
+++ b/packages/toggles/src/views/Input.js
@@ -12,7 +12,7 @@ import CheckboxStyles from '@zendeskgarden/css-forms/dist/checkbox.css';
 const COMPONENT_ID = 'toggles.input';
 
 /**
- * Hidden <input> used to show custom toggle visualization. Accepts all `<input>` props
+ * Hidden `<input>` used to show custom toggle visualization. Accepts all `<input>` props
  */
 const Input = styled.input.attrs({
   'data-garden-id': COMPONENT_ID,
diff --git a/utils/styleguide/styleguide.base.config.js b/utils/styleguide/styleguide.base.config.js
index 5349f2fae98..a6cc93070af 100644
--- a/utils/styleguide/styleguide.base.config.js
+++ b/utils/styleguide/styleguide.base.config.js
@@ -110,7 +110,8 @@ const defaultStyleguideConfig = {
     'babel-polyfill',
     path.resolve(__dirname, 'setup.js'),
     path.resolve(__dirname, 'styles.css'),
-    'github-markdown-css'
+    'github-markdown-css',
+    path.resolve(__dirname, 'github-hljs-theme.css')
   ],
   getExampleFilename(componentPath) {
     return componentPath.replace(/\.jsx?$/u, '.example.md');