Live-Code with Us: Fix the accessibility issues | HTML, CSS & JavaScript

Scrimba ยท Beginner ยท๐Ÿ–Œ๏ธ UI/UX Design ยท4y ago
๐ŸŽ“ View our courses: https://scrimba.com/links/all-courses Leanne, Michael and Pumpkin (๐Ÿฑ) sit down for another casual coding sesh, where they try to solve Scrimba's Weekly Web Dev Challenge. This week, they are fixing accessibility issues with HTML, CSS, JavaScript, and your help! If you'd like to try the challenge for yourself, you can find it here: https://scrimba.com/learn/weeklychallenge ๐Ÿ’ปCheck out Scrimbaโ€™s interactive learning platform: Scrimba: https://scrimba.com/ ๐ŸฆSay hi on Twitter: Scrimba: https://twitter.com/scrimba Leanne: https://twitter.com/RybaLeanne Michael: https://twitter.com/alanmynah
Watch on YouTube โ†— (saves to browser)
Sign in to unlock AI tutor explanation ยท โšก30

Playlist

Uploads from Scrimba ยท Scrimba ยท 0 of 60

โ† Previous Next โ†’
1 CSS Grid Course: Learn the Basics in 3 Minutes
CSS Grid Course: Learn the Basics in 3 Minutes
Scrimba
 2 CSS Grid Course: Positioning Items
CSS Grid Course: Positioning Items
Scrimba
 3 CSS Grid Course: Why Learn It And How It Compares To Bootstrap
CSS Grid Course: Why Learn It And How It Compares To Bootstrap
Scrimba
 4 CSS Grid Course: auto-fit & minmax
CSS Grid Course: auto-fit & minmax
Scrimba
 5 CSS Grid Course: Implicit Rows
CSS Grid Course: Implicit Rows
Scrimba
 6 CSS Grid Course: Fraction Units And Repeat
CSS Grid Course: Fraction Units And Repeat
Scrimba
 7 CSS Grid Course: Justify Items and Align Items
CSS Grid Course: Justify Items and Align Items
Scrimba
 8 CSS Grid Course: An Awesome Image Grid
CSS Grid Course: An Awesome Image Grid
Scrimba
 9 CSS Grid Course: Named Lines
CSS Grid Course: Named Lines
Scrimba
 10 CSS Grid Course: auto-fit vs auto-fill
CSS Grid Course: auto-fit vs auto-fill
Scrimba
 11 CSS Grid Course: Justify Content and Align Content
CSS Grid Course: Justify Content and Align Content
Scrimba
 12 CSS Grid Course: Template areas
CSS Grid Course: Template areas
Scrimba
 13 27. Setting up the structure - Responsive CSS Tutorial
27. Setting up the structure - Responsive CSS Tutorial
Scrimba
 14 25. Making the navigation responsive - Responsive CSS Tutorial
25. Making the navigation responsive - Responsive CSS Tutorial
Scrimba
 15 36. Playing with the title's position and negative margins - Responsive CSS Tutorial
36. Playing with the title's position and negative margins - Responsive CSS Tutorial
Scrimba
 16 31. Starting the CSS for our page - Responsive CSS Tutorial
31. Starting the CSS for our page - Responsive CSS Tutorial
Scrimba
 17 26. Taking a look at the rest of the project - Responsive CSS Tutorial
26. Taking a look at the rest of the project - Responsive CSS Tutorial
Scrimba
 18 15. Spacing out the columns - Responsive CSS Tutorial
15. Spacing out the columns - Responsive CSS Tutorial
Scrimba
 19 33. Starting to think mobile first - Responsive CSS Tutorial
33. Starting to think mobile first - Responsive CSS Tutorial
Scrimba
 20 22. Making our navigation look good - Responsive CSS Tutorial
22. Making our navigation look good - Responsive CSS Tutorial
Scrimba
 21 37. Changing image size with object-fit - Responsive CSS Tutorial
37. Changing image size with object-fit - Responsive CSS Tutorial
Scrimba
 22 44. Module Wrap up - Responsive CSS Tutorial
44. Module Wrap up - Responsive CSS Tutorial
Scrimba
 23 16. Controlling the vertical position of flex items - Responsive CSS Tutorial
16. Controlling the vertical position of flex items - Responsive CSS Tutorial
Scrimba
 24 39. Setting up the widgets and talking breakpoints - Responsive CSS Tutorial
39. Setting up the widgets and talking breakpoints - Responsive CSS Tutorial
Scrimba
 25 42. Setting up the About Me page - Responsive CSS Tutorial
42. Setting up the About Me page - Responsive CSS Tutorial
Scrimba
 26 35. Changing the visual order with flexbox - Responsive CSS Tutorial
35. Changing the visual order with flexbox - Responsive CSS Tutorial
Scrimba
 27 23. Adding the underline - Responsive CSS Tutorial
23. Adding the underline - Responsive CSS Tutorial
Scrimba
 28 21. Using flexbox to start styling our navigation - Responsive CSS Tutorial
21. Using flexbox to start styling our navigation - Responsive CSS Tutorial
Scrimba
 29 20. Creating a navigation - Responsive CSS Tutorial
20. Creating a navigation - Responsive CSS Tutorial
Scrimba
 30 40. Using a new pseudo class to wrap up the homepage - Responsive CSS Tutorial
40. Using a new pseudo class to wrap up the homepage - Responsive CSS Tutorial
Scrimba
 31 43. Fixing up some loose ends - Responsive CSS Tutorial
43. Fixing up some loose ends - Responsive CSS Tutorial
Scrimba
 32 32. Starting the layout. Looking at the big picture - Responsive CSS Tutorial
32. Starting the layout. Looking at the big picture - Responsive CSS Tutorial
Scrimba
 33 24. A more complicated navigation - Responsive CSS Tutorial
24. A more complicated navigation - Responsive CSS Tutorial
Scrimba
 34 28. Feature article structure - Responsive CSS Tutorial
28. Feature article structure - Responsive CSS Tutorial
Scrimba
 35 34. Styling the featured article - Responsive CSS Tutorial
34. Styling the featured article - Responsive CSS Tutorial
Scrimba
 36 18. Making layout responsive with flex direction - Responsive CSS Tutorial
18. Making layout responsive with flex direction - Responsive CSS Tutorial
Scrimba
 37 19. flex direction explained - Responsive CSS Tutorial
19. flex direction explained - Responsive CSS Tutorial
Scrimba
 38 41. Creating the recent posts page - Responsive CSS Tutorial
41. Creating the recent posts page - Responsive CSS Tutorial
Scrimba
 39 17. Media Query basics - Responsive CSS Tutorial
17. Media Query basics - Responsive CSS Tutorial
Scrimba
 40 30. Home Page. HTML for the aside - Responsive CSS Tutorial
30. Home Page. HTML for the aside - Responsive CSS Tutorial
Scrimba
 41 38. Styling recent articles for large screens - Responsive CSS Tutorial
38. Styling recent articles for large screens - Responsive CSS Tutorial
Scrimba
 42 29. The home page. HTML for the recent articles - Responsive CSS Tutorial
29. The home page. HTML for the recent articles - Responsive CSS Tutorial
Scrimba
 43 10. ems and rems an example - Responsive CSS Tutorial
10. ems and rems an example - Responsive CSS Tutorial
Scrimba
 44 1. Starting to think responsively - Responsive CSS Tutorial
1. Starting to think responsively - Responsive CSS Tutorial
Scrimba
 45 4. Controlling the width of images - Responsive CSS Tutorial
4. Controlling the width of images - Responsive CSS Tutorial
Scrimba
 46 5. min width and max width - Responsive CSS Tutorial
5. min width and max width - Responsive CSS Tutorial
Scrimba
 47 3 CSS Units. Percentage - Responsive CSS Tutorial
3 CSS Units. Percentage - Responsive CSS Tutorial
Scrimba
 48 11. Flexbox refresher and setting up some HTML - Responsive CSS Tutorial
11. Flexbox refresher and setting up some HTML - Responsive CSS Tutorial
Scrimba
 49 12. Basic Styles and setting up the columns - Responsive CSS Tutorial
12. Basic Styles and setting up the columns - Responsive CSS Tutorial
Scrimba
 50 8. The Solution Rems - Responsive CSS Tutorial
8. The Solution Rems - Responsive CSS Tutorial
Scrimba
 51 14. Setting the columns widths - Responsive CSS Tutorial
14. Setting the columns widths - Responsive CSS Tutorial
Scrimba
 52 2 CSS Units - Responsive CSS Tutorial
2 CSS Units - Responsive CSS Tutorial
Scrimba
 53 7. The problem with ems - Responsive CSS Tutorial
7. The problem with ems - Responsive CSS Tutorial
Scrimba
 54 6. CSS Units. The em unit - Responsive CSS Tutorial
6. CSS Units. The em unit - Responsive CSS Tutorial
Scrimba
 55 13. Adding the background color - Responsive CSS Tutorial
13. Adding the background color - Responsive CSS Tutorial
Scrimba
 56 9. Picking which unit to use - Responsive CSS Tutorial
9. Picking which unit to use - Responsive CSS Tutorial
Scrimba
 57 Tutorial to Learn Alpine JS - Full Course for Beginners
Tutorial to Learn Alpine JS - Full Course for Beginners
Scrimba
 58 Guide To Algorithms in Javascript [Binary Search] - Full Course / Tutorial
Guide To Algorithms in Javascript [Binary Search] - Full Course / Tutorial
Scrimba
 59 Learn UI Design [7 Fundamentals Tutorial] - Full Course for Beginners
Learn UI Design [7 Fundamentals Tutorial] - Full Course for Beginners
Scrimba
 60 Javascript Tutorial for Beginners [From 0 to ES6+] - Full Course
Javascript Tutorial for Beginners [From 0 to ES6+] - Full Course
Scrimba

Related AI Lessons

โšก
Properties of scroll-timeline: creating animations on scroll without JavaScript
Learn to create animations on scroll without JavaScript using scroll-timeline properties
Dev.to ยท Nick Benksim
 โšก
Inline context for every article, without leaving the page
Learn to use inline context to improve reading experience without leaving the page
Dev.to ยท J Now
 โšก
Is Spatial Computing the Death of the Screen?
Spatial computing may replace traditional screens, changing how we interact with digital information
Medium ยท Cybersecurity
 โšก
Reflections on UI/UX Prototyping, Pitching Architecture, and Network Defense.
Learn to avoid common pitfalls in software development by focusing on UI/UX prototyping, pitching architecture, and network defense
Medium ยท Cybersecurity
Up next
Designing for Brands and Social Media with Photoshop
Coursera
Watch โ†’