Semantic code and header tags within DotNetNuke skins

A List Apart - Article Page: http://www.alistapart.com/articles/worldgrowssmall (fig. 2) H1 tag surrounds logo of the site Left column (Main content area) No header tag around the date H1 – The Article Title H3 – By-line (Article author) H2 – Sub heading of article H2 – Further sub headings H3 – Sub-sub headings of article H2 – Learn More H2 – Discuss H2 – About the author Right Column H3 – Search H3 – Topics H3 - Snapshot H4 – Job Board H1 tag is used here for the main title, which is ideal for the search engines as they add further emphasis to any text within H1 tags. H2 and H3 tags are used as sub headings within an article. H3 is used for the title of each container within the right column.

5 | Page 6 of 26 | 7

Article Contents

1. Tutorial Overview
2. Introduction - What is Semantic code?
3. How do we create semantic code?
4. Analysis of the pros | Helpful Tools
5. Header Tags Structure Analysis | A List Apart - Home Page
6. A List Apart - Article Page
7. ESPN - Home Page
8. Veerle – Home Page
9. Veerle - Article Page
10. Think Vitamin - Home Page
11. Think Vitamin - Article Page
12. Web Standards - Home Page
13. Web Standards - Article page
14. DotNetNuke – Header Tags Suggestions and Conclusions
15. Possible Header Tag Structures for the DNN-Blue skin
16. Applying the header tag structure to a DotNetNuke skin
17. Edit the container for h2 tags
18. Edit the container for h1 tags
19. Style the H3 and H4 tags
20. Further Styling Options
21. A step further
22. Styling the Module Titles
23. Putting it altogether
24. Demo of Fangs and Document Outline
25. Final Thoughts
26. References / Useful links