4 ms·
The images don't load for me for whatever reason, but the alt text is set up nicely, which is great to see! Image: /design/human-interface-guidelines/foundat
by KronisLV 4y ago
The images don't load for me for whatever reason, but the alt text is set up nicely, which is great to see!
Image: /design/human-interface-guidelines/foundations/writing/images/fall-detection-message.png
Alt: A screenshot of a Fall Detection message that reads: it looks like you've taken a hard fall.
Image: /design/human-interface-guidelines/foundations/writing/images/move-streak-message.png
Alt: A screenshot of an Activity message that reads: you set a personal record for your longest daily Move streak, 35 days!
Image: /design/human-interface-guidelines/foundations/writing/images/handwashing-settings.png
Alt: A screenshot showing the Handwashing Timer description, which reads: Apple Watch can detect when you're washing your hands and start a 20-second timer.
These are pretty useful for not just when using a screen reader or maybe a text based browser or something, but also when the images themselves break.
- toastal 4y agoJust as important of a side note for supporting text-based browsers and screen readers: if the images are purely decorative, you should make it alt="". https://www.w3.org/WAI/tutorials/images/decorative/ https://www.w3.org/WAI/tutorials/images/decorative/ Don't do: <h1><img src alt="ACME logo">ACME</h1>.
- ryanjamurphy 4y agoHuh, this is a good tip. I've always provided a rich description of decorative images, because I didn't want screen readers to "miss out," but apparently that was a bad idea!
- snowwrestler 4y agoWell the logo might not be a great example, as it is often clickable to the home page and should have alt text so people know what it is. A better example is when a site has little stock photo thumbnails with article titles on a navigational page. The screen reader can read the title text; knowing what’s in the thumbnail adds nothing. Images should only have alt text when they contain “real” content (for example if it is an original photo that is relevant to the associated story).
- toastal 4y agoA logo is a perfect example because so many sites are failing to do it correctly. When you do <h1><img src alt="ACME logo">ACME</h1> What gets rendered and read is what you would never want ACME logoACME If you don't have or use actual text nearby then you just do this: <h1><img src alt="ACME"></h1>
- snowwrestler 4y agoGot it, thanks for following up
- grumple 4y agoSame. Getting 403 Forbidden.
- qwertox 4y agoI'm getting a 404, at least for one of the images [0]. [0] https://developer.apple.com/design/human-interface-guidelines/foundations/writing/images/fall-detection-message.png https://developer.apple.com/design/human-interface-guideline...
- spetryk 4y agoIs the fall detection alt-text actually that good here? There were more elements in that image, which I assume people who use screen readers or are reading the alt-text for broken images would want to know. The "EMERGENCY SOS" slider and "I'm OK" button give more examples of the "straightforward and direct" language that the article text references. I also learned something about that feature itself (besides that it existed in the first place) - Apple's design choices to make the "SOS" a slider, followed by a larger/easier to press button for "I'm OK". Even though it wasn't related to the point of the article, it was information that I wouldn't have learned had I just read that alt-text. Is this part of accessibility guidelines for alt-text? Shouldn't they convey the same information, whether it's in image or text form, even if it's not directly relevant to the point of an article? I can also imagine that people have different preferences - maybe some want all the information like I mentioned, whereas others don't want to distract from the point of what they're reading. I wonder which way the alt-text guidelines lean in practice.