5 Replies Latest reply on Mar 3, 2010 7:33 PM by Robert Heist II

    <h1> The Use Of Header Tags

    helpvid Level 2

      I'm becoming more aware of the importance of using header tags to help the visually impaired navigate your site.  Obviously the main header should be wrapped in an <h1> tag, however after that does it flow from <h1> all the way to <h6>, and what if you have more than six paragraphs to we return to using <h1> and go through them all again.  

       

      Or do we stick with <h2> all the way down the page.

       

      Do understand better I will provide the link to were I wish to use this, the line I want to header is Boxing Schedule, all the way down the page.  Here is the link.  http://www.theboxinghistorian.com/schedule.html

        • 1. Re: <h1> The Use Of Header Tags
          janken71 Level 2

          I may be wrong in the "proper" use of the tags, but I see them as a hierarchy rather than providing any sort of ordering format.  An < h1> tag would provide a top level heading, while going down the chain through < h6> you create subheadings, sub sub headings, and other child elements to the parent < h1>.

          • 2. Re: <h1> The Use Of Header Tags
            Nancy OShea Adobe Community Professional & MVP

            The proper use of heading tags <h1> - <h6> depends on your content.  I never use more than one <h1> tag per page, reserved for the page title, and often only use up to h2 and h3 because my pages are mostly limited to one topic.

             

            An example might look like this:

             

            <h1>Website Design Basics </h1>
            <p>Here is some text</p>


            <h2>HTML</h2>
            <p>Here is some text</p>


            <h2>CSS</h2>
            <p>Here is some text</p>


                 <h3>CSS Hacks</h3>
                 <p>Here is some text</p>

             

            <h2>Javascript<h2>

            <p>Here is some text</p>

             

            Another semantic markup example might look like this:

             

            <h1>North America</h1>
            <h2>
            United States</h2>
            <h3>
            California</h3>
            <h4>
            Orange County</h4>
            <h5>
            Anaheim</h5>
            <h6>Disneyland, the happiest place on Earth</h6>

             

            Use as many tags as needed, but don't overcrowd your pages with them.  I like to think of heading tags as an outline to my page.

             

            Nancy O.
            Alt-Web Design & Publishing
            Web | Graphics | Print | Media  Specialists
            http://alt-web.com/
            http://twitter.com/altweb
            http://alt-web.blogspot.com

            • 3. Re: <h1> The Use Of Header Tags
              Robert Heist II Level 3

              Think of header tags as the levels of an outline.

              h1 is the title of the whole outline

                   h2 would be the second level

                        h3 would be sub point under that

                        h3 another sub point

                   h2 another second level entry

               

              and then under each major heading category, you put the content in regular paragraphs, or divs.   The headings are just one-line type labels.  Content always goes in content type tags, paragraphs or divs.

              • 4. Re: <h1> The Use Of Header Tags
                Nancy OShea Adobe Community Professional & MVP

                Content always goes in content type tags, paragraphs or divs.

                 

                I like logical tags.

                 

                <abbr> <address> <blockquote> <q> <caption> <cite> <code> <del> <ins> <label> <table> <thead> <tbody> <tfoot> 

                 

                New in HTML5:

                <header> <hgroup> <section> <article> <aside> <audio>  <datalist> <dialog> <embed> <figure> <footer> <nav> <video>

                http://www.w3schools.com/html5/html5_reference.asp

                 

                Nancy O.

                Alt-Web Design & Publishing

                Web | Graphics | Print | Media  Specialists

                http://alt-web.com/

                http://twitter.com/altweb

                http://alt-web.blogspot.com

                • 5. Re: <h1> The Use Of Header Tags
                  Robert Heist II Level 3

                  Yes there are lots of logical tags and they are great, especially with css.  I was just simplifying for the sake of clarity.