Heading are bigger and bolder then normal text on web page. Browsers automatically add some white space (margin) before and after the headings but this do not mean that heading can be used to make a text big and bold. Users skim your pages by its headings. It is important to use headings to show the document structure.

headings should be used for main headings, followed by

headings, then the less important

, and so on. Heading can be nested but this is strongly 'not recommended'.

Heading 

Heading are important. Heading not only summaries the web page content but the search engine use to index the structure and content of your web pages and improve the search ranking.

Look a personal or professional website that we all create is all about to be reached to maximum number of peoples. If a website is not visible on search engine than it means either that website is built only for personal/private use and disgusted over search engine or that website is not perfectly built to be indexed and crawled by the search engine. Many things are responsible which can together make a website searched and ranked top on search engine and heading are one of them.

Heading can be defined with <h1> to <h6> tags. The most important heading is defined in <h1> and the least heading is defined in <h6> tags. Read below two examples carefully it helps you to understand the headings.


Example - 1

<!DOCTYPE html>
<html>
<head>
<title>Headings</title>
<meta charset="UTF-8">
<meta name="description" content="Headings">
<meta name="keywords" content="all headings, HTML, HTML5 heading tags">
<meta name="author" content="Progrramers">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" href="img/favicon.png">
</head>
<body>
<h1>This is Heading 1</h1>
<h2>This is Heading 2</h2>
<h3>This is Heading 3</h3>
<h4>This is Heading 4</h4>
<h5>This is Heading 5</h5>
<h6>This is Heading 6</h6>
</body>
</html>


Looks on web page like

This is Heading 1

This is Heading 2

This is Heading 3

This is Heading 4

This is Heading 5
This is Heading 6




Do not be confused

Heading are bigger and bolder then normal text on web page. Browsers automatically add some white space (margin) before and after the headings but this do not mean that heading can be used to make a text big and bold. Users skim your pages by its headings. It is important to use headings to show the document structure. <h1> headings should be used for main headings, followed by <h2> headings, then the less important <h3>, and so on. Heading can be nested but this is strongly 'not recommended'.

Example - 2

<body>
<h1>Type of Cars</h1>
<h2>Sedan</h2>
<p>Maruti Swift Dezire</p>
<p>Honda City</p>
<p>Hundai Verna</p>
<h2>Hatchback</h2>
<p>Maruti Swift</p>
<p>Renault KWID</p>
<p>Hyundai Elite i20</p>
<h2>SUV</h2>
<p>Maruti Vitara Brezza</p>
<p>Hyundai Creta</p>
<p>Renault Captur</p>
<h2>Limousine</h2>
<p>Hindustan Ambassador Limousine</p>
<p>Mahindra Scorpio Limousine</p>
<p>Hindustan Contessa Limousine</p>
</body>


Tips: Copy above code and paste in to your text editor. Save and run in to the browser then see what happens.

To make a text bold it is better to use <strong> tags instead of <b> like “I like <strong>Red</strong> color.” <strong> tags will render the “red” word as bold and it gives the text strong importance on web page.

Example - 3

<p>I like <h4>Red</h4> Color.</p>       Wrong Practice

<p>I like <strong style = "Color:red;">Red</strong> Color.</p>      Best Practice



Heading can be stylized?

Yes! Although all headings have default size but heading can be stylized with style attribute and CSS Like below example.

Example - 4

<h1 style = "font-family:ubuntu; color:#CCCCCC; font-size:42px;">This is Heading 1</h1>



Tips: Sometimes we require most important or least important heading look smaller or bigger than its default size then we can also use <big> and <small> elements also like <h1><small>This is Heading. </small></h1>

Please Note: If you have any question please write down in to the comments. We are committed to solve your problems.



Related Topics

Related Topics

progrramers-logo

progrramers

