Accessibility, Data Visualization, Microsoft Technologies

How a new custom PowerPoint template is helping us to be more effective presenters

DCAC recently had a custom PowerPoint template built for us. We use PowerPoint for teaching technical concepts, delivering sales and marketing presentations, and more. One thing I love about working at DCAC is that each of the 6 consultants is also a speaker at conferences. So we all care about making presentation content understandable and memorable.

In addition to the general desire to be an effective presenter, I have a special interest in accessible design. I speak and consult on accessibility in Power BI report design. So I feel a responsibility to try to be accessible in all areas of visual design. In addition, I know that making things more accessible tends to increase usability for everyone.

PowerPoint templates in general reduce manual efforts to assign colors, set fonts and font sizes, and implement other design properties such as animations. I’m all for making a decision once, templatizing it, and making it easy to instantiate. But most of the templates available within PowerPoint and sold online don’t follow good presentation design practices. That is to say, the formatting gets in the way of the content.

Having a template made

Anyone can make a PowerPoint template. You just have to learn how master slides work. Lots of marketing and graphic design companies offer to create PowerPoint templates. But they are mostly concerned with staying on brand or making something shiny. And people make presentations because we want to communicate information. I wanted our template to make it easy for us to follow some good design practices, including accessibility.

So I reached out to my friend Echo Rivera who has her own company, Creative Research Communications, that specializes in making visually engaging presentations about highly technical topics. I came across one of her tweets a couple of years ago and visited her website. Some of the things I have learned from Echo’s courses and blog posts include:

Echo worked with me to make a template that followed good design practices but was flexible enough for a variety of content and audiences. And we also made the template fairly accessible! I’m pleased with the way our template turned out. A template can’t do everything for you, but it can give you a good start.

The process of presentation template design

I found the process of designing the template interesting, so I thought I would share a bit about that.

First, I sent Echo some samples of the presentations we give and some ideas on a color palette. We met to discuss our corporate personality, our presentation needs, and our goals for the template. Then a few members of the DCAC team helped me pick some potential images for the title slide.

Next we picked icons and colors for sections that we thought we would commonly include in presentations. We stuck with a white background on some content slides to make it easier to use images and diagrams from online (so we wouldn’t have to expend effort removing image backgrounds when they weren’t transparent). It also made it easier to choose colors with good contrast.

Once we got the full draft of the template, the team reviewed it and tried it out on some slides. And because things were going too smoothly, we decided we didn’t like the image we selected for the title slide, and chose another one. We made a few adjustments to default font sizes so that slides would fit our company name and slide headings with long technology names on a single line. We also adjusted the position of the slide heading text on slides with the line and icon at the top (shown below) so the text didn’t sit directly on the line.

We made a version of the slide template that has a small single-color logo on each slide. I plan to use this for sales slides and other situations where we need to ensure our name is on a slide when taken out of context (like a screenshot of a single slide). But the logo is small and not distracting so it doesn’t negatively impact design.

We made the template expecting that team members would adjust the master slides and use the provided multi-purpose layouts as needed for each presentation. We will change icons and use blank slides to add diagrams and big images. We also have multiple options for title and thank you slides.

Benefits of our new PowerPoint template

There is a lot to the new template, and examples below are shown without a ton of background explanation. But I couldn’t write this blog post and not show some examples, and I didn’t want this post to turn into a novel.

Our slides use color contrast to create visual interest while staying close to our corporate color palette.

The spacing and font sizes allow for about 6 lines of text max in an all-text slide. Our default font size for text content is 32pt.

Content slide with large text and clean formatting
Content slide from Meagan’s presentation on accessible Power BI report design

We used icons and color to denote sections in our presentations.

I think the best thing that this process has done is encourage us to use less text and more images. Check out the recently created slides from one of John’s presentations below.

My checklist for accessibility in visual presentation design includes:

  • font sizes no smaller than 24pt
  • color contrast that meets WCAG standards (3:1 for large text, 4.5:1 for smaller text)
  • avoiding using color as the only means of conveying information
  • avoiding color combinations that are problematic for people with color vision deficiency

Echo worked patiently and diligently with me to measure and adjust colors to meet these criteria. It was great to have someone that understood these goals.

Feedback from other team members

To be honest, I think it took some time for the template to grow on people. But most of us have warmed to it. If you are used to small images, lots of text, and extensive use of clip art and smart art, switching to the template can be a bit difficult. But that’s kind of the point.

