Contribute Comment
Build
Brief.md · the rules, for pasting into an AI site tool

The canvas below is 640 pixels wide and does not respond to your viewport. The matte and the width are ours — a composition built for a small screen that no longer exists, shown at its own size.

WEB 1.0

Tiled backgrounds, animated GIFs, centred tables, font tags

Contents

The argument
How to spot it
Not Web Brutalism
The furniture
Under construction
Back to Aesthetics

Best viewed at 640×480.
This page is honest about being unfinished.

The argument it makes

A page is a document that someone made by hand, and the tools available are a document markup language and a slow connection. Nothing is laid out properly because nothing can be; every layout decision is a workaround for a missing capability.

The claim above is the brief's, at confidence medium. Costs accepted: visual control, consistency between browsers, any notion of a designer. Assumes a visitor on dial-up at 640×480 who will wait for the page and expects to be told it is unfinished.

How to spot it

Content laid out in visible HTML tables against a tiled background image. Link colours left at the browser's blue and purple, or set once on the BODY tag. Animated GIFs as ornament and as status. The page's own incompleteness announced rather than hidden.

This page practises what it describes: the layout you are reading is a real <table> with presentational attributes, the headings and rules are the entire hierarchy, and the links on the left are whatever colour your browser gives them.

Not Web Brutalism

This registerWeb Brutalism
Plain by force. There was no CSS layout to decline; the table is compulsion. c. 1989–2004. Plain by choice. CSS exists and is refused as a statement. Any evidence of deliberate restraint moves the page here.
Tell: the workaround. A spacer where a margin should be. A font tag where a stylesheet should be. Tell: the modern system font, the intentional-looking minimalism, the choice worn openly.

The visual overlap is high and the intent is opposite — the brief's discriminator, reproduced here as a comparison table because a comparison table is what this register would use.

The furniture

Documented. A bordered table came out in bas-relief: a raised outer border with every cell inset. HTML 3.2 describes that rendering; the author never drew it. Here it is as the browser drew it:

cellcellcell

The default horizontal rule is a two-colour groove. A flat one had to be asked for with NOSHADE:

Documented on amateur pages. The browser’s own furniture was swapped for GIFs from free collections: home-made back and forward buttons, image bullets instead of list markers, 88×31 promotional buttons. Pages were built from those collections and from other pages’ source.

88×31 buttons go here. No licensed period GIF is held.

Under construction

This section is honestly unfinished, which is the register's own convention. What is actually open, per the brief:

  • Whether Web 1.0 and the GeoCities vernacular are one register or two. Logged, not decided.
  • Density is the one dimension the brief decides curatorially; nothing documents it.

Nothing else on this page is pretending to be unfinished. Only this section is, and it really is.
Made by hand. No stylesheet governs the inside of this canvas beyond what the era forced.

Build with it

A starting grammar for a website in Web 1.0: a fixed 640-pixel canvas of nested, centred tables on a tiled ground, faces set with the FONT tag or left to the browser, headings and rules as the whole hierarchy, the browser’s own controls, and GIFs that loop and never ease.

Web translation marks our choices for the screen. Not specified by the source marks what the sources leave open. Everything else is a rule from the record below.

The same system is in the brief (Build → Brief) and in the structured data.

The record

Research
Partly sourced
Build guidance
Recorded in 7 of 8 research dimensions
Origin
Market convention
Also called
GeoCities, early internet, old web, tiled background
Feel
playful, nostalgic
No source attached
Argument, Recognition test
Not researched yet
Summary, Typeface guidance, Overall positions by area, Ornament and contrast scales, Moving it to screen, Source notes. Unresearched is not permission.
What this record covers
Roughly 1989–2004, the Web 1.0 stage. Not GeoCities-specific.
Scope
The visual register of hand-authored pages from the Web 1.0 stage (roughly 1989–2004): table layout, CENTER, tiled BODY backgrounds, font tags, GIF ornament, as Aesthetary's language drawn from W3C specifications and dated period pages.

What it argues

