diff --git a/content-templates/Example-Template.html b/content-templates/Example-Template.html
index e22469348f..b68aa9bc54 100644
--- a/content-templates/Example-Template.html
+++ b/content-templates/Example-Template.html
@@ -118,7 +118,7 @@ <h2 id="kbd_label">Keyboard Support</h2>
           Use kbd tags,e.g. <kbd>KeyName</kbd>.
           Key names use first-letter caps, e.g., <kbd>Enter</kbd>.
           Single space between multiple Words, e.g., <kbd>Up Arrow</kbd>.
-          Use + to separate modifiers, e.g., <kbd>Control + Right Arrow</kbd>.
+          Use + to separate modifiers, e.g., <kbd>Control</kbd> + <kbd>Right Arrow</kbd>.
           One key per row, e.g., do not combine <kbd>Up Arrow</kbd> and <kbd>Down Arrow</kbd> into a single row.
           Do not use the word "key", e.g., do not write <kbd>Enter Key</kbd> or <kbd>Enter</kbd> key.
         -->
diff --git a/content/patterns/accordion/accordion-pattern.html b/content/patterns/accordion/accordion-pattern.html
index c39f4e1745..6bd2cb18ad 100644
--- a/content/patterns/accordion/accordion-pattern.html
+++ b/content/patterns/accordion/accordion-pattern.html
@@ -59,7 +59,7 @@ <h2>Keyboard Interaction</h2>
             </ul>
           </li>
           <li><kbd>Tab</kbd>: Moves focus to the next focusable element; all focusable elements in the accordion are included in the page <kbd>Tab</kbd> sequence.</li>
-          <li><kbd>Shift + Tab</kbd>: Moves focus to the previous focusable element; all focusable elements in the accordion are included in the page <kbd>Tab</kbd> sequence.</li>
+          <li><kbd>Shift</kbd> + <kbd>Tab</kbd>: Moves focus to the previous focusable element; all focusable elements in the accordion are included in the page <kbd>Tab</kbd> sequence.</li>
           <li>
             <kbd>Down Arrow</kbd> (Optional): If focus is on an accordion header, moves focus to the next accordion header.
             If focus is on the last accordion header, either does nothing or moves focus to the first accordion header.
diff --git a/content/patterns/accordion/examples/accordion.html b/content/patterns/accordion/examples/accordion.html
index 7eca23f625..e7510a1c6a 100644
--- a/content/patterns/accordion/examples/accordion.html
+++ b/content/patterns/accordion/examples/accordion.html
@@ -175,7 +175,7 @@ <h2 id="kbd_label">Keyboard Support</h2>
               </td>
             </tr>
             <tr data-test-id="key-shift-tab">
-              <th><kbd>Shift + Tab</kbd></th>
+              <th><kbd>Shift</kbd> + <kbd>Tab</kbd></th>
               <td>
                 <ul>
                   <li>Moves focus to the previous focusable element.</li>
diff --git a/content/patterns/alertdialog/examples/alertdialog.html b/content/patterns/alertdialog/examples/alertdialog.html
index 239e66c412..985e76fb31 100644
--- a/content/patterns/alertdialog/examples/alertdialog.html
+++ b/content/patterns/alertdialog/examples/alertdialog.html
@@ -134,7 +134,7 @@ <h2 id="kbd_label">Keyboard Support</h2>
               </td>
             </tr>
             <tr>
-              <th><kbd>Shift + Tab</kbd></th>
+              <th><kbd>Shift</kbd> + <kbd>Tab</kbd></th>
               <td>
                 <ul>
                   <li>Moves focus to previous focusable element inside the dialog.</li>
@@ -147,11 +147,11 @@ <h2 id="kbd_label">Keyboard Support</h2>
               <td>Closes the dialog.</td>
             </tr>
             <tr>
-              <th><kbd>Command + S</kbd></th>
+              <th><kbd>Command</kbd> + <kbd>S</kbd></th>
               <td>(Mac only) Save the contents of the notes <code>textarea</code> when focused.</td>
             </tr>
             <tr data-test-id="key-control-s">
-              <th><kbd>Control + S</kbd></th>
+              <th><kbd>Control</kbd> + <kbd>S</kbd></th>
               <td>(Windows only) Save the contents of the notes <code>textarea</code> when focused.</td>
             </tr>
           </tbody>
diff --git a/content/patterns/button/button-pattern.html b/content/patterns/button/button-pattern.html
index 65fabaf965..380085ce81 100644
--- a/content/patterns/button/button-pattern.html
+++ b/content/patterns/button/button-pattern.html
@@ -80,7 +80,7 @@ <h2>Keyboard Interaction</h2>
               <li>If the button action indicates a context change, such as move to next step in a wizard or add another search criteria, then it is often appropriate to move focus to the starting point for that action.</li>
               <li>
                 If the button is activated with a shortcut key, the focus usually remains in the context from which the shortcut key was activated.
-                For example, if <kbd>Alt + U</kbd> were assigned to an &quot;Up&quot; button that moves the currently focused item in a list one position higher in the list, pressing <kbd>Alt + U</kbd> when the focus is in the list would not move the focus from the list.
+                For example, if <kbd>Alt</kbd> + <kbd>U</kbd> were assigned to an &quot;Up&quot; button that moves the currently focused item in a list one position higher in the list, pressing <kbd>Alt</kbd> + <kbd>U</kbd> when the focus is in the list would not move the focus from the list.
               </li>
             </ul>
           </li>
diff --git a/content/patterns/carousel/carousel-pattern.html b/content/patterns/carousel/carousel-pattern.html
index 1388a086d4..a9c17cb2f4 100644
--- a/content/patterns/carousel/carousel-pattern.html
+++ b/content/patterns/carousel/carousel-pattern.html
@@ -86,7 +86,7 @@ <h2>Keyboard Interaction</h2>
             If the carousel has an auto-rotate feature, automatic slide rotation stops when any element in the carousel receives keyboard focus.
             It does not resume unless the user activates the rotation control.
           </li>
-          <li><kbd>Tab</kbd> and <kbd>Shift + Tab</kbd>: Move focus through the interactive elements of the carousel as specified by the page tab sequence -- scripting for <kbd>Tab</kbd> is not necessary.</li>
+          <li><kbd>Tab</kbd> and <kbd>Shift</kbd> + <kbd>Tab</kbd>: Move focus through the interactive elements of the carousel as specified by the page tab sequence -- scripting for <kbd>Tab</kbd> is not necessary.</li>
           <li>
             Button elements implement the keyboard interaction defined in the <a href="../button/button-pattern.html">button pattern</a>.
             Note: Activating the rotation control, next slide, and previous slide do not move focus, so users may easily repetitively activate them as many times as desired.
diff --git a/content/patterns/combobox/combobox-pattern.html b/content/patterns/combobox/combobox-pattern.html
index a243b50429..ec5e2d4bab 100644
--- a/content/patterns/combobox/combobox-pattern.html
+++ b/content/patterns/combobox/combobox-pattern.html
@@ -148,9 +148,9 @@ <h3>Combobox Keyboard Interaction</h3>
             </ul>
           </li>
           <li>If the combobox is editable, it supports standard single line text editing keys appropriate for the device platform (see note below).</li>
-          <li><kbd>Alt + Down Arrow</kbd> (Optional): If the popup is available but not displayed, displays the popup without moving focus.</li>
+          <li><kbd>Alt</kbd> + <kbd>Down Arrow</kbd> (Optional): If the popup is available but not displayed, displays the popup without moving focus.</li>
           <li>
-            <kbd>Alt + Up Arrow</kbd> (Optional): If the popup is displayed:
+            <kbd>Alt</kbd> + <kbd>Up Arrow</kbd> (Optional): If the popup is displayed:
             <ul>
               <li>If the popup contains focus, returns focus to the combobox.</li>
               <li>Closes the popup.</li>
@@ -270,8 +270,8 @@ <h3>Grid Popup Keyboard Interaction</h3>
               <li>If the combobox is editable, returns focus to the combobox and places the cursor after the last character.</li>
             </ul>
           </li>
-          <li><kbd>Control + Home</kbd> (optional): moves focus to the first row.</li>
-          <li><kbd>Control + End</kbd> (Optional): moves focus to the last row.</li>
+          <li><kbd>Control</kbd> + <kbd>Home</kbd> (optional): moves focus to the first row.</li>
+          <li><kbd>Control</kbd> + <kbd>End</kbd> (Optional): moves focus to the last row.</li>
           <li>Any printable character: If the combobox is editable, returns the focus to the combobox without closing the popup and types the character.</li>
           <li><kbd>Backspace</kbd> (Optional): If the combobox is editable, returns focus to the combobox and deletes the character prior to the cursor.</li>
           <li><kbd>Delete</kbd> (Optional): If the combobox is editable, returns focus to the combobox, removes the selected state if a suggestion was selected, and removes the inline autocomplete string if present.</li>
diff --git a/content/patterns/combobox/examples/combobox-autocomplete-both.html b/content/patterns/combobox/examples/combobox-autocomplete-both.html
index 26a87a6dab..8092e32929 100644
--- a/content/patterns/combobox/examples/combobox-autocomplete-both.html
+++ b/content/patterns/combobox/examples/combobox-autocomplete-both.html
@@ -186,7 +186,7 @@ <h3 id="kbd_label_textbox">Textbox</h3>
               </td>
             </tr>
             <tr data-test-id="textbox-key-alt-down-arrow">
