diff --git a/js/views/drawerView.js b/js/views/drawerView.js
index 87d8b5a1..5ff14fb2 100644
--- a/js/views/drawerView.js
+++ b/js/views/drawerView.js
@@ -294,8 +294,10 @@ class DrawerView extends Backbone.View {
     Adapt.trigger('drawer:opened');
 
     this.$el.addClass('anim-show-before');
-    // focus on first tabbable element in drawer
-    a11y.focusFirst(this.$el, { defer: true });
+    // focus the drawer dialog itself so its accessible name (aria-labelledby)
+    // is announced once on open; focusing the heading element directly caused
+    // a duplicate announcement (label + focused element)
+    a11y.focus(this.$el, { defer: false });
     await transitionNextFrame();
     this.$el.addClass('anim-show-after');
     await transitionsEnded(this.$el);
diff --git a/templates/drawer.hbs b/templates/drawer.hbs
index 6b6f0a45..7b8731d9 100644
--- a/templates/drawer.hbs
+++ b/templates/drawer.hbs
@@ -1,6 +1,6 @@
 <div class="drawer__inner">
 
-  <span id="drawer-heading" class="aria-label">{{_globals._accessibility._ariaLabels.drawer}}</span>
+  <span id="drawer-heading" class="aria-label" aria-hidden="true">{{_globals._accessibility._ariaLabels.drawer}}</span>
 
   <div class="drawer__toolbar">