Low-Tech Web Design vs Risograph
ロー・テック・ウェブ / リソグラフ
Low-Tech Web Design comes from UI Expression and Risograph from Stencil Printing. One is style and the other technique. They are reached for with some of the same intent, which is where they get confused.
Low-Tech Web Design
The style starts where Kris De Decker and his collaborators moved Low-tech Magazine onto a solar powered server in 2018 and published how they had built it. Images drop to black and white with four levels of grey, not one web font is loaded, and the height of the colored field behind the page reports how much charge the battery has left. Data weight becomes the first constraint on the layout.
Risograph
Keeps the per-color plates and their happy misregistration, giving each copy its own body heat.
| Low-Tech Web Design | Risograph | |
|---|---|---|
| Era | 2018– | 1980s– / contemporary revival |
| Family | UI Expression | Stencil Printing |
| Kind | Style | Technique |
| Cues | Photographs are reduced to black and white with four levels of grey, the dot grain left plainly visible / The height of the colored field behind the page shows remaining battery charge and falls at night or in bad weather / No web font is loaded at all, so text arrives in a monospace or the browser's own default / Each content category paints the page a fixed color, blue #162DAB, red #D11305, or green #006951 | Misregistration / Spot-color inks / Halftone dots / Paper show-through |
| Best used for | Building an article page an order of magnitude lighter without giving up its photographs, for readers on thin power and thin bandwidth · Reporting a system's state, such as remaining charge or uptime, through the look of the page itself rather than a readout | Handmade heat for zines and event notices · Memorable print with very few colors |
| Type | Load no web font; set in a monospace or whatever the browser already has, and hold the text to a single column around 33rem wide. | Bold letters or homely serifs, separated by color plate |
| Composition | One column running down the page with no decorative frames; images may exceed the text column in size as long as they weigh less than the original file. | Large planes where overlap and slippage stay visible |
| Material | Convert images to four level black and white dither and add color afterwards with a CSS filter per category, then tie the height of a background field to the power supply. | Two or three spot colors, coarse halftones, uncoated paper |
| Caution | Copying the dithered look by running a filter over full resolution photographs leaves the payload untouched, producing a heavy page that only looks light. | Don't fake it with a noise filter. Design how the colors overlap first. |