-              <th><kbd>Alt + Down Arrow</kbd></th>
+              <th><kbd>Alt</kbd> + <kbd>Down Arrow</kbd></th>
               <td>Opens the listbox without moving focus or changing selection.</td>
             </tr>
             <tr data-test-id="textbox-key-up-arrow">
@@ -221,7 +221,7 @@ <h3 id="kbd_label_textbox">Textbox</h3>
               <th>Standard single line text editing keys</th>
               <td>
                 <ul>
-                  <li>Keys used for cursor movement and text manipulation, such as <kbd>Delete</kbd> and <kbd>Shift + Right Arrow</kbd>.</li>
+                  <li>Keys used for cursor movement and text manipulation, such as <kbd>Delete</kbd> and <kbd>Shift</kbd> + <kbd>Right Arrow</kbd>.</li>
                   <li>An HTML <code>input</code> with <code>type="text"</code> is used for the textbox so the browser will provide platform-specific editing keys.</li>
                 </ul>
               </td>
diff --git a/content/patterns/combobox/examples/combobox-autocomplete-list.html b/content/patterns/combobox/examples/combobox-autocomplete-list.html
index fc47b07e34..c1f0e1bb45 100644
--- a/content/patterns/combobox/examples/combobox-autocomplete-list.html
+++ b/content/patterns/combobox/examples/combobox-autocomplete-list.html
@@ -185,7 +185,7 @@ <h3 id="kbd_label_textbox">Textbox</h3>
               </td>
             </tr>
             <tr data-test-id="textbox-key-alt-down-arrow">
-              <th><kbd>Alt + Down Arrow</kbd></th>
+              <th><kbd>Alt</kbd> + <kbd>Down Arrow</kbd></th>
               <td>Opens the listbox without moving focus or changing selection.</td>
             </tr>
             <tr data-test-id="textbox-key-up-arrow">
@@ -215,7 +215,7 @@ <h3 id="kbd_label_textbox">Textbox</h3>
               <th>Standard single line text editing keys</th>
               <td>
                 <ul>
-                  <li>Keys used for cursor movement and text manipulation, such as <kbd>Delete</kbd> and <kbd>Shift + Right Arrow</kbd>.</li>
+                  <li>Keys used for cursor movement and text manipulation, such as <kbd>Delete</kbd> and <kbd>Shift</kbd> + <kbd>Right Arrow</kbd>.</li>
                   <li>An HTML <code>input</code> with <code>type="text"</code> is used for the textbox so the browser will provide platform-specific editing keys.</li>
                 </ul>
               </td>
diff --git a/content/patterns/combobox/examples/combobox-autocomplete-none.html b/content/patterns/combobox/examples/combobox-autocomplete-none.html
index 9503c57bef..8f5a6142f9 100644
--- a/content/patterns/combobox/examples/combobox-autocomplete-none.html
+++ b/content/patterns/combobox/examples/combobox-autocomplete-none.html
@@ -138,7 +138,7 @@ <h3 id="kbd_label_textbox">Textbox</h3>
               </td>
             </tr>
             <tr data-test-id="textbox-key-alt-down-arrow">
-              <th><kbd>Alt + Down Arrow</kbd></th>
+              <th><kbd>Alt</kbd> + <kbd>Down Arrow</kbd></th>
               <td>Opens the listbox without moving focus or changing selection.</td>
             </tr>
             <tr data-test-id="textbox-key-up-arrow">
@@ -158,7 +158,7 @@ <h3 id="kbd_label_textbox">Textbox</h3>
               <th>Standard single line text editing keys</th>
               <td>
                 <ul>
-                  <li>Keys used for cursor movement and text manipulation, such as <kbd>Delete</kbd> and <kbd>Shift + Right Arrow</kbd>.</li>
+                  <li>Keys used for cursor movement and text manipulation, such as <kbd>Delete</kbd> and <kbd>Shift</kbd> + <kbd>Right Arrow</kbd>.</li>
                   <li>An HTML <code>input</code> with <code>type="text"</code> is used for the textbox so the browser will provide platform-specific editing keys.</li>
                 </ul>
               </td>
diff --git a/content/patterns/combobox/examples/combobox-datepicker.html b/content/patterns/combobox/examples/combobox-datepicker.html
index 3fc085a474..0bee5feba8 100644
--- a/content/patterns/combobox/examples/combobox-datepicker.html
+++ b/content/patterns/combobox/examples/combobox-datepicker.html
@@ -33,7 +33,7 @@ <h2>About This Example</h2>
         <img alt="" class="example-page-example-icon" src="../../../images/pattern-combobox.svg">
         <p>
           The below date picker demonstrates an implementation of the <a href="../combobox-pattern.html">Combobox Pattern</a> that opens a dialog.
-          The date picker dialog is opened by activating the choose date button or by moving keyboard focus to the combobox and pressing <kbd>Down Arrow</kbd> or <kbd>Alt + Down Arrow</kbd>.
+          The date picker dialog is opened by activating the choose date button or by moving keyboard focus to the combobox and pressing <kbd>Down Arrow</kbd> or <kbd>Alt</kbd> + <kbd>Down Arrow</kbd>.
           The dialog contains an implementation of the <a href="../../grid/grid-pattern.html">grid pattern</a> for displaying a calendar and enabling selection of a date.
           Additional buttons in the dialog are available for changing the month and year shown in the grid.
         </p>
@@ -220,7 +220,7 @@ <h3 id="kbd_label_1">Combobox</h3>
             </thead>
             <tbody>
               <tr data-test-id="combobox-down-arrow">
-                <th><kbd>Down Arrow</kbd>,<br><kbd>ALT + Down Arrow</kbd></th>
+                <th><kbd>Down Arrow</kbd>,<br><kbd>ALT</kbd> + <kbd>Down Arrow</kbd></th>
                 <td>
                   <ul>
                     <li>Open the date picker dialog.</li>
@@ -260,7 +260,7 @@ <h3 id="kbd_label_3">Date Picker Dialog</h3>
                 </td>
               </tr>
               <tr data-test-id="dialog-shift-tab">
-                <th><kbd>Shift + TAB</kbd></th>
+                <th><kbd>Shift</kbd> + <kbd>TAB</kbd></th>
                 <td>
                   <ul>
                     <li>Moves focus to previous element in the dialog <kbd>Tab</kbd> sequence.</li>
diff --git a/content/patterns/combobox/examples/combobox-select-only.html b/content/patterns/combobox/examples/combobox-select-only.html
index 4f11120a67..4de9d0224b 100644
--- a/content/patterns/combobox/examples/combobox-select-only.html
+++ b/content/patterns/combobox/examples/combobox-select-only.html
@@ -109,7 +109,7 @@ <h3 id="kbd_label_combobox">Closed Combobox</h3>
               </td>
             </tr>
             <tr data-test-id="combobox-key-alt-down-arrow">
-              <th><kbd>Alt + Down Arrow</kbd></th>
+              <th><kbd>Alt</kbd> + <kbd>Down Arrow</kbd></th>
               <td>Opens the listbox without moving focus or changing selection.</td>
             </tr>
             <tr data-test-id="combobox-key-up-arrow">
@@ -226,7 +226,7 @@ <h3 id="kbd_label_listbox">Listbox Popup</h3>
               </td>
             </tr>
             <tr data-test-id="listbox-key-alt-up-arrow">
-              <th><kbd>Alt + Up Arrow</kbd></th>
+              <th><kbd>Alt</kbd> + <kbd>Up Arrow</kbd></th>
               <td>
                 <ul>
                   <li>Sets the value to the content of the focused option in the listbox.</li>
diff --git a/content/patterns/combobox/examples/grid-combo.html b/content/patterns/combobox/examples/grid-combo.html
index 9907c5587a..268be05fc9 100644
--- a/content/patterns/combobox/examples/grid-combo.html
+++ b/content/patterns/combobox/examples/grid-combo.html
@@ -116,7 +116,7 @@ <h3 id="kbd_label_textbox">Textbox</h3>
               <th>Standard single line text editing keys</th>
               <td>
                 <ul>
-                  <li>Keys used for cursor movement and text manipulation, such as <kbd>Delete</kbd> and <kbd>Shift + Right Arrow</kbd>.</li>
+                  <li>Keys used for cursor movement and text manipulation, such as <kbd>Delete</kbd> and <kbd>Shift</kbd> + <kbd>Right Arrow</kbd>.</li>
                   <li>
                     An HTML <code>input</code> with <code>type=<q>text</q></code> is used for the textbox so the browser will provide platform-specific editing keys.
                   </li>
diff --git a/content/patterns/dialog-modal/dialog-modal-pattern.html b/content/patterns/dialog-modal/dialog-modal-pattern.html
index b600de8f68..ba37954138 100644
--- a/content/patterns/dialog-modal/dialog-modal-pattern.html
+++ b/content/patterns/dialog-modal/dialog-modal-pattern.html
@@ -26,7 +26,7 @@ <h2>About This Pattern</h2>
         </p>
         <p>
           Like non-modal dialogs, modal dialogs contain their tab sequence.
