Learn how semantic HTML elements improve webpage structure and accessibility while clarifying your content. Understand how choosing meaningful tags can help both developers and search engines interpret your site effectively.
Key Insights
- Use semantic HTML tags such as
<header>,<nav>,<main>,<article>,<section>,<aside>, and<footer>to clearly define webpage structure and improve readability for developers and accessibility for users. - The WHATWG (Web Hypertext Application Technology Working Group), a consortium supported by browser makers such as Apple, Google, Mozilla, and Microsoft, now defines the HTML "living standard," replacing previous W3C-defined versions like HTML5.
- Verify the heading and outline structure of your page using an HTML outliner tool, ensuring a logical hierarchy (from
h1down toh6) that conveys clear topical relationships and improves SEO visibility.
Note: These materials offer prospective students a preview of how our classes are structured. Students enrolled in this course will receive access to the full set of materials, including video lectures, project-based assignments, and instructor feedback.
This is a lesson preview only. For the full lesson, purchase the course here.
I want to introduce you to some new tags and I want them to be properly defined by the people who define the standard so that we can understand not how we think they should be used but we can learn how they should be used based on the original intentions.
We need to go back to the people who define the standard and there's actually two groups that you might find defining the standard and I want you to understand which one is the correct one that we're going to reference. So let's go back to before web standards were created.
Back then there were browsers like Netscape and internet Explorer and Microsoft and Netscape they could decide to implement whatever code they wanted and it didn't have to work in other browsers so websites were being made for Netscape or made for internet Explorer and we didn't have a universal web where websites worked in all browsers. Then this idea of standards was created and the W3C was formed, the World Wide Web Consortium, and they defined a standard and browsers now try to achieve a standard so that we can write one set of code that works universally across most browsers assuming that they're following the standard.
So as years went on, the iPhone was coming out and we were thinking about the mobile web for the first time and so during that time the W3C they were focused on their own priorities and they were thinking about creating the next version of HTML called XHTML combining XML and HTML so it could be more flexible and you could define whatever tags you wanted and they were just doing things that the industry didn't really need or didn't really want and XHTML2 was going to break backwards compatibility with the web and it just wasn't going to be good for the industry moving forward.
So at that time Apple was focused on the iPhone and this was prior to the App Store coming out so there were no native apps and they wanted to let people create apps and they thought well let's create web apps and so the Web Hypertext Application Technology Working Group was created by Apple, Mozilla, and Opera who at that time was making their own browser and own browser rendering engine.
And so think about web apps, right? So HTML is the hypertext markup language and so hypertext web apps were basically just HTML as a web app. There was no things like video tags or audio tags during that time. Everybody was using plugins—things like Flash to view videos or listen to audio—but plugins didn't work on the iPhone. So the idea was let's move the standard forward in a way that works without plugins.
And so this technology working group was focused on the next version of HTML, not splintering off and creating XHTML as a different flavor of the language. And so they were creating HTML—what would eventually become known as HTML5. Now eventually they said after that, let's not version number these things, let's just call it the living standard. So they now just say the living standard; it's not one specific version number.
So as long as we follow the latest version of this, we're always getting the latest and greatest innovations as soon as browsers get updated and the standards get pushed out. And Apple, Google, Mozilla, and Microsoft—basically the people who make the browsers—they are the ones behind this. And they have essentially taken over the standards. So it's no longer the W3C that we look at for those standards, we now look to the Web Hypertext Application Technology Working Group.
That is a mouthful of a name. It's a long name. But they define the living standard. Essentially they make the browsers so of course they define the standard. And so we don't call it HTML5 anymore. We just call it the latest greatest version of HTML called the living standard.
