SharePoint For All - Minnesota...SharePoint Saturday Twin Cities Minnesota Office 365 User Groups...
Transcript of SharePoint For All - Minnesota...SharePoint Saturday Twin Cities Minnesota Office 365 User Groups...
SharePoint For All
Jennie Delisi| Accessibility AnalystKris Schulze| User Experience
Question 1
Do you work for the State of MN, county, city, other? (Text field beside other)
• State of MN executive branch agency
• County
• City
• Other
After today…many options for learning more!
Free monthly accessibility information:
Office of Accessibility Public Newsletter
Free accessibility training and resources:
Office of Accessibility (Or: mn.gov/mnit/accessibility)
Collaborate with SharePoint
• Create, collect, update, manage files and lists with team members
• Share files and co-author in real time
Who Needs Accessibility?
Minnesota’s population: 5,577,487
% of Minnesotans reporting 1 or more disabilities in 2014:
• 8.5% - age 18-64• 31.7% - 65+ population
1 in 4: Number of today’s 20-year-olds who will become disabled before they retire.
Question 2
Do you have an accessibility policy or standard you are required to follow at work?
• Yes
• No
• I don’t know
State Accessibility Standard
State of Minnesota Accessibility Standard
• Section 508 and WCAG 2.0 AA (includes level A)
• Executive Branch Agencies must follow, others are encouraged
• Not a state agency? Consider using this in your accessibility policy
Which SharePoint Interfaces Need to Be Accessible?
All of them!• SharePoint Administrators
• Site Owners
• Content Creators
• End Users
Today we will focus on the End User interfaces only.
Assistive Technology (AT)
“any item, piece of equipment, or product system,
whether acquired commercially, modified, or customized,
that is used to increase, maintain, or improve functional capabilities
of individuals with disabilities.”
-Assistive Technology Act of 1998, as amended
Clarifying Terminology
Accessibility Testing
Usability Testing
(subset: usability testing with those that use assistive technology)
User Experience
Design Thinking
But I don’t need to test
with assistive technology,
do I?
Ready to Dip Your Toe Into the Water?
• Opportunity to try assistive technologies!
• Volunteer for some, watch others
• Very different experience when you use them, though may not replicate end user’s experience
The Many Flavors of SharePoint
Question 3
Are you a:
• User/Contributor?
• Site Manager?
• Admin?
• Not sure?
Question 4
Are you a:
• Beginner?
• Feeling pretty good (some skills, could use more)?
• Expert?
• Not sure?
Office 365 Periodic Table (G3 License)
Office 365 Periodic Table Website (icsh.pt/O365Table)
Office 365 SharePoint Online or On-premise?
• Look at URL and for app launcher (waffle) and text “Office 365”
• Office 365 cloud site URL is https://mn365.sharepoint.com
• On-Premise SharePoint URL might be something like http://comm https://workplace https://inside
Question 5
What flavor of SharePoint do you use?
• SharePoint Online Government
• SharePoint Online Commercial
• SharePoint 2013/2016/on-prem
• Older version?
• I have no idea
Modern and Classic and Cloud…Oh My
• Looking for online help? Helps to know SharePoint version
• Hard to tell if heavily customized
• Options• SharePoint Online
• SharePoint Online Classic
• SharePoint OnPremise – 2013, 2016, 2019 (preview)
What is Classic SharePoint?
Question 6Do you currently use Modern SharePoint sites or pages?
• Yes
• No
• I don’t know
What is Modern SharePoint in SharePoint Online?
• New user experience
• Easier to edit and create pages
• New look for lists and libraries
• Can create Modern Team Site or Communication Site
Why would you want Modern?
• Future enhancements
• Accessibility
• Mobile responsiveness
Classic and Modern on Mobile
Classic
• Same display as on desktop browser
Modern
• Faster
• Displays better
• Easier to use
Modern Team and Communications Sites
Modern Team Sites
• Ask for Modern site and document library
• From site header, add new• List
• Document library
• Page
• News post or link
• Web app
Modern Communication Sites
• Communicate information to organization - intranet
• Full width site template, mobile responsive
• Simpler to create than publishing sites
• Attractive design out of the box
Classic Sites Mixed with Modern
• SharePoint Admin sets experience
• Classic SharePoint team site with Modern Document Library and Modern Pages
• Modern team site is Modern all over
Differences between Classic & Modern Pages
Classic Pages
• Ribbon
• Web parts
• Layouts
Demo: Switch Access Classic Library
• How much work is it to get through the ribbon?
• All items in the left navigation receive focus using the tab key
• Notice: Status indicators and the person’s name receive focus
• Challenges in Internet Explorer for some ATs when downloading a copy of a document
Switch + Switch Interface
Modern Pages
• Can put spaces in your Page Name
• Options for layout
• Add alt text for images
• REMINDER: Check accessibility of web parts before using
Modern Pages Have Better Themes - Colors
End users may use high contrast mode when viewing pages, or software that modifies color schemes.
Page title is very important
Name your page = Page-Title in URL
Demo: Screen Reader Hears Page Title
Name of your page = Browser tab title
Moving from Classic to Modern
• No good method to convert from Classic to Modern
• Opportunity! Rethink design and user experience in building Modern site
Modern Web Parts
• No classic web parts on modern pages or vice versa
• Easier to use
• Web parts
Bing maps Divider
Document library Events
File viewer Hero
Image Highlighted content
List News
Quick links Sites
Classic and Modern Document Libraries
Classic
Modern
Modern SharePoint Lists and Libraries
• More accessible
• Filter and sort easily
• Resize, group, create custom views
• Quickly change file information, access previews and details
• Create a column
Features in Classic Lists and Libraries Only
• Popularity trends
• RSS Feed
• Connect to Outlook, Office
• Export to Excel for doc libraries
• Edit Library
• Customized navigation links on publishing sites
• Tree and Content Organizer views
• Customizations to list templates, in Infopath, Publishing, JSLink code
Demo: Keyboard Only Access Modern Library
Key change for end users: Command bar
Demo – Screen Reader and Libraries
Classic SharePoint
• Must use the ribbon
• Keyboard trap in Internet Explorer
Modern Library
• Improved navigation
• Command bar controls available using Shift + F10
• No more keyboard trap
Switch between classic and modern lists and libraries
Return to classic SharePoint and Exit classic experience
Break
15 minutes! Enjoy!
I know what I have (maybe), now what?
What do we need to think about for SharePoint?
• Email communications
• SharePoint pages
• Documents
• Videos
• Calendars
• Timelines
• Forms…
Checklist for Your SharePoint Accessibility Tests
• Documents are accessible?
• Operates keyboard only?
• Color contrast passes?
• Alt text added for images?
• Clear at 200% magnification?
• Headings present, in a logical order?
• Links have meaningful text?
• Lists and tables have proper structure?
Document Accessibility
• Word, Excel, PowerPoint, PDFs…
• Use Office of Accessibility’s online training and resources
Can You Operate Using Just Your Keyboard?
• Tab key: goes from actionable item to actionable item
• Quick Launch and other areas that act like applications:
• Tab to group (e.g., Home)
• Arrow through choices
• Form controls (e.g., check boxes and radio buttons)
• Tab to group
• Arrow through choices (not check boxes)
• Enter or space bar to select
Use WebAIM’s Keyboard Testing Chart
Sample: Keyboard Only Test
Test:
• Order (logical?)
• Focus (do you know where you are?)
• This screen shot done with Chrome
• Can you access everything?
Consider Your Keyboard Only Users
Calendar Month View (Classic) Calendar List View (Classic)
Location can be key! For example, put link to Calendar List View link before the Calendar Month View
Testing Tool Used Here: Tab Key
Color Contrast
Text (WebAIM Color Contrast Checker)
• 4.5:1 unless…
• “14 point (typically 18.66px) and bold or larger, or 18 point (typically 24px) or larger”
• 3:1
• Includes heading styles, link text, visited link colors when present
• Exempt: logos, decorative images
But, isn’t the logo important information for your readers? Food for thought…
Good color, Bad color…
Breeze Link Text – Fail Characters Link Text - Pass
Testing Tool Used: Colour Contrast Analyser
Start Seeing Alt Text
Add your image, then select the edit button to open alt text panel for pages
Clear at 200%
Fuzzy logo
Testing tool:
1. Control + mouse scroll, or2. Control + PLUS, or3. Set browser to 200% in zoom settings
Test for Proper Heading Structure
Used Web Accessibility Favelets (WAF) to test for headings. What is missing?
Short, Clear Link Text
Links on a SharePoint page
• Link text is meaningful in context
Screen shot of screen reader list of links
• Link text is meaningful when out of context
Proper Structure for Lists, Tables
List (Testing Tool: WAVE)
Table (Testing Tool: Web Accessibility Favelets)
Example at right shows lack of table headers (th) in table formatted in Modern page
Note: pasting accessible tables from Microsoft Word or PDFs to Modern pages may not guarantee an accessible table.
Is there a way to test for all these things at once?
Use automated accessibility testing tools with caution:
• SharePoint issues vs content issues
• Limits to what is tested
• Manual testing still required
• Select the right testing tool
Testing An Entire Page with WAVE
Wave tool (wave.webaim.org)
Pros:
• Automated checking tool that tests against WCAG standard
• Visual representation of errors
Cons for this purpose:
• You can only impact content
• Need to know which issues exist without you even adding content - baseline
I know what I have (maybe) and a little more about accessibility, now what?
It takes a village
• eDad
• Rapid change and new features• Test
• Spread the testing around!
• Have a good feedback mechanism• End user reporting
• Structured feedback sessions
• Join an accessibility group• Yammer, LinkedIn, Twitter
• Make friends with your accessibility coordinator & UX people!
In our future?
Microsoft Teams
• Skype for Business Online capabilities moving to Teams
• Microsoft Teams video with captions
Accessibility features in Windows 10 and Office 365 Pro Plus
State of MN Training Toolkit and Yammer
• Minnesota IT Services Training Toolkit site extranet for State of MN employees
• Yammer SharePoint Group must have state.mn.us email
Microsoft Online Learning
Accessibility in SharePoint Online
• Keyboard shortcuts
SharePoint Online video training
• Intro to SharePoint Online
• Create sites, posts, lists
Microsoft Learn
Important Note: State of MN does not use all of the features shown in these training materials
More ways to learn more about SharePoint and O365
Microsoft Accessibility site and support
SharePoint Saturday Twin Cities
Minnesota Office 365 User Groups
Microsoft Ignite Sessions Online
Microsoft Tech Community
Microsoft Teams video training from Microsoft
PowerHour with Laura Rogers: Modern Lists webcast of Modern List features from 2/2017
SharePoint classic and modern experiences, Microsoft Support article
Office of Accessibility Resources
• Subscribe to our newsletter and other email updates
• Office of Accessibility website – tons of info on websites, applications, documents, social media and more
• Accessible Word Document eLearning – basics of accessibility taught for Word documents but concepts apply to many applications
Other Greater Minnesota/Great Lakes Region Resources
• Great Lakes ADA Center: webinars, online information, newsletter
• University of Minnesota Accessible U: great info on digital accessibility
When you get back to your desk…
What is one thing you will use, try, do, or share
because of information you learned in this session?