-          That is, <kbd>Tab</kbd> and <kbd>Shift + Tab</kbd> do not move focus outside the dialog.
+          That is, <kbd>Tab</kbd> and <kbd>Shift</kbd> + <kbd>Tab</kbd> do not move focus outside the dialog.
           However, unlike most non-modal dialogs, modal dialogs do not provide means for moving keyboard focus outside the dialog window without closing the dialog.
         </p>
         <p>
@@ -63,7 +63,7 @@ <h2>Keyboard Interaction</h2>
             </ul>
           </li>
           <li>
-            <kbd>Shift + Tab</kbd>:
+            <kbd>Shift</kbd> + <kbd>Tab</kbd>:
             <ul>
               <li>Moves focus to the previous tabbable element inside the dialog.</li>
               <li>If focus is on the first tabbable element inside the dialog, moves focus to the last tabbable element inside the dialog.</li>
diff --git a/content/patterns/dialog-modal/examples/datepicker-dialog.html b/content/patterns/dialog-modal/examples/datepicker-dialog.html
index 59ac1de487..21fc5b9ddb 100644
--- a/content/patterns/dialog-modal/examples/datepicker-dialog.html
+++ b/content/patterns/dialog-modal/examples/datepicker-dialog.html
@@ -252,7 +252,7 @@ <h3 id="kbd_label_3">Date Picker Dialog</h3>
                 </td>
               </tr>
               <tr data-test-id="dialog-shift-tab">
-                <th><kbd>Shift + Tab</kbd></th>
+                <th><kbd>Shift</kbd> + <kbd>Tab</kbd></th>
                 <td>
                   <ul>
                     <li>Moves focus to previous element in the dialog <kbd>Tab</kbd> sequence.</li>
@@ -340,7 +340,7 @@ <h3 id="kbd_label_5">Date Picker Dialog: Date Grid</h3>
                 </td>
               </tr>
               <tr data-test-id="grid-shift-pageup">
-                <th><kbd>Shift + Page Up</kbd></th>
+                <th><kbd>Shift</kbd> + <kbd>Page Up</kbd></th>
                 <td>
                   <ul>
                     <li>Changes the grid of dates to the same month in the previous year.</li>
@@ -364,7 +364,7 @@ <h3 id="kbd_label_5">Date Picker Dialog: Date Grid</h3>
                 </td>
               </tr>
               <tr data-test-id="grid-shift-pagedown">
-                <th><kbd>Shift + Page Down</kbd></th>
+                <th><kbd>Shift</kbd> + <kbd>Page Down</kbd></th>
                 <td>
                   <ul>
                     <li>Changes the grid of dates to the same month in the next year.</li>
diff --git a/content/patterns/dialog-modal/examples/dialog.html b/content/patterns/dialog-modal/examples/dialog.html
index de5244f42a..79949f011b 100644
--- a/content/patterns/dialog-modal/examples/dialog.html
+++ b/content/patterns/dialog-modal/examples/dialog.html
@@ -244,7 +244,7 @@ <h2 id="kbd_label">Keyboard Support</h2>
               </td>
             </tr>
             <tr data-test-id="key-shift-tab">
-              <th><kbd>Shift + Tab</kbd></th>
+              <th><kbd>Shift</kbd> + <kbd>Tab</kbd></th>
               <td>
                 <ul>
                   <li>Moves focus to previous focusable element inside the dialog.</li>
diff --git a/content/patterns/disclosure/examples/disclosure-navigation-hybrid.html b/content/patterns/disclosure/examples/disclosure-navigation-hybrid.html
index 9aebeeedd2..e18df93551 100644
--- a/content/patterns/disclosure/examples/disclosure-navigation-hybrid.html
+++ b/content/patterns/disclosure/examples/disclosure-navigation-hybrid.html
@@ -203,7 +203,7 @@ <h2 id="kbd_label">Keyboard Support</h2>
             <tr data-test-id="key-tab">
               <th>
                 <kbd>Tab</kbd><br>
-                <kbd>Shift + Tab</kbd>
+                <kbd>Shift</kbd> + <kbd>Tab</kbd>
               </th>
               <td>Move keyboard focus among top-level links and buttons, and if a dropdown is open, through links in the dropdown.</td>
             </tr>
diff --git a/content/patterns/disclosure/examples/disclosure-navigation.html b/content/patterns/disclosure/examples/disclosure-navigation.html
index 4e3c7caafb..734b76773d 100644
--- a/content/patterns/disclosure/examples/disclosure-navigation.html
+++ b/content/patterns/disclosure/examples/disclosure-navigation.html
@@ -198,7 +198,7 @@ <h2 id="kbd_label">Keyboard Support</h2>
             <tr data-test-id="key-tab">
               <th>
                 <kbd>Tab</kbd><br>
-                <kbd>Shift + Tab</kbd>
+                <kbd>Shift</kbd> + <kbd>Tab</kbd>
               </th>
               <td>Move keyboard focus among top-level buttons, and if a dropdown is open, into and through links in the dropdown.</td>
             </tr>
diff --git a/content/patterns/feed/examples/feed.html b/content/patterns/feed/examples/feed.html
index 907a35dab9..e92c87312d 100644
--- a/content/patterns/feed/examples/feed.html
+++ b/content/patterns/feed/examples/feed.html
@@ -81,11 +81,11 @@ <h2 id="kbd_label">Keyboard Support</h2>
               <td>Move focus to previous article.</td>
             </tr>
             <tr data-test-id="key-control-end">
-              <th><kbd>Control + End</kbd></th>
+              <th><kbd>Control</kbd> + <kbd>End</kbd></th>
               <td>Move focus to the first focusable element after the feed.</td>
             </tr>
             <tr data-test-id="key-control-home">
-              <th><kbd>Control + Home</kbd></th>
+              <th><kbd>Control</kbd> + <kbd>Home</kbd></th>
               <td>Move focus to the first focusable element in the feed.</td>
             </tr>
           </tbody>
diff --git a/content/patterns/feed/feed-pattern.html b/content/patterns/feed/feed-pattern.html
index 7ae27f47f0..b4bcc0d1d1 100644
--- a/content/patterns/feed/feed-pattern.html
+++ b/content/patterns/feed/feed-pattern.html
@@ -79,8 +79,8 @@ <h2>Keyboard Interaction</h2>
         <ul>
           <li><kbd>Page Down</kbd>: Move focus to next article.</li>
           <li><kbd>Page Up</kbd>: Move focus to previous article.</li>
-          <li><kbd>Control + End</kbd>: Move focus to the first focusable element after the feed.</li>
-          <li><kbd>Control + Home</kbd>: Move focus to the first focusable element before the feed.</li>
+          <li><kbd>Control</kbd> + <kbd>End</kbd>: Move focus to the first focusable element after the feed.</li>
+          <li><kbd>Control</kbd> + <kbd>Home</kbd>: Move focus to the first focusable element before the feed.</li>
         </ul>
         <div class="note">
           <h3>Note</h3>
@@ -96,8 +96,8 @@ <h3>Note</h3>
                   Users move focus into the nested feed from the content of the containing article with <kbd>Tab</kbd>.
                   This may be slow if the article contains a significant number of links, buttons, or other widgets.
                 </li>
-                <li>Provide a key for moving focus from the elements in the containing article to the first item in the nested feed, e.g., <kbd>Alt + Page Down</kbd>.</li>
-                <li>To continue reading the outer feed, <kbd>Control + End</kbd> moves focus to the next article in the outer feed.</li>
+                <li>Provide a key for moving focus from the elements in the containing article to the first item in the nested feed, e.g., <kbd>Alt</kbd> + <kbd>Page Down</kbd>.</li>
+                <li>To continue reading the outer feed, <kbd>Control</kbd> + <kbd>End</kbd> moves focus to the next article in the outer feed.</li>
               </ul>
             </li>
             <li>In the rare circumstance that a feed article contains a widget that uses the above suggested keys, the feed navigation key will operate the contained widget, and the user needs to move focus to an element that does not utilize the feed navigation keys in order to navigate the feed.</li>
diff --git a/content/patterns/grid/examples/data-grids.html b/content/patterns/grid/examples/data-grids.html
index 36d0c4c98b..078472b72f 100644
--- a/content/patterns/grid/examples/data-grids.html
+++ b/content/patterns/grid/examples/data-grids.html
@@ -123,7 +123,7 @@ <h4 id="grid1Label">Transactions January 1 through January 6</h4>
           <div role="separator" id="ex1_end_sep" aria-labelledby="ex1_end_sep ex1_label" aria-label="End of"></div>
           <h4>Notes</h4>
           <ol>
-            <li>Data cells can be focused using standard navigation keys, including directional arrows, <kbd>Home</kbd>, <kbd>End</kbd>, <kbd>Control + Home</kbd>, and <kbd>Control + End</kbd>.</li>
+            <li>Data cells can be focused using standard navigation keys, including directional arrows, <kbd>Home</kbd>, <kbd>End</kbd>, <kbd>Control</kbd> + <kbd>Home</kbd>, and <kbd>Control</kbd> + <kbd>End</kbd>.</li>
             <li>The <kbd>Page Down</kbd> and <kbd>Page Up</kbd> keys are not supported since such scroll-like functions are not useful with so few rows.</li>
             <li>The links can be activated with the keyboard when focused.</li>
             <li>
@@ -594,13 +594,13 @@ <h2 id="kbd_label">Keyboard Support</h2>
           </tr>
           <tr data-test-id="key-control-home">
             <th scope="row">
