Div + css achieves separation of structure and Expression in ideas and procedures

The separation of content and performance has been discussed since the day from the standard to the emphasis on Chinese people. However, the separation of div + css xhtml + css pure code remains the same. How can we separate the ideological process?

Old topic: separation of an ancient poem

1. Give you an ancient poem and save it as a pile of unformatted text. You can understand its content and process the structure. After using the word layout, he has a structure
2. This structure actually contains semantics and representation
3. Structured with html. Aside from all forms of representation, only semantics is considered.
4. CSS is used for representation processing, including the default representation of html. It has visual representation, which reflects the structure and user experience, the user experience includes interactive layout and visual experience.
5. If the behavior is added, such as clicking the comment sequence number, the Comment content will be slowly jumped.

Let's take a look at css Zen garden.
The above five steps form the css zen garden of the first version.
More template providers are engaged in interactive online drafting + visual design. It is reflected in CSS on the webpage.

We can see from the encoding perspective
Step 1: content processing is structured and compiled in pure HTML
Step 2: structure processing is a manifestation of pure CSS Compilation
Step 3: Add behavior to the performance.

From the process perspective
Step 1: planning documents
Step 2: Structure Processing
Step 3: Interactive Design (interactive style Construction)
Step 4: Visual Design (visual style Construction)
Step 5: Style Building

Reverse Thinking
If there is no css zen garden, the designer has designed hundreds of design documents and made them into pages. Will the HTML structure be the same? Analogy: If you plan to process two interactions and visual designers, will the structure of page building be the same? The answer is certainly not the same. Why not? The root cause of the discussion is that we need to think deeply!