A page is a document that someone made by hand, and the tools available are a document markup language and a slow connection. Nothing is laid out properly because nothing can be; every layout decision is a workaround for a missing capability.

It refuses: Refuses the idea that a page should be designed rather than authored, and refuses any layout that the markup cannot express directly.

How you recognise it

Content laid out in visible HTML tables against a tiled background image, with link colours left at the browser's blue and purple or set once on the BODY tag, animated GIFs used as ornament and as status, and the page's own incompleteness announced rather than hidden. The diagnostic condition is that every visual device is a workaround: the table is there because there is no layout language, the spacer GIF because there is no margin, the font tag because there is no stylesheet. Web Brutalism reproduces the plainness on purpose and from a position of choice; this had no choice.

Rules 19

Layout

  • Seen in the workComposition: nested tables; centred; 640×480. Seen in the work

Typography

  • Seen in the workTypography: size and face set with the FONT tag; where no face is set, the browser default. Seen in the work

Color

  • Seen in the workColour: set on the BODY tag — a tiled background image or a flat BGCOLOR ground, with text and link colours either left at the browser default or set per page. Seen in the work

Imagery

  • Graded by our research brief · No source attachedImagery: animated GIF; low-bit-depth.

Interface

  • Documented · Source attachedBordered tables were commonly rendered in bas-relief: a bevelled raised outer border with cells inset, a rendering convention described by HTML 3.2 rather than drawn by the author.
  • Documented · Source attachedThe default horizontal rule is a two-colour 'groove'; a flat rule has to be requested with NOSHADE.
  • Documented · Source attachedA linked image is generally shown with a coloured border, typically blue.
  • Documented · Source attachedForm furniture is the browser's own controls plus image submit buttons; forms were often sent by email.
  • Documented · Source attachedAmateur pages replaced browser and markup furniture with GIFs from free collections: their own back/forward buttons, image bullets instead of list markers, 88x31 promotional buttons.

Motion

  • Graded by our research brief · No source attachedOnly looping GIF animation, running continuously and independent of scroll or interaction. Motion here is never triggered and never eases. It just runs.

Motif

  • Documented · Source attachedA tiled background image is the recurring surface device: space tiles first, then paper, glass, water and wood sets passed around in free collections. Documented · Source attached

Technique

  • Documented · Source attachedSome pages were built using Server Side Includes or CGI.
  • Documented · Source attachedAmateur pages were built modularly from free graphics collections, and elements were lifted from other pages by reading their source code.
  • Documented · Source attachedProfessional sites broke with this: designed in Photoshop and sliced into pieces, a method Lialina contrasts with amateur modular construction.
  • Seen in the workCollection makers distributed page sets and invited users unfamiliar with them to copy their HTML source.

Form

  • Documented · Source attachedA web page has no three-dimensional organisation; the simulated relief it shows (bevelled tables, grooved rules) is interface rendering, filed under interface.

Hierarchy

  • Graded by our research brief · No source attachedHierarchy is unusually literal: rank comes from the heading level tag and from horizontal rules dividing sections. Not from scale chosen by a designer — from <h1> through <h3> and <hr>. That is a real instruction and a genuinely different way to build a page. Graded by our research brief · No source attached

Form / motif / surface / technique

  • Graded by our research brief · No source attachedForm / motif / surface / technique: tiled texture; hard edges.

Context

  • Graded by our research brief · No source attachedThe register is a period constraint, not a style: fixed-width tables, system fonts, tiled backgrounds and hand-authored markup are what the tools of the time produced.

Often confused with

  • Utilitarian Aesthetic Utilitarian is contemporary and fast on purpose; this is slow and unstyled by force.
  • Arcade Aesthetic Seen from Arcade: both are low-fidelity and nostalgic, but this is a closed machine with a score, not a document with links.

Use it

Contribute

Contributing and commenting need JavaScript. Nothing else on this page does.

Work made in this style: a poster, a page, a type setting. Every submission is reviewed before it appears.

Comments

Feedback