IE5.5 Incompatible Features Checklist & Tech Stack

Origin

The site's subtitle reads "Compatible with IE5.5+", but the reality is: a fair number of features on IE5.5 either degrade or simply do not work at all. This article lists every incompatible point and also documents the site's full tech stack, for the reference of those who come after.

CSS Incompatibilities

All dark semi-transparent backgrounds on the site rely on rgba(0, 0, 0, 0.45), including the header, banner, sidebar, 404 page, and styles generated by three CGI scripts: editor.py, search.py, and stats.py.

IE5.5 silently skips color values it doesn't recognize, leaving the background fully transparent. In theory, this could be simulated with IE's proprietary filter:progid:DXImageTransform.Microsoft.gradient (using ARGB format #73000000, which equals 45% opacity).

Sticky sidebar positioning is a CSS3 feature. IE5.5 has no support for it whatsoever — position: fixed wasn't even available until IE7. Degradation behavior: the sidebar scrolls normally with the page and disappears once scrolled off-screen. I attempted to simulate it using JScript's onscroll, but on Pentium MMX-class hardware, it caused noticeable ghosting and stuttering.

The emoji panel uses display: flex; flex-wrap: wrap; gap: 1px to arrange 20 emoji icons at 20x20 pixels each. On IE5.5, flex cannot be parsed, and all <img> elements fall back to the default display: block, stacking the emojis into a single vertical column.

stats.py also uses display: flex, gap: 18px, flex: 1, min-width, and max-width — all CSS3.

The input fields in the sidebar message form rely on box-sizing: border-box to correctly calculate the rendered width of width: 100%. IE5.5 does not recognize this property, so width: 100% adds border and padding on top, causing overflow. In theory, this can be fixed by manually subtracting the pixel values of padding and border from the width.

The scrollable containers in the guestbook and changelog use overflow-y: auto; overflow-x: hidden;. IE5.5 only recognizes the overflow shorthand, not the per-axis properties. Fortunately, no obvious rendering errors have been observed in actual testing.

IE5.5's CSS only supports a:hover. The following pseudo-classes are all non-functional:

• .em-toggle:hover (emoji panel toggle button)
• input[type="submit"]:hover (send button)
• .toolbar-btn:hover (editor toolbar)

Purely cosmetic — does not affect functionality.

Hover transition animations on form submit buttons. IE5.5 ignores transition; button colors switch instantly, with no animation.

The password generation output in toolbox.py and the UA strings in stats.py use word-break: break-all. IE5.5 does not recognize this property, and extremely long continuous strings (such as base64 output) may overflow their containers. Can be replaced with word-wrap: break-word (an IE proprietary property).

Email notification templates use box-shadow: 3px 3px 0px #a0a0a0 (to simulate a 3D border), and the toolbox title bar uses linear-gradient. On IE5.5, the former shows no shadow, and the latter falls back to a solid color of #000080. I don't plan to fix either.

All emoji icons and badge images use this CSS3 property. IE5.5 ignores it and uses the default smooth rendering. However, for unscaled images at their original dimensions, IE5.5 already uses nearest-neighbor sampling, so the practical difference is minimal. This property is mainly intended for modern browsers on high-DPI screens.

Removing input focus outlines (outline: none) and disabling textarea resizing (resize: none). IE5.5's outline handling is buggy anyway, so this property makes little difference. Textarea resizing is not supported by IE5.5 at all, so resize: none is entirely redundant.

HTML Incompatibilities

Approximately 20 input fields across the guestbook, editor, and toolbox use the HTML5 placeholder attribute. IE5.5 silently ignores it, and users see no hint text inside empty input fields.

Could be simulated with a JScript polyfill: detect 'placeholder' in document.createElement('input'), and if unsupported, manually set/clear default values on onfocus/onblur. However, the polyfill itself is overhead that isn't worth it on 90s-era hardware. The alternative is placing text labels next to the input fields.

Background music embedding in blog posts uses the HTML5 <audio> tag. The Chinese pages have a <bgsound> fallback, and the English pages have an <embed> fallback, so IE5.5 can play audio normally.

All emoji images and external badges include loading="lazy" (an HTML5 attribute). IE5.5 ignores it and loads all images synchronously. On older devices, not loading a lazy-load polyfill may actually be faster.

The temporary pages generated by the editor's "Preview" feature use the HTML5 doctype. In IE5.5, this triggers standards mode, causing rendering to differ from the production pages. Changing it to <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> would fix this.

The header contains two <link rel="preconnect" crossorigin> tags. IE5.5 recognizes neither preconnect nor crossorigin and silently skips them. These are performance optimizations and do not affect functionality.

<embed hidden="true"> is used to hide audio elements. Although hidden was later adopted into the HTML5 standard, IE has been using this non-standard attribute on <embed> since the HTML4 era, so it actually works on IE5.5.

Some <style> and <script> tags lack a type attribute. HTML 4.01 requires it, but IE5.5 defaults to parsing them as CSS/JS, so there is no practical impact.

JavaScript Incompatibilities

The "copy password" feature in toolbox.py uses document.querySelector('.result-box span'). The Selectors API is a DOM Level 2+ feature; IE5.5 only has DOM Level 1. Needs to be changed to document.getElementsByTagName('span') with iteration, or the target element should be given an ID directly.

The same code uses box.textContent, which is DOM Level 3. IE5.5's equivalent property is innerText.

execCommand has been available since IE4, but the 'copy' command was not supported until IE10. IE5.5's clipboard API is window.clipboardData.setData('Text', ...).

Form autofill style overrides. IE5.5's CSS parser discards the entire rule block when encountering an unrecognized pseudo-class, but this only matters for WebKit browsers anyway.

Tech Stack Overview

Compatibility Strategy

1. Graceful degradation — Visual effects (transition, box-shadow, rgba) are allowed to degrade; core interactions (form submission, link navigation, search) must remain functional
2. JS-free first — All core functionality works without JavaScript: search is HTML form + CGI, guestbook is form POST, navigation is <a> tags
3. JS for enhancement only — JavaScript is only used for auxiliary features like emoji insertion, reply quoting, and password copying