-              <kbd>Control + Home</kbd>
+              <kbd>Control</kbd> + <kbd>Home</kbd>
             </th>
             <td>moves focus to the first cell in the first row.</td>
           </tr>
           <tr data-test-id="key-control-end">
             <th scope="row">
-              <kbd>Control + End</kbd>
+              <kbd>Control</kbd> + <kbd>End</kbd>
             </th>
             <td>moves focus to the last cell in the last row.</td>
           </tr>
diff --git a/content/patterns/grid/examples/layout-grids.html b/content/patterns/grid/examples/layout-grids.html
index 2642136f85..53d1a1fc16 100644
--- a/content/patterns/grid/examples/layout-grids.html
+++ b/content/patterns/grid/examples/layout-grids.html
@@ -501,13 +501,13 @@ <h2 id="kbd_label">Keyboard Support</h2>
             </tr>
             <tr data-test-id="key-control-home">
               <th>
-                <kbd>Control + Home</kbd>
+                <kbd>Control</kbd> + <kbd>Home</kbd>
               </th>
               <td>Moves focus to the first cell in the first row.</td>
             </tr>
             <tr data-test-id="key-control-end">
               <th>
-                <kbd>Control + End</kbd>
+                <kbd>Control</kbd> + <kbd>End</kbd>
               </th>
               <td>Moves focus to the last cell in the last row.</td>
             </tr>
diff --git a/content/patterns/grid/grid-pattern.html b/content/patterns/grid/grid-pattern.html
index 7becf71747..eec44961f9 100644
--- a/content/patterns/grid/grid-pattern.html
+++ b/content/patterns/grid/grid-pattern.html
@@ -109,8 +109,8 @@ <h3>Keyboard Interaction For Data Grids</h3>
             </li>
             <li><kbd>Home</kbd>: moves focus to the first cell in the row that contains focus.</li>
             <li><kbd>End</kbd>: moves focus to the last cell in the row that contains focus.</li>
-            <li><kbd>Control + Home</kbd>: moves focus to the first cell in the first row.</li>
-            <li><kbd>Control + End</kbd>: moves focus to the last cell in the last row.</li>
+            <li><kbd>Control</kbd> + <kbd>Home</kbd>: moves focus to the first cell in the first row.</li>
+            <li><kbd>Control</kbd> + <kbd>End</kbd>: moves focus to the last cell in the last row.</li>
           </ul>
           <div class="note">
             <h4>Note</h4>
@@ -123,21 +123,21 @@ <h4>Note</h4>
                 While navigation keys, such as arrow keys, are moving focus from cell to cell, they are not available to do something like operate a combobox or move an editing caret inside of a cell.
                 If this functionality is needed, see <a href="#gridNav_inside">Editing and Navigating Inside a Cell</a>.
               </li>
-              <li>If navigation functions can dynamically add more rows or columns to the DOM, key events that move focus to the beginning or end of the grid, such as <kbd>Control + End</kbd>, may move focus to the last row in the DOM rather than the last available row in the back-end data.</li>
+              <li>If navigation functions can dynamically add more rows or columns to the DOM, key events that move focus to the beginning or end of the grid, such as <kbd>Control</kbd> + <kbd>End</kbd>, may move focus to the last row in the DOM rather than the last available row in the back-end data.</li>
             </ul>
           </div>
           <p>If a grid supports selection of cells, rows, or columns, the following keys are commonly used for these functions.</p>
           <ul>
-            <li><kbd>Control + Space</kbd>: selects the column that contains the focus.</li>
+            <li><kbd>Control</kbd> + <kbd>Space</kbd>: selects the column that contains the focus.</li>
             <li>
-              <kbd>Shift + Space</kbd>: Selects the row that contains the focus.
+              <kbd>Shift</kbd> + <kbd>Space</kbd>: Selects the row that contains the focus.
               If the grid includes a column with checkboxes for selecting rows, this key can serve as a shortcut for checking the box when focus is not on the checkbox.
             </li>
-            <li><kbd>Control + A</kbd>: Selects all cells.</li>
-            <li><kbd>Shift + Right Arrow</kbd>: Extends selection one cell to the right.</li>
-            <li><kbd>Shift + Left Arrow</kbd>: Extends selection one cell to the left.</li>
-            <li><kbd>Shift + Down Arrow</kbd>: Extends selection one cell down.</li>
-            <li><kbd>Shift + Up Arrow</kbd>: Extends selection one cell up.</li>
+            <li><kbd>Control</kbd> + <kbd>A</kbd>: Selects all cells.</li>
+            <li><kbd>Shift</kbd> + <kbd>Right Arrow</kbd>: Extends selection one cell to the right.</li>
+            <li><kbd>Shift</kbd> + <kbd>Left Arrow</kbd>: Extends selection one cell to the left.</li>
+            <li><kbd>Shift</kbd> + <kbd>Down Arrow</kbd>: Extends selection one cell down.</li>
+            <li><kbd>Shift</kbd> + <kbd>Up Arrow</kbd>: Extends selection one cell up.</li>
           </ul>
           <div class="note">
             <h5>Note</h5>
@@ -215,8 +215,8 @@ <h3>Keyboard Interaction For Layout Grids</h3>
               <kbd>End</kbd>: moves focus to the last cell in the row that contains focus.
               Optionally, if the grid has a single column or fewer than three cells per row, focus may instead move to the last cell in the grid.
             </li>
-            <li><kbd>Control + Home</kbd> (optional): moves focus to the first cell in the first row.</li>
-            <li><kbd>Control + End</kbd> (Optional): moves focus to the last cell in the last row.</li>
+            <li><kbd>Control</kbd> + <kbd>Home</kbd> (optional): moves focus to the first cell in the first row.</li>
+            <li><kbd>Control</kbd> + <kbd>End</kbd> (Optional): moves focus to the last cell in the last row.</li>
           </ul>
           <div class="note">
             <h4>Note</h4>
@@ -229,7 +229,7 @@ <h4>Note</h4>
                 While navigation keys, such as arrow keys, are moving focus from cell to cell, they are not available to do something like operate a combobox or move an editing caret inside of a cell.
                 If this functionality is needed, see <a href="#gridNav_inside">Editing and Navigating Inside a Cell</a>.
               </li>
-              <li>If navigation functions can dynamically add more rows or columns to the DOM, key events that move focus to the beginning or end of the grid, such as <kbd>control + End</kbd>, may move focus to the last row in the DOM rather than the last available row in the back-end data.</li>
+              <li>If navigation functions can dynamically add more rows or columns to the DOM, key events that move focus to the beginning or end of the grid, such as <kbd>control</kbd> + <kbd>End</kbd>, may move focus to the last row in the DOM rather than the last available row in the back-end data.</li>
             </ul>
           </div>
           <p>
@@ -238,16 +238,16 @@ <h4>Note</h4>
           </p>
 
           <ul>
-            <li><kbd>Control + Space</kbd>: selects the column that contains the focus.</li>
+            <li><kbd>Control</kbd> + <kbd>Space</kbd>: selects the column that contains the focus.</li>
             <li>
-              <kbd>Shift + Space</kbd>: Selects the row that contains the focus.
+              <kbd>Shift</kbd> + <kbd>Space</kbd>: Selects the row that contains the focus.
               If the grid includes a column with checkboxes for selecting rows, this key can serve as a shortcut for checking the box when focus is not on the checkbox.
             </li>
-            <li><kbd>Control + A</kbd>: Selects all cells.</li>
-            <li><kbd>Shift + Right Arrow</kbd>: Extends selection one cell to the right.</li>
-            <li><kbd>Shift + Left Arrow</kbd>: Extends selection one cell to the left.</li>
-            <li><kbd>Shift + Down Arrow</kbd>: Extends selection one cell down.</li>
-            <li><kbd>Shift + Up Arrow</kbd>: Extends selection one cell up.</li>
+            <li><kbd>Control</kbd> + <kbd>A</kbd>: Selects all cells.</li>
+            <li><kbd>Shift</kbd> + <kbd>Right Arrow</kbd>: Extends selection one cell to the right.</li>
+            <li><kbd>Shift</kbd> + <kbd>Left Arrow</kbd>: Extends selection one cell to the left.</li>
+            <li><kbd>Shift</kbd> + <kbd>Down Arrow</kbd>: Extends selection one cell down.</li>
+            <li><kbd>Shift</kbd> + <kbd>Up Arrow</kbd>: Extends selection one cell up.</li>
           </ul>
           <div class="note">
             <h4>Note</h4>
@@ -354,7 +354,7 @@ <h3>Editing and Navigating Inside a Cell</h3>
               Optionally, the focus movement may wrap inside a single cell or within the grid itself.
             </li>
             <li>
-              <kbd>Shift + Tab</kbd>: moves focus to the previous widget in the grid.
+              <kbd>Shift</kbd> + <kbd>Tab</kbd>: moves focus to the previous widget in the grid.
               Optionally, the focus movement may wrap inside a single cell or within the grid itself.
             </li>
           </ul>
diff --git a/content/patterns/landmarks/examples/at.html b/content/patterns/landmarks/examples/at.html
index ccec4ccfaa..97d1da8759 100644
--- a/content/patterns/landmarks/examples/at.html
+++ b/content/patterns/landmarks/examples/at.html
@@ -192,7 +192,7 @@ <h2 id="orca">ORCA Screen Reader for Linux/GNOME</h2>
             <section>
               <h2 id="skipto">SkipTo Landmarks &amp; Headings Browser Extension</h2>
 
