Victor Engmark ha scritto:
> Besides all the "theorical" questions, I've had some problems. In fact,
> there are some HTML attributes which do not exist in XHTML. For some, I
> just used CSS, but for others, I couldn't find a valid substitute.
> That's why some pages are, actually, hybrid HTML/XHTML. :-(
>
> Huh? XHTML 1.0 and HTML 4.01 are IIRC equivalent. Can you give an example?
The first thing I can remember of (Davi reverted my commit... "unstable
code"... lol, I can't convert the whole webapp all at once! :-D ) is..
tables :-)
HTML:
<table bgcolor="{$webpage->theme->contentBGcolor}" cellpadding="0"
cellspacing="0" rules="none" border="0">
I converted it into XHTML this way:
<table style="background-color:{$webpage->theme->contentBGcolor};border:0;">
Notice that we lost the information provided by cellpadding, cellspacing
and rules. There are no equivalents in CSS, IIRC.
Your fix is in the attached file - You apply TD formatting to the TD elements, instead of the (IMO rather silly) way of HTML, which is to set it at the table level.
The result looks the same in Firefox
2.0.0.2 and IE 6, and is much more space efficient: With the old approach, you get an overhead of 66 bytes per table per page load (bgcolor="" cellpadding="0" cellspacing="0" rules="none" border="0"). Compare with external CSS, where the user loads 64 bytes (table{background-color:;border-collapse:collapse;}td{padding:0;})
once, ever. And consider that these savings are duplicated for every table on every page load.
Moreover, look at this sample code (I've found different pieces like this):
<img src="" width="90" height="120" align="left" alt=""
border="1" hspace="0" vspace="0">
In XHTML it would be:
<img src="" width="90" height="120" align="left" alt="image"
style="border:0;position:relative;left:0;top:0" />
(I don't really remember if "align" is an acceptable attribute of img)
Now, see that I used position:relative, with left and top = 0px instead
of hspace and vspace... is that correct? I'm not sure.
Unless you need to be able to save the web site as a single file with styles, you'd normally move those away from the <img> element, and into a separate style sheet file, to save space and make your design much more flexible. That also includes @align. To date, I've
never encountered an old-style HTML layout which I couldn't duplicate with standard compliant, accessible (WCAG level AA), and
smaller XHTML + CSS. It may be that the pages I've worked with were exceedingly bad, or that the W3C people are smart enough to make the newer standards better than the old ones...
P.S.: in my opinion, it would be better using DIVs instead of TABLEs.
But I think it's a lot of work
That depends on the contents of the table. If it's tabular data, use <table>. If the table is just there to keep things aligned, then use <div>. Otherwise, you'll end up with "divitis", coined in Jeffrey Zeldman's
Designing with web standards.
Just my 2 cents.
PS: Where can I find the actual files to edit the pages? I'm getting an itch to have a look at this myself.