Web Design - Web Authoring / Intro to HTML: Formatting Text

Sections:  Introduction  |  Section 1  |  Section 2  |  Section 3
Section Two:  Part A  |  Part B  |  Part C  |  Part D  |  Part E  |  Part F  |  Part G  |  Part H  |  Part I

Nesting

Nesting Tags to Aid in Accessibility

Thus far through your introduction to HTML coding, you've seen that you can apply multiple HTML tags to any text-based content listed in a web page. For instance, you could make text within an HTML web page bold and italicized by adding <strong></strong> and <em></em> tags around the text. While the concept of adding the appropriate tags around text-to-be-formatted is fairly simple, what is a little more complex is ensuring each opening and closing tag is listed in the correct order. The process of closing HTML tags in the correct order, based on how the tags were opened, is known as Nesting.

Now that you have been introduced to the concept of Nesting, you might be asking yourself: "how does Nesting affect user accessibility?" This is a very good question. The answer is that when multiple tags are applied to text in a web page without the proper nesting of said tags, the page may not appear as the web author/designer intended. This change in appearance may render the page unreadable for users.

Further investigation Extend Your Understanding: Nesting

When it comes to learning new information, sometimes concepts can be presented more succinctly through video - as is the case with Nesting HTML tags.

presentation Watch the video below to extend your understanding of Nesting HTML tags and to ensure your HTML syntax is correct.

NOTE: While the video presented above is a good tool for improving your Nesting capabilities, please be aware that the creator of the video uses old HTML tags (i.e. <b></b> and <i></i>) instead of HTML 5 supported emphasis tags (<strong></strong> and <em></em>).

Next Next

© All rights reserved.