-              <p>The SkipTo Landmarks &amp; Headings browser extension implements the <a href="https://www.w3.org/TR/UAAG/">User Agent Accessibility Guidelines 1.0</a> requirement <q><a href="https://www.w3.org/TR/UAAG/guidelines.html#tech-nav-structure">9.9 Allow Structured Navigation</a></q>. It does this by providing keyboard navigation to landmarks and headings on any web page.  The keyboard shortcut to open the SkipTo menu is <kbd>alt+2</kbd> on Windows/Linux and <kbd>option+2</kbd> on Mac keyboards.</p>
+              <p>The SkipTo Landmarks &amp; Headings browser extension implements the <a href="https://www.w3.org/TR/UAAG/">User Agent Accessibility Guidelines 1.0</a> requirement <q><a href="https://www.w3.org/TR/UAAG/guidelines.html#tech-nav-structure">9.9 Allow Structured Navigation</a></q>. It does this by providing keyboard navigation to landmarks and headings on any web page.  The keyboard shortcut to open the SkipTo menu is <kbd>alt</kbd> + <kbd>2</kbd> on Windows/Linux and <kbd>option</kbd> + <kbd>2</kbd> on Mac keyboards.</p>
 
               <ul style="margin-top: 1em">
                 <li><a href="https://chrome.google.com/webstore/detail/skipto-landmarks-headings/fjkpbfcodhflpdildjbmdhhmcoplghgf">Chrome Extension: Skip to Landmarks &amp; Headings</a></li>
diff --git a/content/patterns/link/link-pattern.html b/content/patterns/link/link-pattern.html
index 1b18f20ce4..21d92f9e89 100644
--- a/content/patterns/link/link-pattern.html
+++ b/content/patterns/link/link-pattern.html
@@ -40,7 +40,7 @@ <h2>Examples</h2>
         <h2>Keyboard Interaction</h2>
         <ul>
           <li><kbd>Enter</kbd>: Executes the link and moves focus to the link target.</li>
-          <li><kbd>Shift + F10</kbd> (Optional): Opens a context menu for the link.</li>
+          <li><kbd>Shift</kbd> + <kbd>F10</kbd> (Optional): Opens a context menu for the link.</li>
         </ul>
       </section>
 
diff --git a/content/patterns/listbox/examples/listbox-rearrangeable.html b/content/patterns/listbox/examples/listbox-rearrangeable.html
index bce043d135..22152fcd18 100644
--- a/content/patterns/listbox/examples/listbox-rearrangeable.html
+++ b/content/patterns/listbox/examples/listbox-rearrangeable.html
@@ -243,8 +243,8 @@ <h2>Accessibility Features</h2>
               <li>
                 Action buttons have the following shortcuts:
                 <ul>
-                  <li>"Up": <kbd>Alt + Up Arrow</kbd></li>
-                  <li>"Down": <kbd>Alt + Down Arrow</kbd></li>
+                  <li>"Up": <kbd>Alt</kbd> + <kbd>Up Arrow</kbd></li>
+                  <li>"Down": <kbd>Alt</kbd> + <kbd>Down Arrow</kbd></li>
                   <li>"Add": <kbd>Enter</kbd></li>
                   <li>"Not Important", "Important", and "Remove": <kbd>Delete</kbd></li>
                 </ul>
@@ -256,7 +256,7 @@ <h2>Accessibility Features</h2>
               </li>
               <li>
                 Using a shortcut key intentionally places focus to optimize both screen reader and keyboard usability.
-                For example, pressing <kbd>Alt + Up Arrow</kbd> in the "Important Features" list keeps focus on the option that is moved up, enabling all keyboard users to easily perform consecutive move operations for an option and screen reader users to hear the position of an option after it is moved.
+                For example, pressing <kbd>Alt</kbd> + <kbd>Up Arrow</kbd> in the "Important Features" list keeps focus on the option that is moved up, enabling all keyboard users to easily perform consecutive move operations for an option and screen reader users to hear the position of an option after it is moved.
                 Similarly, pressing <kbd>Enter</kbd> in the available options list leaves focus in the available options list.
                 If the option that had focus before the add operation is no longer present in the list, focus lands on the first of the subsequent options that is still present.
               </li>
@@ -376,24 +376,24 @@ <h3 id="kbd_label_multiselect">Multiple selection keys supported in example 2</h
               <td>changes the selection state of the focused option .</td>
             </tr>
             <tr data-test-id="key-shift-down-arrow">
-              <th><kbd>Shift + Down Arrow</kbd></th>
+              <th><kbd>Shift</kbd> + <kbd>Down Arrow</kbd></th>
               <td>Moves focus to and selects the next option.</td>
             </tr>
             <tr data-test-id="key-shift-up-arrow">
-              <th><kbd>Shift + Up Arrow</kbd></th>
+              <th><kbd>Shift</kbd> + <kbd>Up Arrow</kbd></th>
               <td>Moves focus to and selects the previous option.</td>
             </tr>
             <tr data-test-id="key-control-shift-home">
-              <th><kbd>Control + Shift + Home</kbd></th>
+              <th><kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>Home</kbd></th>
               <td>Selects from the focused option to the beginning of the list.</td>
             </tr>
             <tr data-test-id="key-control-shift-end">
-              <th><kbd>Control + Shift + End</kbd></th>
+              <th><kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>End</kbd></th>
               <td>Selects from the focused option to the end of the list.</td>
             </tr>
             <tr data-test-id="key-control-a">
               <th>
-                <kbd>Control + A</kbd> (All Platforms)<br>
+                <kbd>Control</kbd> + <kbd>A</kbd> (All Platforms)<br>
                 <kbd>Command-A</kbd> (macOS)
               </th>
               <td>
diff --git a/content/patterns/listbox/listbox-pattern.html b/content/patterns/listbox/listbox-pattern.html
index 3988a66f2a..f17aab71bf 100644
--- a/content/patterns/listbox/listbox-pattern.html
+++ b/content/patterns/listbox/listbox-pattern.html
@@ -109,19 +109,19 @@ <h2>Keyboard Interaction</h2>
                 Recommended selection model -- holding modifier keys is not necessary:
                 <ul>
                   <li><kbd>Space</kbd>: changes the selection state of the focused option.</li>
-                  <li><kbd>Shift + Down Arrow</kbd> (Optional): Moves focus to and toggles the selected state of the next option.</li>
-                  <li><kbd>Shift + Up Arrow</kbd> (Optional): Moves focus to and toggles the selected state of the previous option.</li>
-                  <li><kbd>Shift + Space</kbd> (Optional): Selects contiguous items from the most recently selected item to the focused item.</li>
+                  <li><kbd>Shift</kbd> + <kbd>Down Arrow</kbd> (Optional): Moves focus to and toggles the selected state of the next option.</li>
+                  <li><kbd>Shift</kbd> + <kbd>Up Arrow</kbd> (Optional): Moves focus to and toggles the selected state of the previous option.</li>
+                  <li><kbd>Shift</kbd> + <kbd>Space</kbd> (Optional): Selects contiguous items from the most recently selected item to the focused item.</li>
                   <li>
-                    <kbd>Control + Shift + Home</kbd> (Optional): Selects the focused option and all options up to the first option.
+                    <kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>Home</kbd> (Optional): Selects the focused option and all options up to the first option.
                     Optionally, moves focus to the first option.
                   </li>
                   <li>
-                    <kbd>Control + Shift + End</kbd> (Optional): Selects the focused option and all options down to the last option.
+                    <kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>End</kbd> (Optional): Selects the focused option and all options down to the last option.
                     Optionally, moves focus to the last option.
                   </li>
                   <li>
-                    <kbd>Control + A</kbd> (Optional): Selects all options in the list.
+                    <kbd>Control</kbd> + <kbd>A</kbd> (Optional): Selects all options in the list.
                     Optionally, if all options are selected, it may also unselect all options.
                   </li>
                 </ul>
@@ -129,22 +129,22 @@ <h2>Keyboard Interaction</h2>
               <li>
                 Alternative selection model -- moving focus without holding a <kbd>Shift</kbd> or <kbd>Control</kbd> modifier unselects all selected options except the focused option:
                 <ul>
-                  <li><kbd>Shift + Down Arrow</kbd>: Moves focus to and toggles the selection state of the next option.</li>
-                  <li><kbd>Shift + Up Arrow</kbd>: Moves focus to and toggles the selection state of the previous option.</li>
-                  <li><kbd>Control + Down Arrow</kbd>: Moves focus to the next option without changing its selection state.</li>
-                  <li><kbd>Control + Up Arrow</kbd>: Moves focus to the previous option without changing its selection state.</li>
-                  <li><kbd>Control + Space</kbd> Changes the selection state of the focused option.</li>
-                  <li><kbd>Shift + Space</kbd> (Optional): Selects contiguous items from the most recently selected item to the focused item.</li>
+                  <li><kbd>Shift</kbd> + <kbd>Down Arrow</kbd>: Moves focus to and toggles the selection state of the next option.</li>
+                  <li><kbd>Shift</kbd> + <kbd>Up Arrow</kbd>: Moves focus to and toggles the selection state of the previous option.</li>
+                  <li><kbd>Control</kbd> + <kbd>Down Arrow</kbd>: Moves focus to the next option without changing its selection state.</li>
+                  <li><kbd>Control</kbd> + <kbd>Up Arrow</kbd>: Moves focus to the previous option without changing its selection state.</li>
+                  <li><kbd>Control</kbd> + <kbd>Space</kbd> Changes the selection state of the focused option.</li>
+                  <li><kbd>Shift</kbd> + <kbd>Space</kbd> (Optional): Selects contiguous items from the most recently selected item to the focused item.</li>
                   <li>
