From f465b8aaf97f8df5563950453e904d48f58ada97 Mon Sep 17 00:00:00 2001 From: Clarence Bakosi Date: Fri, 19 Sep 2025 04:50:39 +0100 Subject: [PATCH] chore: change labelled to labeled - American English spelling (#40451) Co-authored-by: Sharra-writes --- .../removing-organizations-from-your-enterprise.md | 2 +- .../managing-automatically-dismissed-alerts.md | 4 ++-- .../creating-diagrams-for-github-docs.md | 12 ++++++------ .../using-markdown-and-liquid-in-github-docs.md | 2 +- ...ut-using-makecode-arcade-with-github-classroom.md | 2 +- data/reusables/desktop/settings-git-pane.md | 2 +- data/reusables/two_fa/add-additional-method.md | 2 +- 7 files changed, 13 insertions(+), 13 deletions(-) diff --git a/content/admin/managing-accounts-and-repositories/managing-organizations-in-your-enterprise/removing-organizations-from-your-enterprise.md b/content/admin/managing-accounts-and-repositories/managing-organizations-in-your-enterprise/removing-organizations-from-your-enterprise.md index 56c4828798..b0a3d05dfc 100644 --- a/content/admin/managing-accounts-and-repositories/managing-organizations-in-your-enterprise/removing-organizations-from-your-enterprise.md +++ b/content/admin/managing-accounts-and-repositories/managing-organizations-in-your-enterprise/removing-organizations-from-your-enterprise.md @@ -40,7 +40,7 @@ As part of the downgrade to the free plan: 1. In the search bar, begin typing the organization's name until the organization appears in the search results. 1. To the right of the organization's name, select the ... dropdown menu and click **Remove organization**. - ![Expanded dropdown menu labelled with "...", for an organization. The "Remove organization" option outlined.](/assets/images/help/enterprises/remove-organization.png) + ![Expanded dropdown menu labeled with "...", for an organization. The "Remove organization" option outlined.](/assets/images/help/enterprises/remove-organization.png) 1. Review the warnings, decide whether to also remove users who will become unaffiliated, then click **Remove organization**. diff --git a/content/code-security/dependabot/dependabot-auto-triage-rules/managing-automatically-dismissed-alerts.md b/content/code-security/dependabot/dependabot-auto-triage-rules/managing-automatically-dismissed-alerts.md index d095f00e32..a35632b039 100644 --- a/content/code-security/dependabot/dependabot-auto-triage-rules/managing-automatically-dismissed-alerts.md +++ b/content/code-security/dependabot/dependabot-auto-triage-rules/managing-automatically-dismissed-alerts.md @@ -28,11 +28,11 @@ redirect_from: {% data reusables.repositories.sidebar-security %} 1. To filter to see all closed alerts, click **{% octicon "check" aria-hidden="true" aria-label="check" %} Closed**. Alternatively, use the `is:closed` filter query in the search bar. - ![Screenshot of the "Dependabot Alerts" page. A button, labelled "Closed" is highlighted with an orange outline.](/assets/images/help/repository/dependabot-alerts-closed-tab.png) + ![Screenshot of the "Dependabot Alerts" page. A button, labeled "Closed" is highlighted with an orange outline.](/assets/images/help/repository/dependabot-alerts-closed-tab.png) 1. To see all auto-dismissed alerts, select **Closed as**, then in the dropdown menu, click **Auto-dismissed**. - ![Screenshot of the "Dependabot Alerts" page. A button, labelled "Closed as" is highlighted with an orange outline.](/assets/images/help/repository/dependabot-alerts-closed-as.png) + ![Screenshot of the "Dependabot Alerts" page. A button, labeled "Closed as" is highlighted with an orange outline.](/assets/images/help/repository/dependabot-alerts-closed-as.png) 1. To reopen an auto-dismissed alert, to the left of the alert title, click the checkbox adjacent to the alert, then click **Reopen**. diff --git a/content/contributing/writing-for-github-docs/creating-diagrams-for-github-docs.md b/content/contributing/writing-for-github-docs/creating-diagrams-for-github-docs.md index ee273ddcb0..55b983f96d 100644 --- a/content/contributing/writing-for-github-docs/creating-diagrams-for-github-docs.md +++ b/content/contributing/writing-for-github-docs/creating-diagrams-for-github-docs.md @@ -87,11 +87,11 @@ If you are creating a diagram to explain when or how something happens, consider ![An example flowchart that uses rectangles to represent steps in a process and a diamond to represent a decision point where the chart branches.](/assets/images/help/diagrams/flowchart-example.png) -* [Gantt chart](https://en.wikipedia.org/wiki/Gantt_chart): Gantt charts are useful for showing how long tasks take and when they overlap. In this example, the horizontal axis is labelled "Time" and the blue rectangles represent three discrete tasks. Task 1 and task 2 overlap, which means that at least part of the tasks happen at the same time. Task 3 does not overlap with the other tasks, which means that it happens after the first two are completed. +* [Gantt chart](https://en.wikipedia.org/wiki/Gantt_chart): Gantt charts are useful for showing how long tasks take and when they overlap. In this example, the horizontal axis is labeled "Time" and the blue rectangles represent three discrete tasks. Task 1 and task 2 overlap, which means that at least part of the tasks happen at the same time. Task 3 does not overlap with the other tasks, which means that it happens after the first two are completed. ![An example Gantt chart that has three tasks arranged on a horizontal axis labeled "Time".](/assets/images/help/diagrams/gantt-example.png) -* [Journey map](https://en.wikipedia.org/wiki/User_journey): Journey maps are useful for showing how the state of something over time. In this example, the horizontal axis is labelled "Time" and the vertical axis is labelled "Something observed or measured." Blue dots mark measurements at specific times and they are connected with a line to illustrate the trend over time. +* [Journey map](https://en.wikipedia.org/wiki/User_journey): Journey maps are useful for showing how the state of something over time. In this example, the horizontal axis is labeled "Time" and the vertical axis is labeled "Something observed or measured." Blue dots mark measurements at specific times and they are connected with a line to illustrate the trend over time. ![An example journey map that has a line on two axes tracking events over time that we want to observe or measure something about.](/assets/images/help/diagrams/journey-example.png) @@ -99,7 +99,7 @@ If you are creating a diagram to explain when or how something happens, consider If you are creating a diagram to explain what or where things are, consider one of these diagram types. -* [Block diagram](https://en.wikipedia.org/wiki/Block_diagram): Block diagrams are useful for showing how things are organized by putting items within other items. This example shows how content is organized in {% data variables.product.prodname_docs %} with the largest rectangle labelled "Category," a rectangle within that labelled "Map topics," and a rectangle within that labelled "Articles." +* [Block diagram](https://en.wikipedia.org/wiki/Block_diagram): Block diagrams are useful for showing how things are organized by putting items within other items. This example shows how content is organized in {% data variables.product.prodname_docs %} with the largest rectangle labeled "Category," a rectangle within that labeled "Map topics," and a rectangle within that labeled "Articles." ![A block diagram of the GitHub Docs content model with overlapping squares showing articles within map topics within categories.](/assets/images/help/diagrams/block-example.png) @@ -119,11 +119,11 @@ If you are creating a diagram to explain why something is the way that it is, co ![An example continuum with a horizontal axis representing the continuum between two options and the position of an item on the continuum.](/assets/images/help/diagrams/continuum-example.png) -* [Quadrant diagram](https://en.wikipedia.org/wiki/Quadrant_(plane_geometry)): Quadrant diagrams are useful for explaining the relationship between two axes and where things fall on both axes. In this example, the horizontal axis is labelled "Purely decorative" on the left and "Meets a specific acceptance criteria" on the right. The vertical axis is labelled "Compliment written text" on the top and "The only way information is presented" on the bottom. The blue square labelled "Diagrams in the {% data variables.product.prodname_docs %}" is in the upper right quadrant formed by the overlap of "Compliment written text" and "Meets a specific acceptance criteria," which means that it has those two properties. +* [Quadrant diagram](https://en.wikipedia.org/wiki/Quadrant_(plane_geometry)): Quadrant diagrams are useful for explaining the relationship between two axes and where things fall on both axes. In this example, the horizontal axis is labeled "Purely decorative" on the left and "Meets a specific acceptance criteria" on the right. The vertical axis is labeled "Compliment written text" on the top and "The only way information is presented" on the bottom. The blue square labeled "Diagrams in the {% data variables.product.prodname_docs %}" is in the upper right quadrant formed by the overlap of "Compliment written text" and "Meets a specific acceptance criteria," which means that it has those two properties. ![An example quadrant diagram with four quadrants created by two axes and a blue rectangle in the upper right quadrant.](/assets/images/help/diagrams/quadrant-example.png) -* [Venn diagram](https://en.wikipedia.org/wiki/Venn_diagram): Venn diagrams are useful for showing shared traits or overlap of ideas. Circles represent concepts or things, and the area where the circles overlap represent shared traits between things. In this example, the overlap between the circle labelled "Octopus" and the circle labelled "Cat" is labelled "Octocat," which is a combination of an octopus and a cat. +* [Venn diagram](https://en.wikipedia.org/wiki/Venn_diagram): Venn diagrams are useful for showing shared traits or overlap of ideas. Circles represent concepts or things, and the area where the circles overlap represent shared traits between things. In this example, the overlap between the circle labeled "Octopus" and the circle labeled "Cat" is labeled "Octocat," which is a combination of an octopus and a cat. ![An example Venn diagram with two circles overlapping: one labeled "Octopus" and the other "Cat". The intersection of the circles is labeled "Octocat".](/assets/images/help/diagrams/venn-diagram-example.png) @@ -175,7 +175,7 @@ Labels are visual and verbal markers. Labels should be 25 characters or less. To Keys help with understanding by explaining what different elements of a graph are or explicitly clarifying relationships. Not every diagram will need a key. -Keys cannot introduce new information that isn't otherwise in the diagram. Keys cannot fix overly complicated diagrams. Keys should not define poorly labelled objects or relationships. +Keys cannot introduce new information that isn't otherwise in the diagram. Keys cannot fix overly complicated diagrams. Keys should not define poorly labeled objects or relationships. Keys should be used to explain shapes, colors, or other visual elements. Keys can also include citations or explanations of scale and manipulation. Keys can include some instruction like where to begin in a flow chart, but most instruction should be in the text that introduces a diagram. diff --git a/content/contributing/writing-for-github-docs/using-markdown-and-liquid-in-github-docs.md b/content/contributing/writing-for-github-docs/using-markdown-and-liquid-in-github-docs.md index e7e12262f7..2457af7c50 100644 --- a/content/contributing/writing-for-github-docs/using-markdown-and-liquid-in-github-docs.md +++ b/content/contributing/writing-for-github-docs/using-markdown-and-liquid-in-github-docs.md @@ -221,7 +221,7 @@ Octicons are icons used across {% data variables.product.prodname_dotcom %}’s If you're referencing an Octicon that appears in the UI, identify whether the Octicon is the entire label of the UI element (for example, a button that is labeled only with "+") or whether it's only decorative, in addition to another label (for example, a button is labeled "+ Add message"). * If the Octicon is the entire label, use your browser's developer tools to inspect the Octicon and determine what screen reader users will hear instead. Then, use that text for the `aria-label` (for example, `{% raw %}{% octicon "plus" aria-label="Add file" %}{% endraw %}`). Occasionally, in the UI, the Octicon itself will not have an `aria-label`, but a surrounding element such as a `` or `
` tag will. - * Some Octicons used as labels have dynamic `aria-label` elements that change based on the state of the UI element or a user input. For example, when someone has two security policies-`Policy A` and `Policy B`-their UI will show two trash Octicons labelled `{% raw %}{% octicon "trash" aria-label="Delete Policy A" %}{% endraw %}` and `{% raw %}{% octicon "trash" aria-label="Delete Policy B" %}{% endraw %}`. For dynamic `aria-label` elements, since we can't document the exact `aria-label` that people will encounter, describe the Octicon and a placeholder example of the label (for example, `"{% raw %}{% octicon "trash" aria-label="The trash icon, labelled 'Delete YOUR-POLICY-NAME'." %}{% endraw %}"`). This will help people identify both the Octicon and how it is labelled, and give context for collaborating with people who are visually describing the Octicon. + * Some Octicons used as labels have dynamic `aria-label` elements that change based on the state of the UI element or a user input. For example, when someone has two security policies-`Policy A` and `Policy B`-their UI will show two trash Octicons labeled `{% raw %}{% octicon "trash" aria-label="Delete Policy A" %}{% endraw %}` and `{% raw %}{% octicon "trash" aria-label="Delete Policy B" %}{% endraw %}`. For dynamic `aria-label` elements, since we can't document the exact `aria-label` that people will encounter, describe the Octicon and a placeholder example of the label (for example, `"{% raw %}{% octicon "trash" aria-label="The trash icon, labeled 'Delete YOUR-POLICY-NAME'." %}{% endraw %}"`). This will help people identify both the Octicon and how it is labeled, and give context for collaborating with people who are visually describing the Octicon. * If the Octicon is decorative, it's likely hidden to screen readers with the `aria-hidden=true` attribute. If so, for consistency with the product, use `aria-hidden="true"` in the Liquid syntax for the Octicon in the docs as well (for example, `"{% raw %}{% octicon "plus" aria-hidden="true" %} Add message"{% endraw %}`). If you're using the Octicon in another way, such as using the "check" and "x" icons to reflect binary values in tables, use the `aria-label` to describe the meaning of the Octicon, not its visual characteristics. For example, if you're using a "x" icon in the "Supported" column of a table, use "Not supported" as the `aria-label`. For more information, see [AUTOTITLE](/contributing/style-guide-and-content-model/style-guide#tables). diff --git a/content/education/manage-coursework-with-github-classroom/integrate-github-classroom-with-an-ide/about-using-makecode-arcade-with-github-classroom.md b/content/education/manage-coursework-with-github-classroom/integrate-github-classroom-with-an-ide/about-using-makecode-arcade-with-github-classroom.md index b5c66d3c4a..1099a36442 100644 --- a/content/education/manage-coursework-with-github-classroom/integrate-github-classroom-with-an-ide/about-using-makecode-arcade-with-github-classroom.md +++ b/content/education/manage-coursework-with-github-classroom/integrate-github-classroom-with-an-ide/about-using-makecode-arcade-with-github-classroom.md @@ -24,7 +24,7 @@ MakeCode Arcade does not support multiplayer-editing for group assignments. Inst By default, MakeCode Arcade is configured to push to the assignment repository on {% data variables.location.product_location %}. After making progress on an assignment with MakeCode Arcade, students should push changes to {% data variables.location.product_location %} using the {% octicon "mark-github" aria-label="The GitHub mark" %}{% octicon "arrow-up" aria-label="The up arrow icon" %} button at the bottom of the screen. -![Screenshot of the MakeCode Arcade window. At the bottom of the window, a button is labelled with the Octocat logo and an upwards-facing arrow.](/assets/images/help/classroom/ide-makecode-arcade-version-control-button.png) +![Screenshot of the MakeCode Arcade window. At the bottom of the window, a button is labeled with the Octocat logo and an upwards-facing arrow.](/assets/images/help/classroom/ide-makecode-arcade-version-control-button.png) ## Further reading diff --git a/data/reusables/desktop/settings-git-pane.md b/data/reusables/desktop/settings-git-pane.md index 9d85b8406c..23fe7481bb 100644 --- a/data/reusables/desktop/settings-git-pane.md +++ b/data/reusables/desktop/settings-git-pane.md @@ -1,3 +1,3 @@ 1. In the "Settings" window, click **Git**. - ![Screenshot of the "Git" pane in the "Preferences" window. In the left sidebar, an option labelled "Git" is highlighted in blue and outlined in orange.](/assets/images/help/desktop/mac-select-git-pane.png) + ![Screenshot of the "Git" pane in the "Preferences" window. In the left sidebar, an option labeled "Git" is highlighted in blue and outlined in orange.](/assets/images/help/desktop/mac-select-git-pane.png) diff --git a/data/reusables/two_fa/add-additional-method.md b/data/reusables/two_fa/add-additional-method.md index e90f5866bd..425446b770 100644 --- a/data/reusables/two_fa/add-additional-method.md +++ b/data/reusables/two_fa/add-additional-method.md @@ -1,3 +1,3 @@ 1. In "Two-factor methods", find the method you want to add. Next to that method, click **Add**. - ![Screenshot of the "Two-factor methods" settings. To the right of "SMS/Text message," a button labelled "Add" is outlined in orange.](/assets/images/help/2fa/add-sms-number-option.png) + ![Screenshot of the "Two-factor methods" settings. To the right of "SMS/Text message," a button labeled "Add" is outlined in orange.](/assets/images/help/2fa/add-sms-number-option.png)