scripting with non standard tags

[extrabigmehdi]

hi,
I've been browsing the web for hours,
and wasn't able to answer to this question: what's wrong with using "non standard markups" (other would say invalid) for scripting purposes ?
I like the idea of storing dedicated attributes in a dedicated tag.
I've made a kind of popup script (not exactely a popup, but a lightbox-like (http://www.huddletogether.com/projects/lightbox/))
and here's how basically how it works.
Let's call the tag "darkbox"
So basically the code would be like:

<a href="link.htm">
<darkbox bottom="blue" title="my title" width="500" effect="zx" type="iframe" >
</darkbox>
</a>


I will initialize the page with an external js script , that will loop through all
the "darbox" tags.
It is pretty straightforward, I just have to do : document.getElementsByTagName("darkbox")
and then retrieve all these particular attributes using getAttribute.
After that , I can assign an onClick event to the parent tag which is a link .

Before you make an objection, you might ask why not put all attributes directely in the "a" link tag ?

First: I find the code easier to read
I keep attributes specific to the popup effect separate to "a" link tag.

Second: I don't want to conflict with existing valid attributes.
Special attributes stay dedicated to the popup effect.

Third: You may suggest the use of a class called "darkbox", and make a loop that check all span tags that have a class called "darkbox".
I would say then: the problem of non valid attributes remain.
Even if I put them in the "a" tag, the w3 validator (http://validator.w3.org/) will show errors.
Worst: with an invalid tag, I get with the validator one error,
while with only invalid attributes I get many errors with the validator :D

Fourth: it works! . I've tested this with every well known browsers: opera 9, firefox, IE5,I6, IE7 (beta),
a clone of safari for windows (swift (http://www.getswift.org/)) .
There's only one browser that resist : konqueror, it doesn't add the tag to the dom tree. But anyway, konqueror is not widely used.

So tell me: do you have any good reason to resist to the use of an invalid markup ? I've been looking to all famous javascript libraries (moo fx, scriptaculous, dojo toolkit), YUI, all seem to avoid the use of invalid markup.
However the use of invalid attributes seems tolerated. . At least according to "dojo toolkit (http://dojotoolkit.org/)" use. So why not a little step further, invalid markup ?

Also I tryed to make a "minimalistic DTD", that will be added to the standard one, in other to validate my newly introduced tag. But I wasn't able to do that: too complicated. I do not want a DTD that has a too big size (4 kb maximum) . It seems that XHTML specifications are too heavy, and that the langage is not really extensible for common uses.
Anyway, I'm not sure that after doing the trick that konqueror will accept my tag.

Any suggestions ? Thanks.

[rlemon]

I've dabbled down this road before. it's not pretty and does not have a very 'promising' outcome.

so i know the custom tags / invalid markup is a great idea in theory, and maybe even works great when your writing your code. the problem comes into play when you start thinking about accessability.

now with these tags your site (unless custom tags and rendered to proper markup before they are sent out) screen readers, and i'm assuming BB/PDA's won't have access.
also, you will never pass a validation service, even with a hacked DTD.

i suggest you read a little more from the W3C site before you continue.

furthermore, about the comment

XHTML specifications are too heavy


what exactly do you mean?
I'm confused by this comment.

[jkd]

If you're dealing with honest-to-goodness XHTML (with proper mime-types), then custom markup is absolutely fine. There are semantic-implications, as what exactly does a <darkbox> tag mean versus a well-defined <a> tag? XHTML is first and foremost a semantic language, and mixing in presentational tags like <darkbox> is no better than using tags like <font>. The preference for invalid attributes is that people are more "ok" with presentational attributes (e.g. "style" or "width"), and the tag itself still carries relevant semantic meaning.

If you're dealing with plain-jane HTML, then you are relying on poorly-defined error behavior. IE treats opening tags and closing tags as actual separate elements in the DOM, Firefox's parser will move child elements outside of the tag, etc. Different behavior for different browsers, since they all handle errors in different ways.

[rlemon]

try doing this server side.

Replace strings iin the code.

{DarkBox::bottom=blue;height=500;width=400;anotherProp=value;}

then just replace that with the proper HTML markup as defined by the XHTML or HTML specification.

[extrabigmehdi]

Hi all, thanks for your opinions,

@rlemon
the problem comes into play when you start thinking about accessability.
.
I might be a moron but in fact I do not really care about people having disabilities.
If you have a website related to design, then it's not a big matter to put
an alt tag on images for blind people.
Anyway, I think, it's still possible to offer accessibility
with my solution (just use the parent tag for "accessible" stuffs)

i'm assuming BB/PDA's won't have access.
The script will degrade nicely,
and I guess that PDA, will just ignore the non standard tag, isn't it ?
I must say I never used a PDA (nor a screen reader)

also, you will never pass a validation service, even with a hacked DTD.
Thanks for the info, but I was hoping that with a DTD, the browser konqueror
will finally accept my tag.


furthermore, about the comment
Quote:
XHTML specifications are too heavy

what exactly do you mean?
I'm confused by this comment.
Sorry , it's unclear. The fact is that I was
hoping that after reading a whole bunch of
specification page, I would have the freedom
to define my own tag. I was looking for a straightforward solution.
I was expecting to be able to define in two-three lines,
what should be the behavior of any browser for a user-defined tag.
Instead I have to dive into an almost encyclopedic specification,
and I'm still unable to do that. According to your comment, it is
even "forbidden". I think the appellation of "extensible" for XHTML
is misleading.

@jkd
If you're dealing with honest-to-goodness XHTML (with proper mime-types)
Well, I try to follow the basic rules of XHTML. (each tag must have a closing tag,
closing tags in right order, doctype declaration...)
About proper "mime-types", well I don't know, I guess that any server
will provide the correct one for html/php documents, isn't it ?

There are semantic-implications,
Well, new tag would be a clone of a span tag, same behavior, different
name. Only the external js script will make the difference.

and mixing in presentational tags like <darkbox> is no better than using tags like <font>.
Well I'm working with particular attributes, that won't be accepted within a CSS.
We can avoid font tags only because CSS exists.
Also I believe, that's not always handy to separate content from presentation (at least for the script I'm thinking off)

If you're dealing with plain-jane HTML,
then you are relying on poorly-defined error behavior.
IE treats opening tags and closing tags as actual separate elements in the DOM,
Firefox's parser will move child elements outside of the tag, etc.
Different behavior for different browsers, since they all handle errors in different ways.
That's scary. That's the main reason, I worry a bit about the idea of using a non standard tag.
The fact is that I'm making a script I'll distribute, and I guess that if people
make syntax errors in their document, the script might become unreliable.
While in another hand, using my own tag looks so much neater...

@rlemon (again)
{DarkBox::bottom=blue;height=500;width=400;anotherProp=value;}
I was looking for a generic solution, not just dynamic pages (as I'll distribute my script).
Moreover, I think adopting a quick solution for parsing might not be easily "extensible"
(exemple: defining a new title attribute that accepts this times ";" )


Thanks all.

[rlemon]

you could always use a deprecated tag like <B> and just 'restyle' it via css and js.