Upgrade to HTML5


  • To upgrade to html5 first of all we have to make basic changes first like below
    • Doctype:
      • doctype defination at the top of HTML file and it tells the browser the type of document and info related that document.
      • Old way :
        • example : <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
        • In this case doctype is html and PUBLIC indicates standard is publicly available.
        • -//W3C//DTD HTML 4.01//EN it means it using “HTML 4.0 and langauage is english
      • Now using HTML5 you can easily write this in simple way like below
        • <!doctype html>
        • it will also work in old browser too and in future no need to change , so it is easy to remeber and also easy to compare to older doctype defination.
    • Other things we have to change is Meta , link and script tag
      • like below
        • from <meta http-equiv="content-type" content="text/html; charset=UTF-8"> to <meta charset="utf-8">
        • from <link type="text/css" rel="stylesheet" href="lounge.css"> to <link rel="stylesheet" href="lounge.css">
  • So overall our html document change like below
    • From
    • <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
                   <html>
                        <head>
                               <title>Demo Site</title>
                               <meta http-equiv="content-type" content="text/html; charset=UTF-8">
                               <link type="text/css" rel="stylesheet" href="demo.css">
                               <script type="text/javascript" src="demo.js"></script>
                        </head>
                       <body>
                               <h1>Welcome to Site</h1>
                       </body>
                   </html>
             
               To
               <!doctype html>
              <html>
                      <head>
                           <title>Demo Site</title>
                          <meta charset=“utf-8">
                          <link rel=“stylesheet" href=“demo.css">
                          <script src=“demo.js"></script>
                     </head>
                     <body>
                           <h1>Welcome to Demo Site</h1>
                    </body>
            </html> 
Latest
Previous
Next Post »