The editable-table is a web component that improves the authoring experience for creating acceessible tables. Try an demo, and play with the code on CodePen.
a11y-media-player
The a11y-media-player is a video player web component with accessibility features. Try a demo, see the example markup it uses, and try it out on CodePen.
a11y-media-player An accessible video player interface that “plays nice” with Sites
Presented at Penn State’s Learning Design Summer Camp, online (View Slides)
a11y-media-player is a video player that combines the accessibility features of ABLE player, a modern user interface, and the tools we have available to us as Penn Staters. In this session, you’ll learn about the player, learn what makes it so accessible, and learn how to use it and the rest of our components library with your videos.
Old School HTML with Modern Web Components
Presented at PSEWeb 2021 and HighEdWeb 2020, online (View Slides)
Every generation the classics make a comeback. Frameworks are what all of the cool kids have been doing these last few years, but as of January all modern browsers support web components. It’s time for HTML to make a comeback. Web components are about to rock your world whether you’re a web developer or a user of the web. In this session you’ll learn what web components are, why your institution should use them, why dynamic imports allow them to load faster than any framework, and how anyone, ANYONE can use them with just a little bit of HTML knowledge.
Bringing Everyone to the Table: An Open-Source Table-Editor Web Component
Presented at HighEdWeb 2019, Milwaukee, WI (View Slides)
“I love how my CMS lets users create accessible, responsive tables!” said no one, ever.
No matter how many things a WYSIWYG editor or an author interface gets right, we still don’t have a UI that helps novices create accessible tables… until now. This session will highlight the pain points of creating tables on the web, how I created the table-editor web component, and how you can use this open source project.