Echo gave us some videos on how to use the template and some slide makeover examples when she delivered the template, and I asked the team to watch this TEDx talk. That reinforced the design goals and choices.

I asked the team for comments, and this is what they said.

“I like having a professional-looking, themed template that isn’t just something out of the box that looks like everyone else’s. The template, plus the helpful background info force you to think about what you are puking onto a single slide. It will lead to some semi-major rewrite/re-evaluation of about every presentation I do.”

Kerry

“The template, in part with its notes and reminders, helps me to ensure that I put the proper amount of context on a given slide.  It’s a balancing act with font size and content.  If I have to reduce the font size below 32 pt and I still have content to provide, it goes on another slide.”

John

Final thoughts

Will every slide we make be perfect and beautiful? No. But this template will help us avoid common mistakes like having too much text on the slide, and it provides some built-in accessibility without us having to remember to make adjustments.

I really enjoyed working with and learning from Echo, and I recommend her for your presentation design needs. I want to note that she prefers that you take her training before she does custom design work for you so you have a mutual design foundation to build upon. But her courses are great, so that’s not a hardship.

It’s also a privilege to work with people that share and support my goals of effective presentation delivery and accessible design. PowerPoint templates are part of the branding and marketing collateral in an organization, and I love what this says about DCAC.

Accessibility, Conferences, Microsoft Power Apps, Microsoft Technologies, Power BI

I’m Speaking at Microsoft Ignite 2019

I’m happy to be speaking at Microsoft Ignite this year. I have an unconference session and a regular session, both focused on accessibility in the Power Platform.

The regular session, Techniques for accessible report design in Microsoft Power BI, will be Wednesday, November 6 at 2:15pm. In this session I’ll discuss the features available in Power BI for making accessible reports and demonstrate techniques for making your reports easier to use. This session will be recorded, so if you can’t make it to Ignite, you can catch it online.

My unconference session, Accessibility in the Microsoft Power Platform, is a chance to have a discussion about accessibility in Power BI and PowerApps. It will be held on Thursday, November 7 at 10:45 am. Unconference sessions at Ignite include facilitor-led discussion and exercises that encourage audience participation where everyone can share their experiences and opinions. If you will be at Ignite and want to share struggles or successes in improving accessibility or raising awareness of accessibility issues, please join me.

This year at Ignite there is a reservation system for unconferences. You can RSVP while you are building your schedule on the website. Walk-ins will be accepted just before the session, assuming there is room. But please RSVP if you want to be sure to get a seat in an unconference session. Unconference sessions are not recorded, so this will be an in-person session only. But I will post materials through the Ignite website once the session is over.

If you will be at Ignite, please stop by and say hello and meet Artemis the Power BI accessibility aardvark.

Accessibility, Conferences

Tips for More Accessible Presentations

I’m busy building presentations for some upcoming conferences, so in lieu of a full blog post, please read my twitter thread about making your presentations more accessible. All but one of these tips are applicable regardless of the software that you use to build presentation content.

Meagan’s twitter thread on accessible presentation design

Why lose the engagement of a single person in your audience because of poor design choices? Most of the design tips I list are not that difficult to implement, and many of them can be built in to your presentation template, which I hope you are customizing to fit your content (and yes, I’m aware of the struggle of using templates provided by conference organizers). See below for my thoughts on the built-in templates in presentation design software.

Tweet from Echo Rivera: “Friends don’t let friends use off-the-shelf templates”
Accessibility, Data Visualization, Microsoft Technologies, Power BI

Power BI Now Has Keyboard Accessible Visual Interactions

The March 2019 release of Power BI Desktop has brought us keyboard accessible visual interactions. One of Power BI’s natural strengths is that you can click on a data point within a visual and have it cross-highlight or cross-filter the other visuals on a page. But keyboard-only users weren’t able to use this feature until now. This greatly raises the accessibility of the Power BI report consumption experience.

Below is a demonstration of interacting with a visual using keyboard commands. Notice how I can select specific data points within the line chart, and the other charts on the page filter based upon the selection.

Keyboard commands can now access visual interactions

