Add alt text to images missing it (#10504)

Resolves flutter/website#9527

.gitignore

@@ -1,4 +1,5 @@
 _site
+.cache
 .*-cache
 .*-metadata
 .DS_Store

firebase.json

@@ -630,7 +630,7 @@
         ]
       },
       {
-        "source": "**/*.@(jpg|jpeg|gif|png|webp|webm|svg|md|css|js)",
+        "source": "**/*.@(avif|jpg|jpeg|gif|png|webp|webm|svg|md|css|js)",
         "headers": [
           { "key": "Cache-Control", "value": "max-age=3600" },
           { "key": "Access-Control-Allow-Origin", "value": "*" }

src/_includes/docs/android-ios-figure-pair.md

@@ -1,14 +1,10 @@
 <figure class="site-figure">
   <div class="site-figure-container">
-      <img src='/assets/images/docs/get-started/android/{{include.image}}'
-           alt='{{include.alt}} on Android'
-           class='{{include.class}}'>
+      <img src='/assets/images/docs/get-started/android/{{include.image}}' alt='{{include.alt}} on Android' class='{{include.class}}'>
       <figcaption class="figure-caption">Android</figcaption>
   </div>
   <div class="site-figure-container">
-      <img src='/assets/images/docs/get-started/ios/{{include.image}}'
-           alt='{{include.alt}} on iOS'
-           class='{{include.class}}'>
+      <img src='/assets/images/docs/get-started/ios/{{include.image}}' alt='{{include.alt}} on iOS' class='{{include.class}}'>
       <figcaption class="figure-caption">iOS</figcaption>
   </div>
 </figure>

src/content/data-and-backend/state-mgmt/simple.md

@@ -27,6 +27,7 @@ state management from other reactive frameworks,
 you can find packages and tutorials listed on the [options page][].
 
 ## Our example 
+
 <img src='/assets/images/docs/development/data-and-backend/state-mgmt/model-shopper-screencast.gif' alt='An animated gif showing a Flutter app in use. It starts with the user on a login screen. They log in and are taken to the catalog screen, with a list of items. The click on several items, and as they do so, the items are marked as "added". The user clicks on a button and gets taken to the cart view. They see the items there. They go back to the catalog, and the items they bought still show "added". End of animation.' class='site-image-right'>
 
 For illustration, consider the following simple app.

src/content/deployment/android.md

@@ -262,17 +262,17 @@ Opting in allows Flutter to automatically depend on
 When you try to build and run your app with the **Run** and **Debug**
 options in your IDE, your build might fail with the following message:
 
-<img src='/assets/images/docs/deployment/android/ide-build-failure-multidex.png' width="100%" alt='screenshot of build failure because Multidex support is required'>
+<img src='/assets/images/docs/deployment/android/ide-build-failure-multidex.png' width="100%" alt='Build failure because Multidex support is required'>
 
 To enable multidex from the command line,
 run `flutter run --debug` and select an Android device:
 
-<img src='/assets/images/docs/deployment/android/cli-select-device.png' width="100%" alt='screenshot of selecting an Android device'>
+<img src='/assets/images/docs/deployment/android/cli-select-device.png' width="100%" alt='Selecting an Android device with the flutter CLI.'>
 
 When prompted, enter `y`.
 The Flutter tool enables multidex support and retries the build:
 
-<img src='/assets/images/docs/deployment/android/cli-multidex-added-build.png' width="100%" alt='screenshot of a successful build after adding multidex'>
+<img src='/assets/images/docs/deployment/android/cli-multidex-added-build.png' width="100%" alt='The output of a successful build after adding multidex.'>
 
 :::note
 Multidex support is natively included when targeting
@@ -528,13 +528,13 @@ In Android Studio, open the existing `android/`
 folder under your app's folder. Then,
 select **build.gradle (Module: app)** in the project panel:
 
-<img src='/assets/images/docs/deployment/android/gradle-script-menu.png' width="100%" alt='screenshot of gradle build script menu'>
+<img src='/assets/images/docs/deployment/android/gradle-script-menu.png' width="100%" alt='The Gradle build script menu in Android Studio.'>
 
 Next, select the build variant. Click **Build > Select Build Variant**
 in the main menu. Select any of the variants in the **Build Variants**
 panel (debug is the default):
 
-<img src='/assets/images/docs/deployment/android/build-variant-menu.png' width="100%" alt='screenshot of build variant menu'>
+<img src='/assets/images/docs/deployment/android/build-variant-menu.png' width="100%" alt='The build variant menu in Android Studio with Release selected.'>
 
 The resulting app bundle or APK files are located in
 `build/app/outputs` within your app's folder.

src/content/get-started/codelab-web.md

@@ -20,7 +20,7 @@ does work on mobile and desktop
 once you download and configure the appropriate tooling.
 :::
 
-<img src="/assets/images/docs/get-started/sign-up.gif" alt="The web app that you'll be building" class='site-image-right'>
+<img src="/assets/images/docs/get-started/sign-up.gif" alt="The web app that you'll be building." class='site-image-right'>
 
 This is a guide to creating your first Flutter **web** app.
 If you are familiar with object-oriented programming,

src/content/get-started/flutter-for/declarative.md

@@ -29,7 +29,7 @@ This, however, requires a slight shift in thinking for how to manipulate UI.
 
 Consider a simplified example below:
 
-<img src="/assets/images/docs/declarativeUIchanges.png" alt="View B (contained by view A) morphs from containing two views, c1 and c2, to containing only view c3">
+<img src="/assets/images/docs/declarativeUIchanges.png" alt="View B (contained by view A) morphs from containing two views, c1 and c2, to containing only view c3.">
 
 In the imperative style, you would typically go to ViewB's owner
 and retrieve the instance `b` using selectors or with `findViewById` or similar,

src/content/get-started/flutter-for/swiftui-devs.md

@@ -141,7 +141,7 @@ UnconstrainedBox(
 )
 ```
 
-<img src="/assets/images/docs/ui/layout/layout-14.png" alt="When parents pass unbounded constraints to children, and the children are expanding, then there is an overflow warning">
+<img src="/assets/images/docs/ui/layout/layout-14.png" alt="When parents pass unbounded constraints to children, and the children are expanding, then there is an overflow warning.">
 
 To learn how constraints work in Flutter,
 see [Understanding constraints][].

src/content/platform-integration/ios/app-extensions.md

@@ -32,10 +32,9 @@ add the extension point *target* to your Xcode project.
    Flutter project directory.
 1. In Xcode, select **File -> New -> Target** from the menu bar. 
 
-    <figure class="site-figure {{include.class}}">
+    <figure class="site-figure">
     <div class="site-figure-container">
-        <img src='/assets/images/docs/development/platform-integration/app-extensions/xcode-new-target.png'
-        height='300'>
+        <img src='/assets/images/docs/development/platform-integration/app-extensions/xcode-new-target.png' alt='Opening the File -> New menu, then selecting Target in Xcode.' height='300'>
     </div>
     </figure>
 1. Select the app extension you intend to add.
@@ -97,7 +96,7 @@ To add a target to an App Group:
     1. Select an App Group from the list.
     1. Click **+** to add a new App Group.
 
-{% include docs/app-figure.md image="development/platform-integration/app-extensions/xcode-app-groups.png" %}
+{% include docs/app-figure.md image="development/platform-integration/app-extensions/xcode-app-groups.png" alt="Selecting an App Group within an Xcode Runner target configuration." %}
 
 When two targets belong to the same App Group,
 they can read from and write to the same source.
@@ -135,10 +134,9 @@ share content with other apps,
 such as sharing a picture to create
 a new post on a social media app.
 
-<figure class="site-figure {{include.class}}">
+<figure class="site-figure">
     <div class="site-figure-container">
-        <img src='/assets/images/docs/development/platform-integration/app-extensions/share-extension.png'
-        height='300'>
+        <img src='/assets/images/docs/development/platform-integration/app-extensions/share-extension.png' alt='An example of an entry added to the share menu by a Flutter app' height='300'>
     </div>
 </figure>
 
@@ -174,10 +172,9 @@ use an iOS simulator to test your extension in debug mode.
    share extension's frameworks and libraries list.
    Make sure the embed column says "Embed & Sign".
 
-   <figure class="site-figure {{include.class}}">
+   <figure class="site-figure">
        <div class="site-figure-container">
-           <img src='/assets/images/docs/development/platform-integration/app-extensions/embed-framework.png'
-           height='300'>
+           <img src='/assets/images/docs/development/platform-integration/app-extensions/embed-framework.png' alt='The Flutter.xcframework file being marked as Embed & Sign in Xcode.' height='300'>
        </div>
    </figure>
 
@@ -192,10 +189,9 @@ use an iOS simulator to test your extension in debug mode.
       **Based on configuration file** drop-down menu for your
       extension matches the one selected for the normal app target.
 
-    <figure class="site-figure {{include.class}}">
+    <figure class="site-figure">
         <div class="site-figure-container">
-            <img src='/assets/images/docs/development/platform-integration/app-extensions/xcode-configurations.png'
-            height='300'>
+            <img src='/assets/images/docs/development/platform-integration/app-extensions/xcode-configurations.png' alt='An example Xcode Runner configuration with each property set to: Based on configuration file.' height='300'>
         </div>
     </figure>
 
@@ -212,10 +208,9 @@ use an iOS simulator to test your extension in debug mode.
        you should omit the `<YourShareExtensionTargetName>.`
        portion.<br>
 
-    <figure class="site-figure {{include.class}}">
+    <figure class="site-figure">
         <div class="site-figure-container">
-            <img src='/assets/images/docs/development/platform-integration/app-extensions/share-extension-info.png'
-            height='300'>
+            <img src='/assets/images/docs/development/platform-integration/app-extensions/share-extension-info.png' alt='Setting the NSExtensionPrincipalClass property in the Info.plist file within Xcode.' height='300'>
         </div>
     </figure>
 

src/content/release/breaking-changes/flutter-driver-migration.md

@@ -1,6 +1,6 @@
 ---
 title: Migrating from flutter_driver
-description: >
+description: >-
   Learn how to migrate existing flutter_driver tests to integration_test.
 ---
 
@@ -26,13 +26,11 @@ functionality:
 * On the right, there's a details screen that displays the plant name
   and species.
 * On app start, when no plant is selected, a text asking the user to select
-a plant is displayed
+  a plant is displayed
 * The list of plants is loaded from a local JSON file located in the
-  assets folder.
+  `/assets` folder.
 
-<img src='/assets/images/docs/integration-test/migration-1.png'
-class="mw-100" 
-alt="Starter project screenshot">
+<img src='/assets/images/docs/integration-test/migration-1.png' class="mw-100" alt="Starter project screenshot">
 
 You can find the full code example in the [Example Project][] folder.
 
@@ -56,7 +54,7 @@ This file won't be necessary anymore when using `integration_test`.
 
 To start using the `integration_test` package,
 add the `integration_test` to
-your pubspec.yaml file if you haven't yet:
+your `pubspec.yaml` file if you haven't yet:
 
 ```yaml
 dev_dependencies: