[Accessibility] Update screenshots in `pages` directory (#35567)

Co-authored-by: Sophie <29382425+sophietheking@users.noreply.github.com>

content/pages/configuring-a-custom-domain-for-your-github-pages-site/managing-a-custom-domain-for-your-github-pages-site.md

@@ -46,7 +46,6 @@ To set up a `www` or custom subdomain, such as `www.example.com` or `blog.exampl
 {% data reusables.repositories.sidebar-settings %}
 {% data reusables.pages.sidebar-pages %}
 4. Under "Custom domain", type your custom domain, then click **Save**. If you are publishing your site from a branch, this will create a commit that adds a `CNAME` file to the root of your source branch. If you are publishing your site with a custom {% data variables.product.prodname_actions %} workflow , no `CNAME` file is created. For more information about your publishing source, see "[AUTOTITLE](/pages/getting-started-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site)."
-  ![Save custom domain button](/assets/images/help/pages/save-custom-subdomain.png)
 
   {% note %}
   
@@ -56,7 +55,7 @@ To set up a `www` or custom subdomain, such as `www.example.com` or `blog.exampl
   
   {% endnote %}
 
-5. Navigate to your DNS provider and create a `CNAME` record that points your subdomain to the default domain for your site. For example, if you want to use the subdomain `www.example.com` for your user site, create a `CNAME` record that points `www.example.com` to `<user>.github.io`. If you want to use the subdomain `another.example.com` for your organization site, create a `CNAME` record that points `another.example.com` to `<organization>.github.io`. The `CNAME` record should always point to `<user>.github.io` or `<organization>.github.io`, excluding the repository name. {% data reusables.pages.contact-dns-provider %} {% data reusables.pages.default-domain-information %}
+1. Navigate to your DNS provider and create a `CNAME` record that points your subdomain to the default domain for your site. For example, if you want to use the subdomain `www.example.com` for your user site, create a `CNAME` record that points `www.example.com` to `<user>.github.io`. If you want to use the subdomain `another.example.com` for your organization site, create a `CNAME` record that points `another.example.com` to `<organization>.github.io`. The `CNAME` record should always point to `<user>.github.io` or `<organization>.github.io`, excluding the repository name. {% data reusables.pages.contact-dns-provider %} {% data reusables.pages.default-domain-information %}
 
 {% indented_data_reference reusables.pages.wildcard-dns-warning spaces=3 %}
 {% data reusables.command_line.open_the_multi_os_terminal %}
@@ -81,7 +80,6 @@ To set up an apex domain, such as `example.com`, you must configure a custom dom
 {% data reusables.repositories.sidebar-settings %}
 {% data reusables.pages.sidebar-pages %}
 4. Under "Custom domain", type your custom domain, then click **Save**. If you are publishing your site from a branch, this will create a commit that adds a `CNAME` file to the root of your source branch. If you are publishing your site with a custom {% data variables.product.prodname_actions %} workflow , no `CNAME` file is created. For more information about your publishing source, see "[AUTOTITLE](/pages/getting-started-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site)."
-  ![Save custom domain button](/assets/images/help/pages/save-custom-apex-domain.png)
 5. Navigate to your DNS provider and create either an `ALIAS`, `ANAME`, or `A` record. You can also create `AAAA` records for IPv6 support. {% data reusables.pages.contact-dns-provider %}
     - To create an `ALIAS` or `ANAME` record, point your apex domain to the default domain for your site. {% data reusables.pages.default-domain-information %}
     - To create `A` records, point your apex domain to the IP addresses for {% data variables.product.prodname_pages %}.
@@ -144,7 +142,7 @@ After you configure the apex domain, you must configure a CNAME record with your
 {% data reusables.repositories.sidebar-settings %}
 {% data reusables.pages.sidebar-pages %}
 4. Under "Custom domain," click **Remove**.
-  ![Save custom domain button](/assets/images/help/pages/remove-custom-domain.png)
+  ![Screenshot of a settings box to save or remove a custom domain on {% data variables.product.prodname_pages %} . To the right of a text box reading "example.com" is a button labeled "Remove" in red type.](/assets/images/help/pages/remove-custom-domain.png)
 
 ## Securing your custom domain
 

content/pages/configuring-a-custom-domain-for-your-github-pages-site/verifying-your-custom-domain-for-github-pages.md

@@ -41,7 +41,7 @@ Organization owners can verify custom domains for their organization.
 {% data reusables.profile.org_settings %}
 1. In the "Code, planning, and automation" section of the sidebar, click **{% octicon "browser" aria-label="The browser icon" %} Pages**.
 {% data reusables.pages.settings-verify-domain-setup %}
-1. Wait for your DNS configuration to change, this may be immediate or take up to 24 hours. You can confirm the change to your DNS configuration by running the `dig` command on the command line. In the command below, replace `ORGANIZATION` with the name of your organization and `example.com` with the domain you're verifying. If your DNS configuration has updated, you should see your new TXT record in the output.
+1. Wait for your DNS configuration to change. This may be immediate or take up to 24 hours. You can confirm the change to your DNS configuration by running the `dig` command on the command line. In the command below, replace `ORGANIZATION` with the name of your organization and `example.com` with the domain you're verifying. If your DNS configuration has updated, you should see your new TXT record in the output.
   ```
   dig _github-pages-challenge-ORGANIZATION.example.com +nostats +nocomments +nocmd TXT
   ```

content/pages/getting-started-with-github-pages/changing-the-visibility-of-your-github-pages-site.md

@@ -37,10 +37,9 @@ To use a shorter and more memorable domain for your privately published site, yo
 {% data reusables.pages.navigate-site-repo %}
 {% data reusables.repositories.sidebar-settings %}
 {% data reusables.pages.sidebar-pages %}
-3. Under "{% data variables.product.prodname_pages %}", select the **{% data variables.product.prodname_pages %} visibility** drop-down menu, then click a visibility.
-   ![Drop-down to choose a visibility for your site](/assets/images/help/pages/public-or-private-visibility.png)
+3. Under "{% data variables.product.prodname_pages %}", select the **{% data variables.product.prodname_pages %} visibility** dropdown menu, then select a visibility.
 4. To see your published site, under "{% data variables.product.prodname_pages %}", click **{% octicon "link-external" aria-label="The external link icon" %} Visit site**.
-   ![Screenshot of the "Visit site" button next to the URL of a privately published site](/assets/images/help/pages/click-private-pages-url-to-preview.png)
+  ![Screenshot of a confirmation message for {% data variables.product.prodname_pages %} listing the site's URL. To the right of a long blue URL, a button labeled "Visit site" is outlined in dark orange.](/assets/images/help/pages/click-private-pages-url-to-preview.png)
 
   {% note %}
 

content/pages/getting-started-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site.md

@@ -31,24 +31,16 @@ shortTitle: Configure publishing source
 {% data reusables.pages.sidebar-pages %}
 {% ifversion pages-custom-workflow %}
 1. Under "Build and deployment", under "Source", select **Deploy from a branch**.
-1. Under "Build and deployment", under "Branch", use the **None** or **Branch** dropdown menu and select a publishing source.
-
-   ![Screenshot of the dropdown menu to select a publishing source](/assets/images/help/pages/publishing-source-drop-down.png)
-
+1. Under "Build and deployment", use the branch dropdown menu and select a publishing source.
+   ![Screenshot of Pages settings in a {% data variables.product.prodname_dotcom %} repository. A menu to select a branch for a publishing source, labeled "None," is outlined in dark orange.](/assets/images/help/pages/publishing-source-drop-down.png)
 {% else %}
-3. Under "{% data variables.product.prodname_pages %}", use the **None** or **Branch** drop-down menu and select a publishing source.
-
-   ![Screenshot of the dropdown menu to select a publishing source](/assets/images/help/pages/publishing-source-drop-down.png)
-
+1. Under "{% data variables.product.prodname_pages %}", use the branch dropdown menu and select a publishing source.
+  ![Screenshot of Pages settings in a {% data variables.product.prodname_dotcom %} repository. A menu to select a branch for a publishing source, labeled "None," is outlined in dark orange.](/assets/images/help/pages/publishing-source-drop-down.png)
 {% endif %}
-1. Optionally, use the drop-down menu to select a folder for your publishing source.
-
-   ![Screenshot of the dropdown menu to select a folder for publishing source](/assets/images/help/pages/publishing-source-folder-drop-down.png)
-
+1. Optionally, use the folder dropdown menu to select a folder for your publishing source.
+  ![Screenshot of Pages settings in a {% data variables.product.prodname_dotcom %} repository. A menu to select a folder for a publishing source, labeled "/(root)," is outlined in dark orange.](/assets/images/help/pages/publishing-source-folder-drop-down.png)
 1. Click **Save**.
 
-   ![Screenshot of the button to save changes to publishing source settings](/assets/images/help/pages/publishing-source-save.png)
-
 ### Troubleshooting publishing from a branch
 
 {% ifversion pages-disable-symlinks-on-legacy-pages %}

content/pages/getting-started-with-github-pages/creating-a-custom-404-page-for-your-github-pages-site.md

@@ -20,7 +20,6 @@ shortTitle: Create custom 404 page
 {% data reusables.pages.navigate-publishing-source %}
 {% data reusables.files.add-file %}
 3. In the file name field, type `404.html` or `404.md`.
-  ![File name field](/assets/images/help/pages/404-file-name.png)
 4. If you named your file `404.md`, add the following YAML front matter to the beginning of the file:
   ```yaml
   ---

content/pages/getting-started-with-github-pages/securing-your-github-pages-site-with-https.md

@@ -35,7 +35,6 @@ All {% data variables.product.prodname_pages %} sites, including sites that are
 {% data reusables.repositories.sidebar-settings %}
 {% data reusables.pages.sidebar-pages %}
 3. Under "{% data variables.product.prodname_pages %}," select **Enforce HTTPS**.
-  ![Enforce HTTPS checkbox](/assets/images/help/pages/enforce-https-checkbox.png)
 
 ## Troubleshooting certificate provisioning ("Certificate not yet created" error)
 

content/pages/getting-started-with-github-pages/unpublishing-a-github-pages-site.md

@@ -27,8 +27,7 @@ When you unpublish your site, the site will no longer be available. Any existing
 {% data reusables.repositories.navigate-to-repo %}
 1. Under **{% data variables.product.prodname_pages %}**, next to the **Your site is live at** message, click {% octicon "kebab-horizontal" aria-label="the horizontal kebab icon" %}.
 1. In the menu that appears, select **Unpublish site**.
-
-   ![Drop down menu to unpublish site](/assets/images/help/pages/unpublish-site.png)
+   ![Screenshot of {% data variables.product.prodname_pages %} settings showing the URL of a live Pages site. Under the horizontal kebab icon to the right, the "Unpublish site" dropdown option is outlined in dark orange.](/assets/images/help/pages/unpublish-site.png)
 
 {% else %}
 
@@ -39,8 +38,8 @@ When you unpublish your site, the site will no longer be available. Any existing
 3. If the `gh-pages` branch was your publishing source, {% ifversion fpt or ghec %}skip to step 6{% else %}your site is now unpublished and you can skip the remaining steps{% endif %}.
 {% data reusables.repositories.sidebar-settings %}
 {% data reusables.pages.sidebar-pages %}
-5. Under "{% data variables.product.prodname_pages %}", use the **Source** drop-down menu and select **None.**
-  ![Drop down menu to select a publishing source](/assets/images/help/pages/publishing-source-drop-down.png)
+5. Under "{% data variables.product.prodname_pages %}", use the branch dropdown menu and select **None.**
+  ![Screenshot of Pages settings in a {% data variables.product.prodname_dotcom %} repository. A menu to select a branch for a publishing source, labeled "None," is outlined in dark orange.](/assets/images/help/pages/publishing-source-drop-down.png)
 {% data reusables.pages.update_your_dns_settings %}
 
 ## Unpublishing a user or organization site

content/pages/quickstart.md

@@ -24,15 +24,14 @@ This guide will lead you through creating a user site at `username.github.io`.
 
 {% data reusables.repositories.create_new %}
 1. Enter `username.github.io` as the repository name. Replace `username` with your {% data variables.product.prodname_dotcom %} username. For example, if your username is `octocat`, the repository name should be `octocat.github.io`.
-   ![Repository name field](/assets/images/help/pages/create-repository-name-pages.png)
+   ![Screenshot of {% data variables.product.prodname_pages %} settings in a repository. The repository name field contains the text "octocat.github.io" and is outlined in dark orange.](/assets/images/help/pages/create-repository-name-pages.png)
 {% data reusables.repositories.sidebar-settings %}
 {% data reusables.pages.sidebar-pages %}
 1. Under "Build and deployment", under "Source", select **Deploy from a branch**.
-1. Under "Build and deployment", under "Branch", use the **None** or **Branch** drop-down menu and select a publishing source.
-
-   ![Drop-down menu to select a publishing source](/assets/images/help/pages/publishing-source-drop-down.png)
+1. Under "Build and deployment", under "Branch", use the branch dropdown menu and select a publishing source.
+   ![Screenshot of Pages settings in a {% data variables.product.prodname_dotcom %} repository. A menu to select a branch for a publishing source, labeled "None," is outlined in dark orange.](/assets/images/help/pages/publishing-source-drop-down.png)
 1. Optionally, open the `README.md` file of your repository. The `README.md` file is where you will write the content for your site. You can edit the file or keep the default content for now.
-1. Visit `username.github.io` to view your new website. **Note:** It can take up to 10 minutes for changes to your site to publish after you push the changes to {% data variables.product.product_name %}.
+2. Visit `username.github.io` to view your new website. Note that it can take up to 10 minutes for changes to your site to publish after you push the changes to {% data variables.product.product_name %}.
 
 ## Changing the title and description
 

content/pages/setting-up-a-github-pages-site-with-jekyll/adding-a-theme-to-your-github-pages-site-using-jekyll.md

@@ -29,10 +29,8 @@ People with write permissions for a repository can add a theme to a {% data vari
 2. Navigate to *_config.yml*.
 {% data reusables.repositories.edit-file %}
 4. Add a new line to the file for the theme name.
-   - To use a supported theme, type `theme: THEME-NAME`, replacing THEME-NAME with the name of the theme as shown in the README of the theme's repository. For a list of supported themes, see "[Supported themes](https://pages.github.com/themes/)" on the {% data variables.product.prodname_pages %} site.
-   ![Supported theme in config file](/assets/images/help/pages/add-theme-to-config-file.png)
+   - To use a supported theme, type `theme: THEME-NAME`, replacing _THEME-NAME_ with the name of the theme as shown in the README of the theme's repository. For a list of supported themes, see "[Supported themes](https://pages.github.com/themes/)" on the {% data variables.product.prodname_pages %} site. For example, to select the Minima theme, type `theme: minima`.
    - To use any other Jekyll theme hosted on {% data variables.product.prodname_dotcom %}, type `remote_theme: THEME-NAME`, replacing THEME-NAME with the name of the theme as shown in the README of the theme's repository.
-   ![Unsupported theme in config file](/assets/images/help/pages/add-remote-theme-to-config-file.png)
 {% data reusables.files.write_commit_message %}
 {% data reusables.files.choose-commit-email %}
 {% data reusables.files.choose_commit_branch %}

content/pages/setting-up-a-github-pages-site-with-jekyll/setting-a-markdown-processor-for-your-github-pages-site-using-jekyll.md

@@ -26,8 +26,7 @@ You can use {% data variables.product.prodname_dotcom %} Flavored Markdown with
 {% data reusables.pages.navigate-site-repo %}
 2. In your repository, browse to the *_config.yml* file.
 {% data reusables.repositories.edit-file %}
-4. Find the line that starts with `markdown:` and change the value to `kramdown` or `GFM`.
-  ![Markdown setting in config.yml](/assets/images/help/pages/config-markdown-value.png)
+4. Find the line that starts with `markdown:` and change the value to `kramdown` or `GFM`. The full line should read `markdown: kramdown` or `markdown: GFM`.
 {% data reusables.files.write_commit_message %}
 {% data reusables.files.choose-commit-email %}
 {% data reusables.files.choose_commit_branch %}

data/reusables/enterprise-accounts/pages-tab.md

@@ -1,2 +1 @@
 1. Under "{% octicon "law" aria-label="The law icon" %} Policies", click **Pages**.
-    ![Pages tab in the enterprise sidebar](/assets/images/enterprise/business-accounts/pages-tab.png)

data/reusables/pages/choose-visibility.md

@@ -1,6 +1,5 @@
 {%- ifversion ghec %}
-1. Optionally, if you're publishing a project site from a private or internal repository, choose the visibility for your site. Under "{% data variables.product.prodname_pages %}", select the **{% data variables.product.prodname_pages %} visibility** drop-down menu, then click a visibility. For more information, see "[AUTOTITLE](/pages/getting-started-with-github-pages/changing-the-visibility-of-your-github-pages-site)".
-   ![Drop-down to select visibility for your site](/assets/images/help/pages/public-or-private-visibility.png)
-
+1. Optionally, if you're publishing a project site from a private or internal repository, choose the visibility for your site. Under "{% data variables.product.prodname_pages %}", select the visibility dropdown menu, then select public or private. For more information, see "[AUTOTITLE](/pages/getting-started-with-github-pages/changing-the-visibility-of-your-github-pages-site)."
+   ![Screenshot of Pages settings in a {% data variables.product.prodname_dotcom %} repository. A menu to select private or public visibility of the Pages site, labeled "Private," is outlined in dark orange.](/assets/images/help/pages/public-or-private-visibility.png)
    {% indented_data_reference reusables.pages.privately-publish-ghec-only spaces=3%}
 {%- endif %}

data/reusables/pages/create-repo-name.md

@@ -1,3 +1,3 @@
 1. Type a name for your repository and an optional description. If you're creating a user or organization site, your repository must be named `<user>.github.io` or `<organization>.github.io`. If your user or organization name contains uppercase letters, you must lowercase the letters.
 For more information, see "[AUTOTITLE](/pages/getting-started-with-github-pages/about-github-pages#types-of-github-pages-sites)."
-   ![Create repository field](/assets/images/help/pages/create-repository-name-pages.png)
+   ![Screenshot of {% data variables.product.prodname_pages %} settings in a repository. The repository name field contains the text "octocat.github.io" and is outlined in dark orange.](/assets/images/help/pages/create-repository-name-pages.png)

data/reusables/pages/enforce-https-custom-domain.md

@@ -1,2 +1 @@
-1. Optionally, to enforce HTTPS encryption for your site, select **Enforce HTTPS**. It can take up to 24 hours before this option is available. For more information, see "[AUTOTITLE](/pages/getting-started-with-github-pages/securing-your-github-pages-site-with-https)."
-  ![Enforce HTTPS for custom domains option](/assets/images/help/pages/enforce-https-custom-domains.png)
+1. Optionally, to enforce HTTPS encryption for your site, select **Enforce HTTPS**. It can take up to 24 hours before this option is available. For more information, see "[AUTOTITLE](/pages/getting-started-with-github-pages/securing-your-github-pages-site-with-https)."

data/reusables/pages/settings-verify-domain-confirm.md

@@ -1,5 +1,4 @@
 1. After confirming that your DNS configuration has updated, you can verify the domain. If the change wasn't immediate, and you have navigated away from the previous page, return to your Pages settings by following the first few steps and, to the right of the domain, click {% octicon "kebab-horizontal" aria-label="The horizontal kebab icon" %} and then click **Continue verifying**.
-  ![Continue verifying option on Pages settings](/assets/images/help/pages/verify-continue.png)
+  ![Screenshot of {% data variables.product.prodname_pages %} settings showing verified domains. Under the horizontal kebab icon to the right, the "Continue verifying" dropdown option is outlined in dark orange.](/assets/images/help/pages/verify-continue.png)
 1. To verify your domain, click **Verify**.
-  ![Verify button on Pages settings](/assets/images/help/pages/verify-button.png)
-1. To make sure your custom domain remains verified, keep the TXT record in your domain's DNS configuration.
+2. To make sure your custom domain remains verified, keep the TXT record in your domain's DNS configuration.

data/reusables/pages/settings-verify-domain-setup.md

@@ -1,6 +1,5 @@
 1. On the right, click **Add a domain**.
-  ![Add domain button on Pages settings](/assets/images/help/pages/verify-add-domain.png)
-1. Under "What domain would you like to add?", enter the domain you wish to verify and click **Add domain**.
-  ![Domain text field and Add domain button on Pages settings](/assets/images/help/pages/verify-enter-domain.png)
-1. Follow the instructions under "Add a DNS TXT record" to create the TXT record with your domain hosting service.
-  ![DNS TXT record information on Pages settings](/assets/images/help/pages/verify-dns.png)
+2. Under "What domain would you like to add?," enter the domain you wish to verify and select **Add domain**.
+    ![Screenshot of a text box to add a verified domain on {% data variables.product.prodname_pages %}, filled in with "example.com." Below the text is a green button labeled "Add domain."](/assets/images/help/pages/verify-enter-domain.png)
+3. Follow the instructions under "Add a DNS TXT record" to create the TXT record with your domain hosting service.
+    ![Screenshot of {% data variables.product.prodname_pages %} instructions to add a TXT record to the DNS configuration of example.com.](/assets/images/help/pages/verify-dns.png)

data/reusables/pages/sidebar-pages.md

@@ -2,5 +2,4 @@
 1. In the "Code and automation" section of the sidebar, click **{% octicon "browser" aria-label="The browser icon" %} Pages**.
 {% else %}
 1. In the left sidebar, click **Pages**.
-   ![Page tab in the left-hand sidebar](/assets/images/help/pages/pages-tab.png)
 {% endif %}

data/reusables/pages/visit-site.md

@@ -1,5 +1,5 @@
 1. To see your published site, under "{% data variables.product.prodname_pages %}", click **{% octicon "link-external" aria-label="The external link icon" %} Visit site**.
-![Screenshot of the "Visit site" button next to the URL of a published site](/assets/images/help/pages/click-pages-url-to-preview.png)
+![Screenshot of a confirmation message for {% data variables.product.prodname_pages %} listing the site's URL. To the right of the URL, a button labeled "Visit site" is outlined in dark orange.](/assets/images/help/pages/click-pages-url-to-preview.png)
 
   {% note %}