If you are a person that prefers to use a keyboard over a mouse, this might also be something you want to try. Relevant keyboard commands include:

  • Ctrl + right arrow: Move focus into the chart area of the visual
  • Tab or Arrow keys: navigate between data points (or legend items in a chart that contains a legend)
  • Enter or Space: select a data point within a visual
  • Ctrl + Enter or Ctrl + Space: select multiple data points within a visual
  • Ctrl + shift + c: clear all selections

I think this was the last big missing piece of keyboard accessibility. I’m excited to see its impact on users. If you try keyboard accessible visual interactions, or are taking advantage of keyboard accessibility in Power BI in general, please let me know how you are liking it. Tweet me at @mmarie or send me a note via my blog contact form.

Accessibility, Data Visualization, Microsoft Technologies, Power BI

Tab Order Enhances Power BI Report Accessibility

Confused starLike a diamond in the sky.
How I wonder what you are!
Twinkle, twinkle, little star,
Twinkle, twinkle, little star,
Up above the world so high,
How I wonder what you are!

Confused?

You were probably expecting a different order. Order is an important element when singing a song or telling a story or explaining information.

In western cultures we tend to read left to right, top to bottom, making a Z-pattern. This applies to books and blogs as well as reports and data visualizations. But if you are using the keyboard to navigate in a Power BI report, the order in which you arrive at visuals will not follow your vision unless you set the new tab order property. If you have low or no vision, this becomes an even bigger issue because you may not be able to see that you are navigating visuals out of visual order because the screen reader just reads whatever comes next.

It takes effort to consume each visual, and many visuals need the context of the other visuals around them to be most useful. When we present information out of order, we are putting more cognitive load on our users, forcing them to hold information in their limited working memory until they arrive at another visual that helps put the pieces together to make sense.

What is Tab Order?

Tab order is the order in which users interact with the items on a page using the keyboard. Generally, we want tab order to be predictable and to closely match the visual order on the page (unless there is a good reason to deviate). If you press the tab key in a Power BI report, you might be surprised at the seemingly random order in which you move from visual to visual on the page. The default order is the order in which the visuals were placed on the page in Power BI Desktop, or the last modified order in PowerBI.com if you have edited your report there.

I wrote about the issues with tab order in Power BI back in February and posted an idea for it. So I’m quite happy to see it come to fruition. Not only does it increase usability and accessibility, it also helps meet WCAG Success Criterion 2.4.3: Focus Order (accessibility compliance guidelines, for those who do not geek out on this stuff).

How To Set Tab Order In Power BI Desktop

To set the tab order of visuals on a report page in Power BI Desktop, go to the View tab, open the Selection Pane and select Tab Order at the top of the Selection Pane.

TabOrder1TabOrder2

From there, you can move visuals up and down in order, or hide them from tab order completely. This is helpful if you have decorative items on the page whose selection has no value to the user.

To change the tab order, you can either drag an item to a new position in the list, or you can select the item and click the up or down arrows above the list.

TabOrderCHange.gif

In case you missed it, slicers are now keyboard accessible. If you would like users to select values in slicers before using the other visuals on the page, make sure to put the slicers early in the tab order.

It only takes a minute to set the tab order, but it greatly increases usability for keyboard users.

Accessibility, Conferences

Dear Conferences, Please Stop Making Inaccessible Presentation Templates

It’s hard to please everyone, especially when everyone means several dozen speakers and thousands of audience members at a tech conference. And especially when it comes to presentations to an international audience. So I get that it can be difficult to make a presentation template that stays on brand and promotes the best presentation of information. But I see a continuing trend that conferences optimize templates for marketing and forget that we are trying to communicate to audiences of varying skills and abilities, many of whom have paid to attend the conference to learn the information in our presentations. I’m not here just to argue aesthetics, although I definitely have opinions on that. I want people to realize that we are unintentionally excluding many of our audience members with our horribly inaccessible slide templates. Accessibility refers to the ability for everyone, regardless of disability or special needs, to access, use, and benefit from everything within their environment. Yes, in many cases use of the conference template is not required, but many speakers will still use it. So the designer of the slide template should be thoughtful about their design more than just staying on brand with colors and conference logos. Basically, we can do better. We should be designing with accessibility in mind.

I’m going to pick on a template that I’m currently working with because it is from a conference that is near and dear to my heart, and it serves as a good example of how we can (and should) improve. Concrete examples seem to have more impact than just providing guidelines. While this year’s PASS Summit template is not the worst conference presentation template I’ve seen, it leaves a lot to be desired in the areas of effectiveness and inclusiveness. I’m writing this publicly to help educate our SQL Family about making better presentations that actually work for our audience. While it is criticism, it is said with love and hope that we can improve for future conferences. The speakers and organizers of PASS Summit are good people who strive to deliver a great conference. I know we can do better.

