Alternative HTML syntax

Question

It's a subjective question but don't you think the following HTML syntax would make more sense?

<div #id .class1 .class2><!-- content --></div>

Instead of:

<div id="id" class="class1 class2"><!-- content --></div>

Answer 1

Might be that it makes more sense to someone who authors only HTML and CSS. However, bear in mind that

• CSS was invented much later than HTML
• HTML is largely backwards-compatible; you can still view current web pages with ancient browsers and there is no need to change that
• Your proposed syntax is incompatible with XML. Therefore you're throwing out all XHTML folks
• Furthermore, do you want to change other languages too that rely on CSS for styling, e.g. SVG (again, XML, therefore incompatible)?

I agree, for a very narrow purpose, it might be a beneficial change, but when viewing at this from a broader angle, I doubt you'll see much improvement, only pain. You can of course use a preprocessor to write your HTML this way and convert it to the actual thing.

You may also want to take a look at other languages who convert into HTML, such as Haml.

If you are content with just typing something similar to what you have proposed, then Zen-Coding might be an option for you. Quoting:

Zen Coding is an editor plugin for high-speed HTML, XML, XSL (or any other structured code format) coding and editing. The core of this plugin is a powerful abbreviation engine which allows you to expand expressions—similar to CSS selectors—into HTML code. For example:

div#page>div.logo+ul#navigation>li*5>a

... can be expanded into:

<div id="page">
    <div class="logo"></div>
    <ul id="navigation">
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
    </ul>
</div>