Editor's Recommendation: Do you really understand HTML? Below, we will take you through an in-depth look at HTML. Through a single flawed line of HTML code, the editor will help you delve deeper into HTML.
Here is a snippet of HTML; please identify its issues:
```html
<P> What I write isn't HTML, it's loneliness.<br><br> I say:<br>Don't be infatuated with me, I'm just a legend.
```
This was originally a Yahoo interview question (the text has been slightly altered). It has been used for many years, but no one has ever answered it completely correctly.
---
### Explanation
The purpose of this question is to highlight how many people think HTML is too simple, yet it is the most fundamental and critical part of front-end development. The reasonableness of HTML structure design directly affects the maintainability and flexibility of the code, as well as web performance and collaboration efficiency. Many people mistakenly believe that front-end development is equivalent to JavaScript development—this is a major misconception. JavaScript, HTML, and CSS are the three foundational pillars of front-end development. They have different natures but are closely related. Proper understanding and reasonable application of these technologies distinguish professionals from amateurs. Some back-end engineers can write elegant JavaScript, but they don’t truly understand how to reasonably combine JS, HTML, and CSS. Mastery of HTML doesn’t come from learning a typical programming language—it comes from extensive practical experience and insight. This is the basic skill of a front-end engineer.
This is not a nitpicking or show-off question; it’s a serious "painting eggs" question that tests basic skills. A person's understanding of a single line of code can reflect their overall front-end development proficiency. Let's get back to the main topic. Here are the key points tested by this question:
#### Key Point 1: Differences between HTML and XHTML
This line of code is entirely correct under HTML 4.01 Strict but contains numerous errors under XHTML 1.0 Strict. Therefore, this is clearly a test point. In XHTML, all tags must be closed, so `` and `` need to be closed. Tags cannot be written in uppercase; `` should be lowercase ``. Additionally, ` ` and `` must be contained within a container. None of these rules apply in HTML. `` in HTML is an optionally closed tag, meaning it does not need to be explicitly closed.
This test point shows how strict XHTML is. If you answer this correctly, you'll score 60 points.
#### Key Point 2: Style Separation
Using ` ` to control indentation is unreasonable. This should be handled with CSS. Therefore, ` ` should be removed.
#### Key Point 3: Proper Use of Tags
`` is a forced line break tag, while `` is for paragraphs. The original question uses consecutive `` tags to create the effect of two paragraphs, which works but is clearly inappropriate because paragraph spacing cannot be controlled later. The correct approach is to use two `` tags to represent two paragraphs. After "I say," using `` for normal text wrapping is reasonable.
If you answer all of the above correctly, you’ll score 100 points.
---
### Improved Version of the Original Question:
**HTML 4.01:**
```html
What I write isn't HTML, it's loneliness.I say: Don't be infatuated with me, I'm just a legend
```
**XHTML 1.0:**
```html
What I write isn't HTML, it's loneliness.I say: Don't be infatuated with me, I'm just a legend
```
---
### Bonus: Semantic Tag Usage
On top of the previous improvements, appropriately using semantic tags to mark the content is a bonus. However, overusing tags would be counterproductive. For example, the phrase "I say" could be marked with the `` tag.
```html
What I write isn't HTML, it's loneliness.
I say: Don't be infatuated with me, I'm just a legend
```
I think this is sufficient. If you want to go further, you could use `` for "I" and `` or `` for "HTML" (though discussing the difference between `` and `` might be overly pedantic). Beyond this, further complexity isn't necessary.
```html
What I write isn't HTML, it's loneliness.
I say: Don't be infatuated with me, I'm just a legend
```