So what’s wrong with the template?

Let’s start with the title slide.

PASSSummitTItleslide.jpg

The title text is 36pt Segoe UI Light, the subheading text is 24pt Segoe UI, and the speaker info text is 14 pt Segoe UI.

Those font sizes alone make it very hard to read from the back of even the smaller rooms at the conference.

In addition to being too small, the gray text for the speaker info doesn’t have enough contrast from the white background. We want to get a contrast ratio of at least 4.5:1 (but 7:1 would be better). The contrast ratio for these colors is 4.0.

While sans serif fonts are generally thought to be easier to read in presentations, it’s better to use fonts with a stroke width that is not too thin – not necessarily wider characters, but thicker lines that make up each letter. So Segoe UI Light would not be my first choice for a title font, but Segoe UI or Segoe UI Bold might be ok.

Also, the red used on the right half of the slide is VERY bright for an element that is purely decorative, to the point that it might be distracting for some people. And the reason we need to squish our title into two lines of too-small text is because that giant red shape takes up half the page. What is more important: a “pretty” red shape to make our slide look snazzy or being able to clearly read the title of the presentation?

Here is the speaker bio slide.

PASS Speaker BIO slide

This slide also suffers from the font being way too small.

  • Speaker name: 32pt (Segoe UI Light)
  • Title/Company: 20 pt (Segoe UI)
  • Social media handles: 11pt (Segoe UI)
  • Biography Point One: 14pt (Segoe UI)
  • Biography Point body text: 10.5pt (Segoe UI)

Again, there are issues with color contrast, which make the slide difficult to read – especially when shown on a projector that will probably wash out some of the color. The blue font on white background has a contrast ratio of 2.2. The red font on white background has a contrast ratio of 3.67. The dark font color on light gray background is actually ok from a color contrast perspective.

Here is a standard content slide.

PASS Speaker Content Slide

What I appreciate about this slide is that it is free from unnecessary decorative shapes/backgrounds and doesn’t use needless bullet points everywhere. And the PASS logo is small in the lower right hand corner, not taking up too much room or being super distracting. But again, font sizes are way too small and the color contrast from the background is not high enough.

The difference in heading styles is a bit distracting. While they should probably differ in size, they don’t need to also differ in capitalization and font and color and boldness. One or two properties would be fine to denote difference, and having so many differences is a bit distracting.

More important than that, if you have three layers of headings on your slide, you probably have too much text. It would have been better not to even suggest that we would need to do such a thing. Putting it in the template passively gives presenters permission or encouragement to do just that.

What’s wrong and why should you care?

Conferences need to consider that some attendees may have varying abilities to see, hear, and understand the presentations. But those attendees paid to attend the conference and shall we say… connect, share, and learn? How can they learn when they can’t read the slide? How can they connect when the speaker contact information is tiny and hard to distinguish from the background? When we use slide templates that don’t work for those attendees, we are basically saying that they don’t matter and aren’t our “real” audience. Do we really want to be just another conference that discriminates against these people and makes them feel unwelcome? No one is purposefully doing this, but our ignorance/thoughtlessness about accessibility still creates that experience for them, whether or not we meant to do so.

KeepOutSign.jpg
Don’t let your slides make attendees feel excluded when a few changes could help everyone enjoy and learn.

Attendees don’t have to have a diagnosed “official” disability to benefit from slides that present information clearly. How many of us just have aging eyes? We can all appreciate when we end up seated at the back of a large conference room and can actually read the slides. Non-native English speakers may appreciate being able to clearly and quickly read slide content as they have to take more time/effort to process information written in English. We all get distracted by our phone/laptop/tablet/watch/neighbor during conference sessions, and it’s nice to be able to refocus on the presentation by focusing on the visual content while we listen to the speaker. But we can’t do that when the speaker’s slides are distracting us from the good information or are just plain hard to read. Slide templates are just one part of the presentation, but they can help set a standard that provides a good, inclusive experience for all attendees.

And what’s going to be better marketing for a conference: slide templates that are hard to read but use the right colors and logos, or attendees that have a great experience and learn a ton and tell their friends and coworkers all about it?