Hello friends! Progrramers is a tutorial site of w3 programming. If you like this tutorial site please encourages us by sharing this site links with your friends and nears & dears who want to learn web development and give us like on our Facebook page. If have any question please type in to comment box or send us message on social media sites via below given social links. Thank you, have a nice learning.

Post A Comment:

49 comments:

  1. Thanks for sharing excellent informations. Your web-site is very cool. I'm impressed by the details that you have on this web site. It reveals how nicely you perceive this subject. Bookmarked this web page, will come back for extra articles. You, my pal, ROCK! I found simply the information I already searched all over the place and simply couldn't come across. What a perfect web-site. app development companies

    ReplyDelete
  2. Great post, I appreciat website owners should learn a lot from this web blog its rattling user genial . app developer

    ReplyDelete
  3. Thanks for this post, I am a big fan of this website would like to go on updated. app development firms

    ReplyDelete
  4. Sweet site, super pattern , real clean and utilize genial . top web design companies

    ReplyDelete
  5. It was any exhilaration discovering your website yesterday. I arrived here nowadays hunting new things. I was not necessarily frustrated. Your ideas after new approaches on this thing have been helpful plus an superb assistance to personally. We appreciate you leaving out time to write out these items and then for revealing your thoughts. website design agency

    ReplyDelete
  6. Good website! I truly love how it is simple on my eyes and the data are well written. I am wondering how I could be notified whenever a new post has been made. I’ve subscribed to your RSS which must do the trick! Have a nice day! ui/ux design agency

    ReplyDelete
    Replies
    1. First of all, thank you for subscribing progrramers. As an author and site developer of progrramers.com I'm working hard to bring more useful content for all of you loving buddies. I wish and I also request to keep supporting me like this. It gives me enthusiasm to keep continuing and creating more beautiful content. Thank You

      Delete
  7. Great post, I’m looking forward to hear more from you!! ui design agency

    ReplyDelete
  8. I can’t remember the last time I enjoyed an article as much as this one. You have gone beyond my expectations on this topic and I agree with your points. You’ve done well with this.
    long island web development

    ReplyDelete
  9. Nice to read this article will be very helpful in the future, share more info with us. Good job!
    top agency websites

    ReplyDelete
  10. Hi to everybody, here everyone is sharing such knowledge, so it’s fastidious to see this site, and I used to visit this blog daily.
    Lead conversion system squared

    ReplyDelete
  11. Superbly written article, if only all bloggers offered the same content as you, the internet would be a far better place.. I will make 40 unique profile seo backlinks on top domains

    ReplyDelete
  12. Such type of sounds definitely top. Every one of these smaller knowledge really are crafted alongside several foundation knowledge. I favor which usually very much. web design company denver

    ReplyDelete
  13. User friendly website with good content , thanks for the knowledge. Great help, thanks for adding up to the knowledge its good to read well ordered blogs. I would like to enlighten you with the idea of business services and how it helps it grow, magento customization services give it a go Thanks!

    ReplyDelete
  14. The team was flexible, best digital design agencies and supported an effective collaboration. They were organized and accessible, which enables repeated partnerships.
    experience design companies

    ReplyDelete
  15. Personally I think overjoyed I discovered the blogs. notepad++ for mac download

    ReplyDelete
  16. Wow, this is really interesting reading. I am glad I found this and got to read it. Great job on this content. I like it. SEO

    ReplyDelete
  17. I was surfing through the internet to get the fine idea for my problem and instead of fine I got the finest though! Check out them for all the latest options and the best crew for help as well!


    web development

    ReplyDelete
  18. If you are looking for more information about flat rate locksmith Las Vegas check that right away. Take me to another useless website

    ReplyDelete
  19. This amazing appears to be altogether recommended. Each smallish data are intended and also massive amount back ground awareness. I prefer this unique very much. Graphic Designer

    ReplyDelete
  20. Besides, on the off chance that you have the financial plan to recruit SEO organization, at that point you ought to take the plunge as natural traffic age, watchword inspecting, content composition and following coherent SEO measure, all are the SEO administrations which must be actualized simultaneously and in an immense way. SEO Services

    ReplyDelete
  21. This article is actually remarkable one it helps many new users that desire to read always the best stuff.
    Jono Armstrong

    ReplyDelete
  22. I think this is an informative post and it is very useful and knowledgeable. therefore, I would like to thank you for the efforts you have made in writing this article. seo expert

    ReplyDelete
  23. Thanks for the blog filled with so many information. Stopping by your blog helped me to get what I was looking for. Now my task has become as easy as ABC. dotcomsecrets

    ReplyDelete
  24. We are really grateful for your blog post. You will find a lot of approaches after visiting your post. I was exactly searching for. Thanks for such post and please keep it up. Great work. creare sito ecommerce

    ReplyDelete
  25. We have sell some products of different custom boxes.it is very useful and very low price please visits this site thanks and please share this post with your friends. sviluppo siti web

    ReplyDelete
  26. I think this is an informative post and it is very beneficial and knowledgeable. Therefore, I would like to thank you for the endeavors that you have made in writing this article. All the content is absolutely well-researched. Thanks... sites like fiverr com

    ReplyDelete
  27. I invite you to the page where see how much we have in common. Get web series

    ReplyDelete
  28. To build up a design financial plan our guidance at breaking down web design costs may assist you with maintaining a strategic distance from the slip-ups others make. Webdesign Genk

    ReplyDelete
  29. Thanks for posting this info. I just want to let you know that I just check out your site and I find it very interesting and informative. I can't wait to read lots of your posts. 웹툰 미리보기

    ReplyDelete
  30. This is such a great resource that you are providing and you give it away for free. I love seeing blog that understand the value of providing a quality resource for free. New Tab To-do List

    ReplyDelete
  31. I just found this blog and have high hopes for it to continue. Keep up the great work, its hard to find good ones. I have added to my favorites. Thank You. Webdesign Antwerpen

    ReplyDelete
  32. I was tired of running behind companies, waiting for their updates on my website design. You must first develop a strategic plan and design your website accordingly. web design galway.

    ReplyDelete
  33. I have read your article, it is very informative and helpful for me.I admire the valuable information you offer in your articles. Thanks for posting it.. Webdesign bureau

    ReplyDelete
  34. Took me time to read all the comments, but I really enjoyed the article. It proved to be Very helpful to me and I am sure to all the commenters here! It’s always nice when you can not only be informed, but also entertained! Webdesign

    ReplyDelete
  35. I really appreciate the kind of topics you post here. Thanks for sharing us a great information that is actually helpful. Good day! Webdesign

    ReplyDelete
  36. I invite you to the page where see how much we have in common. this article

    ReplyDelete
  37. This is a great post. I like this topic.This site has lots of advantage.I found many interesting things from this site. It helps me in many ways.Thanks for posting this again. Allentown Web Design

    ReplyDelete
  38. I wanted to thank you for this great read!! I definitely enjoying every little bit of it I have you bookmarked to check out new stuff you post. WordPress Developer Brisbane

    ReplyDelete
  39. For example, in the event that you need non-benefit website, at that point non-benefit website designers are the ideal decision for you.Webdesign-seo-limburg.be

    ReplyDelete
  40. If we print hologram stickers and keep doing trade in the similar technique and make no alteration then sooner or later, we will be abandoned by our clients. Holograms assist your customers to know your products authenticity and reality. It is extremely vital and significant to select the correct hologram sticker printing

    ReplyDelete
  41. Fort Lauderdale has a rich culture and offers a wide variety of experiences, activities, and locations to enjoy. Fort Lauderdale is located in Broward county, right beside Miami. For inquiries, you can visit their website.

    ReplyDelete
  42. Hello, this weekend is good for me, since this time i am reading this enormous informative article here at my home.
    quenza app

    ReplyDelete