Home > front end >  Web front-end engineers need to pay attention to the development of the specification have?
Web front-end engineers need to pay attention to the development of the specification have?

Time:10-20

Engaged in web front-end development work we need to know about web front-end development of the specification, so as to guarantee the efficient and fast to complete the work, this is a web front end and share with you the development engineers need to be aware of what web front-end development specification, hope to help friends,

a, CSS writing standards

1. The unified coding for utf-8;

2. The collaborative development and division of labor: I will, according to the various modules according to page similar program at the same time, write a general framework in advance, and assigned to the front end staff realize the internal structure & amp; Performance & amp; Behavior; Common CSS file base. CSS by I write, collaborative development process, each page, please be sure to be introduced, this file contains the reset and style at the bottom of the head, this file cannot be modified;

3. The class and the use of the id: id is unique and is the parent, the class can be repeated and is a child, so id use only on the large module, the class is available in the repeated utilization high and children; Id in principle are distributed framework file named by me, except for JavaScript reserved hooks;

4. Reserved for JavaScript named hooks, please js_ starting, such as: js_hide, js_show;

5. The class and id name: big name such as the framework of the header/footer/wrapper/left/right in 2 by the unified naming, I like other style name consists of lowercase English & amp; Digital & amp; _ to combine name, such as i_comment fontred, width200; As far as possible avoid the use of Chinese pinyin, using a combination of simple words; All in all, named to semantic, concise,

6. Avoid class and id names (this is important, if you have don't understand please timely and I communication) :

A) by the subordinate writing to evade;

B) take the parent element id/class name part of the name;

C) the naming of repeated utilization high, please refer to our code underlined its start, such as i_clear;

D) a, b two, be applicable to the framework has been built in 2 pages, such as, to have been built in 2 framework to add new div elements page code,

7. Order CSS properties, it is suggested that follow: layout positioning properties - & gt; Its properties - & gt; Text attributes - & gt; Other attributes. This can be written according to their own habits, but try to ensure that the similar properties to write together;

8. Before writing code, consider and improve style repeat usage;

9. Make full use of HTML itself attribute and style inheritance principle decrease code;

10. The stylesheet Chinese fonts, please be sure to turn into unicode code, in order to avoid coding errors when the code;

11. The background image, please try to use Sprite technology, reduce HTTP requests, considering the collaborative development, Sprite according to the module production;

12. When using the table tag (try to avoid using the table tag), please don't use the width/height/cellspacing/cellpadding table attributes defined performance directly, and USES the private property of the table as possible to the separation of structure and performance, such as the thead, tr, th, td, tbody, tfoot, colgroup and scope; (cellspaing and cellpadding CSS control methods: table {border: 0; margin:0; Border - the collapse: the collapse; {} table th, table td padding: 0; }, base. The CSS file I will initialize the table style);

13. If you can please use less compatible;

14. Do pictures in PNG images, requirements for the PNG image format - 8 format, if PNG - 8 really affect image quality or with translucent effect, please define background for ie6 alone;

15. Avoid using compatibility properties, such as text - shadow | | CSS 3 relevant properties;

16. Use less impact performance properties, such as the position: absolute | | float;

17. Must be a big block style add comments, residential block moderate comments;

18. Code indentation and format: suggest writing line, according to their own habits, late optimization will be unified process;

2, JavaScript writing standards

1. The file encoding to utf-8, writing process, the end of each line of code must have a semicolon; In principle all functions are native development according to XXX project demand, in order to avoid down down online code caused by pollution (heavy redundant code | | conflict with existing code | |...). ;

2. The library introduces: the jQuery library, introduced in principle only, if to introduce a third party libraries, are required to discuss with other team personnel decisions;

3. The variable naming: camel. Native JavaScript variable requirement is pure English letters, first letter must be lowercase.

4. Class names: capitalize the first letter, camel name. Such as ITaoLun;

5. The function name: first letters lowercase camel. Such as iTaoLun ();

6. Named semantic, as far as possible the use of English words or its abbreviation;

7. Try to avoid using compatibility and consume resources or properties;

8. Later, in optimization of JavaScript the annotation class Chinese characters must be converted to unicode encoding to use, in order to avoid the code shown when coding errors;

9. Code structure clear, proper comments. Improve function reuse rate;

10. The attention from HTML, decrease the reflow, pay attention to the performance.

CodePudding user response:

HTML to avoid hierarchical nesting serious; Specification use semantic tags; Images add Alt attribute,,,
  • Related