Geekle eCommerce Tech Summit - December 2021
•
0 likes•71 views
PaaS solutions help launch eCommerce stores in record time and provide lots of features out of the box. However, it is critical for developers to understand the UX and accessibility requirements to build inclusive digital solutions. Most projects fail to connect the creative and tech processes, so it's our job as "geek" to better bridge that gap. Let's explore the end-to-end process and best practices so you can ensure your next eCommerce project is compliant and optimised for all.
Report
Share
Geekle eCommerce Tech Summit - December 2021
- 1. @sylvainreiter Baking in accessibility throughout the project lifecycle
- 3. @sylvainreiter INCREASE IN TRAFFIC 12 MONTHS AFTER LAUNCH 77% INCREASE IN CONVERSION RATE 12 MONTHS AFTER LAUNCH (1.4 TO 2.9% CVR) 166%
- 4. @sylvainreiter An agency focused on digital transformation through UX and technology Cyber-Duck Growing since 2005. Over 80 staff. ISO accredited process. £5m revenue. HQ in London. Our values: Excellence + Selfless + Relentless + Adaptive
- 6. @sylvainreiter A SET OF PRINCIPLES ✓ Perceivable ✓ Operable ✓ Understandable ✓ Robust
- 7. @sylvainreiter A DIGITAL STANDARD ✓ Several levels of conformance ✓ More stringent criteria as you go up ✓ Used during audits to measure compliance
- 8. @sylvainreiter A DIGITAL STANDARD ✓ Several levels of conformance • A - 25 criteria • AA - 38 criteria • AAA - 61 criteria
- 9. @sylvainreiter A COMPLETE MINDSET ✓ Planning & UX ✓ Creative Design ✓ Development & Testing ✓ Ongoing improvements
- 10. @sylvainreiter WHY SHOULD YOU CARE?
- 11. @sylvainreiter REGULATORY COMPLIANCE ✓ ADA / Section 508 (USA) ✓ Disability Act (UK) ✓ Similar laws in EU / AUS ✓ Negative PR risk
- 12. @sylvainreiter BEST PRACTICES ✓ Compatibility with all platforms ✓ Performance improvement ✓ Visual consistency ✓ SEO boost
- 13. @sylvainreiter THE BASICS ARE EASY ✓ Images ✓ Links ✓ Form fields ✓ Keyboard navigation
- 14. @sylvainreiter THE BASICS ARE EASY ✓ …
- 15. @sylvainreiter IT’S GOOD FOR ECOMMERCE ✓ Increased conversions ✓ Untapped audience ✓ Unique differentiator ✓ Cost of customer service
- 16. @sylvainreiter IT’S THE RIGHT THING TO DO ✓ It benefits everyone ✓ Equal participation for all ✓ 1 billion people depend on it ✓ Culture of diversity and inclusivity
- 18. @sylvainreiter CHECKLIST ✓ Prepare your team (mindset) ✓ Define KPIs (WCAG) ✓ Pick a platform (theming engine) ✓ Forget overlay solutions (do it yourself) ✓ Allow time for your teams (audits) ✓ Test, test, test
- 20. @sylvainreiter HTML LANDMARKS ✓ Special markup <nav aria- label="Secondary Navigation">...</nav>
- 21. @sylvainreiter SEMANTIC HEADINGS ✓ Ensure compatibility with screen-readers ✓ Correct orders of <H> ✓ Alt tags on all images ✓ Captions on videos
- 22. @sylvainreiter KEYBOARD NAVIGATION ✓ Consider focus triggers - Navigation dropdown - Accordions - Forms
- 24. @sylvainreiter SKIP LINK ✓ Add a skip link as the 1st element of any page <a href="#main-content" class="skip-link">Skip to content</a>
- 25. @sylvainreiter CSS ELEMENTS ✓ Understand the impact display: none; or visibility: hidden; VS opacity: 0; or overflow: hidden;
- 27. @sylvainreiter TESTING DESKTOP SCREEN READERS SCREEN MAGNIFIERS VoiceOver for iOS Android Accessibility Suite Apple Magni fi er Windows Magnifier SPEECH RECOGNITION MOBILE SCREEN READERS CI / CD Tool
- 30. @sylvainreiter TESTING ✓ Manual reports ✓ Gorilla testing ✓ Professional audits ✓ In-labs audits
- 33. @sylvainreiter TALE OF CAUTION ✓ Do NOT use overlay solutions • Don’t work as expected • Don’t protect legally • Expensive
- 34. @sylvainreiter KEY TAKEAWAYS ✓ The internet is for everyone ✓ Accessible design is beautiful design ✓ Accessible websites improve conversions ✓ Accessibility is everyone’s responsibility
- 36. @sylvainreiter ARE YOU READY TO START TOMORROW?