Posted: 2026-01-30
Last updated: 2026-03-16
|
Finally, after spending several weeks of trial and error, trying to find a good and decent retro web design for my homepage, I managed to finish this site.
For a long time, I dreamed of redesigning my personal website but with an "almost-accurate" classic web design, compatible (or well, semi-compatible) with older browsers like my beloved Netscape, without using modern things like CSS3 or HTML5, taking inspiration from Frag-NET's web design.
However, it wasn't an easy thing to do...
Table-based web design was always one of my favorite types of web design instead of those plain HTML designs or frames (eww frames), but unfortunately doing something like that is annoying and embarrasing since it ends up with a confusing and large HTML code. But hey, that was the way to make an attractive and professional web design before CSS.
Creating this design you see here took me weeks of trial and error. I had to read old HTML3.2 and HTML4 specifications to make it "compatible" with some older browsers, and I also had to apply some techniques such as the classic 1x1 GIF image for margin and padding (thanks to the VSPACE and HSPACE attributes), but for some reason that caused Netscape 4.8 to display the image with a larger margin than I had set, so I had to opt to create tables with a TD/TH with a custom HEIGHT to simulate margins, and seems like that solved that annoying issue I was having.
Sometimes I feel that CSS came out too late to solve all this shit, although HTML and the Web was never intended to have fancy and eyepleasing styles in the first place.
Another thing that has caused me a lot of confusion is the COLOR attribute of HR. For some reason, browsers such as Netscape 4.8 doesn't display any color, but RetroZilla and modern Firefox do. I don't know where this attribute came from, as I couldn't find anything related to it in the W3C specifications. According to GPT and Gemini (SORRY FOR RESORTING TO AI FOR THIS), it was added in HTML3.2, but as I said, it doesn't appear on the W3C official specifications. Anyway, I had to go to Paint.NET, create a 1x1 GIF image with the color I was using for the text, and use that to simulate a green HR.
Regarding the footer, there's something that bothers me, which is that in Netscape 4.8, the 88x31 buttons on the right side are displayed with an extra margin on the right. I have no idea why this happens and as for now I haven't found a way to fix that.
As for some pages, while I was porting the How to run a Sven Co-op 3.0 server on Linux guide to this new design, the PRE and CODE tags caused the content TABLE to overflow (although it seems that with CODE this doesn't happen if one word isn't separated), so I had to resort to taking screenshots of the codes/commands I wanted to show and linking them to a text file. Too annoying, I know.
And no, in case you're asking, I haven't used any WYSIWYG HTML editor. I only used Firefox's DevTools to check the width and height of tables and images and also WinSCP's integrated editor =)
And BTW, yes, all of this is also done thanks to Server-Side Includes. Imagine copypasting every part of the design structure into all the HTMLs on this site without it X_X
Anyway, I'll conclude this journal with a screenshot of how this site looks on an old browser such as Netscape 4.8 on my Windows XP VM (w/ Inexperience Patcher to get that Win2k aspect).
Someday I should remove those white pixels on the Mozilla GIF from the sidebar...
Tiny update from 2026-02-21: I just discovered that setting an old HTML DOCTYPE, some modern Firefox versions automatically enables "Quirk Mode", which tries to emulate behaivor from Netscape Navigator 4 and IE 5. That explains why when you change the DOCTYPE to a modern one it changes all the design.
[ Back to Top ]
|