-                    <kbd>Control + Shift + Home</kbd> (Optional): Selects the focused option and all options up to the first option.
+                    <kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>Home</kbd> (Optional): Selects the focused option and all options up to the first option.
                     Optionally, moves focus to the first option.
                   </li>
                   <li>
-                    <kbd>Control + Shift + End</kbd> (Optional): Selects the focused option and all options down to the last option.
+                    <kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>End</kbd> (Optional): Selects the focused option and all options down to the last option.
                     Optionally, moves focus to the last option.
                   </li>
                   <li>
-                    <kbd>Control + A</kbd> (Optional): Selects all options in the list.
+                    <kbd>Control</kbd> + <kbd>A</kbd> (Optional): Selects all options in the list.
                     Optionally, if all options are selected, it may also unselect all options.
                   </li>
                 </ul>
diff --git a/content/patterns/menubar/menu-and-menubar-pattern.html b/content/patterns/menubar/menu-and-menubar-pattern.html
index 123e8b9637..c8af7ff04c 100644
--- a/content/patterns/menubar/menu-and-menubar-pattern.html
+++ b/content/patterns/menubar/menu-and-menubar-pattern.html
@@ -21,7 +21,7 @@ <h2>About This Pattern</h2>
         <p>
           A <a href="#menu" class="role-reference">menu</a> is a widget that offers a list of choices to the user, such as a set of actions or functions.
           Menu widgets behave like native operating system menus, such as the menus that pull down from the menubars commonly found at the top of many desktop application windows.
-          A menu is usually opened, or made visible, by activating a <a href="../menu-button/menu-button-pattern.html">menu button</a>, choosing an item in a menu that opens a sub menu, or by invoking a command, such as <kbd>Shift + F10</kbd> in Windows, that opens a context specific menu.
+          A menu is usually opened, or made visible, by activating a <a href="../menu-button/menu-button-pattern.html">menu button</a>, choosing an item in a menu that opens a sub menu, or by invoking a command, such as <kbd>Shift</kbd> + <kbd>F10</kbd> in Windows, that opens a context specific menu.
           When a user activates a choice in a menu, the menu usually closes unless the choice opened a submenu.
         </p>
 
@@ -61,12 +61,12 @@ <h2>Keyboard Interaction</h2>
           When a <code>menu</code> opens, or when a <code>menubar</code> receives focus, keyboard focus is placed on the first item.
           Because <code>menubar</code> and <code>menu</code> elements are composite widgets as described in the practice for
           <a href="../../practices/keyboard-interface/keyboard-interface-practice.html#kbd_general_within">Keyboard Navigation Inside Components</a>,
-          <kbd>Tab</kbd> and <kbd>Shift + Tab</kbd> do not move focus among the items in the menu.
+          <kbd>Tab</kbd> and <kbd>Shift</kbd> + <kbd>Tab</kbd> do not move focus among the items in the menu.
           Instead, the keyboard commands described in this section enable users to move focus among the elements in a <code>menubar</code> or <code>menu</code>.
         </p>
         <ul>
           <li>
-            <kbd>Tab</kbd> and <kbd>Shift + Tab</kbd>:
+            <kbd>Tab</kbd> and <kbd>Shift</kbd> + <kbd>Tab</kbd>:
             <ul>
               <li>
                 Move focus into a <code>menubar</code>:
@@ -80,7 +80,7 @@ <h2>Keyboard Interaction</h2>
               </li>
               <li>When focus is on a <code>menuitem</code> in a <code>menu</code> or <code>menubar</code>, move focus out of the <code>menu</code> or <code>menubar</code>, and close all menus and submenus.</li>
               <li>
-                Note that <kbd>Tab</kbd> and <kbd>Shift + Tab</kbd> do not move focus into a <code>menu</code>.
+                Note that <kbd>Tab</kbd> and <kbd>Shift</kbd> + <kbd>Tab</kbd> do not move focus into a <code>menu</code>.
                 Unlike a <code>menubar</code>, a <code>menu</code> is not visually persistent, and authors are responsible for ensuring focus moves to an item inside of a <code>menu</code> when the <code>menu</code> opens.
               </li>
             </ul>
@@ -158,7 +158,7 @@ <h3>Note</h3>
             <li>A <a href="#separator" class="role-reference">separator</a> in a menu is not focusable or interactive.</li>
             <li>
               If a menu is opened or a menubar receives focus as a result of a context action, <kbd>Escape</kbd> or <kbd>Enter</kbd> may return focus to the invoking context.
-              For example, a rich text editor may have a menubar that receives focus when a shortcut key, e.g., <kbd>alt + F10</kbd>, is pressed while editing.
+              For example, a rich text editor may have a menubar that receives focus when a shortcut key, e.g., <kbd>alt</kbd> + <kbd>F10</kbd>, is pressed while editing.
               In this case, pressing <kbd>Escape</kbd> or activating a command from the menu may return focus to the editor.
             </li>
             <li>
diff --git a/content/patterns/radio/radio-group-pattern.html b/content/patterns/radio/radio-group-pattern.html
index 8c476bd446..bb451c98e1 100644
--- a/content/patterns/radio/radio-group-pattern.html
+++ b/content/patterns/radio/radio-group-pattern.html
@@ -44,7 +44,7 @@ <h3>For Radio Groups Not Contained in a Toolbar</h3>
           </p>
           <ul>
             <li>
-              <kbd>Tab</kbd> and <kbd>Shift + Tab</kbd>: Move focus into and out of the radio group.
+              <kbd>Tab</kbd> and <kbd>Shift</kbd> + <kbd>Tab</kbd>: Move focus into and out of the radio group.
               When focus moves into a radio group:
               <ul>
                 <li>If a radio button is checked, focus is set on the checked button.</li>
@@ -64,7 +64,7 @@ <h3>For Radio Groups Not Contained in a Toolbar</h3>
           <div class="note">
             <h3>Note</h3>
             <p>The initial focus behavior described above differs slightly from the behavior provided by some browsers for native HTML radio groups.
-            In some browsers, if none of the radio buttons are selected, moving focus into the radio group with <kbd>Shift+Tab</kbd> will place focus on the last radio button instead of the first radio button.</p>
+            In some browsers, if none of the radio buttons are selected, moving focus into the radio group with <kbd>Shift</kbd> + <kbd>Tab</kbd> will place focus on the last radio button instead of the first radio button.</p>
           </div>
         </section>
         <section>
diff --git a/content/patterns/tabs/examples/tabs-actions.html b/content/patterns/tabs/examples/tabs-actions.html
index f2a9613124..a632380a51 100644
--- a/content/patterns/tabs/examples/tabs-actions.html
+++ b/content/patterns/tabs/examples/tabs-actions.html
@@ -281,7 +281,7 @@ <h3 id="kbd1_label">Tabs</h3>
               </td>
             </tr>
             <tr data-test-id="key-shift-tab">
-              <th><kbd>Shift + Tab</kbd></th>
+              <th><kbd>Shift</kbd> + <kbd>Tab</kbd></th>
               <td>
                 <ul>
                   <li>When focus moves into the <code>tablist</code>, places focus on the menu <code>button</code> associated with the active <code>tab</code>.</li>
diff --git a/content/patterns/tabs/tabs-pattern.html b/content/patterns/tabs/tabs-pattern.html
index 3b0d405322..c32132b334 100644
--- a/content/patterns/tabs/tabs-pattern.html
+++ b/content/patterns/tabs/tabs-pattern.html
@@ -87,7 +87,7 @@ <h2>Keyboard Interaction</h2>
                 <kbd>End</kbd> (Optional): Moves focus to the last tab.
                 Optionally, activates the newly focused tab (See note below).
               </li>
-              <li><kbd>Shift + F10</kbd>: If the tab has an associated popup menu, opens the menu.</li>
+              <li><kbd>Shift</kbd> + <kbd>F10</kbd>: If the tab has an associated popup menu, opens the menu.</li>
               <li>
                 <kbd>Delete</kbd> (Optional): If deletion is allowed, deletes (closes) the current tab element and its associated tab panel, sets focus on the tab following the tab that was closed, and optionally activates the newly focused tab.
                 If there is not a tab that followed the tab that was deleted, e.g., the deleted tab was the right-most tab in a left-to-right horizontal tab list, sets focus on and optionally activates the tab that preceded the deleted tab.
diff --git a/content/patterns/toolbar/toolbar-pattern.html b/content/patterns/toolbar/toolbar-pattern.html
index 695d92868e..97b8bd832d 100644
--- a/content/patterns/toolbar/toolbar-pattern.html
+++ b/content/patterns/toolbar/toolbar-pattern.html
@@ -58,7 +58,7 @@ <h2>Example</h2>
         <h2>Keyboard Interaction</h2>
         <ul>
           <li>
