15 best practices for beginners of HTML-HTML/Xhtml-web page creation

Source: Internet
Author: User
This article mainly recommends 30 best practices for beginners of HTML. If you are interested, you can refer to the following thirty best practices for beginners of HTML, the content is as follows:

1. Keep tags closed

In the past, we often saw code similar to the following ......) :

Copy XML/HTML Code to clipboard

  1. Some text here.
  2. Some new text here.
  3. You get the idea.

Note that the UL/OL label of the outer package is missing (who knows whether it is intentional or unintentional), and the LI label is also forgotten. According to today's standards, this is an obvious bad practice and should be avoided by 100%. In short, keep the closed tag. Otherwise, you may encounter problems when verifying html tags.

Better Way

Copy XML/HTML Code to clipboard

    • Some text here.
    • Some new text here.
    • You get the idea.

2. Declare the correct document type

I have previously joined many CSS forums. Whenever a user encounters problems, we recommend that you do the following:

1. Verify the CSS file to ensure there are no errors.

2. confirm that the correct doctype is added.

DOCTYPE appears before the HTML Tag. It tells the browser whether the page contains HTML, XHTML, or both, so that the browser can correctly parse it.

There are usually four types of documents to choose from:

Copy XML/HTML Code to clipboard

There are always different statements about the document type declaration to be used. It is generally considered that the strictest statement is the best choice, but research shows that most browsers use a common method to parse such statements, so many people choose to use the HTML4.01 standard. The bottom line for selecting a declaration is whether it is really suitable for you. Therefore, you need to consider the declaration that suits your project.

3. Never use inline styles

When you write code in your head, you may often add a little bit of css code in the line, just like this:

Copy XML/HTML Code to clipboard

  1. I'm going to make this text red so that it really stands out and makes people take notice!

This looks convenient and there is no problem. However, this is an error in your coding practice.

When writing code, it is best not to add style code before the content structure is complete.

This encoding method is like guerrilla warfare. It is a very shanty practice. -- Chris Coyier

A better way is to define the P style in the external style sheet file after the label part is completed.

Suggestions

Copy XML/HTML Code to clipboard

  1. # SomeElement> p {
  2. Color: red;
  3. }

4. Put all external css files in the head tag

Theoretically, you can introduce CSS style sheets at any position. However, we recommend that you add HTML standards to the head mark of a webpage to speed up page rendering.

During Yahoo's development, we found that introducing style sheets in the head label will speed up webpage loading, because this will gradually render the page. -- YSlow team

Copy XML/HTML Code to clipboard

  1. My Favorites Kinds of Corn

5. Place the javascript file at the bottom

Remember that the principle is to make the page appear in front of the user as quickly as possible. When a script is loaded, the page stops loading until the script is fully loaded and executed. Therefore, it will waste more time for users.

If your JS file only needs to implement some functions (such as clicking a button event), you can safely introduce it at the bottom of the body. This is definitely the best method.

Suggestions

Copy the content to the clipboard using JavaScript Code

  1. And now you know my favorite kinds of corn.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.