How do we fix it?

There are several basic things we can do to fix our templates to make them more accessible and more engaging (and still on brand for the conference). Here is a (non-comprehensive) list that organizations that create conference slide templates could start with to create accessible templates.

  1. Use a high contrast color scheme. Ensure that all text has a contrast ratio against its background of at least 4.5:1.
  2. Use sans serif fonts that are 24 pt or larger for body text. If possible, don’t encourage anything less than 32pt font size.
  3. Don’t use text that is ALL CAPS as a regular part of the template.
  4. Avoid using color as the only indicator of importance or change.
  5. Minimize the amount of text on slides so it is only a few lines or less than 20 words.
  6. Discourage use of distracting transitions between slides.

Even better, don’t require/request use of a slide template. Just give speakers a few intro/exit slides with necessary information and let them do what is best to communicate their intended information. It would then be the speaker’s responsibility to create accessible content, but hopefully they care enough about their presentations to do that. PASS Summit requires the use of the title and speaker bio slides (and a few other conference-related slides), but it allows speakers to design their own slides for the rest of the content.

If you have tips or opinions about creating accessible presentation content for conferences, please leave them in the comments.

Accessibility, Data Visualization, Microsoft Technologies, Power BI

Power BI Report Accessibility Checklist

In many cases, some small changes can go a long way in making your Power BI reports more accessible for users with different abilities. The checklist below lists considerations you should make in your report design to create more inclusive reports. I’ll update this post as new features are released.

Accessibility Checklist

Last Updated: 04-Oct-2019

All Visuals

  • Ensure color contrast between title, axis label, and data label text and the background are at least 4.5:1.
  • Avoid using color as the only means of conveying information. Use text or icons to supplement or replace the color.
  • Replace unnecessary jargon or acronyms.
  • Ensure alt text is added to all non-decorative visuals on the page.
  • Check that your report page works for users with color vision deficiency.
  • Add descriptive, purposeful titles to charts

Slicers

  • If you have a collection of several slicers on your report pages, ensure your design is consistent across pages. Use the same font, colors, and spatial position as much as possible.

Textbox

  • Ensure color contrast between font and background are at least 4.5:1.
  • Make sure to put text contents in the alt text box so screen readers can read them.

Visual Interactions

  • Is key information only accessible through an interaction? If so, rearrange your visuals so they are pre-filtered to make the important conclusion more obvious.
  • Are you using bookmarks for navigation? Try navigating your report with a keyboard to ensure the experience is acceptable for keyboard-only users.

Sort Order

  • Have you purposefully set the sort order of each visual on the page? The accessible Show Data table shows the data in the sort order you have set on the visual.

Tooltips

  • Don’t use tooltips to convey important information. Users with motor issues and users who do not use a mouse will have difficulties accessing them.
  • Do add tooltips to charts as ancillary information. It is included in the accessible Show Data table for each visual.

Video

  • Avoid video that automatically starts when the page is rendered.
  • Ensure your video has captions or provide a transcript.

Audio

  • Avoid audio that automatically starts when the page is rendered.
  • Provide a transcript for any audio.

Shapes

  • Make sure any decorative shapes are marked as hidden in tab order, so they aren’t announced by a screen reader.
  • Avoid using too many decorative shapes to the point where they are distracting.
  • When using shapes to call out data points, use alt text to explain what is being called out.

Images

  • When using images to call out data points, use alt text to explain what is being called out.
  • Make sure any decorative images are marked as hidden in tab order, so they aren’t announced by a screen reader.
  • Avoid using too many decorative images, to the point where they are distracting.

Custom Visuals

  • Check the accessible Show Data table for custom visuals. If the information shown is not sufficient, look for another visual.
  • If using the Play Axis custom visual, ensure it does not autoplay. Make it obvious that the user must press the play/pause button to start/stop the changing values.

Across Visuals on the Page

  • Set tab order and turn off tab order (mark the item as hidden) on any decorative items.
  • Add explanatory text as needed to describe your charts and their necessary context (perhaps via textbox or header tooltips).

Power BI Accessibility Features

Tools to Check Accessibility in your Power BI Report

Keyboard-Only Navigation

  • Use a keyboard to navigate and interact with your report, without using a mouse.

Color Vision Deficiency

Low Vision

If you would like to suggest an update to the list, feel free to leave a comment on this post.