-            <kbd>Tab</kbd> and <kbd>Shift + Tab</kbd>: Move focus into and out of the toolbar.
+            <kbd>Tab</kbd> and <kbd>Shift</kbd> + <kbd>Tab</kbd>: Move focus into and out of the toolbar.
             When focus moves into a toolbar:
             <ul>
               <li>If focus is moving into the toolbar for the first time, focus is set on the first control that is not disabled.</li>
diff --git a/content/patterns/treegrid/examples/treegrid-1.html b/content/patterns/treegrid/examples/treegrid-1.html
index 11e3bb813d..7c131508c2 100644
--- a/content/patterns/treegrid/examples/treegrid-1.html
+++ b/content/patterns/treegrid/examples/treegrid-1.html
@@ -235,7 +235,7 @@ <h2 id="kbd_label">Keyboard Support</h2>
             </tr>
             <tr data-test-id="key-shift-tab">
               <th scope="row">
-                <kbd>Shift + Tab</kbd>
+                <kbd>Shift</kbd> + <kbd>Tab</kbd>
               </th>
               <td>
                 <ul>
@@ -268,7 +268,7 @@ <h2 id="kbd_label">Keyboard Support</h2>
             </tr>
             <tr data-test-id="key-control-home">
               <th scope="row">
-                <kbd>Control + Home</kbd>
+                <kbd>Control</kbd> + <kbd>Home</kbd>
               </th>
               <td>
                 <ul>
@@ -279,7 +279,7 @@ <h2 id="kbd_label">Keyboard Support</h2>
             </tr>
             <tr data-test-id="key-control-end">
               <th scope="row">
-                <kbd>Control + End</kbd>
+                <kbd>Control</kbd> + <kbd>End</kbd>
               </th>
               <td>
                 <ul>
diff --git a/content/patterns/treegrid/treegrid-pattern.html b/content/patterns/treegrid/treegrid-pattern.html
index 0ba629c652..0b438b68e7 100644
--- a/content/patterns/treegrid/treegrid-pattern.html
+++ b/content/patterns/treegrid/treegrid-pattern.html
@@ -159,7 +159,7 @@ <h2>Keyboard Interaction</h2>
             </ul>
           </li>
           <li>
-            <kbd>Control + Home</kbd>:
+            <kbd>Control</kbd> + <kbd>Home</kbd>:
             <ul>
               <li>
                 If focus is on a row, moves focus to the first row.
@@ -172,7 +172,7 @@ <h2>Keyboard Interaction</h2>
             </ul>
           </li>
           <li>
-            <kbd>Control + End</kbd>:
+            <kbd>Control</kbd> + <kbd>End</kbd>:
             <ul>
               <li>
                 If focus is on a row, moves focus to the last row.
@@ -196,20 +196,20 @@ <h3>Note</h3>
               While navigation keys, such as arrow keys, are moving focus from cell to cell, they are not available to do something like operate a combobox or move an editing caret inside of a cell.
               If this functionality is needed, see <a href="../grid/grid-pattern.html#gridNav_inside">Editing and Navigating Inside a Cell</a>.
             </li>
-            <li>If navigation functions can dynamically add more rows or columns to the DOM, key events that move focus to the beginning or end of the grid, such as <kbd>control + End</kbd>, may move focus to the last row in the DOM rather than the last available row in the back-end data.</li>
+            <li>If navigation functions can dynamically add more rows or columns to the DOM, key events that move focus to the beginning or end of the grid, such as <kbd>control</kbd> + <kbd>End</kbd>, may move focus to the last row in the DOM rather than the last available row in the back-end data.</li>
           </ul>
         </div>
         <p>If a treegrid supports selection of cells, rows, or columns, the following keys are commonly used for these functions.</p>
         <ul>
           <li>
-            <kbd>Control + Space</kbd>:
+            <kbd>Control</kbd> + <kbd>Space</kbd>:
             <ul>
               <li>If focus is on a row, selects all cells.</li>
               <li>If focus is on a cell, selects the column that contains the focus.</li>
             </ul>
           </li>
           <li>
-            <kbd>Shift + Space</kbd>:
+            <kbd>Shift</kbd> + <kbd>Space</kbd>:
             <ul>
               <li>If focus is on a row, selects the row.</li>
               <li>
@@ -218,30 +218,30 @@ <h3>Note</h3>
               </li>
             </ul>
           </li>
-          <li><kbd>Control + A</kbd>: Selects all cells.</li>
+          <li><kbd>Control</kbd> + <kbd>A</kbd>: Selects all cells.</li>
           <li>
-            <kbd>Shift + Right Arrow</kbd>:
+            <kbd>Shift</kbd> + <kbd>Right Arrow</kbd>:
             <ul>
               <li>If focus is on a row, does not change selection.</li>
               <li>if focus is on a cell, extends selection one cell to the right.</li>
             </ul>
           </li>
           <li>
-            <kbd>Shift + Left Arrow</kbd>:
+            <kbd>Shift</kbd> + <kbd>Left Arrow</kbd>:
             <ul>
               <li>If focus is on a row, does not change selection.</li>
               <li>if focus is on a cell, extends selection one cell to the left.</li>
             </ul>
           </li>
           <li>
-            <kbd>Shift + Down Arrow</kbd>:
+            <kbd>Shift</kbd> + <kbd>Down Arrow</kbd>:
             <ul>
               <li>If focus is on a row, extends selection to all the cells in the next row.</li>
               <li>If focus is on a cell, extends selection one cell down.</li>
             </ul>
           </li>
           <li>
-            <kbd>Shift + Up Arrow</kbd>:
+            <kbd>Shift</kbd> + <kbd>Up Arrow</kbd>:
             <ul>
               <li>If focus is on a row, extends selection to all the cells in the previous row.</li>
               <li>If focus is on a cell, extends selection one cell up.</li>
diff --git a/content/patterns/treeview/treeview-pattern.html b/content/patterns/treeview/treeview-pattern.html
index 1e8ee01dd3..8eaff4c7e1 100644
--- a/content/patterns/treeview/treeview-pattern.html
+++ b/content/patterns/treeview/treeview-pattern.html
@@ -127,19 +127,19 @@ <h2>Keyboard Interaction</h2>
                 Recommended selection model -- holding a modifier key while moving focus is not necessary:
                 <ul>
                   <li><kbd>Space</kbd>: Toggles the selection state of the focused node.</li>
-                  <li><kbd>Shift + Down Arrow</kbd> (Optional): Moves focus to and toggles the selection state of the next node.</li>
-                  <li><kbd>Shift + Up Arrow</kbd> (Optional): Moves focus to and toggles the selection state of the previous node.</li>
-                  <li><kbd>Shift + Space</kbd> (Optional): Selects contiguous nodes from the most recently selected node to the current node.</li>
+                  <li><kbd>Shift</kbd> + <kbd>Down Arrow</kbd> (Optional): Moves focus to and toggles the selection state of the next node.</li>
+                  <li><kbd>Shift</kbd> + <kbd>Up Arrow</kbd> (Optional): Moves focus to and toggles the selection state of the previous node.</li>
+                  <li><kbd>Shift</kbd> + <kbd>Space</kbd> (Optional): Selects contiguous nodes from the most recently selected node to the current node.</li>
                   <li>
-                    <kbd>Control + Shift + Home</kbd> (Optional): Selects the node with focus and all nodes up to the first node.
+                    <kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>Home</kbd> (Optional): Selects the node with focus and all nodes up to the first node.
                     Optionally, moves focus to the first node.
                   </li>
                   <li>
-                    <kbd>Control + Shift + End</kbd> (Optional): Selects the node with focus and all nodes down to the last node.
+                    <kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>End</kbd> (Optional): Selects the node with focus and all nodes down to the last node.
                     Optionally, moves focus to the last node.
                   </li>
                   <li>
-                    <kbd>Control + A</kbd> (Optional): Selects all nodes in the tree.
+                    <kbd>Control</kbd> + <kbd>A</kbd> (Optional): Selects all nodes in the tree.
                     Optionally, if all nodes are selected, it can also unselect all nodes.
                   </li>
                 </ul>
@@ -147,22 +147,22 @@ <h2>Keyboard Interaction</h2>
               <li>
                 Alternative selection model -- Moving focus without holding the <kbd>Shift</kbd> or <kbd>Control</kbd> modifier unselects all selected nodes except for the focused node:
                 <ul>
-                  <li><kbd>Shift + Down Arrow</kbd>: Moves focus to and toggles the selection state of the next node.</li>
-                  <li><kbd>Shift + Up Arrow</kbd>: Moves focus to and toggles the selection state of the previous node.</li>
-                  <li><kbd>Control + Down Arrow</kbd>: Without changing the selection state, moves focus to the next node.</li>
-                  <li><kbd>Control + Up Arrow</kbd>: Without changing the selection state, moves focus to the previous node.</li>
-                  <li><kbd>Control + Space</kbd>: Toggles the selection state of the focused node.</li>
-                  <li><kbd>Shift + Space</kbd> (Optional): Selects contiguous nodes from the most recently selected node to the current node.</li>
+                  <li><kbd>Shift</kbd> + <kbd>Down Arrow</kbd>: Moves focus to and toggles the selection state of the next node.</li>
+                  <li><kbd>Shift</kbd> + <kbd>Up Arrow</kbd>: Moves focus to and toggles the selection state of the previous node.</li>
+                  <li><kbd>Control</kbd> + <kbd>Down Arrow</kbd>: Without changing the selection state, moves focus to the next node.</li>
+                  <li><kbd>Control</kbd> + <kbd>Up Arrow</kbd>: Without changing the selection state, moves focus to the previous node.</li>
+                  <li><kbd>Control</kbd> + <kbd>Space</kbd>: Toggles the selection state of the focused node.</li>
+                  <li><kbd>Shift</kbd> + <kbd>Space</kbd> (Optional): Selects contiguous nodes from the most recently selected node to the current node.</li>
                   <li>
