HyperCard Stack vs Web 1.0
ハイパーカードのスタック / ウェブ1.0
Both sit in Digital Retro, so the question is not what they belong to but how they behave. One is layout and the other style. They are reached for with some of the same intent, which is where they get confused.
HyperCard Stack
Stacks of screens made and passed around by amateurs, drawn one bit black on white. A single card fills the screen instead of a page, picture and text are pasted onto the same surface, and a row of small icon buttons along the bottom jumps to another card or another stack.
Web 1.0
Reuses the naivety of the constrained early web as directness and charm. In the 2020s it came back as a movement to take the personal site back, gathering under names like Neocities and Yesterweb.
| HyperCard Stack | Web 1.0 | |
|---|---|---|
| Era | 1987–2004 | 1990s |
| Family | Digital Retro | Digital Retro |
| Kind | Layout | Style |
| Cues | One card filling the screen, with no motion of turning a page / One bit black on white drawing, where greys and photographs both arrive as dither patterns / A row of small square icon buttons packed along the bottom edge of the card / Picture and text sharing one surface, with an input field marked by a single rule | Blue links / Low-res GIFs / System fonts / Plain buttons |
| Best used for | Building an exhibition screen that presents holdings one card at a time instead of as a run of pages · Rebuilding the feel of late 1980s and 1990s homemade software in one bit black and white | Showing affection for internet culture · An unpolished, approachable feel |
| Type | Use a bitmap screen face. Do not enlarge headings, and let text carry the same weight as the drawing on the card. | System sans and monospace |
| Composition | One card is one screen. Put the shared frame on the background layer and lay the individual picture and text over it. Pack the navigation buttons along the bottom. | Left-aligned, borders, table-like division |
| Material | Black on white at one bit. Make midtones from dither patterns and halftone any photograph before placing it. Draw outlines as single pixel rules. | White background, blue links, dithered images |
| Caution | Hiding the links inside the artwork erases the way back, and nobody can tell which stack they are in or how far along it. | Don't regress actual accessibility. Separate the look from interaction quality. |