Reference to the HTML5 specification

Source: Internet
Author: User

    • HTML5 specification

    • 1. Code Style

    • 1.1 Indent and line feed

[Recommended] Use 4 spaces as a level of indentation.

[Recommended] Indentation precedence of template code guarantees the indentation rules for HTML code.

1.2 Naming conventions

[Mandatory]class: Must be the word full letter lowercase, the word between-delimited, and must represent the corresponding module or part of the content or function, not to be named in the HTML built-in style, naming should have clear semantics.

[Mandatory]id: The uniqueness of the page must be maintained, and the naming should have explicit semantics.

1.3 Tags

Force Tag names in HTML must use lowercase letters.

[mandatory] The closure of the label to comply with the provisions of HTML5.

The use of the [mandatory] label must conform to the nested rules of the tag, for example: div must not be placed in P, tbody have to be placed in table.

The use of the label must follow the semantics of the label, for example:

P-Paragraph

h1,h2,h3,h4,h5,h6-level headings

Strong,em-Emphasis

INS-inserting

Del-Delete

ABBR-Abbreviation

Code-ID

Cite-Quote the title of the source work

Q-Reference

BLOCKQUOTE-A paragraph or lengthy reference

UL-unordered list

OL-Ordered list

DL,DT,DD-Definition List

[Recommended] You should not use a table to lay out your CSS when you can achieve the same requirements.

1.4 Properties

The Force property must be in lowercase letters and its property values must be surrounded by double quotation marks.

Suggestions for Boolean types do not add property values. Custom attributes are recommended to be prefixed with xxx-, data-is recommended

2. Page Header

2.1 DOCTYPE

[Force] using DOCTYPE to enable standard mode, it is recommended to use uppercase DOCTYPE

2.2 Language coding

[Recommended] to help improve the accessibility of the page, you must set the correct lang attribute, for example:

The [mandatory] page must specify a character-encoded meta, and must be the first direct child of the head, for example: <metacharset= "UTF-8" >.

2.3 CSS and JavaScript introduction

[Mandatory] The introduction of CSS must indicate the rel= "stylesheet", when introducing CSS and JavaScript must indicate the Type property.

Recommendations JavaScript code must be placed at the end of the page or loaded asynchronously.

2.4 Head Content

Force The title tag must be set to the immediate child element of head and immediately after the CharSet declaration.

Force Favicon Guaranteed Accessibility, Example: <linkrel= "shortcut icon" href= "Path/favicon.ico" >

Force The viewport property must be specified.

3. Picture

[Force] to prohibit the IMG src value is empty, deferred loading of the picture also to increase the default SRC attribute value.

[Recommended] Important images add ALT attribute values.

[Recommended] Add the width and Height properties to avoid page jitter.

4. Forms

4.1 Control title

The control of the [force] text caption must be associated with its title using a label label, for example:

<label><input type= "checkbox" name= "Confirm" value= "on" > I have confirmed the above terms </label> or <labelfor= "user" > User: </label><inputtype= "text" name= "user" id= "user" >

4.2 button

[force] must indicate the Type property value when using the button element

4.3 accessibility

[Recommended] When you use JavaScript for form submission, you should make the native commit feature work correctly.

[Recommended] Specify the Type property of the input box based on the content type, for example: <input type= "Date" >

5. Multimedia

[Recommended] When you use audio and video tags to play the sound, videos, you should pay attention to the format:

Audio format: MP3, WAV, Ogg

Video format: MP4, WebM, Ogg

6. Notes

[Force] CSS, JavaScript code for a page or module must be commented in detail

Reference to the HTML5 specification

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.