-                    <kbd>Control + Shift + Home</kbd> (Optional): Selects the node with focus and all nodes up to the first node.
+                    <kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>Home</kbd> (Optional): Selects the node with focus and all nodes up to the first node.
                     Optionally, moves focus to the first node.
                   </li>
                   <li>
-                    <kbd>Control + Shift + End</kbd> (Optional): Selects the node with focus and all nodes down to the last node.
+                    <kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>End</kbd> (Optional): Selects the node with focus and all nodes down to the last node.
                     Optionally, moves focus to the last node.
                   </li>
                   <li>
-                    <kbd>Control + A</kbd> (Optional): Selects all nodes in the tree.
+                    <kbd>Control</kbd> + <kbd>A</kbd> (Optional): Selects all nodes in the tree.
                     Optionally, if all nodes are selected, it can also unselect all nodes.
                   </li>
                 </ul>
diff --git a/content/practices/keyboard-interface/keyboard-interface-practice.html b/content/practices/keyboard-interface/keyboard-interface-practice.html
index ce83c87e71..429dba46e0 100644
--- a/content/practices/keyboard-interface/keyboard-interface-practice.html
+++ b/content/practices/keyboard-interface/keyboard-interface-practice.html
@@ -27,7 +27,7 @@ <h2>Introduction</h2>
         <ol>
           <li>Understanding fundamental principles of focus movement conventions used in ARIA design patterns.</li>
           <li>Maintaining visible focus, predictable focus movement, and distinguishing between keyboard focus and the selected state.</li>
-          <li>Managing movement of keyboard focus between components, e.g., how the focus moves when the <kbd>Tab</kbd> and <kbd>Shift+Tab</kbd> keys are pressed.</li>
+          <li>Managing movement of keyboard focus between components, e.g., how the focus moves when the <kbd>Tab</kbd> and <kbd>Shift</kbd> + <kbd>Tab</kbd> keys are pressed.</li>
           <li>Managing movement of keyboard focus inside components that contain multiple focusable elements, e.g., two different methods for programmatically exposing focus inside widgets like radio groups, menus, listboxes, trees, and grids.</li>
           <li>Determining when to make disabled interactive elements focusable.</li>
           <li>Assigning and revealing keyboard shortcuts, including guidance on how to avoid problematic conflicts with keyboard commands of assistive technologies, browsers, and operating systems.</li>
@@ -54,7 +54,7 @@ <h2>Fundamental Keyboard Navigation Conventions</h2>
         </p>
 
         <p>
-          A primary keyboard navigation convention common across all platforms is that the <kbd>tab</kbd> and <kbd>shift+tab</kbd> keys move focus from one UI component to another while other keys, primarily the arrow keys, move focus inside of components that include multiple focusable elements.
+          A primary keyboard navigation convention common across all platforms is that the <kbd>tab</kbd> and <kbd>shift</kbd> + <kbd>tab</kbd> keys move focus from one UI component to another while other keys, primarily the arrow keys, move focus inside of components that include multiple focusable elements.
           The path that the focus follows when pressing the <kbd>tab</kbd> key is known as the tab sequence or tab ring.
         </p>
 
@@ -262,7 +262,7 @@ <h2>Keyboard Navigation Inside Components</h2>
 
         <p>
           As described in section <a href="#kbd_generalnav">Fundamental Keyboard Navigation Conventions</a>, the tab sequence should include only one focusable element of a composite UI component.
-          Once a composite contains focus, keys other than <kbd>Tab</kbd> and <kbd>Shift + Tab</kbd> enable the user to move focus among its focusable elements.
+          Once a composite contains focus, keys other than <kbd>Tab</kbd> and <kbd>Shift</kbd> + <kbd>Tab</kbd> enable the user to move focus among its focusable elements.
           Authors are free to choose which keys move focus inside of a composite, but they are strongly advised to use the same key bindings as similar components in common GUI operating systems as demonstrated in <a href="../../patterns/patterns.html">APG Patterns</a>.
         </p>
 
@@ -314,7 +314,7 @@ <h3>Managing Focus Within Components Using a Roving tabindex</h3>
             </li>
 
             <li>
-              If the design calls for a specific element to be focused the next time the user moves focus into the composite with <kbd>Tab</kbd> or <kbd>Shift+Tab</kbd>, check if that target element has <code>tabindex="0"</code> when the composite loses focus.
+              If the design calls for a specific element to be focused the next time the user moves focus into the composite with <kbd>Tab</kbd> or <kbd>Shift</kbd> + <kbd>Tab</kbd>, check if that target element has <code>tabindex="0"</code> when the composite loses focus.
               If it does not, set <code>tabindex="0"</code> on the target element and set <code>tabindex="-1"</code> on the element that previously had <code>tabindex="0"</code>.
             </li>
           </ul>
@@ -355,7 +355,7 @@ <h3>Managing Focus in Composites Using aria-activedescendant</h3>
               </ul>
             </li>
             <li>
-              If the design calls for a specific element to be focused the next time a user moves focus into the composite with <kbd>Tab</kbd> or <kbd>Shift+Tab</kbd>, check if aria-activedescendant is referring to that target element when the container loses focus.
+              If the design calls for a specific element to be focused the next time a user moves focus into the composite with <kbd>Tab</kbd> or <kbd>Shift</kbd> + <kbd>Tab</kbd>, check if aria-activedescendant is referring to that target element when the container loses focus.
               If it is not, set aria-activedescendant to refer to the target element.
             </li>
           </ul>
@@ -454,33 +454,33 @@ <h2>Key Assignment Conventions for Common Functions</h2>
           <tbody>
             <tr>
               <th scope="row">open context menu</th>
-              <td><kbd>Shift + F10</kbd></td>
+              <td><kbd>Shift</kbd> + <kbd>F10</kbd></td>
               <td></td>
             </tr>
             <tr>
               <th scope="row">Copy to clipboard</th>
-              <td><kbd>Control + C</kbd></td>
-              <td><kbd>Command + C</kbd></td>
+              <td><kbd>Control</kbd> + <kbd>C</kbd></td>
+              <td><kbd>Command</kbd> + <kbd>C</kbd></td>
             </tr>
             <tr>
               <th scope="row">Paste from clipboard</th>
-              <td><kbd>Control + V</kbd></td>
-              <td><kbd>Command + V</kbd></td>
+              <td><kbd>Control</kbd> + <kbd>V</kbd></td>
+              <td><kbd>Command</kbd> + <kbd>V</kbd></td>
             </tr>
             <tr>
               <th scope="row">Cut to clipboard</th>
-              <td><kbd>Control + X</kbd></td>
-              <td><kbd>Command + X</kbd></td>
+              <td><kbd>Control</kbd> + <kbd>X</kbd></td>
+              <td><kbd>Command</kbd> + <kbd>X</kbd></td>
             </tr>
             <tr>
               <th scope="row">undo last action</th>
-              <td><kbd>Control + Z</kbd></td>
-              <td><kbd>Command + Z</kbd></td>
+              <td><kbd>Control</kbd> + <kbd>Z</kbd></td>
+              <td><kbd>Command</kbd> + <kbd>Z</kbd></td>
             </tr>
             <tr>
               <th scope="row">Redo action</th>
-              <td><kbd>Control + Y</kbd></td>
-              <td><kbd>Command + Shift + Z</kbd></td>
+              <td><kbd>Control</kbd> + <kbd>Y</kbd></td>
+              <td><kbd>Command</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd></td>
             </tr>
           </tbody>
         </table>
@@ -592,7 +592,7 @@ <h4>Choose Where to Add Shortcuts</h4>
           <h3>Assigning Keyboard Shortcuts</h3>
           <p>When choosing the keys to assign to a shortcut, there are many factors to consider.</p>
           <ul>
-            <li>Making the shortcut easy to learn and remember by using a mnemonic (e.g., <kbd>Control + S</kbd> for "Save") or following a logical or spacial pattern.</li>
+            <li>Making the shortcut easy to learn and remember by using a mnemonic (e.g., <kbd>Control</kbd> + <kbd>S</kbd> for "Save") or following a logical or spacial pattern.</li>
             <li>Localizing the interface, including for differences in which keys are available and how they behave and for language considerations that could impact mnemonics.</li>
             <li>Avoiding and managing conflicts with key assignments used by an assistive technology, the browser, or the operating system.</li>
           </ul>
@@ -657,7 +657,7 @@ <h4>Assistive Technology Key Conflicts</h4>
               <li><kbd>Caps Lock</kbd> + any other combination of keys.</li>
               <li><kbd>Insert</kbd> + any combination of other keys.</li>
               <li><kbd>Scroll Lock</kbd> + any combination of other keys.</li>
-              <li>macOS only: <kbd>Control+Option</kbd> + any combination of other keys.</li>
+              <li>macOS only: <kbd>Control</kbd> + <kbd>Option</kbd> + any combination of other keys.</li>
             </ol>
           </section>