How can a junior front-end write high-quality code?

一HTML
1. The declaration of DOCTYPE is basically the world of H5 now, and it can be generated directly by shortcut keys.
2. Character set declaration, usually , remember to escape symbol characters such as spaces -  &-amp;
3. Correct abbreviation Now, the code in each FamilyMart bucket has been configured with indentation. You can use it directly without much need
4.css and js emphasize the use of external links. Now I feel that componentized things are written in each It can be done in the component. Using precompiled languages ​​such as less can more easily achieve effects such as skin changes
5. Correct tag nesting
6. Delete unnecessary tags. For example,

semantically, the outer div can be deleted, because div and ul are both block-level elements
7. Set it when making the page Area, after the entire site is laid out, if you want to adjust the small area block, directly define a separate class (ID is also acceptable) in the body or the nearby large area block, and do the style processing
8. Omit the picture, The protocol portion (http:, https:) of the URL for styles, scripts, and other media files unless neither of these two is satisfied. For example,
9. Use two spaces for indentation (it does not have to be as unified as possible) to achieve Code formatting
10. Try to use lowercase for tag names, attributes, and attribute values
11. Reduce unnecessary spaces in the content of the element, and do not use spaces at the end of the content.
12. Add appropriate comments to describe the function
13. Add TODO to mark to-do items. Such as

• Apples
• Oranges

14.h5 mid laner Do not use closed form for labels, just write labels directly. For example,
do not write it as
; Multimedia elements such as images, videos, canvas animations, etc. ensure that other accessible content is provided. For example,
17. When referencing the style sheet, type defaults to text/css and can be omitted. When referencing a script, type specifies text/javascript by default, and
can be omitted. 18. Use double quotes for attribute values.
19. The published code must be compressed.

Two CSS
1. Use of reset. First, clarify its role, because the default attribute values ​​​​of each browser are different and compatibility needs to be considered. Do not use global reset because it is inefficient.
2. In the order of attributes, those that change the layout are written in front, such as display, margin, padding, position, and others are written in the back (can be arranged in alphabetical order)
3. Define meaningful id and class names, Short and clear, use connectors for multiple words
4. Try to define the id in a large block, and search for elements in the block, such as