Find the best guidance and tools to meet the accessibility regulations.

“AI can do what you do, right?*” That’s been the question we’ve been getting as writers and content designers — whether literally or implicitly — since LLMs started joining the conversation. In some ways it’s a good question. AI has gone from laughably quaint to actually pretty good in record time.…

Find out how to prepare for an emergency in your area. There are simple and effective steps you can take to be more prepared.

Home » Toolbox » Safelinks original URL decoder A little app that takes the mangled URLs generated by Microsoft 365’s Safelinks link checking service and decodes them to recover the original target. Just pop the Safelinks redirect URL in this widget and press enter or click the button. Then copy the retrieved URL and use it wherever you need it. Outlook Safelinks URL Decode Safelinks URL Original URL Copy original URL Reset ## What data do we store? None. Any URL you paste here is dealt with entirely in your browser. No data is sent to our server, or to analytics. We don’t know what you do when you’re here. You can view the javascript that does this below. ## Why create this? We use Microsoft 365, so links in all the emails we receive are passed through a link-checking service called Safelinks to check that the endpoint is not malicious. Which is great, but … In the process, link URLs are transformed into something like this: > http://safelinks.protection.outlook.com/?url=https%3A%2F%2Fdesign.scotentblog.co.uk%2Fsafelinks-original-url-decoder&data=05%7C01%7Cxxxxx.xxxxxx%40scotent.co.uk%7C014af0a3586b4b6935e608da39ca8a1c%7C50374495fdde4d04bc5c574982680e19%7C0%7C0%7C637885839322117164%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000%7C%7C%7C&sdata=oQY%2BD%2FHdElO%2BsWIKPxSh%2FCZhqVnOlqnemz9ocQlkDGY%3D&reserved=0 Content authors are often under great time pressure to publish, and will simply copy links from an email to publish on the web. This can be problematic, because: * Safelinks redirects may not work for everyone * The URLs are too long for some older browsers to handle * They are not human-readable, so hide the ultimate destination * They mess with analytics data * They are served over http, not https, so * potentially vulnerable to interception * could harm search ranking if we have too many links to insecure resources * If you look closely, there’s an email address in there (I’ve changed it to xxxxx.xxxxxx@ in the example) which is going to be available for anyone on the web to harvest So, on the web, it’s best to decode Safelinks URLs and use the original target for your hrefs instead. ## Code The `copyToClipboard()` function is called by an `onClick` event in the button. let btn = document.getElementById("btn"); let str = ""; btn.addEventListener("click", function (event) { event.preventDefault(); str = document.getElementById("input").value; var start, end; start = str.indexOf("=") + 1; end = str.indexOf("&"); let url = str.slice(start, end); url = decodeURIComponent(url); document.getElementById("output").value = url; document.getElementById("result").setAttribute("style", "display: block;"); }); function copyToClipboard() { event.preventDefault(); var text = document.getElementById("output").value; navigator.clipboard.writeText(text).then( function () { alert("Link has been copied"); }, function (err) { alert( "Looks like your browser does not support copying to the clipboard. Select and copy the text manually." ); } ); } Code language: JavaScript (javascript) David O'Brien Website | + postsBio I'm a service designer in Scottish Enterprise's unsurprisingly-named service design team. I've been a content designer, editor, UX designer and giant haystacks developer on the web for (gulp) over 25 years. * David O'Brien __What’s in a name? * David O'Brien __Why people use subtitles and captioning * David O'Brien __How to create a user story map with a Miro table * David O'Brien __Would you hire Sam? ## Possibly related * How this site is performing * 2025 performance data * Good services scale * Alt text decide-o-matic

Home » Toolbox » Alt text decide-o-matic Writing alternate text for non-text content can be hard. This widget can help you decide which approach to take. Alt text decide-o-matic This application requires javascript. Please make sure javascript is enabled in your browser’s settings. About this This decision tree will help you understand how best to include text alternatives for image-based content. It is based on the W3C’s alt text decision tree. All errors are mine. Give feedback, tell me what’s broken, by leaving a comment here, or via Mastodon. Start now Does the image contain text? Yes No Next Please select either Yes or No, then click Next Is the text also present as real text nearby? Yes No Next Please select either Yes or No, then click Next Is the text only shown for visual effects? Yes No Next Please select either Yes or No, then click Next Does the text have a specific function, for example as an icon? Yes No Next Please select either Yes or No, then click Next Is the text in the image not present otherwise? Yes No Next Please select either Yes or No, then click Next Is the image used in a link or a button, and would it be hard or impossible to understand what the link or the button does, if the image wasn’t there? Yes No Next Please select either Yes or No, then click Next Does the image contribute meaning to the current page or context? Yes No Next Please select either Yes or No, then click Next Is the image a simple graphic or photograph? Yes No Next Please select either Yes or No, then click Next Is the image a a graph or complex piece of information? Yes No Next Please select either Yes or No, then click Next Does the image show content that is redundant to real text nearby? Yes No Next Please select either Yes or No, then click Next Is the image purely decorative or not intended for the user? Yes No Next Please select either Yes or No, then click Next ## Use alt=”” Use an empty alt attribute. See Decorative Images. Start over ## Communicate the function Use the alt attribute to communicate the function of the image. See Functional Images. Start over ## Include the text Use the alt attribute to include the text of the image. See Images of Text. Start over ## Communicate the destination of the link Use the alt attribute to communicate the destination of the link or action taken. See Functional Images. Start over ## Briefly describe the image Use a brief description of the image in a way that conveys that meaning in the alt attribute. See Informative Images. Start over ## Include the information elsewhere Include the information contained in the image elsewhere on the page. See Complex Images. Start over ## Use alt=”” Use an empty alt attribute. See (redundant) Functional Images. Start over David O'Brien Website | + postsBio I'm a service designer in Scottish Enterprise's unsurprisingly-named service design team. I've been a content designer, editor, UX designer and giant haystacks developer on the web for (gulp) over 25 years. * David O'Brien __What’s in a name? * David O'Brien __Why people use subtitles and captioning * David O'Brien __How to create a user story map with a Miro table * David O'Brien __Would you hire Sam? ## Possibly related * How this site is performing * 2025 performance data * How to create accessible Word documents * Good services scale

Lately, I’ve been thinking a lot about how to explain complicated things in writing, and how to help people actually understand them. Two people have inspired that reflection: Ylva Bjelle and Randall Munroe. They come from very different backgrounds, but both emphasize that writing too often relies on overly technical or specialized vocabulary. I first...

Find Task-based intranet content: a step by step guide to user-centred design by Lizzie Bruce at Blurb Books. “Really good stuff from someone who knows her intra...

I offer comprehensive, introductory pathway courses into user-centred design and content design. Yesterday someone asked me a great question about them: “What is the main difference between t…

Explore user-centred design and content design online training courses from Cake.

Martin welcomed 5 new starters – 3 user researchers and 2 content designers – to the team in week 227. He co-ran a product review session with a justice service and helped prepare upcoming Service Sta...