Semantics at the heart of the Web: why structure takes precedence over style

The original Web: a document-oriented architecture

At the origin of the World Wide Web, Tim Berners-Lee designed the HTML language with a precise ambition: to enable information sharing through a system of interconnected documents. In this initial vision, the document itself carries its own structure. Each element—headings, paragraphs, lists, quotes—possesses its own semantic meaning. A level 1 heading (h1) is not simply a line of enlarged text; it defines the main subject of the page.

This approach, often forgotten in the era of ultra-complex CSS frameworks, is the foundation of Web accessibility and interoperability. Yet, over the years, a trend has taken hold: that of "div-itis," a practice consisting of using generic tags to build layouts, leaving it to CSS to provide the appearance of structure.

CSS: a tool for presentation, not definition

The role of CSS (Cascading Style Sheets) is clear: it is designed to separate presentation from content. However, a common mistake is to try to "recreate" the structure of a document via CSS properties. For example, transforming a list of elements into a menu via margins and floats rather than using semantic tags (nav, ul, li) amounts to masking the true nature of the content from user agents.

When the document carries its native structure, CSS no longer needs artifice. It simply improves readability, adapts content to different screens (responsive design), and applies a visual identity. When HTML is correctly structured, the document is readable by any browser, search engine, or assistive technology, even if the stylesheet fails to load.

The benefits of a return to semantics

Adopting this "structure-by-document" philosophy offers concrete benefits for developers and users:

• Enhanced accessibility: Screen readers naturally interpret the document hierarchy. If the structure is logical, visually impaired users can access information fluidly.
• Optimized SEO: Search engines like Google prioritize content with a clear semantic structure. They better understand the weight of headings and the hierarchy of information.
• Simplified maintenance: Semantic HTML code is easier to read and maintain. Fewer "structural" CSS classes mean less risk of conflicts during future design updates.
• Robustness: Content remains intelligible, regardless of the device or browsing context.

Conclusion: towards a more sober and sustainable Web

The rise of CSS Grid and Flexbox has sometimes given the illusion that developers could free themselves from the constraints of HTML. This is a strategic error. The strength of the Web lies in its ability to be universal. By letting the document carry its own structure, we respect the Web's initial contract: to make information accessible, durable, and structured. It is time to consider HTML not as a simple wrapper, but as the essential skeleton upon which the aesthetics of CSS are lightly grafted.

Sources

W3C: Web Design Standards (HTML and CSS) MDN Web Docs: HTML text fundamentals Tim Berners-Lee: Style Sheets in HTML documents