Home>Web design tutorial>HTML tutorial

HTML5 page architecture (HTML5 Boilerplates)

Author：Eve Cole Update Time：2025-03-27 01:32:01

HTML5 architecture

HTML5 architecture, (HTML5 Boilerplates)

Quick creation of html5 documents

html5 documentation is very easy to create, you just need to change the DOCTYPE declaration at the head of the document.

  1. <!DOCTYPEhtml>

In this way, you have already created an HTML5 document. Let's see how Google's homepage is done

Copy content to clipboard
  1. <!doctypehtml>
  2. <head>
  3. <title>HTML5-GoogleSearch</title>
  4. <script>
  5. ..

However, Google's verification and search results pages are not used, because there are still many invalid tags on those pages, such as <font>, etc., but it doesn't matter, you can still use some correct tags such as <script> to parse under the current HTML5 DOCTYPE.

HTML5 simple examples

A complete html5 page does not require many complicated tags

Copy content to clipboard
  1. <!DOCTYPEhtml>
  2. <title>SmallHTML5</title>
  3. <p>Helloworld</p>

This is a simple and complete example.

(Interestingly, when I deleted the <title> tag. Hixie's DOM viewer parsing is through the W3C validator. But the Henri Sivonen's validator says this is invalid without the tag.)

HTML5 integrity and compatibility

Best, here is a complete HTML5 example, with styles and new tags added. In order to solve the problem that some IE kernel browsers cannot view, here is a JS script that solves this problem.

  1. <!DOCTYPEhtml>
  2. <html>
  3. <head>
  4. <metacharset=utf-8/>
  5. <title>HTML5complete</title>
  6. <!--[ifIE]><scriptsrc=http://html5shiv.googlecode.com/svn/trunk/html5.js></script><![endif]-->
  7. <style>
  8. article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
  9. </style>
  10. </head>
  11. <body>
  12. <p>HelloWorld!</p>
  13. </body>
  14. </html>
Related Articles