What rules should html5 follow?

html5 rules to follow: 1. Make good use of DIV for layout; 2. Separate HTML tags and CSS style sheets; 3. Optimize CSS code; 4. Optimize JS files and place them in Bottom of the page; 5. Make good use of title elements; 6. Use appropriate HTML tags in the appropriate places; 7. Avoid abusing div tags.

The operating environment of this tutorial: Windows 7 system, HTML5 version, Dell G3 computer.

HTML has gone through nearly 20 years of development. From HTML4 to XHTML, and then to the recently very popular HTML5, it has almost witnessed the development of the entire Internet. However, even now, there are many basic concepts and principles that developers still need to pay close attention to. The editor of Web front-end development training will introduce to you these HTML5 development principles that should be followed.

1. Make good use of DIVs for layout

When developing a Web page, one thing to consider is to distinguish the focus of the page. By including these contents in DIV tags, the code on the page will appear neat and well-indented.

2. Separate HTML tags and CSS style sheets

A good page should separate HTML tags and CSS style sheets. This is a principle that every web developer should know when coming into contact with web development. However, until today, there are still many developers who do not strictly follow this principle.

Do not embed style sheet code in HTML tags. Developers should develop a habit of creating separate files to store CSS style sheets. This will also make it easier for other developers to complete their work quickly when modifying your code.

3. Optimize CSS code

Nowadays, it is very common to add multiple CSS files to a website. However, when a website contains too many CSS files, it will slow down the website's response speed. The solution is: streamline the code and optimize multiple CSS files and merge them into one file. This method can significantly improve the loading speed of the website. In addition, there are many tools that can be used to optimize CSS files, such as CSS Optimizer, Clean CSS, etc.

Regarding CSS, we have also recommended 10 excellent CSS frameworks that you should know. You can learn about the types and related usages of CSS frameworks.

4. Optimize JS files and place them at the bottom of the page

Like CSS, it is also common to add multiple JS files to the page. But this will also reduce the response speed of the website. For this reason, developers should streamline and optimize these JS files.

But one thing is different from CSS, browsers usually do not support parallel loading. This means that when the browser loads a JS file, it will no longer load other content at the same time. This causes the loading speed of web pages to seem to slow down.

A good solution is to put the loading order of JS files last. To achieve this goal, developers can place the JS code at the bottom of the HTML document, and a good location is close to the tag.

5. Make good use of title elements.

span to h6 elements are used to highlight the key content of the page. This helps users focus more on the important parts of the page. For blogs, I (referring to the author of this article) recommend using span tags to highlight the blog title. Because, the blog title is almost an important part of the page.

6. Use appropriate HTML tags in the right places

HTML tags are the key to constructing a standardized content structure. For example, the

7. Avoid abusing div tags

Not all block elements should be created using the

tag. For example, you can add display:block to the attributes of an inline element to display it as a block element.

8. Uniformly quote attribute values ​​

Although some attributes in HTML5 can be unquoted, for the sake of standardization, quote marks are added to each attribute.

9. Avoid a line of code that is too long

The size of the page is limited. If the code is too long, a scroll bar will be added, which will reduce the readability of the code.

10. Add alt to the img tag

After adding alt to the image attribute, when the image cannot be displayed, the content of alt can fill the gap in the image, and alt is also good for SEO optimization. of.

11. Blank lines and indentation

When we were learning Java, the teacher taught us to add comments, blank lines and indentation to the code to improve the readability of the code.

12. Close tags

Most tags in html appear in pairs. If some tags are not closed, problems such as document misarrangement will occur. Even if some tags can use single tags, it is best to unify them into closed tags, such as p. Also like meta, it is best to write it in the following form: <meta charset="utf-8"/>.

Related recommendations: "html video tutorial"

The above is the detailed content of What rules should html5 follow?. For more information, please follow other related articles on the PHP Chinese website!