Outline algorithm
What is outline algorithm?
We all know that using html 5 building website is best. But the problem is how to use HTML5 correctly. Html 5 Sectioning content which is section, article, aside and nav is not widely understood. To understand sectioning content, we need to know the document outlining algorithm.Html 5 outline algorithm can help to solve the problem completely.Using the these rules you can structure your page exactly you want.We can compare outline algorithm with a book's table of contents where have a summery of all of the chapters and its content.This table of content is the guideline to use the book.<Body> is the sectioning root of a document.From body it travels into further and in the way when it find a sectioning content it
creates a chapter(chapter) and if there have any heading below it if not then the section name will remain undefine.This heading become the name of the chapter(section).
If there have any neated sectioning content within a sectioning content.This nested sectioning content create a nested chapter(section) within its parent.
The heading elements have a rank given by the number in the element name, where <h1> has the highest rank, and <h6> has the lowest rank. Relative ranking matters only within a section; the structure of the sections determines sectioning contents, not the heading rank of the sections.
Why you need your document outline?:
This is good for Web browser and search engine crawler.They are software so they follow rules to monitor your web page.If there have any document outline then these software may easily understand which section or content is most important and which is less and can easily collect information from your site.This is also important web developer also for future maintainance.Example
<body><h1>Different Cows</h1>
<section>
<h1>Forest Cows</h1>
<h2>Habitat</h2>
<p>Forest cowdo not live in trees but among them.
...this subsection continues...
<h2>Ass</h2>
<p>In this section, we discuss the lesser known forest cows
...this section continues...
</section>
<article>
<h1>Mongolian horse</h1>
<p>mongolians hores are famous world wide and it has a reputation.........</p>
</article>
<aside>
<h3>Animal worlds</h3>
<section>
<h2>Animals videos</h2>
<video src="animal_life.mp4"></video>
<section>
</aside>
</body>
The above code create a following outline of the document
Different Cows
1.Forest cows
1.1)habitat
1.2)Ass
2.Mongolian horse
3.Animals worlds
3.1)Animals videos
Description:
Firstly,Start from root section body and give it a name by the following h1 tag.Then find a section tag and create a section named it from below h1 tag.Then within this section it find two other heading and its content create both of them as sub-section under the main one.Remember one thing, it finds two same level heading within 'Forest cow' section and creates two sub-section uder it.If the heading is not same level then it will create sub-section according to the heading level.
For an example,if you wanted to add a <h3>avc</h3> and its paragrah below the first h2 and its content then it will create a sub-secion of first h2 heading(it will be 1.1.1)avc) not the main section(Forest Cows).
Great News:
If you make a website where a lot of heading and sectioning content will be very difficult to make the document outline by yourself.There have some online tool which work is to make a outline for your code.Your work is to give the link or submit your page to them and then they will give you the table of content of your website.Step 1: Go to http://gsnedders.html5.org/outliner/
Step 2:There are there option
i.upload your file from computer
ii.Paste your url
iii.Paste the page code in the html box
step 3:Click Outline this! button
Finally You get your document desire Outline.
For more information about document outline algorithm visit Mozzila developer site
