[all hosts] (formatting) Use kbd HTML tags (#5010)

* [all hosts] (formatting) Use kbd HTML tags

* Updates based on feedback

Author: ElizabethSamuel-MSFT

Contributing.md

@@ -30,7 +30,7 @@ Use GitHub to contribute to this documentation without having to clone the repo
 2. Once you are on the article in GitHub, sign in to GitHub (get a free account [Join GitHub](https://github.com/join)).
 3. Choose the **pencil icon** (edit the file in your fork of this project) and make your changes in the **<>Edit file** window.
 4. Scroll to the bottom and enter a description.
-5. Choose **Propose file change**>**Create pull request**.
+5. Choose **Propose file change** > **Create pull request**.
 
 You now have successfully submitted a pull request. Pull requests are typically reviewed within 10 business days.
 

docs/design/accessibility-guidelines.md

@@ -17,7 +17,7 @@ Apply the following guidelines to ensure that your solution is accessible to all
 
 ## Design for multiple input methods
 
-- Ensure that users can perform operations by using only the keyboard. Users should be able to move to all actionable elements on the page by using a combination of the Tab and arrow keys.
+- Ensure that users can perform operations by using only the keyboard. Users should be able to move to all actionable elements on the page by using a combination of the <kbd>Tab</kbd> and arrow keys.
 - On a mobile device, when users operate a control by touch, the device should provide useful audio feedback.
 - Provide helpful labels for all interactive controls.
 - [Explore more design and UI resources.](/windows/apps/design/accessibility/accessibility)

docs/design/keyboard-shortcuts.md

@@ -150,26 +150,26 @@ Custom keyboard shortcuts are defined in a JSON file. This file describes your k
 
 Use the following guidelines to create custom key combinations for your add-ins.
 
-- A keyboard shortcut must include at least one modifier key (Alt/Option, Ctrl/Command, Shift) and only one other key. These keys must be joined with a `+` character.
-- The Command modifier key is supported on the macOS platform.
-- On macOS, the Alt key is mapped to the Option key. On Windows, the Command key is mapped to the Ctrl key.
-- The Shift key can't be used as the only modifier key. It must be combined with either Alt/Option or Ctrl/Command.
+- A keyboard shortcut must include at least one modifier key (<kbd>Alt</kbd>/<kbd>Option</kbd>, <kbd>Ctrl</kbd>/<kbd>Cmd</kbd>, <kbd>Shift</kbd>) and only one other key. These keys must be joined with a `+` character.
+- The <kbd>Cmd</kbd> modifier key is supported on the macOS platform.
+- On macOS, the <kbd>Alt</kbd> key is mapped to the <kbd>Option</kbd> key. On Windows, the <kbd>Cmd</kbd> key is mapped to the <kbd>Ctrl</kbd> key.
+- The <kbd>Shift</kbd> key can't be used as the only modifier key. It must be combined with either <kbd>Alt</kbd>/<kbd>Option</kbd> or <kbd>Ctrl</kbd>/<kbd>Cmd</kbd>.
 - Key combinations can include characters "A-Z", "a-z", "0-9", and the punctuation marks "-", "_", and "+". By convention, lowercase letters aren't used in keyboard shortcuts.
-- When two characters are linked to the same physical key on a standard keyboard, then they're synonyms in a custom keyboard shortcut. For example, Alt+a and Alt+A are the same shortcut, as well as Ctrl+- and Ctrl+\_ ("-" and "_" are linked to the same physical key).
+- When two characters are linked to the same physical key on a standard keyboard, then they're synonyms in a custom keyboard shortcut. For example, <kbd>Alt</kbd>+<kbd>a</kbd> and <kbd>Alt</kbd>+<kbd>A</kbd> are the same shortcut, as well as <kbd>Ctrl</kbd>+<kbd>-</kbd> and <kbd>Ctrl</kbd>+<kbd>\_</kbd> ("-" and "_" are linked to the same physical key).
 
 > [!NOTE]
-> Custom keyboard shortcuts must be pressed simultaneously. KeyTips, also known as sequential key shortcuts (for example, Alt+H, H), aren't supported in Office Add-ins.
+> Custom keyboard shortcuts must be pressed simultaneously. KeyTips, also known as sequential key shortcuts (for example, <kbd>Alt</kbd>+<kbd>H</kbd>, <kbd>H</kbd>), aren't supported in Office Add-ins.
 
 ### Browser shortcuts that cannot be overridden
 
 When using custom keyboard shortcuts on the web, some keyboard shortcuts that are used by the browser can't be overridden by add-ins. The following list is a work in progress. If you discover other combinations that can't be overridden, please let us know by using the feedback tool at the bottom of this page.
 
-- Ctrl+N
-- Ctrl+Shift+N
-- Ctrl+T
-- Ctrl+Shift+T
-- Ctrl+W
-- Ctrl+PgUp/PgDn
+- <kbd>Ctrl</kbd>+<kbd>N</kbd>
+- <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>N</kbd>
+- <kbd>Ctrl</kbd>+<kbd>T</kbd>
+- <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>T</kbd>
+- <kbd>Ctrl</kbd>+<kbd>W</kbd>
+- <kbd>Ctrl</kbd>+<kbd>PgUp</kbd>/<kbd>PgDn</kbd>
 
 ### Avoid key combinations in use by other add-ins
 
@@ -185,11 +185,11 @@ The user can select which action the keyboard shortcut will take. After making t
 
 For the best user experience, we recommend that you minimize keyboard shortcut conflicts with these good practices.
 
-- Use only keyboard shortcuts with the following pattern: **Ctrl+Shift+Alt+*x***, where *x* is some other key.
+- Use only keyboard shortcuts with the following pattern: <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>Alt</kbd>+*x*, where *x* is some other key.
 - Avoid using established keyboard shortcuts in Excel and Word. For a list, see the following:
   - [Keyboard shortcuts in Excel](https://support.microsoft.com/office/1798d9d5-842a-42b8-9c99-9b7213f0040f)
   - [Keyboard shortcuts in Word](https://support.microsoft.com/office/95ef89dd-7142-4b50-afb2-f762f663ceb2)
-- When the keyboard focus is inside the add-in UI, **Ctrl+Spacebar** and **Ctrl+Shift+F10** won't work as these are essential accessibility shortcuts.
+- When the keyboard focus is inside the add-in UI, <kbd>Ctrl</kbd>+<kbd>Spacebar</kbd> and <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>F10</kbd> won't work as these are essential accessibility shortcuts.
 - On a Windows or Mac computer, if the **Reset Office Add-ins shortcut preferences** command isn't available on the search menu, the user can manually add the command to the ribbon by customizing the ribbon through the context menu.
 
 ## Localize the description of a keyboard shortcut

docs/develop/convert-javascript-to-typescript.md

@@ -24,7 +24,7 @@ You can use the Office Add-in template in Visual Studio to create an add-in that
 > [!NOTE]
 > [Skip this section](#convert-the-add-in-project-to-typescript) if you already have an existing project.
 
-1. In Visual Studio, choose **Create a new project**. If the Visual Studio development environment is already open, you can create a new project by choosing **File > New > Project** on the menu bar.
+1. In Visual Studio, choose **Create a new project**. If the Visual Studio development environment is already open, you can create a new project by choosing **File** > **New** > **Project** on the menu bar.
 
 1. Using the search box, enter **add-in**. Choose **Excel Web Add-in**, then select **Next**.
 
@@ -128,7 +128,7 @@ The JavaScript files generated by Visual Studio do not contain any TypeScript sy
 
 ## Run the converted add-in project
 
-1. In Visual Studio, press **F5** or choose the **Start** button to launch Excel with the **Show Taskpane** add-in button displayed on the ribbon. The add-in will be hosted locally on IIS.
+1. In Visual Studio, press <kbd>F5</kbd> or choose the **Start** button to launch Excel with the **Show Taskpane** add-in button displayed on the ribbon. The add-in will be hosted locally on IIS.
 
 1. In Excel, choose the **Home** tab, and then choose the **Show Taskpane** button on the ribbon to open the add-in task pane.
 

docs/develop/convert-xml-to-json-manifest.md

@@ -101,7 +101,7 @@ You can sideload the add-in using the Teams Toolkit or in a command prompt, bash
 1. First, *make sure Outlook desktop is closed.*
 1. In Visual Studio Code, open the Teams Toolkit.
 1. In the **ACCOUNTS** section, verify that you're signed into Microsoft 365.
-1. Select **View** | **Run** in Visual Studio Code. In the **RUN AND DEBUG** drop down menu, select the option, **Outlook Desktop (Edge Chromium)**, and then press **F5**. The project builds and a Node dev-server window opens. This process may take a couple of minutes and then Outlook desktop opens.
+1. Select **View** | **Run** in Visual Studio Code. In the **RUN AND DEBUG** drop down menu, select the option, **Outlook Desktop (Edge Chromium)**, and then press <kbd>F5</kbd>. The project builds and a Node dev-server window opens. This process may take a couple of minutes and then Outlook desktop opens.
 1. You can now work with your add-in. Be sure you're working in the **Inbox** of *your Microsoft 365 account identity*.
 
 ##### Sideload with a system prompt, bash shell, or terminal

docs/develop/create-sso-office-add-ins-aspnet.md

@@ -372,7 +372,7 @@ The server-side code is an ASP.NET Core server that provides REST APIs for the c
 
     :::image type="content" source="../images/select-host.png" alt-text="Choose the desired Office client application: Excel, PowerPoint, or Word.":::
 
-1. Press F5. Or select **Debug > Start Debugging**.
+1. Press <kbd>F5</kbd>. Or select **Debug** > **Start Debugging**.
 1. In the Office application, select the **Show Add-in** in the **SSO ASP.NET** group to open the task pane add-in.
 1. Select **Get OneDrive File Names**. If you're logged into Office with either a Microsoft 365 Education or work account, or a Microsoft account, and SSO is working as expected, the first 10 file and folder names in your OneDrive for Business are displayed on the task pane. If you are not logged in, or you are in a scenario that does not support SSO, or SSO is not working for any reason, you will be prompted to sign in. After you sign in, the file and folder names appear.
 

docs/develop/debug-office-add-ins-in-visual-studio.md

@@ -69,7 +69,7 @@ This section describes how to start and debug an add-in in desktop Office on Win
 
 ### Start the add-in project
 
-Start the project by choosing **Debug** > **Start Debugging** from the menu bar or press the F5 button. Visual Studio automatically builds the solution and starts the Office host application.
+Start the project by choosing **Debug** > **Start Debugging** from the menu bar or press the <kbd>F5</kbd> button. Visual Studio automatically builds the solution and starts the Office host application.
 
 When Visual Studio builds the project, it performs the following tasks:
 
@@ -141,7 +141,7 @@ This section describes how to start and debug an add-in in desktop Office on the
 
 ### Start the add-in project on the web
 
-Start the project by choosing **Debug** > **Start Debugging** from the menu bar or press the F5 button. Visual Studio automatically builds the solution and launches the Office application host page of your Microsoft 365 tenancy.
+Start the project by choosing **Debug** > **Start Debugging** from the menu bar or press the <kbd>F5</kbd> button. Visual Studio automatically builds the solution and launches the Office application host page of your Microsoft 365 tenancy.
 
 > [!NOTE]
 > When you're debugging an add-in on the web, you may get an AADSTS50011 error similar to the following: 
@@ -163,7 +163,7 @@ Start the project by choosing **Debug** > **Start Debugging** from the menu bar
 >       ```
 >
 >    1. Run the script in PowerShell.
->    1. Restart the project by choosing **Debug** > **Start Debugging** from the menu bar or press the F5 button.
+>    1. Restart the project by choosing **Debug** > **Start Debugging** from the menu bar or press the <kbd>F5</kbd> button.
 
 When Visual Studio builds the project it performs the following tasks.
 
@@ -203,9 +203,9 @@ The best method for debugging an add-in in Visual Studio 2022 depends on whether
 
 #### Use the browser developer tools to debug on the web
 
-1. For an add-in in any host except Outlook, in the Office host application page, press F12 to open the debugging tool.
+1. For an add-in in any host except Outlook, in the Office host application page, press <kbd>F12</kbd> to open the debugging tool.
 
-1. For an Outlook add-in, if the add-in's manifest is configured for a read surface, select an email message or appointment item to open it in its own window. If the add-in is configured for only a compose surface, open a new message, reply to message, or new appointment window. Ensure that the appropriate window has focus and press F12 to pen the debugging tool.
+1. For an Outlook add-in, if the add-in's manifest is configured for a read surface, select an email message or appointment item to open it in its own window. If the add-in is configured for only a compose surface, open a new message, reply to message, or new appointment window. Ensure that the appropriate window has focus and press <kbd>F12</kbd> to pen the debugging tool.
 
 1. After the tool is open, launch the add-in. The exact steps vary depending on the design of your add-in. Typically, you press a button to open a task pane. In Outlook, in the toolbar at the top of the window, select the **More apps** button, and then select your add-in from the callout that opens.
 

docs/develop/extended-overrides.md

@@ -36,7 +36,7 @@ Use the manifest to tell Office where to find the JSON file. Immediately *below*
 </OfficeApp>
 ```
 
-The following is an example of a very simple extended overrides JSON file. It assigns keyboard shortcut CTRL+SHIFT+A to a function (defined elsewhere) that opens the add-in's task pane.
+The following is an example of a very simple extended overrides JSON file. It assigns keyboard shortcut <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>A</kbd> to a function (defined elsewhere) that opens the add-in's task pane.
 
 ```json
 {

docs/develop/localization.md

@@ -512,7 +512,7 @@ To test your localized add-in, change the language used for display or editing i
 
 3. Choose **OK** to confirm your selection, and then close Word.
 
-4. Press **F5** in Visual Studio to run the sample add-in, or choose **Debug** > **Start Debugging** from the menu bar.
+4. Press <kbd>F5</kbd> in Visual Studio to run the sample add-in, or choose **Debug** > **Start Debugging** from the menu bar.
 
 5. In Word, choose **Home** > **Show Taskpane**.
 

docs/develop/teams-toolkit-overview.md

@@ -39,7 +39,7 @@ Install the latest version of Teams Toolkit into Visual Studio Code as described
     1. **Close Outlook desktop**.
     1. In Visual Studio Code, open Teams Toolkit.
     1. In the **ACCOUNTS** section, verify that you're signed into Microsoft 365.
-    1. Select **View** | **Run** in Visual Studio Code. In the **RUN AND DEBUG** drop down menu, select the option, **Outlook Desktop (Edge Chromium)**, and then press F5. The project builds and a Node dev-server window opens. This process may take a couple of minutes. Eventually, Outlook desktop will open.
+    1. Select **View** | **Run** in Visual Studio Code. In the **RUN AND DEBUG** drop down menu, select the option, **Outlook Desktop (Edge Chromium)**, and then press <kbd>F5</kbd>. The project builds and a Node dev-server window opens. This process may take a couple of minutes. Eventually, Outlook desktop will open.
     1. Open the **Inbox** *of your Microsoft 365 account identity* and open any message. A **Contoso Add-in** tab with two buttons will appear on the **Home** ribbon (or the **Message** ribbon, if you have opened the message in its own window).
     1. Click the **Show Taskpane** button and a task pane opens. Click the **Perform an action** button and a small notification appears near the top of the message.
     1. To stop debugging and uninstall the add-in, select **Run** | **Stop Debugging** in Visual Studio Code.