May 16, 2025
Now that I've gone through the archive and done some spot-checking, I think I've got DOS Mode working the way I want it to. Everything looks like I'd want it to; with some compromises to account for the fact that nobody is using a browser window that's 80 columns by 50 rows.
I did try to keep to the more common colors that DOS would have used in text mode: The yellow and light blue (as well as black, of course) are all from the CGA palette, which I think I remember being the lowest common denominator use case back in the '90s. I did make one tweak; the "white" is #EEEEEE instead of #FFFFFF to make the white-on-black a tiny bit less harsh.
Even though I barely ever go bowling any more, I even adjusted the bowling <div> class to style properly. Now it looks like something reminiscent of DOS text-mode games. Still haven't gone back and adjusted the original blog posts though. Maybe that's something I'll get on eventually.
I did make at least a small effort to maintain a character-grid alignment, but there are some spots where it isn't perfect. It's something I'll pay more attention to as I make new entries, but I don't think I'm going to bother with old posts on that one.
Another idea I had was to drop images to the VGA 256-color palette. I'm not sure that's a transformation that's easily doable (or doable at all), and I'm not sure that I'd like it if I implemented it. So I think I'm just going to leave that as a compromise.
There were some places I found that I used visual tags (<b> and <i>) instead of their semantic cousins (<strong> and <em>) that I needed to make a small update to the style sheet for. Those uses were (generally) correct though, since I was going for appearance and not a form of emphasis. Things like italicizing book titles, marking a subsection, and the like. Though the latter could be a <strong> tag as well, now that I think about it.
Borders were another compromise. Ideally I'd use box-drawing characters like ┌ or │, just like we did back in the day. But that would, at best, require a lot of information about screen width that I just wouldn't have. At worst it's another impossible thing. So I settled for making borders be light gray (#AAAAAA) with no rounding. It's not perfect, but it's close.
That does lead to some alignment issues like I mentioned before; since borders exist outside the text instead of as part of it, there are a couple places where my CSS says things like padding-left: calc(0.45em - 1px) to try to keep things lined up horizontally. Doesn't always work though, and I didn't even make that half-hearted attempt at vertical alignment to the grid.
The font itself presents a final issue; there's no Unicode support. Back in the day that would have been correct; the font for the US market would have been limited to extended ASCII and with only 256 available character codes that would have been it. Other languages would have used different code pages, usually keeping ASCII in the low half of the byte and putting their own character sets in the high half. (Asian languages implemented the first multi-byte characters with encoding schemes like Shift-JIS, I'm not sure about the degree to which that influenced the later UTF-8 and UTF-16 encodings.)
But nowadays we have Unicode, and it's no problem for the font to include all those character sets -- especially since there were already DOS versions that had them. But on the rare occasion I need to step outside European script I'm stuck with font substitution, unless I can find another font that goes whole-hog.
I'd be willing to give it a try myself if this were a bitmap font, but since it's TrueType it's well outside my ability to mess with. Assuming I could even find copies of the glyphs to start from.
Either way, it was a fun little exercise and I'm happy with how it turned out. Click that toggle switch in the site menu and relive the good ol' days, when you had to edit your AUTOEXEC.BAT file to be able to play Doom fullscreen on your 486.
