The Early Web Hall

The glass

On the web, the first screen was the user’s own. A game on a page had to work on whatever monitor, in whatever colour mode, at whatever window size the visitor happened to have. Some of those monitors showed only 256 colours, and a web-safe palette of 216 colours was handed out as advice so that images would not turn to mush. Designers worked with a deliberately small box of crayons, again.

Pages used flat, bevelled controls: grey rectangles with a light top-left edge and a dark bottom-right edge, so they looked pressed out of the screen. It was the visual grammar of the desktop operating system leaking into content. A button that looked like a button was a courtesy in a medium where nothing yet had conventions. Beige was not a mood. It was a standard.

Small is the style

A dial-up modem delivered something like five kilobytes a second on a good day. A game of 200 kilobytes took most of a minute to arrive, and nobody wanted to wait for two megabytes. So the art was tiny, the sound was shorter than a breath, and animation used few frames. A background was a single repeating tile. Every asset was squeezed with as much care as the paint on a postage stamp.

Loading itself became a design problem. A page that showed nothing for thirty seconds felt broken, so creators gave the wait a face: a progress bar, a message, a little animation to keep the eye busy. The loading screen was the first thing every player saw and, for many sites, the most polished. The loading-bar wing collects some of the idioms that grew out of it.

Plugins, applets and the first browser games

The browser could not run a real game by itself at first. Plain pages could show images and text, and little else. So games arrived through add-ons: small programs embedded in the page that the browser handed off to a runtime. Java applets ran compiled programs in a sandbox; a plugin from a graphics company turned vector animation into a playable medium; another company’s multimedia player brought richer 3D to a few ambitious sites. Each needed the visitor to install something first, which was its own small drama.

Alongside them sat the quieter inventions: image maps, frames, forms and tables abused as layout grids. A text adventure could be built from nothing but links. A trivia game could be a page of radio buttons and a script on a server. The distinction between a website and a game was thin enough that many people did not notice they were playing.

The sound of getting online

None of this happened without the line. A modem turned data into sound and sound into data, and to connect it had to introduce itself to the modem at the other end in a rising, warbling, shrieking sequence that millions of people can still recite. It is a conversation: the answering modem declares itself, the callers agree on a language and a speed, and then both go quiet and begin to talk. You can hear a synthesised version, with the phases explained, in the dial-up sound room.

The input

The web’s input device was the mouse, and its gift to games was the click. A click is a small, certain act: here, now. Early browser games often reduced everything to it. Pick a card. Shoot the thing. Click the correct colour. Because a page might also be sitting next to a spreadsheet at work, controls were designed to be understood without instructions and played with one hand.

The keyboard worked, when the page had focus, which was a subtle thing to get right. A game that did not claim keyboard focus would let the arrow keys scroll the page instead, and the whole screen would lurch away from the player. Plenty of early browser games came with a small instruction: click here first.

Joysticks and gamepads were an add-on for computers. Players who wanted them knew what they were doing and plugged them in themselves, but the web could rarely see them. A fully web-native game would keep to the mouse and the keys for years, and that limited its design in a particular way. The best of them leaned into it.

Tower defence, puzzle and time-wasters

Mouse-driven games tend to reward planning. Place a building, aim a cannon, rearrange tiles. The genre that grew most naturally in this ground was the tower-defence game, in which you do all your work between waves and watch the results play out. A lot of them were built by one person in a few weeks, and a lot of them were good.

The room

The room was whatever room had the computer in it. In many homes that meant a spare bedroom, a study or a corner of the living room, with a tower under the desk, a heavy monitor above it, and a phone cable run along the skirting board. While you were online, nobody else could ring the house. Family negotiations about who got the line were real, and so were the phone bills.

Offices and schools were the other great arcade. A discreet game window on a workstation was the cheapest rebellion of the age, and the best browser games learned to be playable in a corner of the screen in short bursts, in a way that could be hidden at a moment’s notice. A computer lab with a rule against games was an equally good place to find them.

Internet cafes were something stranger and better: rooms full of strangers at identical machines, headphones on, talking to each other across a small hall. Tournaments for the big network games of the time were held in such places and in rented halls where players carried their own towers and monitors on trolleys. Those early meet-ups were the first time many people saw that others cared about the same game.

The portals

Websites collected games the way a record shop collects records. A portal might offer hundreds, each with a thumbnail and a line of description, organised into categories. A visitor could go from one to the next in minutes. Most of the games were small and made by individuals or tiny teams, and the portals were the first place many creators saw an audience. The hosting was free, the competition was friendly, and the high-score table was the community.

Chat and forums did the rest. A game that had a thread on a message board had a following. Strategy guides were written by fans and posted as long plain-text pages. Scores were reported by screenshot, proof by honour, and cheating was dealt with by a mix of embarrassment and the moderators. It was a smaller, more human system than its descendants.

Three design ideas we borrowed

1. Make the resource the enemy

   Every tower in Packet Patrol eats bandwidth, so overbuilding slows your own defences. This is a game about a modem, designed around the thing that made modems frustrating. The best web games of the time let the limit of the medium be the rule of the game, and the player felt the joke and the pressure at once.

   Packet Patrol, 2000 Play Packet Patrol

2. Come back tomorrow

   Browser games discovered that a player who returns tomorrow is worth more than one who plays for an hour today. Floe Flingers follows the clock: dusk brings a tailwind, midday fights you, and upgrades add up between runs. A short session and a visible reason to return is the quiet heart of the web arcade, long before anyone gave it a name.

   Floe Flingers, 2001 Play Floe Flingers

3. Turn the wait into the game

   Dialup Dash, still in the workshop, takes the oldest annoyance of the period, a slow connection, and makes it a lane-switching race where a data packet fights to arrive. It borrows the web’s own folk memory: the beige corridor, the squeal, the blocked ads. The lesson is that nostalgia works best when it is specific.

   Dialup Dash, 1999 In the workshop

Games from this era on Eracade

• Packet Patrol 2000 · Tower Defense Play
• Floe Flingers 2001 · Idle / Launcher Play
• Hotlink Typist 2001 · Typing Arcade Play
• Dialup Dash 1999 · Runner In the workshop
• Banner Blaster 2002 · Shooter In the workshop

Browse every Early Web game.

What ended the era

Broadband did not so much end this era as remove its main constraint. When pages could be megabytes without anyone noticing, there was no reason to squeeze, and the particular charm of fifty-kilobyte games began to fade. The dot-com bust took many of the portals and their advertising with it, and the survivors learned to run on sponsorship and a small number of well-chosen banners.

What replaced them was a more polished, more professional web. Browsers became capable, plugins matured, and a single runtime took over most of the creative ground. That story belongs to the next hall. But the lessons of the early web remain useful: keep it small, make the wait part of the show, give the player a click that means something, and trust that a good idea in a tiny package will travel.

Further reading

Outside links are chosen for being stable, general and free to read. We link; we do not copy.

• Dial-up Internet access (Wikipedia) How phone-line connections worked and what they could carry.
• Modem (Wikipedia) Modulation, demodulation and the history of the box.
• Web colors (Wikipedia) The 216-colour safe palette and the reasoning behind it.
• Tower defense (Wikipedia) A genre that grew up naturally on the mouse-driven web.