Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
Over the years, the ID and class attributes have grown to become an important part of controlling the styling of documents and increasing the meaning of the content contained inside them. Take document headers for example. In the past, it was quite common to create a div tag, assign it an ID or class of Header and control layout and styling though the appropriate selector. This not only grouped the header content, but identified the content through the attribute value. Now that we have semantic tags that can express many of these meanings without the use of IDs and classes, we should revisit this practice and discuss where the ID and class attributes fit in HTML5 authoring.
As far as the specification goes, the ID and Class attributes remain unchanged. Both are global attributes, meaning they can be applied to any element. IDs must be unique within each document and are primarily to be used to target an element when scripting or to control the styling of a specific element. Classes can be used as often as liked within a page, and are encouraged to be written so as to describe the type of content contained within the element. One thing that may increase the use of classes in HTML5 is the addition of the getElementsByClassName method to the Document Object Model.
So where does that leave us? Well, to be honest, not too far from where we were in HTML 4. Instead of using a div with an ID of header, you can now just use a header tag. However, since you can use multiple headings within your page, you still may need some way to differentiate it from other headers. The same is true for sections, articles, footers, navs, and asides. In those cases, it's perfectly acceptable to use IDs and classes to add additional meaning to your elements. Just make sure that there is a compelling reason to add them, and don't feel like every element needs to have a unique identity or belong to a class.
In the long run, IDs and classes will still be important parts of scripting and styling, even if you find that you don't need to use them as often to enhance the semantics of your files.
Get unlimited access to all courses for just $25/month.Become a member
82 Video lessons · 101819 Viewers
61 Video lessons · 88574 Viewers
71 Video lessons · 72391 Viewers
56 Video lessons · 104093 Viewers
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.
Your file was successfully uploaded.