How Much HTML Do I Need To Be Job-Ready?

HTML is the foundation of all web applications/websites, and strong knowledge of it is a must for any web developer. But like a lot of development technologies, there's a lot to potentially learn, or overlearn when you're first starting out with the language. I've put together this guide to clearly spell out how well you need to know HTML to become a professional developer!

What Do I Mean By Job-Ready?

Before starting, let me clarify precisely what I mean when I say 'job-ready:

• You'll understand the broad strokes of the technology in question, and know the most fundamental concepts that come up every day.

• There may be gaps in your knowledge, but those will be limited to secondary concepts or syntax/other details that you'll be able to find the answer to relatively quickly and easily.

• You'll know exactly where to turn to find answers to problems or questions that you're running into.

Following the advice here won't make you a master of HTML, but you'll be effective at the day-to-day that you'll need to get started on the job.

What you need to know

• You need to understand the core mechanics of HTML: how tags work, attributes, empty/void elements, etc.

• Know what ids and classes are and what the difference between them is. This is generally more of a CSS topic (which you should be learning at the same time as HTML), but ids do matter for in-page navigation in some cases.

• Understand the basics of the doctype declaration: be aware of doctype declarations pre-HTML5, but don't spend any time delving into the details of these, you should only be concerned with that if your specific workplace requires you to do so.

• Have an idea when to use certain form elements. For example, checkboxes and radio buttons may seem visually similar, but someone with training will realize that the latter is for mutually exclusive choices and the former is for choices that aren't mutually exclusive.

• Understand how containing elements like <div> work, and get comfortable with semantic containers like <main> or <footer>. While there can be some ambiguity in how and where to employ these, there are some cases like header, footer, and nav that should never have a div in their place.

• Have some awareness of the head tag and SEO.

• Be aware of a11y and audits: Get familiar with Google Lighthouse sooner rather than later.

• Be aware of web security: get to know the [OWASP Top Ten}(https://owasp.org/www-project-top-ten/) vulnerabilites and how to avoid them.

Where To Learn

For where to get the basics down, you can pretty much throw a dart at most of the Udemy courses by Colt Steele, Angela Yu, etc, and be fine with those. I'm going to recommend Andrei Neagoie's The Complete Web Developer in 2021: Zero to Mastery since it gives a great overview of the overall web development ecosystem that will be helpful for brand-new developers.

Another resource that I think every new developer should go through is freeCodeCamp's Responsive Web Design Certification. You'll hear me repeat this exact piece of advice for several other technologies, but if you've gone through all the FCC material and done all the projects for this certification (only getting help when you're dead stuck!), you're good to go for job-ready HTML.

Where to get help/find reference

The official documentation is often a good reference source for technologies, but I don't recommend reading the specs for HTML (this goes for CSS and JavaScript as well), at least not when you're initially getting to know the language because there's so much information and it's not really constructed for easy readability. My recommendation here is MDN aka the Mozilla Developer's Network. MDN is a developer-maintained resource and a very high-quality one. This site will be one of your best friends as a developer for its detailed resources on the three major web technologies. MDN shines in particular for HTML because of its detailed breakdowns of attributes, and you can really stand out from other devs with some careful study of these, learning obscure but powerful options (such as loading or decoding for the img tag).

Chances are you're not the first dev to run into a problem and one of the best places to see if (and how) others handled that particular problem is Stack Overflow. For common gotchas or best practices, you can get a lot of perspective into how to approach certain problems, and how that approach has changed as technology evolved.

In Conclusion

I hope this piece puts you on a less ambiguous path to learning just enough HTML to be dangerous. Join me next time as I talk about how much CSS you need to be job-ready!