Debugging HTML

In Brief

The following HTML example has several errors in it. Remix this project on Glitch and do your best to improve this code.

Purpose

This is an evaluation exercise that will give you a sense of what familiarity with HTML you’ve retained from previous classes. You’ll be asked to complete an activity and also evaluate yourself, so you know whether or not to do additional HTML review.

Process

This is meant to be a short exercise; set a timer and don’t spend more than 20 minutes on this please. 🙏🏻

The timer is not meant to make you anxious, but rather to stop you from spending too much time on this activity. It’s a much better use of your time to read the review links below than to spend an hour on this activity.

1. Click the Remix to Edit button to make a copy of this Glitch project.
2. Next, click Edit Fullscreen; this will force the project to open in its own window where you can save your work. You must do this in order to have a copy of your changes to share back with me.
3. Make changes to the index.html, focusing first on any code that is broken.
4. After you’ve fixed the areas with broken code, review the HTML to see if there are other improvements to be made.
5. When you are satisfied with your code, copy the link for your project and add it to the form immediately below. See this screen capture to see how to get the link:

Next Steps

If this activity made you want to review some HTML, I highly recommend these lessons from the tutorial HTML & CSS Is Hard (but it doesn’t have to be) by Oliver James:

• Basic Web Pages (est. reading time: 16min)
• Links and Images (est. reading time: 20min)
• Semantic HTML (est. reading time: 22min)