Despite the fact that Mozilla is a browser based on observing standards, its website hasn't ever validated. Furthermore, it never used semantic html. While the new design by Ben Goodger is more pleasing to the eye than the former one, it still fails to use correct structure and it fails to eliminate the nested table design. As a result, I have created a purely CSS layout for mozilla.org using the current design. It validates in XHTML 1.1 and CSS 2.
Because the design is finished, the purpose of this project is more for publicizing rather than coding, although some help is still greatly appreciated (read below).
Please take a look at the proposed design. Also, please take a look at the W3C validator's results as well. A list of all files and comments on them are included in the table below:
| File | Comments |
| index.html | Together both files were 32kb. Now they are 25kb. |
| styles.css | |
| bugIconGoto.gif | Unmodified |
| bugIconNewBug.gif | Unmodified |
| bugIconQuery.gif | Unmodified |
| bugIconNewBug.gif | Unmodified |
| downloadIconCamino.png | Instead of using PNG-24 (4.9kb), conversion to PNG-8 (1.2kb) makes it shrink in size. |
| downloadIconFirebird.gif | Unmodified |
| downloadIconMozilla.gif | Unmodified |
| downloadIconThunderbird.gif | Unmodified |
| header.gif | Unmodified |
| productIconBugzilla.png | Instead of using PNG-24 (19.1kb), conversion to PNG-8 (6.8kb) makes it shrink in size. |
| productIconCamino.png | Instead of using PNG-24 (5.6kb), conversion to PNG-8 (1.5kb) makes it shrink in size. |
| productIconFirebird.png | Instead of using PNG-24 (37.1kb), conversion to PNG-8 (8.4kb) makes it shrink in size. |
| productIconMozilla.png | Instead of using PNG-24 (55.4kb), conversion to PNG-8 (12.7kb) makes it shrink in size. |
Overall, mozilla.org and its frontpage files were shrunk from 165kb to 66kb. At a whopping 100kb savings, that translates to mozilla.org downloading 20 seconds faster on dial-up. Also, the index.html file is easier to edit and oversee. All this plus structured markup and a CSS layout.
Like all things, this design is not perfect (or rather, the browsers that display it :). A few known (but truly minor) discrepancies do exist in some browsers. All browsers are tested on WinME.
No problems, everything is displayed as expected.
