Build pages with clean HTML markup_HTML/Xhtml_Webpage Production

The Internet is an organism that is constantly evolving. How to build a page that can adapt to the development of the Internet for a long time is very important. It can enable your website to quickly follow the rapid development of the Internet.

Using clean HTML tags and building standards-compliant pages can help you do this, and more importantly, it can save you a lot of time and money in future operations.

Web page technology has progressed with the development of Internet technology. HTML technology has been developing for a long time, and its accompanying technologies have also developed steadily.

First it was Javascript, then CSS, XML, and now AJAX. The large-scale application of HTML5 has also begun to take shape - Firefox, Safari, Opera and Chrome have basically fully supported HTML5 (on this issue, Microsoft's Internet Explorer once again hinders the development of the Internet#-_-)

In this article, we will explore the basic web standards, discuss what they are, what their significance is, and solutions to these important but often overlooked problems.

What is "clean" HTML markup?

Simply put, "clean" HTML markup means: No redundancy, conforming to standards, using meaningful tags and structure.

The cumbersome HTML code can make full use of tags, eliminate unnecessary code, and save only meaningful tags. It avoids useless properties, such as embedded CSS, and keeps the document structure neat.

Similarly, cumbersome CSS code should avoid duplication of itself, use inheritable properties (remember that the original intention of CSS is cascading style sheets), and reuse CSS Classes scientifically.

Standard compliance means that your page can pass the HTML, CSS, and XML standard verification of W3C. Use the free W3C validator to find and correct errors and continue testing. Know that it is 100% compliant.

Why is this? Isn't it enough as long as it can be displayed normally?

Every project has a tight time limit, and users want the website to be released as early as possible. So website developers and designers are required to complete their work quickly and efficiently.

It’s easy to fall into a trap—fast means sloppy, and writing clean, standards-compliant code is a waste of time. People often say: "If it displays normally, there will be no problem."

While it shows at this moment, what about next year? What about three years from now? What should I do if I upgrade my browser? Is the device compatible?

Do you really think that search engines will dig into your code line by line? They are very picky. If you don’t use standardized code, it is equivalent to driving away the search engines yourself.

What will happen if another employee comes to modify your code? What happens if you are fired by your boss or change jobs yourself? There will be successors who look at your code and understand what it means. Do you want it to be easy, or do you want him to stab you behind your back?

Start writing it correctly, it is not an annoying task, it will save you time and money, and give you less worries.

You may think that using embedded CSS to write pages is faster, or you may think that it is more convenient to write HTML directly without considering the structure.

But when you modify the document or you want to revamp the website in the future, you will spend more time making up for the interference caused by poor quality code. If you create a new style sheet, the embedded CSS scattered throughout the HTML code will cause you a lot of trouble, and you may spend hours stripping them.

Extensible, device-friendly, semantic and easy to upgrade

Mobile browsers are developing faster and faster. Internet access on mobile phones is no longer the exclusive domain of BlackBerry. Now hundreds of millions of people use mobile phones to browse the web every day.

Devices with assistive browsing technology developed for people with visual impairments or special operating interfaces designed for people with physical disabilities are already common. If you don't want to lose such a large user base, you need to consider device friendliness.

Your website may be provided to users in Braille form, with Internet Content Storage , Google Snapshot , etc. Tools, your pages may remain on the web for a long time even if they are deleted.

Using clean, standards-compliant markup can make it easier for you to deal with the above situations.

Do and Don't ("should" and "don't")

DO - Use predefined tags. For example: h1 is the most important part of a web page content, followed by h2, h3, etc. There can only be one h1 in a web page;

DO - Use meaningful element names. Ask yourself if others read the code, would they understand the meaning of your class and ID naming? For example, for the same layer, use #box12 or #comment-footer, which one do you think is better?

DO - Take full advantage of CSS inheritance. For example: if you set the font attribute in a container, then you don't have to set it separately in its child elements unless it uses a different font. This will make your stylesheet clear and concise.

DO - Make your HTML, CSS, and XML code compliant. Use the W3C validator to verify errors and warnings, and fix them until you are 100% compliant with the standards.

DO - Bidirectional inspection of code generated by the WYSIWYG editor. WYSIWYG browsers are the main source of garbage code. Be sure to streamline the code it generates as much as possible.

DON'T - Do not use inline css styles and extraneous tags and attributes. Even if you are very busy, don’t add these things casually.

DON'T - Don't settle for "right display". Because errors hidden in the page may ruin the page beyond recognition in other browsers or devices.