indentation

mbstevens · Aug 25, 2006

For the following code snippets from
a strict doctype page,
which of the following styles of
indentation do you prefer?

And do you have a style that is unlike any of these
that we should have a look at?

____________________________________________
HTML Tidy output with '-i' indentation set:
_____________________________________________

<body>
ljfdlsfjd ksldfjlsdjk lsjdlsdj ldkfjlf jdksllsdj
lsjlsjd jlsdkfj fjkdlflkf jldksjflsjf ldsjflsdj jfdlsjlds

<ul class="ahem">
<li><a href="http://www.mozilla.org/" class="dark">Download
Mozilla or Firebird</a></li>

<li><a href="http://www.opera.com/" class="dark">Download
Opera</a></li>
</ul>
</body>

_______________________________________________
vaguely Lispish:
_______________________________________________
<body>
ljfdlsfjd ksldfjlsdjk lsjdlsdj ldkfjlf jdksllsdj
lsjlsjd jlsdkfj fjkdlflkf jldksjflsjf ldsjflsdj jfdlsjlds

<ul class="ahem">
<li>
< a href="http://www.mozilla.org/" class="dark">Download
Mozilla or Firebird
</a>
</li>
<li>
< a href="http://www.opera.com/" class="dark">Download
Opera
</a>
</li>
</ul>
</body>

_______________________________________________
contained levels:
_______________________________________________
<body>
ljfdlsfjd ksldfjlsdjk lsjdlsdj ldkfjlf jdksllsdj
lsjlsjd jlsdkfj fjkdlflkf jldksjflsjf ldsjflsdj jfdlsjlds

<ul class="ahem">
<li>
< a href="http://www.mozilla.org/" class="dark">Download
Mozilla or Firebird
</a>
</li>
<li>
< a href="http://www.opera.com/" class="dark">Download
Opera
</a>
</li>
</ul>
</body>

_________________________________________________
Flat, spaced:
_________________________________________________
<body>

ljfdlsfjd ksldfjlsdjk lsjdlsdj ldkfjlf jdksllsdj
lsjlsjd jlsdkfj fjkdlflkf jldksjflsjf ldsjflsdj jfdlsjlds


<ul class="ahem">

<li><a href="http://www.mozilla.org/" class="dark">Download
Mozilla or Firebird</a>
</li>

<li><a href="http://www.opera.com/" class="dark">Download
Opera</a>
</li>

</ul>

</body>
</html>

dfloss · Aug 25, 2006

Tab indents aren't worth the trouble, imho. We use two or three spaces.

Eric B. Bednarz · Aug 26, 2006

mbstevens said:
which of the following styles of
indentation do you prefer?

And do you have a style that is unlike any of these
that we should have a look at?

< a href="http://www.mozilla.org/"

^

This is not wrong (the end tag further on is, though), but you do
realise that's not a STAGO delimiter in this context, do you?

