<div dir="ltr"><div>Hi Christine<br></div><div><br></div><div>Here are my rules of thumb for writing instructions with screenshots for web-based apps:</div><div><br></div><div><b>Use but don't rely on screenshots</b></div><div>Write instructions first, making sure that interface descriptions or references to interface elements make sense without the screenshots, and then add screenshots with a blank or minimal alt text.</div><div><br></div><div><b>Reduce verbal clutter</b></div><div>Just like visual clutter, verbal clutter can increase cognitive load and make instructions harder to understand and follow. Avoid or minimise:</div><div><ul><li>redundant image descriptions that duplicate what's already covered in the surrounding text;<br></li><li>unnecessary descriptions that are unlikely to be useful to someone, who won't see the interface.<br></li></ul></div><div><b>Check 'under the hood'</b><br></div><div>What the visual label of an interface element shows may not necessarily be what the screen reader will read out. So, when describing elements such as image or icon buttons, always check the underlying markup and incorporate 'hidden' labels if they differ from the visible labels. </div><div><br></div><div>The most obvious example is a search button with a magnifying glass icon as a visual indicator and a word 'search' as a title or alt attribute. The easiest way to check this is to inspect the markup in a browser. You can also try the WAVE tool and select 'No Styles' option from the sidebar controls. This option strips the CSS, so you'll be able to compare the markup with the visual display.</div><div><br></div><div>Hope this helps.</div><div><br></div><div>Including keyboard shortcuts will benefit many people so it is definitely worth doing. Is this what you're looking for? <a href="https://support.office.com/en-us/article/shortcut-keys-in-office-e765366f-24fc-4054-870d-39b214f223fd">Shortcut keys in Office</a> </div><div><br></div><div>cheers</div><div>Iza</div><br clear="all"><div><div dir="ltr" class="gmail_signature" data-smartmail="gmail_signature"><div dir="ltr"><div><div dir="ltr"><div><div dir="ltr"><div dir="ltr"><div dir="ltr"><div dir="ltr"><div dir="ltr"><div dir="ltr"><div dir="ltr"><div dir="ltr"><div dir="ltr"><div dir="ltr"><div dir="ltr"><div dir="ltr"><b>Iza Bartosiewicz | <span style="font-size:12.8px">Web Coordinator</span></b><div>Internet Services, Library and Student Success</div><div><br></div><div>Building 94, 23 Cardigan Street</div><div>Carlton VIC 3053</div><div><span style="font-size:12.8px">Tel. +61 3 9925 3103</span><br></div><div><a href="mailto:iza.bartosiewicz@rmit.edu.au" target="_blank">iza.bartosiewicz@rmit.edu.au</a></div><div><a href="http://www1.rmit.edu.au/library" target="_blank">www.rmit.edu.au/</a></div><div><a href="http://twitter.com/Mr0wka18" target="_blank">@Mr0wka18</a></div><div><a href="http://www.linkedin.com/in/izabartosiewicz" target="_blank">www.linkedin.com/in/izabartosiewicz</a></div><div><br></div><div><div><i>RMIT University acknowledges the people of the Woi wurrung and Boon wurrung language groups of the eastern Kulin Nations on whose unceded lands we conduct the business of the University. RMIT University respectfully acknowledges their Ancestors and Elders, past and present.</i></div><div><i><br></i></div><div><i>RMIT also acknowledges the Traditional Custodians and their Ancestors of the lands and waters across Australia where we conduct our business.</i></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div><br><div class="gmail_quote"><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div>Date: Tue, 25 Sep 2018 14:20:02 +0000<br>
From: Christine Robinson <<a href="mailto:crobinson@ggc.edu" target="_blank">crobinson@ggc.edu</a>><br>
To: Access Technology Higher Education Network<br>
<<a href="mailto:athen-list@u.washington.edu" target="_blank">athen-list@u.washington.edu</a>><br>
Subject: [Athen] Alt text for instructions with screenshots<br>
Message-ID:<br>
<<a href="mailto:BN6PR04MB07543642981C7577242454BDAA160@BN6PR04MB0754.namprd04.prod.outlook.com" target="_blank">BN6PR04MB07543642981C7577242454BDAA160@BN6PR04MB0754.namprd04.prod.outlook.com</a>><br>
<br>
Content-Type: text/plain; charset="us-ascii"<br>
<br>
Hi all -<br>
<br>
For our campus, I'm tasked with creating instructions for various elements in Office 365. Obviously, I want to make the instructions accessible - and I haven't dealt with this kind of thing before.<br>
<br>
My instructions include steps such as (for example) "In the upper left corner of the Office 365 window, click the icon for the App Launcher," followed by a screenshot with the icon circled.<br>
<br>
It seems like the alt text should not be a description of the screenshot, however. I suspect a screen reader user doesn't really care what the icon looks like. Since alt text is supposed to convey the same information that a sighted user would obtain from an image, it makes sense to me that the alt text should offer instructions on how to accomplish the same result using keyboard commands.<br>
<br>
For example, if my text instructions say, "in the upper left corner, click the icon..." perhaps the alt text for the image should say something like, "Tab to the icon for the App Launcher." ???<br>
<br>
So my questions for you all are:<br>
<br>
1. Is it correct that, in this case, alt text should provide instructions on how to navigate to the icon instead of a description of the image?<br>
<br>
2. Where can I find more instructions re. using Office 365 features via keyboard commands? I've searched on the Microsoft site but haven't succeeded in finding anything.<br>
<br>
Thanks!<br>
<br>
Christine Robinson | Technical Trainer/Writer | Center for Teaching Excellence<br>
Georgia Gwinnett College | 1000 University Center Lane| Lawrenceville, GA 30043<br>
<br><br>
</div>
</blockquote></div></div>