FIREFOX 1.0.7 AND IE6 viewed through DATATIME: a summary REPORT
================================================== =============
by Pamela
Datatime Team
-----------------
Ok guys. I am back.
I have been working hard to implement all your suggestions and to
incorporate all the advice you kindly provided concerning Datatime web
export. And in particular to extract the different styles and to make
preliminary classes, in order to avoid repetitions of the same
descriptors.
- acknowledgements ----------------------------------------------------
In particular I am very grateful to the contributors:
PretLetters
Spartanicus
Bill
kchayka
Beauregard
Antoine
Robi
Arne
Niek
Rincewind
Blinky the Shark
Matt
Udo
....
(hope didn't miss anyone. Althought someone should be listed in a black
list :-))
Here is my latest result. These are 2 pages. The first one contains a
SCREENSHOT to show the original as it is in DATATIME.
And the other is the corresponding WEB OUTPUT.
Compare Firefox and IE to see differences.
The layout shown it is not intended to not make any sense.
It is just a TEST where several formatting effects are used.
ORIGINAL SCREENSHOT (bitmap):
http://cam70.sta.uniroma1.it/Technic...screenshot.htm
WEB OUTPUT (rendered with CSS2):
http://cam70.sta.uniroma1.it/Technic...tatimedemo.htm Just for the record when your css is
validated
http://www.google.com/url?sa=D&q=htt...tatimedemo.htmyou get over 5000 errors, that's not a typo that's 5000 and over 10,000
warnings, It amazes me that any browser can render such a pitifully poor
piece of coding, especially as it has to cope with 3385 html coding errors.
I have lost my previous record. But I still deserve a prize according
what
Matt Silberstein says... :-)
There are some strange warning about colors and font. Please let me
know the code changes
to eliminate them.
Your suggestions are very important for my work.
Of course, all of you are invited, if you wish, to join the board of
supporting experts of Datatime
----------------------------------------------------------------------
This time I have been working using in parallel FIREFOX end IE
to double check the rendering of the report.
In the process of reprogramming the web ouput I have made some
discoveries (i use the word subjectively), which I wish to share.
Some are just hypotheses. So, please, correct me if am wrong.
IE has the well-known issue it does not support natively the PNG
transparency. To modify this behavior it is necessary to use
a script. For the webmaster, it is matter of inserting 1 line, such as
img {behavior:url("pngbehavior.htc");}
within the <style> section. This work fine and is the official
solution suggested by IE Team. (IE7 beta corrects this behavior).
WARNING! I noticed it is very important *where* you place this line.
In fact while IE doensn't care. If you place it before
the class definitions, FIREFOX is no more able to render
the page correctly.
To be safe, place it past the class definitions.
About doctypes, I noticed that if you
use <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
instead of <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN">
there are sensible differences in the computation of the blocks.
Infact the algorithm I used to draw the boxes with HTML 4.01
Transitional does NOT
work with HTML 4.01, and a slightly different algorithm is needed.
This would suggest the box model is different.
In general, it seems FIREFOX is more strict that IE. An example was the
behavior
it has with the call to "pngbehavior.htc". Here are other 2 examples.
1.
HTML 4.01 Transitional seems to be rendered differently by
IE6 and Firefox. I have the impression that when this doctype
is used, Firefox uses a newer box model with respect to IE6,
while just some of the latest properties are not rendered.
Hence, there seems to be no way to get the same result with IE6 and
the last version of Firefox using the Transitional doctype, as the box
model
used is different.
Using DTD HTML 4.01 you can get almost exactly the same
rendering, apart some small details explained below.
2.
About encoding. If your web page is actually encoded UTF-8 and you
by chance specify another encoding, such as charset=iso-8859-1
IE seems anyway able to understand that the encoding is UTF-8,
FIREFOX instead uses what is specified. This might
cause the appearance of some strange chars at the very beginning
of the page.
In general, the impression I have got so far is that Firefox is
candidate to
be more lovable by users, especially those open source oriented, due to
some
nice features and the tabbed interface. FIREFOX is somehow more
confortable
to use for the final user. (IE is perhaps sligtly better good looking).
Firefox is unforgiven and strict as to css.
There is something strange with Firefox rendering of INSET/OUTSET.
In fact if the border size is 1 it uses for the borders the forecolor.
This is strange as it does not happen with border width > 1. IE6 does
not
have this problem.
To center I used the VALIGN, because I could not find a way with css.
(HELP!!!!!!!!!!!!)
This is very uncomfortable to maintain and requires some attention as
the cell generated by TD
automatically is shifted 2 pixels below and to the righ respect to its
container.
So to correct this behavior the absolute location of container must be
shifted
2 pixels top left. The size of the cell is different in the browsers.
Here
IE seems to be a little more consistent.
<table><td bgcolor=blue width=127px height=139px valign=middle>Austria
</td></table>
this instruction generates the following phisical box:
129x141 pixels in IE6
129x139 pixels in Firefox
Further Firefox anf IE have slightly different behavior if the TD box
il larger than
the container, IE enlarges the container also. Firefox no. But this
will not
affect us, except when the cell il smaller than its content.
------------------------------------------------------------------
So thanks to your help the Datatime web EXPORT has so far improved
sensibly.
In particular those big pages have been reduced sensibly by a
preliminary
extraction of style classes.
I still need help with vertical alignent since I feel the solution I
have use
is unelegant and ackward (althought it works).
After all, it also turns out Datatime can also be used as an effective
tool to test and
overstress browsers!! :-)
-Pamela