Since whitespace between tags is often problematic (e.g. CSS bugs, DOM
discrepancies), the best way of formatting HTML is to remove it (the
whitespace, not the HTML

. I wouldn't indent myself, but of course
you can if you wish, e.g.

<body

<p class="ahem"
ljfdlsfjd ksldfjlsdjk lsjdlsdj ldkfjlf jdksllsdj lsjlsjd jlsdkfj

fjkdlflkf jldksjflsjf ldsjflsdj jfdlsjlds</p

<ul class="ahem"
><li
><a

href="http://www.mozilla.org/"
class="dark"

>Download Mozilla or Firebird</a
></li
><li
><a

href="http://www.opera.com/"
class="dark"

>Download Opera</a
></li
</ul
</body
</html

I appreciate the copy in the paragraph, BTW. I've seen a lot of pages
with an 'ahem' class, and they all had an idiotic message attached.

Michael Winter · Aug 27, 2006

Eric B. Bednarz wrote:

[snip]

Since whitespace between tags is often problematic
Often?

(e.g. CSS bugs, DOM discrepancies),

If a script depends upon an exact, node-for-node representation of the
document tree, it's probably not very robust. There's certainly no need
to use whitespace nodes as an excuse for munging markup: use a loop to
traverse siblings in the document tree and test the node type (watch out
for IE5.x and comment nodes).

Even if markup is altered to remove whitespace between tags, there's no
need to reformat the entire document.

the best way of formatting HTML is to remove [the whitespace]

That's horrific, in my opinion.

[snip]

Mike

Eric B. Bednarz · Aug 28, 2006

Michael Winter said:
Eric B. Bednarz wrote:

Often?

Often enough (in practice, not even generally taking mixed content
models in account). I can say offhand that IE lte 6 has a problem with
list elements seperated by whitespace if they contain child elements
with the display property changed from inline to block, and I've seen
whitespace related problems regarding tables the other month in a dutch
newsgroup.

If a script depends upon an exact, node-for-node representation of the
document tree, it's probably not very robust. There's certainly no
need to use whitespace nodes as an excuse for munging markup: use a
loop to traverse siblings in the document tree and test the node type
(watch out for IE5.x and comment nodes).

If I wanted to write a library, yes. :->
If I know how the markup is generated, I don't see a real benefit in
the overhead of using a loop as an extra safety-net when I could address
a particular element directly. I would agree that this is quite
case-dependent, though.

[markup formatting a la said:
That's horrific, in my opinion.

Go shiver, it's not a new idea and even part of a standard

<http://www1.y12.doe.gov/capabilities/sgml/wg8/document/n1920/html/clause-A.4.5.html#clause-A.4.5.2>

and better don't ever use Jade then.

FWIW, I even find it very readable. Of course YMMD.

Michael Winter · Aug 28, 2006

Eric said:
I can say offhand that IE lte 6 has a problem with list elements
seperated by whitespace if they contain child elements with the
display property changed from inline to block,

That's the most intrusive example that I recall as well, yet it's easily
fixed using only CSS. There's no need to alter the markup.

and I've seen whitespace related problems regarding tables the other
month in a dutch newsgroup.

Nothing comes to mind here, but I don't style tables that often, anyway.

[MLW:]

If I wanted to write a library, yes. :->

A library is hardly necessary: one or two functions would do. One might
even have the option of using the DOM traversal methods.

If I know how the markup is generated, I don't see a real benefit in
the overhead of using a loop ...

If the markup was easier to read, write, and generally maintain, I'd
argue that the overhead would be worth it. I doubt the overhead would be
that extreme, anyway[1], so it shouldn't be a factor even for
time-critical code.

I would agree that this is quite case-dependent, though.

Quite. It was the phrase "the best way of formatting" in relation to
HTML that was my main objection (though obviously my personal dislike
was also a factor

).

[markup formatting a la <http://www.w3.org/2000/08/lb2/>]
[snip]

... it's not a new idea ...

I realise that, but it doesn't make it any more palatable.

It might be necessary in some situations (to add to your list: some uses
of standalone XML), but it isn't in HTML.

[snip]

FWIW, I even find it very readable. ...

It probably is once one becomes accustomed to it. I can read it as well.
But, given the choice, I wouldn't.

Mike

[1] On a Web forum, someone asked how to improve the performance of a
DOM traversal function on Pocket PCs. He hadn't profiled the code, and
the bottleneck was actually in creating and inserting additional elements.

Even on a resource-strapped mobile device, traversal over a thousand
nodes should take less than a second (assuming that part of his
benchmark /was/ accurate), far in excess of what should be necessary.

Working on mobile css menu with plenty of frustration!	2	Dec 29, 2022
Horizontal menu bar header	2	May 12, 2021
Javascript scroll to sections and also scroll to section but open relevant nav-tab	4	Feb 25, 2022
I need help fixing my website	2	Oct 15, 2023
JavaScript code not working!!	6	Jun 13, 2023
Song requests	4	Aug 16, 2023
I need help making an html website	2	Aug 2, 2023
Multi select options in a menu	1	Oct 30, 2022

indentation

mbstevens

dfloss

Eric B. Bednarz

Michael Winter

Eric B. Bednarz

Michael Winter

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads