The solutions are found in this Github repo. ✅
https://github.com/shimphillip/applied-accessibility-and-responsive-web-design-principles
This are the 4th and 5th courses of the Responsive Web Design module https://www.freecodecamp.org/learn/responsive-web-design/#applied-accessibility
https://www.freecodecamp.org/learn/responsive-web-design/#responsive-web-design-principles
Timecodes
0:00 Intro
0:23 Add a Text Alternative to Images for Visually Impaired Accessibility
1:12 Know When Alt Text Should be Left Blank
1:45 Use Headings to Show Hierarchical Relationships of Content
2:40 Jump Straight to the Content Using the main Element
3:04 Wrap Content in the article Element
3:27 Make Screen Reader Navigation Easier with the header Landmark
3:52 Make Screen Reader Navigation Easier with the nav Landmark
4:15 Make Screen Reader Navigation Easier with the footer Landmark
4:36 Improve Accessibility of Audio Content with the audio Element
5:44 Improve Chart Accessibility with the figure Element
6:26 Improve Form Field Accessibility with the label Element
7:04 Wrap Radio Buttons in a fieldset Element for Better Accessibility
8:03 Add an Accessible Date Picker
8:51 Standardize Times with the HTML5 datetime Attribute
9:39 Make Elements Only Visible to a Screen Reader by using Custom CSS
10:28 Improve Readability with High Contrast Text
11:01 Avoid Colorblindness Issues by Using Sufficient Contrast
11:46 Avoid Colorblindness Issues by Carefully Choosing Colors that Convey Information
12:17 Give Links Meaning by Using Descriptive Link Text
13:05 Make Links Navigable with HTML Access Keys
13:57 Use tabindex to Add Keyboard Focus to an Element
14:41 Use tabindex to Specify the Order of Keyboard Focus for Several Elements
15:45 Create a Media Query
16:24 Make an Image Responsive
16:55 Use a Retina Image for Higher Resolution Displays
17:29 Make Typography Responsive
18:23 Outro
![Download This Stunning and Creative HTML Website Template for free today [Video]](https://i0.wp.com/vlog.mondoplayer.com/wp-content/uploads/2022/06/mp_186248_0_0jpg.jpg?fit=480%2C360&ssl=1)
![Web Portfolio Workshop [Video]](https://i0.wp.com/vlog.mondoplayer.com/wp-content/uploads/2022/06/mp_186256_0_0jpg.jpg?fit=480%2C360&ssl=1)
![Coding a Button Dropdown Menu [Video]](https://i0.wp.com/vlog.mondoplayer.com/wp-content/uploads/2022/06/mp_185618_0_0jpg.jpg?fit=480%2C360&ssl=1)
![CSS Button with Cool Hover animation effect [Video]](https://i0.wp.com/vlog.mondoplayer.com/wp-content/uploads/2022/06/mp_185875_0_0jpg.jpg?fit=480%2C360&ssl=1)