Debug a Coding Journey Blog Page
Source: Dev.to
Workshop Overview
Today’s post is about the next workshop at freeCodeCamp, specifically in the Accessibility section of the Responsive Web Design certification. This workshop follows a series of theory lessons on accessibility that I completed yesterday, and I hope what I have learned will help the workshop go smoothly.
Fixing Heading Elements
The workshop begins by showing a blog page with accessibility issues. The first steps involve addressing problems with the heading elements:
## My Journey Learning to Code
I started learning to code a few months ago and it's been a wild ride!
#### Early Challenges
At first, syntax was really confusing.
#### Breakthroughs
Eventually things started to click.
## Accessibility Matters
Today I learned that not everyone uses the web the same way I do.
Screen Readers
These tools help visually impaired users browse websites.
## What's Next?
I'm excited to dive into JavaScript and build interactive features!
### Coming soon: My first JavaScript project!
Stay tuned for some exciting interactive blog features.Adding Navigation
The fourth exercise asks you to wrap the navigation section in a “ element:
## Navigation
- [My Journey](#post1)
- [Accessibility](#post2)
- [Next Steps](#post3)Using Semantic Elements
Next, the lesson guides you to replace generic elements with the semantic element and to insert a missing “ element:
## My Journey Learning to Code
I started learning to code a few months ago and it's been a wild ride!
### Early Challenges
At first, syntax was really confusing.
### Breakthroughs
Eventually things started to click.
## Accessibility Matters
Today I learned that not everyone uses the web the same way I do.
### Screen Readers
These tools help visually impaired users browse websites.
## What's Next?
I'm excited to dive into JavaScript and build interactive features!
### Coming soon: My first JavaScript project!
Stay tuned for some exciting interactive blog features.Adding Footer and Mailto Link
The final exercises guide you to add a footer, tweak another heading, and insert a mailto link. Below is an example of a mailto link:
Email me at [janedoe@email.com](mailto:janedoe@email.com)Conclusion
With all nine steps successfully completed, I feel that the workshop provided solid insight into potential accessibility issues when coding a webpage. Definitely some important things for me to watch out for in the future!
Tomorrow, I’ll be working through a couple of theory lessons on Working with Accessible Tables and Forms before moving on to the next workshop. Until then, keep coding!