The document discusses lessons learned in making content management frameworks and developer tools more accessible. It notes that while basic accessibility features like headings and form labels are often supported out of the box, richer interactive elements like dynamic forms, search autocomplete, and charts present greater challenges. It recommends planning accessibility into frameworks by listing all major features, describing how they should work, prioritizing keyboard support, choosing tools with active communities, doing quick accessibility checks, and leveraging forums and examples.
Business 2.0 with WordPress reveals the secrets of making a profit with WordPress. It's target auditory is: entrepreneurs, small business owners, designers and developers. Different approaches for business based on the platform circles - quick, cheap and powerful WP-based website setup or consulting and products for designers and developers.
Lessons Learned in Coding Accessible Apps with FrameworksKate Walser
Today's design and development frameworks - Drupal, WordPress, Bootstrap, jQuery, and others - make it easier to stand up apps quickly. But at what cost? Find out what we learned and what we'd change next time.
Lessons Learned: Coding Accessible Apps with Frameworks 2017Kate Walser
May 18, 2017 presentation at AccessU: There’s often a debate about why applications aren’t accessible. Some people argue that teams don’t care enough about accessibility or prioritize it. Others argue that developers just don’t get it. What if it’s not that simple? What if, in a world of open source and Agile/fast-paced projects, frameworks and deadlines get in the way?
When frameworks like Drupal, jQuery, and WordPress fall short, you can still come out ahead in accessibility by knowing what questions to ask and what resources to engage. This session isn’t a session on out-of-the-box accessibility for Drupal, jQuery, WordPress, and similar frameworks – it will teach you some common glitches in frameworks and techniques to work around those to improve accessibility.
An Accessibility Update: Changes to Section 508Kate Walser
In March 2017, the Section 508 standards were updated as part of the ICT (Information & Communication Technology) updates. This talk gives a quick overview of accessibility, the original web section of the standards, and some high-level perspectives of what's new related to electronic content.
Business 2.0 with WordPress reveals the secrets of making a profit with WordPress. It's target auditory is: entrepreneurs, small business owners, designers and developers. Different approaches for business based on the platform circles - quick, cheap and powerful WP-based website setup or consulting and products for designers and developers.
Lessons Learned in Coding Accessible Apps with FrameworksKate Walser
Today's design and development frameworks - Drupal, WordPress, Bootstrap, jQuery, and others - make it easier to stand up apps quickly. But at what cost? Find out what we learned and what we'd change next time.
Lessons Learned: Coding Accessible Apps with Frameworks 2017Kate Walser
May 18, 2017 presentation at AccessU: There’s often a debate about why applications aren’t accessible. Some people argue that teams don’t care enough about accessibility or prioritize it. Others argue that developers just don’t get it. What if it’s not that simple? What if, in a world of open source and Agile/fast-paced projects, frameworks and deadlines get in the way?
When frameworks like Drupal, jQuery, and WordPress fall short, you can still come out ahead in accessibility by knowing what questions to ask and what resources to engage. This session isn’t a session on out-of-the-box accessibility for Drupal, jQuery, WordPress, and similar frameworks – it will teach you some common glitches in frameworks and techniques to work around those to improve accessibility.
An Accessibility Update: Changes to Section 508Kate Walser
In March 2017, the Section 508 standards were updated as part of the ICT (Information & Communication Technology) updates. This talk gives a quick overview of accessibility, the original web section of the standards, and some high-level perspectives of what's new related to electronic content.
What are the challenges in bringing a Drupal or WordPress site to one million page views per month? Ten million? Fifty million? Logicworks and Cloud.com bring you the perspective of some of the leading voices in the digital publishing industry.
SuiteHelp 4.0: Latest Features in Enterprise WebhelpSuite Solutions
Learn about the new features in SuiteHelp 4.0, the latest in enterprise webhelp!
SuiteHelp 4.0's mobile-friendly responsive design uses common Bootstrap elements already familiar to mobile users. SuiteHelp 4.0 also includes a variety of improvements in context sensitivity, navigation, and ease of customization.
Drupal Step-by-Step: Building a Drupal Site with Acquia Cloud Site FactoryAcquia
Acquia Cloud Site Factory provides a better way to create and manage Drupal multisite deployments. You can use it to rapidly build mobile-ready brand, campaign, and franchise websites using powerful multisite tools on top of the open source Acquia Cloud platform.
The site building capabilities are based on a customized distribution of Drupal. It includes popular modules, user interface improvements, and a ThemeBuilder. The Site Factory dashboard allows you to group and manage all of your sites, and control permissions within groups.
In this step-by-step training webinar, you will learn how to:
• Create a site as a basis for future development
• Duplicate a site as a template
• Customize the site template
• Manage sites within the dashboard
• Configure users and permissions within sites and within the dashboard
You’ll also get a tour of the complete online course. This is one you don’t want to miss!
Sometimes distributions save site builders from having to make many difficult decisions by implementing proven best practices out-of-the-box in easy-to-install packages.
Check out the slides from my presentation from the December Victoria Drupal user group to learn about some of the most interesting distributions out there, built for purposes as diverse as community building, conference management, social networking and news portals. We will look at the strengths and weaknesses of various distributions, as well as tips and tricks for working with them efficiently.
Platform Product Management in 2021 by Square Product LeaderProduct School
Main Takeaways:
- Internal customers are customers too
- API Designs need testing & validation just like human designs
- Platform teams = service teams
To build great sites and digital experiences, teams require easy to use tools focused on key capabilities: Rapid development tools, radically simple page building components, drag-and-drop widgets to manage and use rich media and content assets, and intuitive tools to review, approve and publish quickly.
Acquia Lightning, a Drupal 8 open source distribution from the Drupal experts at Acquia, is the content management foundation that provides these capabilities and more to developers and experience teams in thousands of organizations worldwide.
Join this webinar, led by Drupal Project Lead and Acquia CTO Dries Buytaert, and Jeff Beeman, Acquia Lighting Product Manager, to discover how Lightning is the best content management foundation for developers and next-generation experience builders.
Attend this webinar to:
- Learn about Acquia Lightning and how to make it the best starting point for your Drupal projects
- Discover Lightning’s benefits and learn how developers are reducing development time by 30% while creating better, more usable sites
- Understand through demos how Lightning makes it easier for experience builders to create page layouts, embed rich media, create, approve and publish content more easily to engage with audiences faster
- Discover why Lightning, on Acquia Cloud, is the secret to building better, faster, and delivering more engaging sites that drive engagement and outcomes.
BrownSites: Building and Managing a CMS Infrastructure for Higher EdAlozie Nwosu
Drupal Case Study Presentation of BrownSites, the Drupal-based departmental web template service deployed for Brown University. Presented at DrupalCampNYC (held at John Jay College), Dec. 10, 2011.
*Download presentation file for helpful background notes.
Improving the User Experience of UiPath AppsDianaGray10
Gain Insight Into Improving the User Experience of UiPath Apps
In this session, you will learn how to build better-looking applications to drive increased adoption
Topics covered :
• Examples of challenging user experience scenarios
• Why does it matter? The impact of a good UX on user adoption
• The 60/30/10 Rule for Color
• The C.R.A.P. Rule for Design
• Short demonstrations and examples of applications that follow these methodologies
Responsive Web Design for Universal Access: 2019Kate Walser
2019 AccessU Course:
What if one design could respond to multiple form factors – web, tablet device, smart phone? Better yet, what if creating that one responsive design made it easier for all users – regardless of device or physical abilities – to engage with your organization?
Learn how responsive web design impacts accessibility (and SEO as well!).
AccessU 2018 - Introduction to User ResearchKate Walser
AccessU 2018: “It’s too expensive to do testing.” “We don’t have time.” “We can’t find any users.” If that these sound like something your team might say, this session’s for you! Come learn how - with a little creativity and planning - you can find and learn from users in time for your next release.
Learn about different user research methods (e.g., interviews, personas, testing, and more) exist for your project
Learn how and when to apply them to your project
Learn how to find and engage users of all abilities
Learn how logistics change for these different situations
More Related Content
Similar to AccessU 2018 - Surviving Dev Frameworks: Lessons Learned with WordPress, Drupal, and jQuery
What are the challenges in bringing a Drupal or WordPress site to one million page views per month? Ten million? Fifty million? Logicworks and Cloud.com bring you the perspective of some of the leading voices in the digital publishing industry.
SuiteHelp 4.0: Latest Features in Enterprise WebhelpSuite Solutions
Learn about the new features in SuiteHelp 4.0, the latest in enterprise webhelp!
SuiteHelp 4.0's mobile-friendly responsive design uses common Bootstrap elements already familiar to mobile users. SuiteHelp 4.0 also includes a variety of improvements in context sensitivity, navigation, and ease of customization.
Drupal Step-by-Step: Building a Drupal Site with Acquia Cloud Site FactoryAcquia
Acquia Cloud Site Factory provides a better way to create and manage Drupal multisite deployments. You can use it to rapidly build mobile-ready brand, campaign, and franchise websites using powerful multisite tools on top of the open source Acquia Cloud platform.
The site building capabilities are based on a customized distribution of Drupal. It includes popular modules, user interface improvements, and a ThemeBuilder. The Site Factory dashboard allows you to group and manage all of your sites, and control permissions within groups.
In this step-by-step training webinar, you will learn how to:
• Create a site as a basis for future development
• Duplicate a site as a template
• Customize the site template
• Manage sites within the dashboard
• Configure users and permissions within sites and within the dashboard
You’ll also get a tour of the complete online course. This is one you don’t want to miss!
Sometimes distributions save site builders from having to make many difficult decisions by implementing proven best practices out-of-the-box in easy-to-install packages.
Check out the slides from my presentation from the December Victoria Drupal user group to learn about some of the most interesting distributions out there, built for purposes as diverse as community building, conference management, social networking and news portals. We will look at the strengths and weaknesses of various distributions, as well as tips and tricks for working with them efficiently.
Platform Product Management in 2021 by Square Product LeaderProduct School
Main Takeaways:
- Internal customers are customers too
- API Designs need testing & validation just like human designs
- Platform teams = service teams
To build great sites and digital experiences, teams require easy to use tools focused on key capabilities: Rapid development tools, radically simple page building components, drag-and-drop widgets to manage and use rich media and content assets, and intuitive tools to review, approve and publish quickly.
Acquia Lightning, a Drupal 8 open source distribution from the Drupal experts at Acquia, is the content management foundation that provides these capabilities and more to developers and experience teams in thousands of organizations worldwide.
Join this webinar, led by Drupal Project Lead and Acquia CTO Dries Buytaert, and Jeff Beeman, Acquia Lighting Product Manager, to discover how Lightning is the best content management foundation for developers and next-generation experience builders.
Attend this webinar to:
- Learn about Acquia Lightning and how to make it the best starting point for your Drupal projects
- Discover Lightning’s benefits and learn how developers are reducing development time by 30% while creating better, more usable sites
- Understand through demos how Lightning makes it easier for experience builders to create page layouts, embed rich media, create, approve and publish content more easily to engage with audiences faster
- Discover why Lightning, on Acquia Cloud, is the secret to building better, faster, and delivering more engaging sites that drive engagement and outcomes.
BrownSites: Building and Managing a CMS Infrastructure for Higher EdAlozie Nwosu
Drupal Case Study Presentation of BrownSites, the Drupal-based departmental web template service deployed for Brown University. Presented at DrupalCampNYC (held at John Jay College), Dec. 10, 2011.
*Download presentation file for helpful background notes.
Improving the User Experience of UiPath AppsDianaGray10
Gain Insight Into Improving the User Experience of UiPath Apps
In this session, you will learn how to build better-looking applications to drive increased adoption
Topics covered :
• Examples of challenging user experience scenarios
• Why does it matter? The impact of a good UX on user adoption
• The 60/30/10 Rule for Color
• The C.R.A.P. Rule for Design
• Short demonstrations and examples of applications that follow these methodologies
Similar to AccessU 2018 - Surviving Dev Frameworks: Lessons Learned with WordPress, Drupal, and jQuery (20)
Responsive Web Design for Universal Access: 2019Kate Walser
2019 AccessU Course:
What if one design could respond to multiple form factors – web, tablet device, smart phone? Better yet, what if creating that one responsive design made it easier for all users – regardless of device or physical abilities – to engage with your organization?
Learn how responsive web design impacts accessibility (and SEO as well!).
AccessU 2018 - Introduction to User ResearchKate Walser
AccessU 2018: “It’s too expensive to do testing.” “We don’t have time.” “We can’t find any users.” If that these sound like something your team might say, this session’s for you! Come learn how - with a little creativity and planning - you can find and learn from users in time for your next release.
Learn about different user research methods (e.g., interviews, personas, testing, and more) exist for your project
Learn how and when to apply them to your project
Learn how to find and engage users of all abilities
Learn how logistics change for these different situations
Usability Testing with People with Disabilities (2017)Kate Walser
May 17, 2017 presentation at AccessU: The best way to learn how your website or app will work for people with disabilities is to observe them using it. Usability testing let users try out your product so you can learn what works for them for usable accessibility. You will learn how to adapt a usability test plan for different assistive technology and different disabilities. Best of all, you’ll practice running a usability test with users with disabilities.
Responsive Web Design for Universal Access 2016Kate Walser
You can improve how well your website works and looks across different devices using responsive web design techniques. But did you know you can also improve access for all users, including those with disabilities, by applying responsive techniques? Learn how.
Usability Testing with People with DisabilitiesKate Walser
For users with disabilities visiting your website, accessibility is essential for site and app use. But how usable is your product? Why not ask people who use assistive technologies to use your site and find out? Learn tips for creating a test plan, recruiting, and moderating usability test sessions with people with disabilities.
Organizations are using social media for all sorts of reasons - customer service, outreach, for fun... So how can they use it effectively? And more importantly, how can they include their whole audience, without alienating those with different disabilities?
On target three-ways-to-keep-audience-in-focus_ivmgKate Walser
Keeping your user audience in mind can be challenging. Each of these 3 tools can be adapted to project timelines and budgets to help you remember who that end user is and what he needs.
Rich Web Apps presentation for UPA-DC UserFocus conference. Includes ideas for UX professionals to work more effectively with developers to create apps that users will love.
Inspired by President Obama’s vision, government agencies have stepped on the accelerator and are opening up their agencies, data, and missions to the public like never before. With 305 million people in the US, that’s some lot of potential customers and users. And this audience spans different demographics, ethnicities, education levels, and levels of interest in government. Where product companies and organizations may be able to focus in on certain target audiences, “Gov 2.0″ success and continued energy President Obama’s brought to the government will depend on making ALL in the US feel welcome and engaged. Not a small task.
Presented at Interaction 10, the conference for interaction designers, in Savannah, GA, February 2010.
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...DanBrown980551
Do you want to learn how to model and simulate an electrical network from scratch in under an hour?
Then welcome to this PowSyBl workshop, hosted by Rte, the French Transmission System Operator (TSO)!
During the webinar, you will discover the PowSyBl ecosystem as well as handle and study an electrical network through an interactive Python notebook.
PowSyBl is an open source project hosted by LF Energy, which offers a comprehensive set of features for electrical grid modelling and simulation. Among other advanced features, PowSyBl provides:
- A fully editable and extendable library for grid component modelling;
- Visualization tools to display your network;
- Grid simulation tools, such as power flows, security analyses (with or without remedial actions) and sensitivity analyses;
The framework is mostly written in Java, with a Python binding so that Python developers can access PowSyBl functionalities as well.
What you will learn during the webinar:
- For beginners: discover PowSyBl's functionalities through a quick general presentation and the notebook, without needing any expert coding skills;
- For advanced developers: master the skills to efficiently apply PowSyBl functionalities to your real-world scenarios.
Connector Corner: Automate dynamic content and events by pushing a buttonDianaGray10
Here is something new! In our next Connector Corner webinar, we will demonstrate how you can use a single workflow to:
Create a campaign using Mailchimp with merge tags/fields
Send an interactive Slack channel message (using buttons)
Have the message received by managers and peers along with a test email for review
But there’s more:
In a second workflow supporting the same use case, you’ll see:
Your campaign sent to target colleagues for approval
If the “Approve” button is clicked, a Jira/Zendesk ticket is created for the marketing design team
But—if the “Reject” button is pushed, colleagues will be alerted via Slack message
Join us to learn more about this new, human-in-the-loop capability, brought to you by Integration Service connectors.
And...
Speakers:
Akshay Agnihotri, Product Manager
Charlie Greenberg, Host
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered QualityInflectra
In this insightful webinar, Inflectra explores how artificial intelligence (AI) is transforming software development and testing. Discover how AI-powered tools are revolutionizing every stage of the software development lifecycle (SDLC), from design and prototyping to testing, deployment, and monitoring.
Learn about:
• The Future of Testing: How AI is shifting testing towards verification, analysis, and higher-level skills, while reducing repetitive tasks.
• Test Automation: How AI-powered test case generation, optimization, and self-healing tests are making testing more efficient and effective.
• Visual Testing: Explore the emerging capabilities of AI in visual testing and how it's set to revolutionize UI verification.
• Inflectra's AI Solutions: See demonstrations of Inflectra's cutting-edge AI tools like the ChatGPT plugin and Azure Open AI platform, designed to streamline your testing process.
Whether you're a developer, tester, or QA professional, this webinar will give you valuable insights into how AI is shaping the future of software delivery.
The Art of the Pitch: WordPress Relationships and SalesLaura Byrne
Clients don’t know what they don’t know. What web solutions are right for them? How does WordPress come into the picture? How do you make sure you understand scope and timeline? What do you do if sometime changes?
All these questions and more will be explored as we talk about matching clients’ needs with what your agency offers without pulling teeth or pulling your hair out. Practical tips, and strategies for successful relationship building that leads to closing the deal.
GraphRAG is All You need? LLM & Knowledge GraphGuy Korland
Guy Korland, CEO and Co-founder of FalkorDB, will review two articles on the integration of language models with knowledge graphs.
1. Unifying Large Language Models and Knowledge Graphs: A Roadmap.
https://arxiv.org/abs/2306.08302
2. Microsoft Research's GraphRAG paper and a review paper on various uses of knowledge graphs:
https://www.microsoft.com/en-us/research/blog/graphrag-unlocking-llm-discovery-on-narrative-private-data/
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Tobias Schneck
As AI technology is pushing into IT I was wondering myself, as an “infrastructure container kubernetes guy”, how get this fancy AI technology get managed from an infrastructure operational view? Is it possible to apply our lovely cloud native principals as well? What benefit’s both technologies could bring to each other?
Let me take this questions and provide you a short journey through existing deployment models and use cases for AI software. On practical examples, we discuss what cloud/on-premise strategy we may need for applying it to our own infrastructure to get it to work from an enterprise perspective. I want to give an overview about infrastructure requirements and technologies, what could be beneficial or limiting your AI use cases in an enterprise environment. An interactive Demo will give you some insides, what approaches I got already working for real.
Transcript: Selling digital books in 2024: Insights from industry leaders - T...BookNet Canada
The publishing industry has been selling digital audiobooks and ebooks for over a decade and has found its groove. What’s changed? What has stayed the same? Where do we go from here? Join a group of leading sales peers from across the industry for a conversation about the lessons learned since the popularization of digital books, best practices, digital book supply chain management, and more.
Link to video recording: https://bnctechforum.ca/sessions/selling-digital-books-in-2024-insights-from-industry-leaders/
Presented by BookNet Canada on May 28, 2024, with support from the Department of Canadian Heritage.
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...UiPathCommunity
💥 Speed, accuracy, and scaling – discover the superpowers of GenAI in action with UiPath Document Understanding and Communications Mining™:
See how to accelerate model training and optimize model performance with active learning
Learn about the latest enhancements to out-of-the-box document processing – with little to no training required
Get an exclusive demo of the new family of UiPath LLMs – GenAI models specialized for processing different types of documents and messages
This is a hands-on session specifically designed for automation developers and AI enthusiasts seeking to enhance their knowledge in leveraging the latest intelligent document processing capabilities offered by UiPath.
Speakers:
👨🏫 Andras Palfi, Senior Product Manager, UiPath
👩🏫 Lenka Dulovicova, Product Program Manager, UiPath
Epistemic Interaction - tuning interfaces to provide information for AI supportAlan Dix
Paper presented at SYNERGY workshop at AVI 2024, Genoa, Italy. 3rd June 2024
https://alandix.com/academic/papers/synergy2024-epistemic/
As machine learning integrates deeper into human-computer interactions, the concept of epistemic interaction emerges, aiming to refine these interactions to enhance system adaptability. This approach encourages minor, intentional adjustments in user behaviour to enrich the data available for system learning. This paper introduces epistemic interaction within the context of human-system communication, illustrating how deliberate interaction design can improve system understanding and adaptation. Through concrete examples, we demonstrate the potential of epistemic interaction to significantly advance human-computer interaction by leveraging intuitive human communication strategies to inform system design and functionality, offering a novel pathway for enriching user-system engagements.
State of ICS and IoT Cyber Threat Landscape Report 2024 previewPrayukth K V
The IoT and OT threat landscape report has been prepared by the Threat Research Team at Sectrio using data from Sectrio, cyber threat intelligence farming facilities spread across over 85 cities around the world. In addition, Sectrio also runs AI-based advanced threat and payload engagement facilities that serve as sinks to attract and engage sophisticated threat actors, and newer malware including new variants and latent threats that are at an earlier stage of development.
The latest edition of the OT/ICS and IoT security Threat Landscape Report 2024 also covers:
State of global ICS asset and network exposure
Sectoral targets and attacks as well as the cost of ransom
Global APT activity, AI usage, actor and tactic profiles, and implications
Rise in volumes of AI-powered cyberattacks
Major cyber events in 2024
Malware and malicious payload trends
Cyberattack types and targets
Vulnerability exploit attempts on CVEs
Attacks on counties – USA
Expansion of bot farms – how, where, and why
In-depth analysis of the cyber threat landscape across North America, South America, Europe, APAC, and the Middle East
Why are attacks on smart factories rising?
Cyber risk predictions
Axis of attacks – Europe
Systemic attacks in the Middle East
Download the full report from here:
https://sectrio.com/resources/ot-threat-landscape-reports/sectrio-releases-ot-ics-and-iot-security-threat-landscape-report-2024/
Generating a custom Ruby SDK for your web service or Rails API using Smithyg2nightmarescribd
Have you ever wanted a Ruby client API to communicate with your web service? Smithy is a protocol-agnostic language for defining services and SDKs. Smithy Ruby is an implementation of Smithy that generates a Ruby SDK using a Smithy model. In this talk, we will explore Smithy and Smithy Ruby to learn how to generate custom feature-rich SDKs that can communicate with any web service, such as a Rails JSON API.
Generating a custom Ruby SDK for your web service or Rails API using Smithy
AccessU 2018 - Surviving Dev Frameworks: Lessons Learned with WordPress, Drupal, and jQuery
1. SURVIVING DEV FRAMEWORKS:
LESSONS LEARNED WITH
DRUPAL, WORDPRESS, JQUERY, AND MORE
Kate Walser • CX Insights
kwalser@cxinsights.com • @kwalser
Slides @ https://www.slideshare.net/kwalser
2. CHALLENGE
Costly commercial software
• As the market crashed in the late 1990s and early
2000s and the recession hit, agencies and
businesses were finding ways to cut costs.
Creative Commons – Some Rights Reserved
2
Image credit: “Piggy Banks with savings chart,” by managementwritingsolutions
Flickr Creative Commons
4. TRENDING
Frameworks & Open Source
Creative Commons – Some Rights Reserved
4
Logos and trademarks courtesy of Oracle, Microsoft, Drupal, and
WordPress.
All product and company names are trademarks™ or registered® trademarks
of their respective holders. Use of them does not imply any affiliation with or
endorsement by them.
8. Content Management
Publish, Edit, Approve
• WordPress, Drupal, Joomla, Grav, SharePoint and
other content management tools let organizations
build websites quickly and manage content easily.
The built-in options out of box for most of them
include the ability to tag content with headings, used
by assistive technologies.
• Content owners can also insert media, and in some
better designed tools like WordPress, add alternative
text.
Creative Commons – Some Rights Reserved
8
9. Navigation
Drop-downs, Megamenus, Mobile menus
• Menu trends totally collapsed menus and that
drop-down menus that are only available on hover
Creative Commons – Some Rights Reserved
9
10. Forms
Cues, Formats, Feedback
• You can also quickly stand up forms to collect
information such as Contact Us, newsletter
subscription, registration, or application
information using Drupal’s Ctools and various
frameworks and plug-ins, like Contact Form 7.
• Many offer support to let you include required
indicators, date picker widgets, and informative
text near the fields to help users know what
format is needed.
Creative Commons – Some Rights Reserved
10
11. Dynamic Areas
Autocompletes, Data-dependent forms, Pop-ups
• Functionality like autocomplete, typeahead search
/ results, data-driven forms are popping up across
sites.
Creative Commons – Some Rights Reserved
11
12. Dynamic Sidebars
Feedback, Chat, and Support
• More sites are including feedback and chat options
off to the side. In some cases they pop up without
any user interaction, which can cause confusion for
users.
Creative Commons – Some Rights Reserved
12
14. Search & Queries
Tables, Filter, Show X rows, Pagerlinks
Creative Commons – Some Rights Reserved
14
Example: https://datatables.net/
15. Big Data
Charts and Tables
New and easier to leverage chart libraries are giving
organizations quick and easy ways to show big data in
charts and scorecards.
Creative Commons – Some Rights Reserved
15
Source: https://cloud.google.com/blog/big-data/2017/04/how-to-build-a-bi-dashboard-using-google-
data-studio-and-bigquery
17. FOR FRAMEWORKS
Accessible content’s easy(er)…
• Content headings
• Labels for basic fields
• Table headings
• Skip to main content
Creative Commons – Some Rights Reserved
17
18. WHEN USING FRAMEWORKS
Richer content and interactions fell short
1. Title, not alt attribute, was
default text for media
2. Tables pasted in from Word lost
headings
3. Keyboard and speech recognition
had less support
4. Accessible rich Internet
application (ARIA) support to
provide context, info varied –
good for menus, but lacking for
autocomplete and dynamic
widgets
Creative Commons – Some Rights Reserved
18
19. DEMO
Pop-ups, menus weren’t reachable
• Websites with pop-ups for tooltips, navigation
menus, and modals and dialogs weren’t always
reachable by keyboard.
Creative Commons – Some Rights Reserved
19
20. LESSONS LEARNED
Add key listeners, focus management
• Add keyboard alternative for click and hover events
– Use native <a href> and interactive elements (button, etc.) when possible
– Level 1 menu links sometimes removed href that provides keyboard
support
– Add hover only after keyboard handled
• Verify that focus outline available
• Set focus when open pop-up
windows and dialogs
• Provide a11y info via Help,
offscreen text, or ARIA
Creative Commons – Some Rights Reserved
20
21. DEMO
Form labels, helper text, feedback weren’t accessible
Example: https://kwalser.wufoo.com/forms/applicant/
Creative Commons – Some Rights Reserved
21
22. LESSONS LEARNED
Adjust rendering of labels, helper text with ARIA, listeners
• Adjust out of box required field settings
– Change * to Required
– Add required attribute to field
• Assign field descriptions to fields
• Adjust code for custom items
– Forms in dialogs
– Character counts
Creative Commons – Some Rights Reserved
22
23. LESSONS LEARNED
Set focus to feedback and add “aria-describedby”
• Improve status messages
– Move focus to success / error messages after validation
– Include links to fields with problems
• Associate error message with field via ARIA
Creative Commons – Some Rights Reserved
23
Example: http://assets.cms.gov/resources/framework/3.4.1/Pages/#formvalidator
24. DEMO
Search, typeahead weren’t keyboard accessible or
didn’t announce result set
Creative Commons – Some Rights Reserved
24
Example: https://www.nps.gov , https://www.cdc.gov
25. • Where input fields offer
typeahead functionality, use
ARIA and event listeners if
needed to enable focus to
move to the list as soon as
it’s available.
• Include the empty div /
container in the code on
page load and position it
immediately after the
search box to minimize
extra work.
Creative Commons – Some Rights Reserved
25
LESSONS LEARNED
Test with keyboard and check ARIA attributes
Sample Code
<input id="search-input" name=" search-input " type="text" class="form-
text" size="60" maxlength="128" aria-haspopup="true" aria-
autocomplete="both" role="combobox" aria-describedby="number-results">
<p class="show-on-results sr-only" id="number-results">10 matching
results</p>
<ul class="show-on-results" id="search-results" role="">
<li><a href="…">medicaid</a></li></ul>
26. LESSONS LEARNED
Extend typeahead functionality
• Add offscreen element (e.g., <span>) with
role=“status” and aria-live=“polite” to provide
feedback on # of results, navigation tips
• Add keydown listener on down arrow to show and
set focus on the first result
Creative Commons – Some Rights Reserved
26
28. LESSONS LEARNED
Pick accessible libraries and tweak as needed
• Change filter option labels to
“Filter” to avoid Search hot
command collision in speech
recognition
• Set focus back to logical spot when
pager links used
– Previous, page #, and next caused page
refresh, focus set to top rather than
search results (or pager links)
• Associate text and map results for
location-aware searches (e.g., Near
you) to improve map a11y
Creative Commons – Some Rights Reserved
28
29. DEMO
Interactive charts still evolving
Creative Commons – Some Rights Reserved
29
Source: http://www.chartjs.org/samples/latest/charts/pie.html
30. LESSONS LEARNED
Use chart libraries that show labels or raw data
Creative Commons – Some Rights Reserved
30
31. LESSONS LEARNED
Use chart libraries that show labels or raw data
Creative Commons – Some Rights Reserved
31
33. 1. List all major features
• Navigation
– Drop-downs, Jump links, Into / out of dialogs and auto-complete
• Search, faceted drill-down
– Results, Filtering, Pagination / pager links, Table headings
• Sliders, carousels, galleries, tabs
• Content sharing options, plugins
• Maps and data charts
Creative Commons – Some Rights Reserved
33
34. 2. Describe interactions, test criteria, examples
• If click triggers action,
keyboard will also…
• If hover triggers action,
keyboard alternative…
• If error returned…
• If many links / elements in
the widget...
Creative Commons – Some Rights Reserved
34
35. 3. Prioritize keyboard access
• Start with click and key event listeners
• Only use mouse-related listeners for non-critical
interactions
• Try interacting from different devices
– Keyboard only
– Mobile
Creative Commons – Some Rights Reserved
35
36. 4. Choose tools with large communities
• Look at downloads, usage, active maintenance
• Find resources on StackOverflow, Quora, JSFiddle.net, CodePen.io
– site:codepen.io +aria +example +jquery/drupal/wp
– site:jsfiddle.net +aria +example +jquery/drupal/wp
– site:jsbin.com +aria +example +jquery/drupal/wp
• Google site:frameworkname +accessibility +…
– “How do I”
– Keyboard access
Creative Commons – Some Rights Reserved
36
38. Drupal Groups Site
Accessibility (AX) Pledge Modules / Themes
• Drupal Group’s site lists modules and themes that
have pledge to be accessible and those that the
community wishes would take the pledge.
Creative Commons – Some Rights Reserved
38
Drupal has made a pledge to accessibility, to make both its core framework
accessible and challenge module and theme developers to take an accessibility
pledge. This means they will “try” to make their products accessible.
Accessibility pledge modules/themes
#D7AX, #D8AX
39. Check usage stats if available
Creative Commons – Some Rights Reserved
39
40. 5. Do a quick check
• Can you navigate using the keyboard? (Tab key)
• Are any menus keyboard-accessible, either with Enter or
Spacebar key on parent? Can you reach any pop-ups?
• Do form elements wrap labels in <label> tags?
• Do any dynamic elements have aria-* attributes in the
code?
• Do dynamic elements that return information or results
relate the element with the results?
Creative Commons – Some Rights Reserved
40
41. 6. Use forums, API, examples
• Many JavaScript libraries document their APIs and
options
• Look for examples to see if and how you can
change things like labels, event listeners, and other
options
• Check forums like StackOverflow and others to see
if others experienced same issue
Creative Commons – Some Rights Reserved
41
42. • Look for accessibility frameworks that extend the
functionality or provide examples of how to make it
accessible
7. Apply (or create) a11y helpers
Creative Commons – Some Rights Reserved
42
Assets.CMS.gov
Standards.USA.gov
43. Useful a11y resources
• Knowbility Developer Resources
– Includes links to browser add-ons and favelets –
http://www.knowbility.org/v/air-dev-resources/AIR-Austin/34/
• Center for Medicare & Medicaid Services
– Assets.cms.gov – Accessibility framework
– Medicare.gov – Accessible website
• Browser add-ons
– Check Chrome, Firefox, IE plugins, extensions
Creative Commons – Some Rights Reserved
43
45. Summary
• Rich, interactive elements present greatest challenge
• “Quick check” of plugin, module, library accessibility helps
• Describe how interactions should work and find examples
45
Editor's Notes
Acronyms to know
A11y = accessibility
WCAG = web content accessibility guidelines
ARIA = accessible rich Internet application standards
Many of us are still in an Agile world where agencies and businesses are focused on creating an initial concept and iterating on that and building
Open source software and commercial frameworks like Drupal, WordPress, jQuery, Yahoo UI, and others have grown in popularity over the past decade.
Businesses use Microsoft SharePoint and Oracle Apex used to stand up intranets and data-intensive apps.
With today’s frameworks, creating an accessible product can feel like being locked in a jail with limited options to get out.
Search, Tables & Filters
Simplistic idea of accessibility as alt attributes and table headings
Apps have evolved and so have the interactions users expect and accessibility options
Drupal configuration
WordPress settings
Limitations and constraints imposed by the modules and framework
Far removed from the actual code
With several plugins and libraries, we found great support for screen reader users. Accessible rich Internet application (ARIA) standards were great
In several tools, there’s a built in asterisk that’s included in various positions –
In several tools, there’s a built in asterisk that’s included in various positions –
WordPress site
Search uses plugin
In several tools, there’s a built in asterisk that’s included in various positions –
In several tools, there’s a built in asterisk that’s included in various positions –
When choosing modules and plug-ins for your framework, think about support – the more popular and widely used modules tend to have more support and examples. You’ll find lots of claims of “Accessible, responsive” choices, but they’re often pretty limited and they often do the easy things.
The more popular, widely-used items tend to have better out-of-box accessibility support as they applied standards / good coding and have more contributors. And if not, you’ll often be able to Google to find examples on Quora, Stack Overflow or other websites where developers ask questions.