Creating a Comparable Experience

You should specify a content description for any UI widget that provides information to the user but does not use text to do it (such as an image). If there is a widget that does not provide any value other than decoration, you should explicitly tell TalkBack to ignore it by setting its content description to null.

You might think, “If a user cannot see, why does he or she need to know whether there is an image?” But you should not make assumptions about your users. More importantly, you should make sure a user with a visual impairment gets the same amount of information and functionality as a user without one. The overall experience and flow may be different, but all users should be able to get the same functionality from the app.

Good accessibility design is not about reading out every single thing on the screen. Instead, it focuses on comparable experiences. Which information and context are important?

Right now, the user experience related to the crime photo is limited. TalkBack will always announce that the image is not set, even if an image is indeed set. To see this for yourself, press the camera button and then double-tap anywhere on the screen to activate it. The camera app launches and TalkBack announces, “Camera.” Capture a photo by pressing on the shutter button and then double-tapping anywhere on the screen.

Accept the photo. (The steps will be different depending on which camera app you are using, but remember that you will need to press to select a button and then double-tap anywhere to activate it.) The crime details screen will appear with the updated photo. Press the photo to give it accessibility focus. TalkBack announces, “Crime scene photo (not set).”

To provide more relevant information to TalkBack users, dynamically set the content description of the ImageView in updatePhotoView().

Listing 19.4  Dynamically setting content description (CrimeFragment.java)

public class CrimeFragment extends Fragment {
    ...
    private void updatePhotoView() {
        if (mPhotoFile == null || !mPhotoFile.exists()) {
            mPhotoView.setImageDrawable(null);
            mPhotoView.setContentDescription(
                    getString(R.string.crime_photo_no_image_description));
        } else {
            ...
            mPhotoView.setImageBitmap(bitmap);
            mPhotoView.setContentDescription(
                    getString(R.string.crime_photo_image_description));
        }
    }
}

Now, whenever the photo view is updated, updatePhotoView() will update the content description. If mPhotoFile is empty, it will set the content description to indicate that there is no photo. Otherwise, it will set the content description to indicate that a photo is present.

Run CriminalIntent. View the crime detail screen for the crime you just added a photo to. Press on the photo of the crime scene (Figure 19.8). TalkBack proudly announces, “Crime scene photo (set).”

Figure 19.8  Focusable ImageView with dynamic description

Screenshot shows CriminalIntent app screen in Android.

Using labels to provide context

Before moving on, give your new crime a title. Press on the title EditText box. TalkBack announces, “Edit box. Enter a title for the crime” (Figure 19.9).

Figure 19.9  EditText hint

Screenshot shows CriminalIntent app screen in Android.

By default, TalkBack announces whatever content is in the EditText. Because you have not entered a title, this means TalkBack reads the value you specified for android:hint. So you do not need to (and should not) specify a content description for your EditText.

However, there is a problem. To see it for yourself, enter the title “Sticker vandalism.” Then press on the EditText. TalkBack announces, “Edit box. Sticker vandalism” (Figure 19.10).

Figure 19.10  EditText with crime title

Screenshot shows CriminalIntent app screen in Android. The title reads, Sticker vandalism and is highlighted. A chat bubble on the left reads, Edit bix, Sticker vandalism.

The problem is that TalkBack users lose context about what the EditText represents once they enter a title. Sighted users can see that the EditText is for the title because of the TextView above it that serves as a label. Given that crime data is pretty simple, TalkBack users could probably infer what the EditText is for based on its contents. But this means you are making TalkBack users do more work than non-TalkBack users.

You can easily provide the same context for TalkBack users by indicating the relationship between the TextView and EditText. Do this by adding an android:labelFor attribute to the label in your layout file.

Listing 19.5  Setting label for EditText (res/layout/fragment_crime.xml)

<TextView
    style="?android:listSeparatorTextViewStyle"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="@string/crime_title_label"
    android:labelFor="@+id/crime_title"/>

The android:labelFor attribute tells TalkBack that the TextView serves as a label to the view specified by the ID value. labelFor is defined on the View class, so you can associate any view as the label for any other view. Note that you must use the @+id syntax here because you are referring to an ID that has not been defined at that point in the file. You could now remove the + from the android:id="@+id/crime_title" line in the EditText’s definition, but it is not necessary to do so.

Run your app and press on the title EditText. TalkBack now announces, “Edit box. Sticker vandalism, for title.”

Congratulations on making your app more accessible. One of the most common reasons developers cite for not making their apps more accessible is lack of awareness about the topic. You are now aware and can see how easy it is to make your apps more usable to TalkBack users. And, as a bonus, improving your app’s TalkBack support means it will also be more likely to support other accessibility services, such as BrailleBack.

Designing and implementing an accessible app may seem overwhelming. People make entire careers out of being accessibility engineers. But rather than forgoing accessibility altogether because you fear you will not do it right, start with the basics: Make sure every meaningful piece of content is reachable and readable by TalkBack. Make sure TalkBack users get enough context to understand what is going on in your app – without having to listen to extraneous information that wastes their time. And, most importantly, listen to your users and learn from them.

With that, you have reached the end of your time with CriminalIntent. In 13 chapters, you have created a complex application that uses fragments, talks to other apps, takes pictures, stores data, and even speaks Spanish. Why not celebrate with a piece of cake?

Just be sure to clean up after yourself. You never know who might be watching.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.227.239.160