Chris DeMars
Senior Developer Advocate @ DigitalOcean
Detroit, Michigan, United States
Chris DeMars is a Senior Developer Advocate at DigitalOcean with over 20 years of technical experience. He speaks all over the world on web accessibility, feature flags, A/B testing, and CSS. For his community contributions, he holds awards as a Microsoft MVP, Google Developer Expert, Cloudinary Media Developer Expert, Auth0 Ambassador, and Progress Ninja. Chris advocates, teaches, and speaks on web accessibility as well as modern CSS; building applications with both at the forefront. When he is not working on making the web great and accessible you can find him writing blog posts, rating Detroit Style pizza, and watching Horror movies.
Awards
Area of Expertise
Topics
Building Accessible Components with Razor
Creating robust experiences using C# and .NET is pretty great if you are a back-end developer, but what if your power lies in the front end? Were you ever tasked to build in accessibility, but the only catch was it had to be supported by C# developers? The power of ASP.NET Core and C# 7 far exceeds the Microsoft technologies of the past, but it is still lacking in terms of building in solutions for accessibility. Razor syntax is the bridge between the back-end C# code and front-end HTML for creating beautiful user interfaces, that can also be accessibility-compliant. In this talk, I will briefly go through an intro to accessibility, Razor syntax, and build a standard form out of Razor syntax that is functional as well as accessible for users with disabilities.
Accessibility: A Point of Vue
Accessibility is gaining much more visibility in the web space than years past. What does it actually mean? What does it mean in regards to the JS framework or library that we are using? Concepts of accessibility like semantic markup, alt attributes, and proper color choices are great to learn but how do we apply those concepts to modern JavaScript frameworks? In this talk I will give a run down on what accessibility is, how to think with accessibility in mind, and how to create an accessible user experience in Vue.
React-a-tron: React on the Desktop
Wouldn't you love to build fast applications for the desktop? If the answer is yes, than look no further than building React apps with Electron. Electron is a framework to build cross-platform applications using tools you already know and love, HTML, CSS, and JavaScript. Chances are you use an Electron app in your daily workflow. Still skeptical? If you use Slack, Atom, or VS Code, you are using Electron. When you pair Electron with React, you can build amazingly fast and robust applications for Windows, Mac, and Linux. In this session, we will walk through how to set up an application using Electron, than we will introduce React and build a small desktop app that looks and feels like a native desktop application.
Run to the light Carol Anne: Auditing with Lighthouse
Have you heard about Lighthouse? Are you afraid to go into the light like Carol Anne in Poltergeist? Don't be afraid because Lighthouse is an awesome tool to achieve your web experience goals. You can do a bunch of awesome things in Lighthouse like running SEO audits, front-end performance audits, and my favorite, accessibility audits. This talk will explore reasons that audits and testing are necessary, and walk through different types of audits you can run. The end goal is analyzing the results and taking steps to achieve your web experience goals.
Rea11y Simple #A11y: A Focused Accessibility Workshop
Accessibility on the web is increasing in visibility, yet some web creators are still unfamiliar with how to create an amazing, accessible user experience. Spoiler alert, it starts with design, but what happens after that? In this workshop, I will walk the attendees through a site that has multiple violations, and a low score in Lighthouse. I will also touch on aXe Core, what it is, and how to use it. After we comb through the site, I will introduce easy wins like semantic markup, alt attributes, and ARIA labels to remove all violations. You'll walk away with the knowledge to build your sites with accessibility in mind.
I Can't See: Low Vision A11y & Users
When you think of low vision, what comes to mind? A user that is near sighted? How about far sighted? Maybe partially blind? These are all qualifying cases of poor vision, but low vision is more complicated than the prescription of glasses or contacts.
According to the World Health Organization, they categorize low vision based on specific levels of visual acuity and field of vision (W3.org, 2016). With that in mind, we as developers can look at different categories of low vision including color vision, visual acuity, contrast sensitivity, etc and make an effort to bake in things like zoom, non-conflicting colors, and re-wrapping of columns in to our code.
My talk will cover what vision accessibility is, different categories of low vision, what the needs of the users are, and what we as developers can do to achieve a great user experience for low vision users.
Hacking the Human Perception
Hacking you say? Yes, I do, but this type of hacking has nothing to do with hooking in Matrix style or surfing through The Gibson at Ellingson Mineral Company. Nope, this type of hacking involves how we as developers, create the illusion of fast load times for our Web applications. Performance is gaining much visibility in the industry and catering to the needs of the user, there are many things we can do to facilitate that need. This talk will focus on ways we can make things appear to be faster than they are and ways to avoid having to play Houdini entirely.
Focusing on Focus
When we think of CSS and Accessibility, what comes to mind? Is it adding alt attributes to image tags? How about color contrast? Is :focus given that much thought since browser's style these by default? Often, focus outlines are turned off in CSS to meet non-inclusive design standards, but this causes problems for keyboard users. How can we make the web a more inclusive place while maintaining design intent?.
As we build more and more things on the web, we must do our part in building awesome, accessible user experiences. Except native default browser styling of the :focus pseudo class is rather blah, don't you think? There has to be a better way to add some pizzazz to elements when users navigate without a mouse. In this talk, I will demo numerous ways to provide custom focus styles despite known limitations in the web platform. For users with disabilities, it's imperative that visual design finds a way to meet in the middle.
Common Accessibility Pitfalls: Climbing out, when you fall in.
You, your users, and Alice from Wonderland have something in common. At one point, everyone has fallen into a hole of perplexity, confusion, and sometimes hysterical madness. Unlike Alice, we can navigate ourselves and our users around the chaotic abyss that we call the web. Shipping inaccessible experiences to our users can have unpleasant effects. Being cognizant of all the things that can go wrong and who are potential users are will take us farther along our journey.
In this session we are going to learn about common accessibility violations that surface when we are lackadaisical about the experiences we ship. We will cover semantic markup, alt attributes and images, color contrast, and more. Attendees will walk away able to identify these problem areas in their codebases and learning techniques, tools, and best practices to keep our users happy and not drive them mad.
Believe in the Power of CSS
You know that song by Huey Lewis and the News, The Power of Love? "First time you feel it, it might make you sad." Might be how you feel about CSS right? What about the power of CSS? CSS has received a bad name as of late, but truth of the matter is that CSS is such a powerful piece of the front-end puzzle and you should really be excited for what's already here and what's to come! Who would have thought we could create magazine-style layouts with CSS grid? What about ruleset variable scoping with custom properties(CSS variables)? And last but not least, the pain of centering content horizontally and vertically which is now possible in three lines with flexbox! Let's talk about how awesome CSS is, and how we can restore our faith in one of the best things that makes the web amazing!
ARIA: A Grande Method Of Accessible Markup.
ARIA, or accessible rich internet applications, are a very powerful set of attributes that define non-semantic content for your users with disabilities. In this session, we are going to break down web accessibility at its most granular level before exploring ARIA properties that will help create amazing user experiences, when semantic markup won't cut it. By the end of this talk, you will walk away with the knowledge of introductory ARIA concepts and when to put them into practice.
Electrify Your Web App
Electrifying your Web app sounds out of this world doesn't it? Well, it is possible with a stable, subatomic framework called Electron. If you have ever built a Web app and thought to yourself, "Self, this would be awesome if I could bring this experience to desktops around the world!", now it is possible with Electron. Electron is a framework for creating native applications with front-end technologies that we all know and love. In this talk, I will introduce Electron, build a small application with front-end technologies including accessibility, and then deploy it to the desktop.
Turning Dr. Jekyll Into Mr. Gatsby
The days of building a blog with popular content management systems like Wordpress seem to have fallen to the wayside, at least in the developer community. Platforms like Ghost and Jekyll have paved the way for creating blogs with static site generators, and by doing this has removed the abstraction of server-side languages like PHP and MySQL databases used in a traditional-style blogging platform. Gatsby, the new kid on the block, is a static site generator using the power of React and Webpack to create blazingly fast static sites. In this talk, I will introduce Gatsby, the differences between other static site generators, and creating a basic page using Gatsby.
Grab Your Lighter: An Intro to Spark Design System
Buttons, Cards, and Accordions, Oh My! I know what you are thinking, but no, this isn't a stroll through the woods. You don't need a physical lighter, either. Break out your virtual lighters and join me for a trip down the design system trail to check out Spark! Spark is the design system created by Rocket Mortgage that streamlines UI creation for the apps you build. Spark can be used for anything- not just mortgage-based apps! In this talk, we will take a look at the components that make up Spark and how you can implement it into your projects using all three starter packages (HTML, React, and Angular).
Chris DeMars
Senior Developer Advocate @ DigitalOcean
Detroit, Michigan, United States
Please note that Sessionize is not responsible for the accuracy or validity of the data provided by speakers. If you suspect this profile to be fake or spam, please let us know.
Jump to top